12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027202820292030203120322033203420352036203720382039204020412042204320442045204620472048204920502051205220532054205520562057205820592060206120622063206420652066206720682069207020712072207320742075207620772078207920802081208220832084208520862087208820892090209120922093209420952096209720982099210021012102210321042105210621072108210921102111211221132114211521162117211821192120212121222123212421252126212721282129213021312132213321342135213621372138213921402141214221432144214521462147214821492150215121522153215421552156215721582159216021612162216321642165216621672168216921702171217221732174217521762177217821792180218121822183218421852186218721882189219021912192219321942195219621972198219922002201220222032204220522062207220822092210221122122213221422152216221722182219222022212222222322242225222622272228222922302231223222332234223522362237223822392240224122422243224422452246224722482249225022512252225322542255225622572258225922602261226222632264226522662267226822692270227122722273227422752276227722782279228022812282228322842285228622872288228922902291229222932294229522962297229822992300230123022303230423052306230723082309231023112312231323142315231623172318231923202321232223232324232523262327232823292330233123322333233423352336233723382339234023412342234323442345234623472348234923502351235223532354235523562357235823592360236123622363236423652366236723682369237023712372237323742375237623772378237923802381238223832384238523862387238823892390239123922393239423952396239723982399240024012402240324042405240624072408240924102411241224132414241524162417241824192420242124222423242424252426242724282429243024312432243324342435243624372438243924402441244224432444244524462447244824492450245124522453245424552456245724582459246024612462246324642465246624672468246924702471247224732474247524762477247824792480248124822483248424852486248724882489249024912492249324942495249624972498249925002501250225032504250525062507250825092510251125122513251425152516251725182519252025212522252325242525252625272528252925302531253225332534253525362537253825392540254125422543254425452546254725482549255025512552255325542555255625572558255925602561256225632564256525662567256825692570257125722573257425752576257725782579258025812582258325842585258625872588258925902591259225932594259525962597259825992600260126022603260426052606260726082609261026112612261326142615261626172618261926202621262226232624262526262627262826292630263126322633263426352636263726382639264026412642264326442645264626472648264926502651265226532654265526562657265826592660266126622663266426652666266726682669267026712672267326742675267626772678267926802681268226832684268526862687268826892690269126922693269426952696269726982699270027012702270327042705270627072708270927102711271227132714271527162717271827192720272127222723272427252726272727282729273027312732273327342735273627372738273927402741274227432744274527462747274827492750275127522753275427552756275727582759276027612762276327642765276627672768276927702771277227732774277527762777277827792780278127822783278427852786278727882789279027912792279327942795279627972798279928002801280228032804280528062807280828092810281128122813281428152816281728182819282028212822282328242825282628272828282928302831283228332834283528362837283828392840284128422843284428452846284728482849285028512852285328542855285628572858285928602861286228632864286528662867286828692870287128722873287428752876287728782879288028812882288328842885288628872888288928902891289228932894289528962897289828992900290129022903290429052906290729082909291029112912291329142915291629172918291929202921292229232924292529262927292829292930293129322933293429352936293729382939294029412942294329442945294629472948294929502951295229532954295529562957295829592960296129622963296429652966296729682969297029712972297329742975297629772978297929802981298229832984298529862987298829892990299129922993299429952996299729982999300030013002300330043005300630073008300930103011301230133014301530163017301830193020302130223023302430253026302730283029303030313032303330343035303630373038303930403041304230433044304530463047304830493050305130523053305430553056305730583059306030613062306330643065306630673068306930703071307230733074307530763077307830793080308130823083308430853086308730883089309030913092309330943095309630973098309931003101310231033104310531063107310831093110311131123113311431153116311731183119312031213122312331243125312631273128312931303131313231333134313531363137313831393140314131423143314431453146314731483149315031513152315331543155315631573158315931603161316231633164316531663167316831693170317131723173317431753176317731783179318031813182318331843185318631873188318931903191319231933194319531963197319831993200320132023203320432053206320732083209321032113212321332143215321632173218321932203221322232233224322532263227322832293230323132323233323432353236323732383239324032413242324332443245324632473248324932503251325232533254325532563257325832593260326132623263326432653266326732683269327032713272327332743275327632773278327932803281328232833284328532863287328832893290329132923293329432953296329732983299330033013302330333043305330633073308330933103311331233133314331533163317331833193320332133223323332433253326332733283329333033313332333333343335333633373338333933403341334233433344334533463347334833493350335133523353335433553356335733583359336033613362336333643365336633673368336933703371337233733374337533763377337833793380338133823383338433853386338733883389339033913392339333943395339633973398339934003401340234033404340534063407340834093410341134123413341434153416341734183419342034213422342334243425342634273428342934303431343234333434343534363437343834393440344134423443344434453446344734483449345034513452345334543455345634573458345934603461346234633464346534663467346834693470347134723473347434753476347734783479348034813482348334843485348634873488348934903491349234933494349534963497349834993500350135023503350435053506350735083509351035113512351335143515351635173518351935203521352235233524352535263527352835293530353135323533353435353536353735383539354035413542354335443545354635473548354935503551355235533554355535563557355835593560356135623563356435653566356735683569357035713572357335743575357635773578357935803581358235833584358535863587358835893590359135923593359435953596359735983599360036013602360336043605360636073608360936103611361236133614361536163617361836193620362136223623362436253626362736283629363036313632363336343635363636373638363936403641364236433644364536463647364836493650365136523653365436553656365736583659366036613662366336643665366636673668366936703671367236733674367536763677367836793680368136823683368436853686368736883689369036913692369336943695369636973698369937003701370237033704370537063707370837093710371137123713371437153716371737183719372037213722372337243725372637273728372937303731373237333734373537363737373837393740374137423743374437453746374737483749375037513752375337543755375637573758375937603761376237633764376537663767376837693770377137723773377437753776377737783779378037813782378337843785378637873788378937903791379237933794379537963797379837993800380138023803380438053806380738083809381038113812381338143815381638173818381938203821382238233824382538263827382838293830383138323833383438353836383738383839384038413842384338443845384638473848384938503851385238533854385538563857385838593860386138623863386438653866386738683869387038713872387338743875387638773878387938803881388238833884388538863887388838893890389138923893389438953896389738983899390039013902390339043905390639073908390939103911391239133914391539163917391839193920392139223923392439253926392739283929393039313932393339343935393639373938393939403941394239433944394539463947394839493950395139523953395439553956395739583959396039613962396339643965396639673968396939703971397239733974397539763977397839793980398139823983398439853986398739883989399039913992399339943995399639973998399940004001400240034004400540064007400840094010401140124013401440154016401740184019402040214022402340244025402640274028402940304031403240334034403540364037403840394040404140424043404440454046404740484049405040514052405340544055405640574058405940604061406240634064406540664067406840694070407140724073407440754076407740784079408040814082408340844085408640874088408940904091409240934094409540964097409840994100410141024103410441054106410741084109411041114112411341144115411641174118411941204121412241234124412541264127412841294130413141324133413441354136413741384139414041414142414341444145414641474148414941504151415241534154415541564157415841594160416141624163416441654166416741684169417041714172417341744175417641774178417941804181418241834184418541864187418841894190419141924193419441954196419741984199420042014202420342044205420642074208420942104211421242134214421542164217421842194220422142224223422442254226422742284229423042314232423342344235423642374238423942404241424242434244424542464247424842494250425142524253425442554256425742584259426042614262426342644265426642674268426942704271427242734274427542764277427842794280428142824283428442854286428742884289429042914292429342944295429642974298429943004301430243034304430543064307430843094310431143124313431443154316431743184319432043214322432343244325432643274328432943304331433243334334433543364337433843394340434143424343434443454346434743484349435043514352435343544355435643574358435943604361436243634364436543664367436843694370437143724373437443754376437743784379438043814382438343844385438643874388438943904391439243934394439543964397439843994400440144024403440444054406440744084409441044114412441344144415441644174418441944204421442244234424442544264427442844294430443144324433443444354436443744384439444044414442444344444445444644474448444944504451445244534454445544564457445844594460446144624463446444654466446744684469447044714472447344744475447644774478447944804481448244834484448544864487448844894490449144924493449444954496449744984499450045014502450345044505450645074508450945104511451245134514451545164517451845194520452145224523452445254526452745284529453045314532453345344535453645374538453945404541454245434544454545464547454845494550455145524553455445554556455745584559456045614562456345644565456645674568456945704571457245734574457545764577457845794580458145824583458445854586458745884589459045914592459345944595459645974598459946004601460246034604460546064607460846094610461146124613461446154616461746184619462046214622462346244625462646274628462946304631463246334634463546364637463846394640464146424643464446454646464746484649465046514652465346544655465646574658465946604661466246634664466546664667466846694670467146724673467446754676467746784679468046814682468346844685468646874688468946904691469246934694469546964697469846994700470147024703470447054706470747084709471047114712471347144715471647174718471947204721472247234724472547264727472847294730473147324733473447354736473747384739474047414742474347444745474647474748474947504751475247534754475547564757475847594760476147624763476447654766476747684769477047714772477347744775477647774778477947804781478247834784478547864787478847894790479147924793479447954796479747984799480048014802480348044805480648074808480948104811481248134814481548164817481848194820482148224823482448254826482748284829483048314832483348344835483648374838483948404841484248434844484548464847484848494850485148524853485448554856485748584859486048614862486348644865486648674868486948704871487248734874487548764877487848794880488148824883488448854886488748884889489048914892489348944895489648974898489949004901490249034904490549064907490849094910491149124913491449154916491749184919492049214922492349244925492649274928492949304931493249334934493549364937493849394940494149424943494449454946494749484949495049514952495349544955495649574958495949604961496249634964496549664967496849694970497149724973497449754976497749784979498049814982498349844985498649874988498949904991499249934994499549964997499849995000500150025003500450055006500750085009501050115012501350145015501650175018501950205021502250235024502550265027502850295030503150325033503450355036503750385039504050415042504350445045504650475048504950505051505250535054505550565057505850595060506150625063506450655066506750685069507050715072507350745075507650775078507950805081508250835084508550865087508850895090509150925093509450955096509750985099510051015102510351045105510651075108510951105111511251135114511551165117511851195120512151225123512451255126512751285129513051315132513351345135513651375138513951405141514251435144514551465147514851495150515151525153515451555156515751585159516051615162516351645165516651675168516951705171517251735174517551765177517851795180518151825183518451855186518751885189519051915192519351945195519651975198519952005201520252035204520552065207520852095210521152125213521452155216521752185219522052215222522352245225522652275228522952305231523252335234523552365237523852395240524152425243524452455246524752485249525052515252525352545255525652575258525952605261526252635264526552665267526852695270527152725273527452755276527752785279528052815282528352845285528652875288528952905291529252935294529552965297529852995300530153025303530453055306530753085309531053115312531353145315531653175318531953205321532253235324532553265327532853295330533153325333533453355336533753385339534053415342534353445345534653475348534953505351535253535354535553565357535853595360536153625363536453655366536753685369537053715372537353745375537653775378537953805381538253835384538553865387538853895390539153925393539453955396539753985399540054015402540354045405540654075408540954105411541254135414541554165417541854195420542154225423542454255426542754285429543054315432543354345435543654375438543954405441544254435444544554465447544854495450545154525453545454555456545754585459546054615462546354645465546654675468546954705471547254735474547554765477547854795480548154825483548454855486548754885489549054915492549354945495549654975498549955005501550255035504550555065507550855095510551155125513551455155516551755185519552055215522552355245525552655275528552955305531553255335534553555365537553855395540554155425543554455455546554755485549555055515552555355545555555655575558555955605561556255635564556555665567556855695570557155725573557455755576557755785579558055815582558355845585558655875588558955905591559255935594559555965597559855995600560156025603560456055606560756085609561056115612561356145615561656175618561956205621562256235624562556265627562856295630563156325633563456355636563756385639564056415642564356445645564656475648564956505651565256535654565556565657565856595660566156625663566456655666566756685669567056715672567356745675567656775678567956805681568256835684568556865687568856895690569156925693569456955696569756985699570057015702570357045705570657075708570957105711571257135714571557165717571857195720572157225723572457255726572757285729573057315732573357345735573657375738573957405741574257435744574557465747574857495750575157525753575457555756575757585759576057615762576357645765576657675768576957705771577257735774577557765777577857795780578157825783578457855786578757885789579057915792579357945795579657975798579958005801580258035804580558065807580858095810581158125813581458155816581758185819582058215822582358245825582658275828582958305831583258335834583558365837583858395840584158425843584458455846584758485849585058515852585358545855585658575858585958605861586258635864586558665867586858695870587158725873587458755876587758785879588058815882588358845885588658875888588958905891589258935894589558965897589858995900590159025903590459055906590759085909591059115912591359145915591659175918591959205921592259235924592559265927592859295930593159325933593459355936593759385939594059415942594359445945594659475948594959505951595259535954595559565957595859595960596159625963596459655966596759685969597059715972597359745975597659775978597959805981598259835984598559865987598859895990599159925993599459955996599759985999600060016002600360046005600660076008600960106011601260136014601560166017601860196020602160226023602460256026602760286029603060316032603360346035603660376038603960406041604260436044604560466047604860496050605160526053605460556056605760586059606060616062606360646065606660676068606960706071607260736074607560766077607860796080608160826083608460856086608760886089609060916092609360946095609660976098609961006101610261036104610561066107610861096110611161126113611461156116611761186119612061216122612361246125612661276128612961306131613261336134613561366137613861396140614161426143614461456146614761486149615061516152615361546155615661576158615961606161616261636164616561666167616861696170617161726173617461756176617761786179618061816182618361846185618661876188618961906191619261936194619561966197619861996200620162026203620462056206620762086209621062116212621362146215621662176218621962206221622262236224622562266227622862296230623162326233623462356236623762386239624062416242624362446245624662476248624962506251625262536254625562566257625862596260626162626263626462656266626762686269627062716272627362746275627662776278627962806281628262836284628562866287628862896290629162926293629462956296629762986299630063016302630363046305630663076308630963106311631263136314631563166317631863196320632163226323632463256326632763286329633063316332633363346335633663376338633963406341634263436344634563466347634863496350635163526353635463556356635763586359636063616362636363646365636663676368636963706371637263736374637563766377637863796380638163826383638463856386638763886389639063916392639363946395639663976398639964006401640264036404640564066407640864096410641164126413641464156416641764186419642064216422642364246425642664276428642964306431643264336434643564366437643864396440644164426443644464456446644764486449645064516452645364546455645664576458645964606461646264636464646564666467646864696470647164726473647464756476647764786479648064816482648364846485648664876488648964906491649264936494649564966497649864996500650165026503650465056506650765086509651065116512651365146515651665176518651965206521652265236524652565266527652865296530653165326533653465356536653765386539654065416542654365446545654665476548654965506551655265536554655565566557655865596560656165626563656465656566656765686569657065716572657365746575657665776578657965806581658265836584658565866587658865896590659165926593659465956596659765986599660066016602660366046605660666076608660966106611661266136614661566166617661866196620662166226623662466256626662766286629663066316632663366346635663666376638663966406641664266436644664566466647664866496650665166526653665466556656665766586659666066616662666366646665666666676668666966706671667266736674667566766677667866796680668166826683668466856686668766886689669066916692669366946695669666976698669967006701670267036704670567066707670867096710671167126713671467156716671767186719672067216722672367246725672667276728672967306731673267336734673567366737673867396740674167426743674467456746674767486749675067516752675367546755675667576758675967606761676267636764676567666767676867696770677167726773677467756776677767786779678067816782678367846785678667876788678967906791679267936794679567966797679867996800680168026803680468056806680768086809681068116812681368146815681668176818681968206821682268236824682568266827682868296830683168326833683468356836683768386839684068416842684368446845684668476848684968506851685268536854685568566857685868596860686168626863686468656866686768686869687068716872687368746875687668776878687968806881688268836884688568866887688868896890689168926893689468956896689768986899690069016902690369046905690669076908690969106911691269136914691569166917691869196920692169226923692469256926692769286929693069316932693369346935693669376938693969406941694269436944694569466947694869496950695169526953695469556956695769586959696069616962696369646965696669676968696969706971697269736974697569766977697869796980698169826983698469856986698769886989699069916992699369946995699669976998699970007001700270037004700570067007700870097010701170127013701470157016701770187019702070217022702370247025702670277028702970307031703270337034703570367037703870397040704170427043704470457046704770487049705070517052705370547055705670577058705970607061706270637064706570667067706870697070707170727073707470757076707770787079708070817082708370847085708670877088708970907091709270937094709570967097709870997100710171027103710471057106710771087109711071117112711371147115711671177118711971207121712271237124712571267127712871297130713171327133713471357136713771387139714071417142714371447145714671477148714971507151715271537154715571567157715871597160716171627163716471657166716771687169717071717172717371747175717671777178717971807181718271837184718571867187718871897190719171927193719471957196719771987199720072017202720372047205720672077208720972107211721272137214721572167217721872197220722172227223722472257226722772287229723072317232723372347235723672377238723972407241724272437244724572467247724872497250725172527253725472557256725772587259726072617262726372647265726672677268726972707271727272737274727572767277727872797280728172827283728472857286728772887289729072917292729372947295729672977298729973007301730273037304730573067307730873097310731173127313731473157316731773187319732073217322732373247325732673277328732973307331733273337334733573367337733873397340734173427343734473457346734773487349735073517352735373547355735673577358735973607361736273637364736573667367736873697370737173727373737473757376737773787379738073817382738373847385738673877388738973907391739273937394739573967397739873997400740174027403740474057406740774087409741074117412741374147415741674177418741974207421742274237424742574267427742874297430743174327433743474357436743774387439744074417442744374447445744674477448744974507451745274537454745574567457745874597460746174627463746474657466746774687469747074717472747374747475747674777478747974807481748274837484748574867487748874897490749174927493749474957496749774987499750075017502750375047505750675077508750975107511751275137514751575167517751875197520752175227523752475257526752775287529753075317532753375347535753675377538753975407541754275437544754575467547754875497550755175527553755475557556755775587559756075617562756375647565756675677568756975707571757275737574757575767577757875797580758175827583758475857586758775887589759075917592759375947595759675977598759976007601760276037604760576067607760876097610761176127613761476157616761776187619762076217622762376247625762676277628762976307631763276337634763576367637763876397640764176427643764476457646764776487649765076517652765376547655765676577658765976607661766276637664766576667667766876697670767176727673767476757676767776787679768076817682768376847685768676877688768976907691769276937694769576967697769876997700770177027703770477057706770777087709771077117712771377147715771677177718771977207721772277237724772577267727772877297730773177327733773477357736773777387739774077417742774377447745774677477748774977507751775277537754775577567757775877597760776177627763776477657766776777687769777077717772777377747775777677777778777977807781778277837784778577867787778877897790779177927793779477957796779777987799780078017802780378047805780678077808780978107811781278137814781578167817781878197820782178227823782478257826782778287829783078317832783378347835783678377838783978407841784278437844784578467847784878497850785178527853785478557856785778587859786078617862786378647865786678677868786978707871787278737874787578767877787878797880788178827883788478857886788778887889789078917892789378947895789678977898789979007901790279037904790579067907790879097910791179127913791479157916791779187919792079217922792379247925792679277928792979307931793279337934793579367937793879397940794179427943794479457946794779487949795079517952795379547955795679577958795979607961796279637964796579667967796879697970797179727973797479757976797779787979798079817982798379847985798679877988798979907991799279937994799579967997799879998000800180028003800480058006800780088009801080118012801380148015801680178018801980208021802280238024802580268027802880298030803180328033803480358036803780388039804080418042804380448045804680478048804980508051805280538054805580568057805880598060806180628063806480658066806780688069807080718072807380748075807680778078807980808081808280838084808580868087808880898090809180928093809480958096809780988099810081018102810381048105810681078108810981108111811281138114811581168117811881198120812181228123812481258126812781288129813081318132813381348135813681378138813981408141814281438144814581468147814881498150815181528153815481558156815781588159816081618162816381648165816681678168816981708171817281738174817581768177817881798180818181828183818481858186818781888189819081918192819381948195819681978198819982008201820282038204820582068207820882098210821182128213821482158216821782188219822082218222822382248225822682278228822982308231823282338234823582368237823882398240824182428243824482458246824782488249825082518252825382548255825682578258825982608261826282638264826582668267826882698270827182728273827482758276827782788279828082818282828382848285828682878288828982908291829282938294829582968297829882998300830183028303830483058306830783088309831083118312831383148315831683178318831983208321832283238324832583268327832883298330833183328333833483358336833783388339834083418342834383448345834683478348834983508351835283538354835583568357835883598360836183628363836483658366836783688369837083718372837383748375837683778378837983808381838283838384838583868387838883898390839183928393839483958396839783988399840084018402840384048405840684078408840984108411841284138414841584168417841884198420842184228423842484258426842784288429843084318432843384348435843684378438843984408441844284438444844584468447844884498450845184528453845484558456845784588459846084618462846384648465846684678468846984708471847284738474847584768477847884798480848184828483848484858486848784888489849084918492849384948495849684978498849985008501850285038504850585068507850885098510851185128513851485158516851785188519852085218522852385248525852685278528852985308531853285338534853585368537853885398540854185428543854485458546854785488549855085518552855385548555855685578558855985608561856285638564856585668567856885698570857185728573857485758576857785788579858085818582858385848585858685878588858985908591859285938594859585968597859885998600860186028603860486058606860786088609861086118612861386148615861686178618861986208621862286238624862586268627862886298630863186328633863486358636863786388639864086418642864386448645864686478648864986508651865286538654865586568657865886598660866186628663866486658666866786688669867086718672867386748675867686778678867986808681868286838684868586868687868886898690869186928693869486958696869786988699870087018702870387048705870687078708870987108711871287138714871587168717871887198720872187228723872487258726872787288729873087318732873387348735873687378738873987408741874287438744874587468747874887498750875187528753875487558756875787588759876087618762876387648765876687678768876987708771877287738774877587768777877887798780878187828783878487858786878787888789879087918792879387948795879687978798879988008801880288038804880588068807880888098810881188128813881488158816881788188819882088218822882388248825882688278828882988308831883288338834883588368837883888398840884188428843884488458846884788488849885088518852885388548855885688578858885988608861886288638864886588668867886888698870887188728873887488758876887788788879888088818882888388848885888688878888888988908891889288938894889588968897889888998900890189028903890489058906890789088909891089118912891389148915891689178918891989208921892289238924892589268927892889298930893189328933893489358936893789388939894089418942894389448945894689478948894989508951895289538954895589568957895889598960896189628963896489658966896789688969897089718972897389748975897689778978897989808981898289838984898589868987898889898990899189928993899489958996899789988999900090019002900390049005900690079008900990109011901290139014901590169017901890199020902190229023902490259026902790289029903090319032903390349035903690379038903990409041904290439044904590469047904890499050905190529053905490559056905790589059906090619062906390649065906690679068906990709071907290739074907590769077907890799080908190829083908490859086908790889089909090919092909390949095909690979098909991009101910291039104910591069107910891099110911191129113911491159116911791189119912091219122912391249125912691279128912991309131913291339134913591369137913891399140914191429143914491459146914791489149915091519152915391549155915691579158915991609161916291639164916591669167916891699170917191729173917491759176917791789179918091819182918391849185918691879188918991909191919291939194919591969197919891999200920192029203920492059206920792089209921092119212921392149215921692179218921992209221922292239224922592269227922892299230923192329233923492359236923792389239924092419242924392449245924692479248924992509251925292539254925592569257925892599260926192629263926492659266926792689269927092719272927392749275927692779278927992809281928292839284928592869287928892899290929192929293929492959296929792989299930093019302930393049305930693079308930993109311931293139314931593169317931893199320932193229323932493259326932793289329933093319332933393349335933693379338933993409341934293439344934593469347934893499350935193529353935493559356935793589359936093619362936393649365936693679368936993709371937293739374937593769377937893799380938193829383938493859386938793889389939093919392939393949395939693979398939994009401940294039404940594069407940894099410941194129413941494159416941794189419942094219422942394249425942694279428942994309431943294339434943594369437943894399440944194429443944494459446944794489449945094519452945394549455945694579458945994609461946294639464946594669467946894699470947194729473947494759476947794789479948094819482948394849485948694879488948994909491949294939494949594969497949894999500950195029503950495059506950795089509951095119512951395149515951695179518951995209521952295239524952595269527952895299530953195329533953495359536953795389539954095419542954395449545954695479548954995509551955295539554955595569557955895599560956195629563956495659566956795689569957095719572957395749575957695779578957995809581958295839584958595869587958895899590959195929593959495959596959795989599960096019602960396049605960696079608960996109611961296139614961596169617961896199620962196229623962496259626962796289629963096319632963396349635963696379638963996409641964296439644964596469647964896499650965196529653965496559656965796589659966096619662966396649665966696679668966996709671967296739674967596769677967896799680968196829683968496859686968796889689969096919692969396949695969696979698969997009701970297039704970597069707970897099710971197129713971497159716971797189719972097219722972397249725972697279728972997309731973297339734973597369737973897399740974197429743974497459746974797489749975097519752975397549755975697579758975997609761976297639764976597669767976897699770977197729773977497759776977797789779978097819782978397849785978697879788978997909791979297939794979597969797979897999800980198029803980498059806980798089809981098119812981398149815981698179818981998209821982298239824982598269827982898299830983198329833983498359836983798389839984098419842984398449845984698479848984998509851985298539854985598569857985898599860986198629863986498659866986798689869987098719872987398749875987698779878987998809881988298839884988598869887988898899890989198929893989498959896989798989899990099019902990399049905990699079908990999109911991299139914991599169917991899199920992199229923992499259926992799289929993099319932993399349935993699379938993999409941994299439944994599469947994899499950995199529953995499559956995799589959996099619962996399649965996699679968996999709971997299739974997599769977997899799980998199829983998499859986998799889989999099919992999399949995999699979998999910000100011000210003100041000510006100071000810009100101001110012100131001410015100161001710018100191002010021100221002310024100251002610027100281002910030100311003210033100341003510036100371003810039100401004110042100431004410045100461004710048100491005010051100521005310054100551005610057100581005910060100611006210063100641006510066100671006810069100701007110072100731007410075100761007710078100791008010081100821008310084100851008610087100881008910090100911009210093100941009510096100971009810099101001010110102101031010410105101061010710108101091011010111101121011310114101151011610117101181011910120101211012210123101241012510126101271012810129101301013110132101331013410135101361013710138101391014010141101421014310144101451014610147101481014910150101511015210153101541015510156101571015810159101601016110162101631016410165101661016710168101691017010171101721017310174101751017610177101781017910180101811018210183101841018510186101871018810189101901019110192101931019410195101961019710198101991020010201102021020310204102051020610207102081020910210102111021210213102141021510216102171021810219102201022110222102231022410225102261022710228102291023010231102321023310234102351023610237102381023910240102411024210243102441024510246102471024810249102501025110252102531025410255102561025710258102591026010261102621026310264102651026610267102681026910270102711027210273102741027510276102771027810279102801028110282102831028410285102861028710288102891029010291102921029310294102951029610297102981029910300103011030210303103041030510306103071030810309103101031110312103131031410315103161031710318103191032010321103221032310324103251032610327103281032910330103311033210333103341033510336103371033810339103401034110342103431034410345103461034710348103491035010351103521035310354103551035610357103581035910360103611036210363103641036510366103671036810369103701037110372103731037410375103761037710378103791038010381103821038310384103851038610387103881038910390103911039210393103941039510396103971039810399104001040110402104031040410405104061040710408104091041010411104121041310414104151041610417104181041910420104211042210423104241042510426104271042810429104301043110432104331043410435104361043710438104391044010441104421044310444104451044610447104481044910450104511045210453104541045510456104571045810459104601046110462104631046410465104661046710468104691047010471104721047310474104751047610477104781047910480104811048210483104841048510486104871048810489104901049110492104931049410495104961049710498104991050010501105021050310504105051050610507105081050910510105111051210513105141051510516105171051810519105201052110522105231052410525105261052710528105291053010531105321053310534105351053610537105381053910540105411054210543105441054510546105471054810549105501055110552105531055410555105561055710558105591056010561105621056310564105651056610567105681056910570105711057210573105741057510576105771057810579105801058110582105831058410585105861058710588105891059010591105921059310594105951059610597105981059910600106011060210603106041060510606106071060810609106101061110612106131061410615106161061710618106191062010621106221062310624106251062610627106281062910630106311063210633106341063510636106371063810639106401064110642106431064410645106461064710648106491065010651106521065310654106551065610657106581065910660106611066210663106641066510666106671066810669106701067110672106731067410675106761067710678106791068010681106821068310684106851068610687106881068910690106911069210693106941069510696106971069810699107001070110702107031070410705107061070710708107091071010711107121071310714107151071610717107181071910720107211072210723107241072510726107271072810729107301073110732107331073410735107361073710738107391074010741107421074310744107451074610747107481074910750107511075210753107541075510756107571075810759107601076110762107631076410765107661076710768107691077010771107721077310774107751077610777107781077910780107811078210783107841078510786107871078810789107901079110792107931079410795107961079710798107991080010801108021080310804108051080610807108081080910810108111081210813108141081510816108171081810819108201082110822108231082410825108261082710828108291083010831108321083310834108351083610837108381083910840108411084210843108441084510846108471084810849108501085110852108531085410855108561085710858108591086010861108621086310864108651086610867108681086910870108711087210873108741087510876108771087810879108801088110882108831088410885108861088710888108891089010891108921089310894108951089610897108981089910900109011090210903109041090510906109071090810909109101091110912109131091410915109161091710918109191092010921109221092310924109251092610927109281092910930109311093210933109341093510936109371093810939109401094110942109431094410945109461094710948109491095010951109521095310954109551095610957109581095910960109611096210963109641096510966109671096810969109701097110972109731097410975109761097710978109791098010981109821098310984109851098610987109881098910990109911099210993109941099510996109971099810999110001100111002110031100411005110061100711008110091101011011110121101311014110151101611017110181101911020110211102211023110241102511026110271102811029110301103111032110331103411035110361103711038110391104011041110421104311044110451104611047110481104911050110511105211053110541105511056110571105811059110601106111062110631106411065110661106711068110691107011071110721107311074110751107611077110781107911080110811108211083110841108511086110871108811089110901109111092110931109411095110961109711098110991110011101111021110311104111051110611107111081110911110111111111211113111141111511116111171111811119111201112111122111231112411125111261112711128111291113011131111321113311134111351113611137111381113911140111411114211143111441114511146111471114811149111501115111152111531115411155111561115711158111591116011161111621116311164111651116611167111681116911170111711117211173111741117511176111771117811179111801118111182111831118411185111861118711188111891119011191111921119311194111951119611197111981119911200112011120211203112041120511206112071120811209112101121111212112131121411215112161121711218112191122011221112221122311224112251122611227112281122911230112311123211233112341123511236112371123811239112401124111242112431124411245112461124711248112491125011251112521125311254112551125611257112581125911260112611126211263112641126511266112671126811269112701127111272112731127411275112761127711278112791128011281112821128311284112851128611287112881128911290112911129211293112941129511296112971129811299113001130111302113031130411305113061130711308113091131011311113121131311314113151131611317113181131911320113211132211323113241132511326113271132811329113301133111332113331133411335113361133711338113391134011341113421134311344113451134611347113481134911350113511135211353113541135511356113571135811359113601136111362113631136411365113661136711368113691137011371113721137311374113751137611377113781137911380113811138211383113841138511386113871138811389113901139111392113931139411395113961139711398113991140011401114021140311404114051140611407114081140911410114111141211413114141141511416114171141811419114201142111422114231142411425114261142711428114291143011431114321143311434114351143611437114381143911440114411144211443114441144511446114471144811449114501145111452114531145411455114561145711458114591146011461114621146311464114651146611467114681146911470114711147211473114741147511476114771147811479114801148111482114831148411485114861148711488114891149011491114921149311494114951149611497114981149911500115011150211503115041150511506115071150811509115101151111512115131151411515115161151711518115191152011521115221152311524115251152611527115281152911530115311153211533115341153511536115371153811539115401154111542115431154411545115461154711548115491155011551115521155311554115551155611557115581155911560115611156211563115641156511566115671156811569115701157111572115731157411575115761157711578115791158011581115821158311584115851158611587115881158911590115911159211593115941159511596115971159811599116001160111602116031160411605116061160711608116091161011611116121161311614116151161611617116181161911620116211162211623116241162511626116271162811629116301163111632116331163411635116361163711638116391164011641116421164311644116451164611647116481164911650116511165211653116541165511656116571165811659116601166111662116631166411665116661166711668116691167011671116721167311674116751167611677116781167911680116811168211683116841168511686116871168811689116901169111692116931169411695116961169711698116991170011701117021170311704117051170611707117081170911710117111171211713117141171511716117171171811719117201172111722117231172411725117261172711728117291173011731117321173311734117351173611737117381173911740117411174211743117441174511746117471174811749117501175111752117531175411755117561175711758117591176011761117621176311764117651176611767117681176911770117711177211773117741177511776117771177811779117801178111782117831178411785117861178711788117891179011791117921179311794117951179611797117981179911800118011180211803118041180511806118071180811809118101181111812118131181411815118161181711818118191182011821118221182311824118251182611827118281182911830118311183211833118341183511836118371183811839118401184111842118431184411845118461184711848118491185011851118521185311854118551185611857118581185911860118611186211863118641186511866118671186811869118701187111872118731187411875118761187711878118791188011881118821188311884118851188611887118881188911890118911189211893118941189511896118971189811899119001190111902119031190411905119061190711908119091191011911119121191311914119151191611917119181191911920119211192211923119241192511926119271192811929119301193111932119331193411935119361193711938119391194011941119421194311944119451194611947119481194911950119511195211953119541195511956119571195811959119601196111962119631196411965119661196711968119691197011971119721197311974119751197611977119781197911980119811198211983119841198511986119871198811989119901199111992119931199411995119961199711998119991200012001120021200312004120051200612007120081200912010120111201212013120141201512016120171201812019120201202112022120231202412025120261202712028120291203012031120321203312034120351203612037120381203912040120411204212043120441204512046120471204812049120501205112052120531205412055120561205712058120591206012061120621206312064120651206612067120681206912070120711207212073120741207512076120771207812079120801208112082120831208412085120861208712088120891209012091120921209312094120951209612097120981209912100121011210212103121041210512106121071210812109121101211112112121131211412115121161211712118121191212012121121221212312124121251212612127121281212912130121311213212133121341213512136121371213812139121401214112142121431214412145121461214712148121491215012151121521215312154121551215612157121581215912160121611216212163121641216512166121671216812169121701217112172121731217412175121761217712178121791218012181121821218312184121851218612187121881218912190121911219212193121941219512196121971219812199122001220112202122031220412205122061220712208122091221012211122121221312214122151221612217122181221912220122211222212223122241222512226122271222812229122301223112232122331223412235122361223712238122391224012241122421224312244122451224612247122481224912250122511225212253122541225512256122571225812259122601226112262122631226412265122661226712268122691227012271122721227312274122751227612277122781227912280122811228212283122841228512286122871228812289122901229112292122931229412295122961229712298122991230012301123021230312304123051230612307123081230912310123111231212313123141231512316123171231812319123201232112322123231232412325123261232712328123291233012331123321233312334123351233612337123381233912340123411234212343123441234512346123471234812349123501235112352123531235412355123561235712358123591236012361123621236312364123651236612367123681236912370123711237212373123741237512376123771237812379123801238112382123831238412385123861238712388123891239012391123921239312394123951239612397123981239912400124011240212403124041240512406124071240812409124101241112412124131241412415124161241712418124191242012421124221242312424124251242612427124281242912430124311243212433124341243512436124371243812439124401244112442124431244412445124461244712448124491245012451124521245312454124551245612457124581245912460124611246212463124641246512466124671246812469124701247112472124731247412475124761247712478124791248012481124821248312484124851248612487124881248912490124911249212493124941249512496124971249812499125001250112502125031250412505125061250712508125091251012511125121251312514125151251612517125181251912520125211252212523125241252512526125271252812529125301253112532125331253412535125361253712538125391254012541125421254312544125451254612547125481254912550125511255212553125541255512556125571255812559125601256112562125631256412565125661256712568125691257012571125721257312574125751257612577125781257912580125811258212583125841258512586125871258812589125901259112592125931259412595125961259712598125991260012601126021260312604126051260612607126081260912610126111261212613126141261512616126171261812619126201262112622126231262412625126261262712628126291263012631126321263312634126351263612637126381263912640126411264212643126441264512646126471264812649126501265112652126531265412655126561265712658126591266012661126621266312664126651266612667126681266912670126711267212673126741267512676126771267812679126801268112682126831268412685126861268712688126891269012691126921269312694126951269612697126981269912700127011270212703127041270512706127071270812709127101271112712127131271412715127161271712718127191272012721127221272312724127251272612727127281272912730127311273212733127341273512736127371273812739127401274112742127431274412745127461274712748127491275012751127521275312754127551275612757127581275912760127611276212763127641276512766127671276812769127701277112772127731277412775127761277712778127791278012781127821278312784127851278612787127881278912790127911279212793127941279512796127971279812799128001280112802128031280412805128061280712808128091281012811128121281312814128151281612817128181281912820128211282212823128241282512826128271282812829128301283112832128331283412835128361283712838128391284012841128421284312844128451284612847128481284912850128511285212853128541285512856128571285812859128601286112862128631286412865128661286712868128691287012871128721287312874128751287612877128781287912880128811288212883128841288512886128871288812889128901289112892128931289412895128961289712898128991290012901129021290312904129051290612907129081290912910129111291212913129141291512916129171291812919129201292112922129231292412925129261292712928129291293012931129321293312934129351293612937129381293912940129411294212943129441294512946129471294812949129501295112952129531295412955129561295712958129591296012961129621296312964129651296612967129681296912970129711297212973129741297512976129771297812979129801298112982129831298412985129861298712988129891299012991129921299312994129951299612997129981299913000130011300213003130041300513006130071300813009130101301113012130131301413015130161301713018130191302013021130221302313024130251302613027130281302913030130311303213033130341303513036130371303813039130401304113042130431304413045130461304713048130491305013051130521305313054130551305613057130581305913060130611306213063130641306513066130671306813069130701307113072130731307413075130761307713078130791308013081130821308313084130851308613087130881308913090130911309213093130941309513096130971309813099131001310113102131031310413105131061310713108131091311013111131121311313114131151311613117131181311913120131211312213123131241312513126131271312813129131301313113132131331313413135131361313713138131391314013141131421314313144131451314613147131481314913150131511315213153131541315513156131571315813159131601316113162131631316413165131661316713168131691317013171131721317313174131751317613177131781317913180131811318213183131841318513186131871318813189131901319113192131931319413195131961319713198131991320013201132021320313204132051320613207132081320913210132111321213213132141321513216132171321813219132201322113222132231322413225132261322713228132291323013231132321323313234132351323613237132381323913240132411324213243132441324513246132471324813249132501325113252132531325413255132561325713258132591326013261132621326313264132651326613267132681326913270132711327213273132741327513276132771327813279132801328113282132831328413285132861328713288132891329013291132921329313294132951329613297132981329913300133011330213303133041330513306133071330813309133101331113312133131331413315133161331713318133191332013321133221332313324133251332613327133281332913330133311333213333133341333513336133371333813339133401334113342133431334413345133461334713348133491335013351133521335313354133551335613357133581335913360133611336213363133641336513366133671336813369133701337113372133731337413375133761337713378133791338013381133821338313384133851338613387133881338913390133911339213393133941339513396133971339813399134001340113402134031340413405134061340713408134091341013411134121341313414134151341613417134181341913420134211342213423134241342513426134271342813429134301343113432134331343413435134361343713438134391344013441134421344313444134451344613447134481344913450134511345213453134541345513456134571345813459134601346113462134631346413465134661346713468134691347013471134721347313474134751347613477134781347913480134811348213483134841348513486134871348813489134901349113492134931349413495134961349713498134991350013501135021350313504135051350613507135081350913510135111351213513135141351513516135171351813519135201352113522135231352413525135261352713528135291353013531135321353313534135351353613537135381353913540135411354213543135441354513546135471354813549135501355113552135531355413555135561355713558135591356013561135621356313564135651356613567135681356913570135711357213573135741357513576135771357813579135801358113582135831358413585135861358713588135891359013591135921359313594135951359613597135981359913600136011360213603136041360513606136071360813609136101361113612136131361413615136161361713618136191362013621136221362313624136251362613627136281362913630136311363213633136341363513636136371363813639136401364113642136431364413645136461364713648136491365013651136521365313654136551365613657136581365913660136611366213663136641366513666136671366813669136701367113672136731367413675136761367713678136791368013681136821368313684136851368613687136881368913690136911369213693136941369513696136971369813699137001370113702137031370413705137061370713708137091371013711137121371313714137151371613717137181371913720137211372213723137241372513726137271372813729137301373113732137331373413735137361373713738137391374013741137421374313744137451374613747137481374913750137511375213753137541375513756137571375813759137601376113762137631376413765137661376713768137691377013771137721377313774137751377613777137781377913780137811378213783137841378513786137871378813789137901379113792137931379413795137961379713798137991380013801138021380313804138051380613807138081380913810138111381213813138141381513816138171381813819138201382113822138231382413825138261382713828138291383013831138321383313834138351383613837138381383913840138411384213843138441384513846138471384813849138501385113852138531385413855138561385713858138591386013861138621386313864138651386613867138681386913870138711387213873138741387513876138771387813879138801388113882138831388413885138861388713888138891389013891138921389313894138951389613897138981389913900139011390213903139041390513906139071390813909139101391113912139131391413915139161391713918139191392013921139221392313924139251392613927139281392913930139311393213933139341393513936139371393813939139401394113942139431394413945139461394713948139491395013951139521395313954139551395613957139581395913960139611396213963139641396513966139671396813969139701397113972139731397413975139761397713978139791398013981139821398313984139851398613987139881398913990139911399213993139941399513996139971399813999140001400114002140031400414005140061400714008140091401014011140121401314014140151401614017140181401914020140211402214023140241402514026140271402814029140301403114032140331403414035140361403714038140391404014041140421404314044140451404614047140481404914050140511405214053140541405514056140571405814059140601406114062140631406414065140661406714068140691407014071140721407314074140751407614077140781407914080140811408214083140841408514086140871408814089140901409114092140931409414095140961409714098140991410014101141021410314104141051410614107141081410914110141111411214113141141411514116141171411814119141201412114122141231412414125141261412714128141291413014131141321413314134141351413614137141381413914140141411414214143141441414514146141471414814149141501415114152141531415414155141561415714158141591416014161141621416314164141651416614167141681416914170141711417214173141741417514176141771417814179141801418114182141831418414185141861418714188141891419014191141921419314194141951419614197141981419914200142011420214203142041420514206142071420814209142101421114212142131421414215142161421714218142191422014221142221422314224142251422614227142281422914230142311423214233142341423514236142371423814239142401424114242142431424414245142461424714248142491425014251142521425314254142551425614257142581425914260142611426214263142641426514266142671426814269142701427114272142731427414275142761427714278142791428014281142821428314284142851428614287142881428914290142911429214293142941429514296142971429814299143001430114302143031430414305143061430714308143091431014311143121431314314143151431614317143181431914320143211432214323143241432514326143271432814329143301433114332143331433414335143361433714338143391434014341143421434314344143451434614347143481434914350143511435214353143541435514356143571435814359143601436114362143631436414365143661436714368143691437014371143721437314374143751437614377143781437914380143811438214383143841438514386143871438814389143901439114392143931439414395143961439714398143991440014401144021440314404144051440614407144081440914410144111441214413144141441514416144171441814419144201442114422144231442414425144261442714428144291443014431144321443314434144351443614437144381443914440144411444214443144441444514446144471444814449144501445114452144531445414455144561445714458144591446014461144621446314464144651446614467144681446914470144711447214473144741447514476144771447814479144801448114482144831448414485144861448714488144891449014491144921449314494144951449614497144981449914500145011450214503145041450514506145071450814509145101451114512145131451414515145161451714518145191452014521145221452314524145251452614527145281452914530145311453214533145341453514536145371453814539145401454114542145431454414545145461454714548145491455014551145521455314554145551455614557145581455914560145611456214563145641456514566145671456814569145701457114572145731457414575145761457714578145791458014581145821458314584145851458614587145881458914590145911459214593145941459514596145971459814599146001460114602146031460414605146061460714608146091461014611146121461314614146151461614617146181461914620146211462214623146241462514626146271462814629146301463114632146331463414635146361463714638146391464014641146421464314644146451464614647146481464914650146511465214653146541465514656146571465814659146601466114662146631466414665146661466714668146691467014671146721467314674146751467614677146781467914680146811468214683146841468514686146871468814689146901469114692146931469414695146961469714698146991470014701147021470314704147051470614707147081470914710147111471214713147141471514716147171471814719147201472114722147231472414725147261472714728147291473014731147321473314734147351473614737147381473914740147411474214743147441474514746147471474814749147501475114752147531475414755147561475714758147591476014761147621476314764147651476614767147681476914770147711477214773147741477514776147771477814779147801478114782147831478414785147861478714788147891479014791147921479314794147951479614797147981479914800148011480214803148041480514806148071480814809148101481114812148131481414815148161481714818148191482014821148221482314824148251482614827148281482914830148311483214833148341483514836148371483814839148401484114842148431484414845148461484714848148491485014851148521485314854148551485614857148581485914860148611486214863148641486514866148671486814869148701487114872148731487414875148761487714878148791488014881148821488314884148851488614887148881488914890148911489214893148941489514896148971489814899149001490114902149031490414905149061490714908149091491014911149121491314914149151491614917149181491914920149211492214923149241492514926149271492814929149301493114932149331493414935149361493714938149391494014941149421494314944149451494614947149481494914950149511495214953149541495514956149571495814959149601496114962149631496414965149661496714968149691497014971149721497314974149751497614977149781497914980149811498214983149841498514986149871498814989149901499114992149931499414995149961499714998149991500015001150021500315004150051500615007150081500915010150111501215013150141501515016150171501815019150201502115022150231502415025150261502715028150291503015031150321503315034150351503615037150381503915040150411504215043150441504515046150471504815049150501505115052150531505415055150561505715058150591506015061150621506315064150651506615067150681506915070150711507215073150741507515076150771507815079150801508115082150831508415085150861508715088150891509015091150921509315094150951509615097150981509915100151011510215103151041510515106151071510815109151101511115112151131511415115151161511715118151191512015121151221512315124151251512615127151281512915130151311513215133151341513515136151371513815139151401514115142151431514415145151461514715148151491515015151151521515315154151551515615157151581515915160151611516215163151641516515166151671516815169151701517115172151731517415175151761517715178151791518015181151821518315184151851518615187151881518915190151911519215193151941519515196151971519815199152001520115202152031520415205152061520715208152091521015211152121521315214152151521615217152181521915220152211522215223152241522515226152271522815229152301523115232152331523415235152361523715238152391524015241152421524315244152451524615247152481524915250152511525215253152541525515256152571525815259152601526115262152631526415265152661526715268152691527015271152721527315274152751527615277152781527915280152811528215283152841528515286152871528815289152901529115292152931529415295152961529715298152991530015301153021530315304153051530615307153081530915310153111531215313153141531515316153171531815319153201532115322153231532415325153261532715328153291533015331153321533315334153351533615337153381533915340153411534215343153441534515346153471534815349153501535115352153531535415355153561535715358153591536015361153621536315364153651536615367153681536915370153711537215373153741537515376153771537815379153801538115382153831538415385153861538715388153891539015391153921539315394153951539615397153981539915400154011540215403154041540515406154071540815409154101541115412154131541415415154161541715418154191542015421154221542315424154251542615427154281542915430154311543215433154341543515436154371543815439154401544115442154431544415445154461544715448154491545015451154521545315454154551545615457154581545915460154611546215463154641546515466154671546815469154701547115472154731547415475154761547715478154791548015481154821548315484154851548615487154881548915490154911549215493154941549515496154971549815499155001550115502155031550415505155061550715508155091551015511155121551315514155151551615517155181551915520155211552215523155241552515526155271552815529155301553115532155331553415535155361553715538155391554015541155421554315544155451554615547155481554915550155511555215553155541555515556155571555815559155601556115562155631556415565155661556715568155691557015571155721557315574155751557615577155781557915580155811558215583155841558515586155871558815589155901559115592155931559415595155961559715598155991560015601156021560315604156051560615607156081560915610156111561215613156141561515616156171561815619156201562115622156231562415625156261562715628156291563015631156321563315634156351563615637156381563915640156411564215643156441564515646156471564815649156501565115652156531565415655156561565715658156591566015661156621566315664156651566615667156681566915670156711567215673156741567515676156771567815679156801568115682156831568415685156861568715688156891569015691156921569315694156951569615697156981569915700157011570215703157041570515706157071570815709157101571115712157131571415715157161571715718157191572015721157221572315724157251572615727157281572915730157311573215733157341573515736157371573815739157401574115742157431574415745157461574715748157491575015751157521575315754157551575615757157581575915760157611576215763157641576515766157671576815769157701577115772157731577415775157761577715778157791578015781157821578315784157851578615787157881578915790157911579215793157941579515796157971579815799158001580115802158031580415805158061580715808158091581015811158121581315814158151581615817158181581915820158211582215823158241582515826158271582815829158301583115832158331583415835158361583715838158391584015841158421584315844158451584615847158481584915850158511585215853158541585515856158571585815859158601586115862158631586415865158661586715868158691587015871158721587315874158751587615877158781587915880158811588215883158841588515886158871588815889158901589115892158931589415895158961589715898158991590015901159021590315904159051590615907159081590915910159111591215913159141591515916159171591815919159201592115922159231592415925159261592715928159291593015931159321593315934159351593615937159381593915940159411594215943159441594515946159471594815949159501595115952159531595415955159561595715958159591596015961159621596315964159651596615967159681596915970159711597215973159741597515976159771597815979159801598115982159831598415985159861598715988159891599015991159921599315994159951599615997159981599916000160011600216003160041600516006160071600816009160101601116012160131601416015160161601716018160191602016021160221602316024160251602616027160281602916030160311603216033160341603516036160371603816039160401604116042160431604416045160461604716048160491605016051160521605316054160551605616057160581605916060160611606216063160641606516066160671606816069160701607116072160731607416075160761607716078160791608016081160821608316084160851608616087160881608916090160911609216093160941609516096160971609816099161001610116102161031610416105161061610716108161091611016111161121611316114161151611616117161181611916120161211612216123161241612516126161271612816129161301613116132161331613416135161361613716138161391614016141161421614316144161451614616147161481614916150161511615216153161541615516156161571615816159161601616116162161631616416165161661616716168161691617016171161721617316174161751617616177161781617916180161811618216183161841618516186161871618816189161901619116192161931619416195161961619716198161991620016201162021620316204162051620616207162081620916210162111621216213162141621516216162171621816219162201622116222162231622416225162261622716228162291623016231162321623316234162351623616237162381623916240162411624216243162441624516246162471624816249162501625116252162531625416255162561625716258162591626016261162621626316264162651626616267162681626916270162711627216273162741627516276162771627816279162801628116282162831628416285162861628716288162891629016291162921629316294162951629616297162981629916300163011630216303163041630516306163071630816309163101631116312163131631416315163161631716318163191632016321163221632316324163251632616327163281632916330163311633216333163341633516336163371633816339163401634116342163431634416345163461634716348163491635016351163521635316354163551635616357163581635916360163611636216363163641636516366163671636816369163701637116372163731637416375163761637716378163791638016381163821638316384163851638616387163881638916390163911639216393163941639516396163971639816399164001640116402164031640416405164061640716408164091641016411164121641316414164151641616417164181641916420164211642216423164241642516426164271642816429164301643116432164331643416435164361643716438164391644016441164421644316444164451644616447164481644916450164511645216453164541645516456164571645816459164601646116462164631646416465164661646716468164691647016471164721647316474164751647616477164781647916480164811648216483164841648516486164871648816489164901649116492164931649416495164961649716498164991650016501165021650316504165051650616507165081650916510165111651216513165141651516516165171651816519165201652116522165231652416525165261652716528165291653016531165321653316534165351653616537165381653916540165411654216543165441654516546165471654816549165501655116552165531655416555165561655716558165591656016561165621656316564165651656616567165681656916570165711657216573165741657516576165771657816579165801658116582165831658416585165861658716588165891659016591165921659316594165951659616597165981659916600166011660216603166041660516606166071660816609166101661116612166131661416615166161661716618166191662016621166221662316624166251662616627166281662916630166311663216633166341663516636166371663816639166401664116642166431664416645166461664716648166491665016651166521665316654166551665616657166581665916660166611666216663166641666516666166671666816669166701667116672166731667416675166761667716678166791668016681166821668316684166851668616687166881668916690166911669216693166941669516696166971669816699167001670116702167031670416705167061670716708167091671016711167121671316714167151671616717167181671916720167211672216723167241672516726167271672816729167301673116732167331673416735167361673716738167391674016741167421674316744167451674616747167481674916750167511675216753167541675516756167571675816759167601676116762167631676416765167661676716768167691677016771167721677316774167751677616777167781677916780167811678216783167841678516786167871678816789167901679116792167931679416795167961679716798167991680016801168021680316804168051680616807168081680916810168111681216813168141681516816168171681816819168201682116822168231682416825168261682716828168291683016831168321683316834168351683616837168381683916840168411684216843168441684516846168471684816849168501685116852168531685416855168561685716858168591686016861168621686316864168651686616867168681686916870168711687216873168741687516876168771687816879168801688116882168831688416885168861688716888168891689016891168921689316894168951689616897168981689916900169011690216903169041690516906169071690816909169101691116912169131691416915169161691716918169191692016921169221692316924169251692616927169281692916930169311693216933169341693516936169371693816939169401694116942169431694416945169461694716948169491695016951169521695316954169551695616957169581695916960169611696216963169641696516966169671696816969169701697116972169731697416975169761697716978169791698016981169821698316984169851698616987169881698916990169911699216993169941699516996169971699816999170001700117002170031700417005170061700717008170091701017011170121701317014170151701617017170181701917020170211702217023170241702517026170271702817029170301703117032170331703417035170361703717038170391704017041170421704317044170451704617047170481704917050170511705217053170541705517056170571705817059170601706117062170631706417065170661706717068170691707017071170721707317074170751707617077170781707917080170811708217083170841708517086170871708817089170901709117092170931709417095170961709717098170991710017101171021710317104171051710617107171081710917110171111711217113171141711517116171171711817119171201712117122171231712417125171261712717128171291713017131171321713317134171351713617137171381713917140171411714217143171441714517146171471714817149171501715117152171531715417155171561715717158171591716017161171621716317164171651716617167171681716917170171711717217173171741717517176171771717817179171801718117182171831718417185171861718717188171891719017191171921719317194171951719617197171981719917200172011720217203172041720517206172071720817209172101721117212172131721417215172161721717218172191722017221172221722317224172251722617227172281722917230172311723217233172341723517236172371723817239172401724117242172431724417245172461724717248172491725017251172521725317254172551725617257172581725917260172611726217263172641726517266172671726817269172701727117272172731727417275172761727717278172791728017281172821728317284172851728617287172881728917290172911729217293172941729517296172971729817299173001730117302173031730417305173061730717308173091731017311173121731317314173151731617317173181731917320173211732217323173241732517326173271732817329173301733117332173331733417335173361733717338173391734017341173421734317344173451734617347173481734917350173511735217353173541735517356173571735817359173601736117362173631736417365173661736717368173691737017371173721737317374173751737617377173781737917380173811738217383173841738517386173871738817389173901739117392173931739417395173961739717398173991740017401174021740317404174051740617407174081740917410174111741217413174141741517416174171741817419174201742117422174231742417425174261742717428174291743017431174321743317434174351743617437174381743917440174411744217443174441744517446174471744817449174501745117452174531745417455174561745717458174591746017461174621746317464174651746617467174681746917470174711747217473174741747517476174771747817479174801748117482174831748417485174861748717488174891749017491174921749317494174951749617497174981749917500175011750217503175041750517506175071750817509175101751117512175131751417515175161751717518175191752017521175221752317524175251752617527175281752917530175311753217533175341753517536175371753817539175401754117542175431754417545175461754717548175491755017551175521755317554175551755617557175581755917560175611756217563175641756517566175671756817569175701757117572175731757417575175761757717578175791758017581175821758317584175851758617587175881758917590175911759217593175941759517596175971759817599176001760117602176031760417605176061760717608176091761017611176121761317614176151761617617176181761917620176211762217623176241762517626176271762817629176301763117632176331763417635176361763717638176391764017641176421764317644176451764617647176481764917650176511765217653176541765517656176571765817659176601766117662176631766417665176661766717668176691767017671176721767317674176751767617677176781767917680176811768217683176841768517686176871768817689176901769117692176931769417695176961769717698176991770017701177021770317704177051770617707177081770917710177111771217713177141771517716177171771817719177201772117722177231772417725177261772717728177291773017731177321773317734177351773617737177381773917740177411774217743177441774517746177471774817749177501775117752177531775417755177561775717758177591776017761177621776317764177651776617767177681776917770177711777217773177741777517776177771777817779177801778117782177831778417785177861778717788177891779017791177921779317794177951779617797177981779917800178011780217803178041780517806178071780817809178101781117812178131781417815178161781717818178191782017821178221782317824178251782617827178281782917830178311783217833178341783517836178371783817839178401784117842178431784417845178461784717848178491785017851178521785317854178551785617857178581785917860178611786217863178641786517866178671786817869178701787117872178731787417875178761787717878178791788017881178821788317884178851788617887178881788917890178911789217893178941789517896178971789817899179001790117902179031790417905179061790717908179091791017911179121791317914179151791617917179181791917920179211792217923179241792517926179271792817929179301793117932179331793417935179361793717938179391794017941179421794317944179451794617947179481794917950179511795217953179541795517956179571795817959179601796117962179631796417965179661796717968179691797017971179721797317974179751797617977179781797917980179811798217983179841798517986179871798817989179901799117992179931799417995179961799717998179991800018001180021800318004180051800618007180081800918010180111801218013180141801518016180171801818019180201802118022180231802418025180261802718028180291803018031180321803318034180351803618037180381803918040180411804218043180441804518046180471804818049180501805118052180531805418055180561805718058180591806018061180621806318064180651806618067180681806918070180711807218073180741807518076180771807818079180801808118082180831808418085180861808718088180891809018091180921809318094180951809618097180981809918100181011810218103181041810518106181071810818109181101811118112181131811418115181161811718118181191812018121181221812318124181251812618127181281812918130181311813218133181341813518136181371813818139181401814118142181431814418145181461814718148181491815018151181521815318154181551815618157181581815918160181611816218163181641816518166181671816818169181701817118172181731817418175181761817718178181791818018181181821818318184181851818618187181881818918190181911819218193181941819518196181971819818199182001820118202182031820418205182061820718208182091821018211182121821318214182151821618217182181821918220182211822218223182241822518226182271822818229182301823118232182331823418235182361823718238182391824018241182421824318244182451824618247182481824918250182511825218253182541825518256182571825818259182601826118262182631826418265182661826718268182691827018271182721827318274182751827618277182781827918280182811828218283182841828518286182871828818289182901829118292182931829418295182961829718298182991830018301183021830318304183051830618307183081830918310183111831218313183141831518316183171831818319183201832118322183231832418325183261832718328183291833018331183321833318334183351833618337183381833918340183411834218343183441834518346183471834818349183501835118352183531835418355183561835718358183591836018361183621836318364183651836618367183681836918370183711837218373183741837518376183771837818379183801838118382183831838418385183861838718388183891839018391183921839318394183951839618397183981839918400184011840218403184041840518406184071840818409184101841118412184131841418415184161841718418184191842018421184221842318424184251842618427184281842918430184311843218433184341843518436184371843818439184401844118442184431844418445184461844718448184491845018451184521845318454184551845618457184581845918460184611846218463184641846518466184671846818469184701847118472184731847418475184761847718478184791848018481184821848318484184851848618487184881848918490184911849218493184941849518496184971849818499185001850118502185031850418505185061850718508185091851018511185121851318514185151851618517185181851918520185211852218523185241852518526185271852818529185301853118532185331853418535185361853718538185391854018541185421854318544185451854618547185481854918550185511855218553185541855518556185571855818559185601856118562185631856418565185661856718568185691857018571185721857318574185751857618577185781857918580185811858218583185841858518586185871858818589185901859118592185931859418595185961859718598185991860018601186021860318604186051860618607186081860918610186111861218613186141861518616186171861818619186201862118622186231862418625186261862718628186291863018631186321863318634186351863618637186381863918640186411864218643186441864518646186471864818649186501865118652186531865418655186561865718658186591866018661186621866318664186651866618667186681866918670186711867218673186741867518676186771867818679186801868118682186831868418685186861868718688186891869018691186921869318694186951869618697186981869918700187011870218703187041870518706187071870818709187101871118712187131871418715187161871718718187191872018721187221872318724187251872618727187281872918730187311873218733187341873518736187371873818739187401874118742187431874418745187461874718748187491875018751187521875318754187551875618757187581875918760187611876218763187641876518766187671876818769187701877118772187731877418775187761877718778187791878018781187821878318784187851878618787187881878918790187911879218793187941879518796187971879818799188001880118802188031880418805188061880718808188091881018811188121881318814188151881618817188181881918820188211882218823188241882518826188271882818829188301883118832188331883418835188361883718838188391884018841188421884318844188451884618847188481884918850188511885218853188541885518856188571885818859188601886118862188631886418865188661886718868188691887018871188721887318874188751887618877188781887918880188811888218883188841888518886188871888818889188901889118892188931889418895188961889718898188991890018901189021890318904189051890618907189081890918910189111891218913189141891518916189171891818919189201892118922189231892418925189261892718928189291893018931189321893318934189351893618937189381893918940189411894218943189441894518946189471894818949189501895118952189531895418955189561895718958189591896018961189621896318964189651896618967189681896918970189711897218973189741897518976189771897818979189801898118982189831898418985189861898718988189891899018991189921899318994189951899618997189981899919000190011900219003190041900519006190071900819009190101901119012190131901419015190161901719018190191902019021190221902319024190251902619027190281902919030190311903219033190341903519036190371903819039190401904119042190431904419045190461904719048190491905019051190521905319054190551905619057190581905919060190611906219063190641906519066190671906819069190701907119072190731907419075190761907719078190791908019081190821908319084190851908619087190881908919090190911909219093190941909519096190971909819099191001910119102191031910419105191061910719108191091911019111191121911319114191151911619117191181911919120191211912219123191241912519126191271912819129191301913119132191331913419135191361913719138191391914019141191421914319144191451914619147191481914919150191511915219153191541915519156191571915819159191601916119162191631916419165191661916719168191691917019171191721917319174191751917619177191781917919180191811918219183191841918519186191871918819189191901919119192191931919419195191961919719198191991920019201192021920319204192051920619207192081920919210192111921219213192141921519216192171921819219192201922119222192231922419225192261922719228192291923019231192321923319234192351923619237192381923919240192411924219243192441924519246192471924819249192501925119252192531925419255192561925719258192591926019261192621926319264192651926619267192681926919270192711927219273192741927519276192771927819279192801928119282192831928419285192861928719288192891929019291192921929319294192951929619297192981929919300193011930219303193041930519306193071930819309193101931119312193131931419315193161931719318193191932019321193221932319324193251932619327193281932919330193311933219333193341933519336193371933819339193401934119342193431934419345193461934719348193491935019351193521935319354193551935619357193581935919360193611936219363193641936519366193671936819369193701937119372193731937419375193761937719378193791938019381193821938319384193851938619387193881938919390193911939219393193941939519396193971939819399194001940119402194031940419405194061940719408194091941019411194121941319414194151941619417194181941919420194211942219423194241942519426194271942819429194301943119432194331943419435194361943719438194391944019441194421944319444194451944619447194481944919450194511945219453194541945519456194571945819459194601946119462194631946419465194661946719468194691947019471194721947319474194751947619477194781947919480194811948219483194841948519486194871948819489194901949119492194931949419495194961949719498194991950019501195021950319504195051950619507195081950919510195111951219513195141951519516195171951819519195201952119522195231952419525195261952719528195291953019531195321953319534195351953619537195381953919540195411954219543195441954519546195471954819549195501955119552195531955419555195561955719558195591956019561195621956319564195651956619567195681956919570195711957219573195741957519576195771957819579195801958119582195831958419585195861958719588195891959019591195921959319594195951959619597195981959919600196011960219603196041960519606196071960819609196101961119612196131961419615196161961719618196191962019621196221962319624196251962619627196281962919630196311963219633196341963519636196371963819639196401964119642196431964419645196461964719648196491965019651196521965319654196551965619657196581965919660196611966219663196641966519666196671966819669196701967119672196731967419675196761967719678196791968019681196821968319684196851968619687196881968919690196911969219693196941969519696196971969819699197001970119702197031970419705197061970719708197091971019711197121971319714197151971619717197181971919720197211972219723197241972519726197271972819729197301973119732197331973419735197361973719738197391974019741197421974319744197451974619747197481974919750197511975219753197541975519756197571975819759197601976119762197631976419765197661976719768197691977019771197721977319774197751977619777197781977919780197811978219783197841978519786197871978819789197901979119792197931979419795197961979719798197991980019801198021980319804198051980619807198081980919810198111981219813198141981519816198171981819819198201982119822198231982419825198261982719828198291983019831198321983319834198351983619837198381983919840198411984219843198441984519846198471984819849198501985119852198531985419855198561985719858198591986019861198621986319864198651986619867198681986919870198711987219873198741987519876198771987819879198801988119882198831988419885198861988719888198891989019891198921989319894198951989619897198981989919900199011990219903199041990519906199071990819909199101991119912199131991419915199161991719918199191992019921199221992319924199251992619927199281992919930199311993219933199341993519936199371993819939199401994119942199431994419945199461994719948199491995019951199521995319954199551995619957199581995919960199611996219963199641996519966199671996819969199701997119972199731997419975199761997719978199791998019981199821998319984199851998619987199881998919990199911999219993199941999519996199971999819999200002000120002200032000420005200062000720008200092001020011200122001320014200152001620017200182001920020200212002220023200242002520026200272002820029200302003120032200332003420035200362003720038200392004020041200422004320044200452004620047200482004920050200512005220053200542005520056200572005820059200602006120062200632006420065200662006720068200692007020071200722007320074200752007620077200782007920080200812008220083200842008520086200872008820089200902009120092200932009420095200962009720098200992010020101201022010320104201052010620107201082010920110201112011220113201142011520116201172011820119201202012120122201232012420125201262012720128201292013020131201322013320134201352013620137201382013920140201412014220143201442014520146201472014820149201502015120152201532015420155201562015720158201592016020161201622016320164201652016620167201682016920170201712017220173201742017520176201772017820179201802018120182201832018420185201862018720188201892019020191201922019320194201952019620197201982019920200202012020220203202042020520206202072020820209202102021120212202132021420215202162021720218202192022020221202222022320224202252022620227202282022920230202312023220233202342023520236202372023820239202402024120242202432024420245202462024720248202492025020251202522025320254202552025620257202582025920260202612026220263202642026520266202672026820269202702027120272202732027420275202762027720278202792028020281202822028320284202852028620287202882028920290202912029220293202942029520296202972029820299203002030120302203032030420305203062030720308203092031020311203122031320314203152031620317203182031920320203212032220323203242032520326203272032820329203302033120332203332033420335203362033720338203392034020341203422034320344203452034620347203482034920350203512035220353203542035520356203572035820359203602036120362203632036420365203662036720368203692037020371203722037320374203752037620377203782037920380203812038220383203842038520386203872038820389203902039120392203932039420395203962039720398203992040020401204022040320404204052040620407204082040920410204112041220413204142041520416204172041820419204202042120422204232042420425204262042720428204292043020431204322043320434204352043620437204382043920440204412044220443204442044520446204472044820449204502045120452204532045420455204562045720458204592046020461204622046320464204652046620467204682046920470204712047220473204742047520476204772047820479204802048120482204832048420485204862048720488204892049020491204922049320494204952049620497204982049920500205012050220503205042050520506205072050820509205102051120512205132051420515205162051720518205192052020521205222052320524205252052620527205282052920530205312053220533205342053520536205372053820539205402054120542205432054420545205462054720548205492055020551205522055320554205552055620557205582055920560205612056220563205642056520566205672056820569205702057120572205732057420575205762057720578205792058020581205822058320584205852058620587205882058920590205912059220593205942059520596205972059820599206002060120602206032060420605206062060720608206092061020611206122061320614206152061620617206182061920620206212062220623206242062520626206272062820629206302063120632206332063420635206362063720638206392064020641206422064320644206452064620647206482064920650206512065220653206542065520656206572065820659206602066120662206632066420665206662066720668206692067020671206722067320674206752067620677206782067920680206812068220683206842068520686206872068820689206902069120692206932069420695206962069720698206992070020701207022070320704207052070620707207082070920710207112071220713207142071520716207172071820719207202072120722207232072420725207262072720728207292073020731207322073320734207352073620737207382073920740207412074220743207442074520746207472074820749207502075120752207532075420755207562075720758207592076020761207622076320764207652076620767207682076920770207712077220773207742077520776207772077820779207802078120782207832078420785207862078720788207892079020791207922079320794207952079620797207982079920800208012080220803208042080520806208072080820809208102081120812208132081420815208162081720818208192082020821208222082320824208252082620827208282082920830208312083220833208342083520836208372083820839208402084120842208432084420845208462084720848208492085020851208522085320854208552085620857208582085920860208612086220863208642086520866208672086820869208702087120872208732087420875208762087720878208792088020881208822088320884208852088620887208882088920890208912089220893208942089520896208972089820899209002090120902209032090420905209062090720908209092091020911209122091320914209152091620917209182091920920209212092220923209242092520926209272092820929209302093120932209332093420935209362093720938209392094020941209422094320944209452094620947209482094920950209512095220953209542095520956209572095820959209602096120962209632096420965209662096720968209692097020971209722097320974209752097620977209782097920980209812098220983209842098520986209872098820989209902099120992209932099420995209962099720998209992100021001210022100321004210052100621007210082100921010210112101221013210142101521016210172101821019210202102121022210232102421025210262102721028210292103021031210322103321034210352103621037210382103921040210412104221043210442104521046210472104821049210502105121052210532105421055210562105721058210592106021061210622106321064210652106621067210682106921070210712107221073210742107521076210772107821079210802108121082210832108421085210862108721088210892109021091210922109321094210952109621097210982109921100211012110221103211042110521106211072110821109211102111121112211132111421115211162111721118211192112021121211222112321124211252112621127211282112921130211312113221133211342113521136211372113821139211402114121142211432114421145211462114721148211492115021151211522115321154211552115621157211582115921160211612116221163211642116521166211672116821169211702117121172211732117421175211762117721178211792118021181211822118321184211852118621187211882118921190211912119221193211942119521196211972119821199212002120121202212032120421205212062120721208212092121021211212122121321214212152121621217212182121921220212212122221223212242122521226212272122821229212302123121232212332123421235212362123721238212392124021241212422124321244212452124621247212482124921250212512125221253212542125521256212572125821259212602126121262212632126421265212662126721268212692127021271212722127321274212752127621277212782127921280212812128221283212842128521286212872128821289212902129121292212932129421295212962129721298212992130021301213022130321304213052130621307213082130921310213112131221313213142131521316213172131821319213202132121322213232132421325213262132721328213292133021331213322133321334213352133621337213382133921340213412134221343213442134521346213472134821349213502135121352213532135421355213562135721358213592136021361213622136321364213652136621367213682136921370213712137221373213742137521376213772137821379213802138121382213832138421385213862138721388213892139021391213922139321394213952139621397213982139921400214012140221403214042140521406214072140821409214102141121412214132141421415214162141721418214192142021421214222142321424214252142621427214282142921430214312143221433214342143521436214372143821439214402144121442214432144421445214462144721448214492145021451214522145321454214552145621457214582145921460214612146221463214642146521466214672146821469214702147121472214732147421475214762147721478214792148021481214822148321484214852148621487214882148921490214912149221493214942149521496214972149821499215002150121502215032150421505215062150721508215092151021511215122151321514215152151621517215182151921520215212152221523215242152521526215272152821529215302153121532215332153421535215362153721538215392154021541215422154321544215452154621547215482154921550215512155221553215542155521556215572155821559215602156121562215632156421565215662156721568215692157021571215722157321574215752157621577215782157921580215812158221583215842158521586215872158821589215902159121592215932159421595215962159721598215992160021601216022160321604216052160621607216082160921610216112161221613216142161521616216172161821619216202162121622216232162421625216262162721628216292163021631216322163321634216352163621637216382163921640216412164221643216442164521646216472164821649216502165121652216532165421655216562165721658216592166021661216622166321664216652166621667216682166921670216712167221673216742167521676216772167821679216802168121682216832168421685216862168721688216892169021691216922169321694216952169621697216982169921700217012170221703217042170521706217072170821709217102171121712217132171421715217162171721718217192172021721217222172321724217252172621727217282172921730217312173221733217342173521736217372173821739217402174121742217432174421745217462174721748217492175021751217522175321754217552175621757217582175921760217612176221763217642176521766217672176821769217702177121772217732177421775217762177721778217792178021781217822178321784217852178621787217882178921790217912179221793217942179521796217972179821799218002180121802218032180421805218062180721808218092181021811218122181321814218152181621817218182181921820218212182221823218242182521826218272182821829218302183121832218332183421835218362183721838218392184021841218422184321844218452184621847218482184921850218512185221853218542185521856218572185821859218602186121862218632186421865218662186721868218692187021871218722187321874218752187621877218782187921880218812188221883218842188521886218872188821889218902189121892218932189421895218962189721898218992190021901219022190321904219052190621907219082190921910219112191221913219142191521916219172191821919219202192121922219232192421925219262192721928219292193021931219322193321934219352193621937219382193921940219412194221943219442194521946219472194821949219502195121952219532195421955219562195721958219592196021961219622196321964219652196621967219682196921970219712197221973219742197521976219772197821979219802198121982219832198421985219862198721988219892199021991219922199321994219952199621997219982199922000220012200222003220042200522006220072200822009220102201122012220132201422015220162201722018220192202022021220222202322024220252202622027220282202922030220312203222033220342203522036220372203822039220402204122042220432204422045220462204722048220492205022051220522205322054220552205622057220582205922060220612206222063220642206522066220672206822069220702207122072220732207422075220762207722078220792208022081220822208322084220852208622087220882208922090220912209222093220942209522096220972209822099221002210122102221032210422105221062210722108221092211022111221122211322114221152211622117221182211922120221212212222123221242212522126221272212822129221302213122132221332213422135221362213722138221392214022141221422214322144221452214622147221482214922150221512215222153221542215522156221572215822159221602216122162221632216422165221662216722168221692217022171221722217322174221752217622177221782217922180221812218222183221842218522186221872218822189221902219122192221932219422195221962219722198221992220022201222022220322204222052220622207222082220922210222112221222213222142221522216222172221822219222202222122222222232222422225222262222722228222292223022231222322223322234222352223622237222382223922240222412224222243222442224522246222472224822249222502225122252222532225422255222562225722258222592226022261222622226322264222652226622267222682226922270222712227222273222742227522276222772227822279222802228122282222832228422285222862228722288222892229022291222922229322294222952229622297222982229922300223012230222303223042230522306223072230822309223102231122312223132231422315223162231722318223192232022321223222232322324223252232622327223282232922330223312233222333223342233522336223372233822339223402234122342223432234422345223462234722348223492235022351223522235322354223552235622357223582235922360223612236222363223642236522366223672236822369223702237122372223732237422375223762237722378223792238022381223822238322384223852238622387223882238922390223912239222393223942239522396223972239822399224002240122402224032240422405224062240722408224092241022411224122241322414224152241622417224182241922420224212242222423224242242522426224272242822429224302243122432224332243422435224362243722438224392244022441224422244322444224452244622447224482244922450224512245222453224542245522456224572245822459224602246122462224632246422465224662246722468224692247022471224722247322474224752247622477224782247922480224812248222483224842248522486224872248822489224902249122492224932249422495224962249722498224992250022501225022250322504225052250622507225082250922510225112251222513225142251522516225172251822519225202252122522225232252422525225262252722528225292253022531225322253322534225352253622537225382253922540225412254222543225442254522546225472254822549225502255122552225532255422555225562255722558225592256022561225622256322564225652256622567225682256922570225712257222573225742257522576225772257822579225802258122582225832258422585225862258722588225892259022591225922259322594225952259622597225982259922600226012260222603226042260522606226072260822609226102261122612226132261422615226162261722618226192262022621226222262322624226252262622627226282262922630226312263222633226342263522636226372263822639226402264122642226432264422645226462264722648226492265022651226522265322654226552265622657226582265922660226612266222663226642266522666226672266822669226702267122672226732267422675226762267722678226792268022681226822268322684226852268622687226882268922690226912269222693226942269522696226972269822699227002270122702227032270422705227062270722708227092271022711227122271322714227152271622717227182271922720227212272222723227242272522726227272272822729227302273122732227332273422735227362273722738227392274022741227422274322744227452274622747227482274922750227512275222753227542275522756227572275822759227602276122762227632276422765227662276722768227692277022771227722277322774227752277622777227782277922780227812278222783227842278522786227872278822789227902279122792227932279422795227962279722798227992280022801228022280322804228052280622807228082280922810228112281222813228142281522816228172281822819228202282122822228232282422825228262282722828228292283022831228322283322834228352283622837228382283922840228412284222843228442284522846228472284822849228502285122852228532285422855228562285722858228592286022861228622286322864228652286622867228682286922870228712287222873228742287522876228772287822879228802288122882228832288422885228862288722888228892289022891228922289322894228952289622897228982289922900229012290222903229042290522906229072290822909229102291122912229132291422915229162291722918229192292022921229222292322924229252292622927229282292922930229312293222933229342293522936229372293822939229402294122942229432294422945229462294722948229492295022951229522295322954229552295622957229582295922960229612296222963229642296522966229672296822969229702297122972229732297422975229762297722978229792298022981229822298322984229852298622987229882298922990229912299222993229942299522996229972299822999230002300123002230032300423005230062300723008230092301023011230122301323014230152301623017230182301923020230212302223023230242302523026230272302823029230302303123032230332303423035230362303723038230392304023041230422304323044230452304623047230482304923050230512305223053230542305523056230572305823059230602306123062230632306423065230662306723068230692307023071230722307323074230752307623077230782307923080230812308223083230842308523086230872308823089230902309123092230932309423095230962309723098230992310023101231022310323104231052310623107231082310923110231112311223113231142311523116231172311823119231202312123122231232312423125231262312723128231292313023131231322313323134231352313623137231382313923140231412314223143231442314523146231472314823149231502315123152231532315423155231562315723158231592316023161231622316323164231652316623167231682316923170231712317223173231742317523176231772317823179231802318123182231832318423185231862318723188231892319023191231922319323194231952319623197231982319923200232012320223203232042320523206232072320823209232102321123212232132321423215232162321723218232192322023221232222322323224232252322623227232282322923230232312323223233232342323523236232372323823239232402324123242232432324423245232462324723248232492325023251232522325323254232552325623257232582325923260232612326223263232642326523266232672326823269232702327123272232732327423275232762327723278232792328023281232822328323284232852328623287232882328923290232912329223293232942329523296232972329823299233002330123302233032330423305233062330723308233092331023311233122331323314233152331623317233182331923320233212332223323233242332523326233272332823329233302333123332233332333423335233362333723338233392334023341233422334323344233452334623347233482334923350233512335223353233542335523356233572335823359233602336123362233632336423365233662336723368233692337023371233722337323374233752337623377233782337923380233812338223383233842338523386233872338823389233902339123392233932339423395233962339723398233992340023401234022340323404234052340623407234082340923410234112341223413234142341523416234172341823419234202342123422234232342423425234262342723428234292343023431234322343323434234352343623437234382343923440234412344223443234442344523446234472344823449234502345123452234532345423455234562345723458234592346023461234622346323464234652346623467234682346923470234712347223473234742347523476234772347823479234802348123482234832348423485234862348723488234892349023491234922349323494234952349623497234982349923500235012350223503235042350523506235072350823509235102351123512235132351423515235162351723518235192352023521235222352323524235252352623527235282352923530235312353223533235342353523536235372353823539235402354123542235432354423545235462354723548235492355023551235522355323554235552355623557235582355923560235612356223563235642356523566235672356823569235702357123572235732357423575235762357723578235792358023581235822358323584235852358623587235882358923590235912359223593235942359523596235972359823599236002360123602236032360423605236062360723608236092361023611236122361323614236152361623617236182361923620236212362223623236242362523626236272362823629236302363123632236332363423635236362363723638236392364023641236422364323644236452364623647236482364923650236512365223653236542365523656236572365823659236602366123662236632366423665236662366723668236692367023671236722367323674236752367623677236782367923680236812368223683236842368523686236872368823689236902369123692236932369423695236962369723698236992370023701237022370323704237052370623707237082370923710237112371223713237142371523716237172371823719237202372123722237232372423725237262372723728237292373023731237322373323734237352373623737237382373923740237412374223743237442374523746237472374823749237502375123752237532375423755237562375723758237592376023761237622376323764237652376623767237682376923770237712377223773237742377523776237772377823779237802378123782237832378423785237862378723788237892379023791237922379323794237952379623797237982379923800238012380223803238042380523806238072380823809238102381123812238132381423815238162381723818238192382023821238222382323824238252382623827238282382923830238312383223833238342383523836238372383823839238402384123842238432384423845238462384723848238492385023851238522385323854238552385623857238582385923860238612386223863238642386523866238672386823869238702387123872238732387423875238762387723878238792388023881238822388323884238852388623887238882388923890238912389223893238942389523896238972389823899239002390123902239032390423905239062390723908239092391023911239122391323914239152391623917239182391923920239212392223923239242392523926239272392823929239302393123932239332393423935239362393723938239392394023941239422394323944239452394623947239482394923950239512395223953239542395523956239572395823959239602396123962239632396423965239662396723968239692397023971239722397323974239752397623977239782397923980239812398223983239842398523986239872398823989239902399123992239932399423995239962399723998239992400024001240022400324004240052400624007240082400924010240112401224013240142401524016240172401824019240202402124022240232402424025240262402724028240292403024031240322403324034240352403624037240382403924040240412404224043240442404524046240472404824049240502405124052240532405424055240562405724058240592406024061240622406324064240652406624067240682406924070240712407224073240742407524076240772407824079240802408124082240832408424085240862408724088240892409024091240922409324094240952409624097240982409924100241012410224103241042410524106241072410824109241102411124112241132411424115241162411724118241192412024121241222412324124241252412624127241282412924130241312413224133241342413524136241372413824139241402414124142241432414424145241462414724148241492415024151241522415324154241552415624157241582415924160241612416224163241642416524166241672416824169241702417124172241732417424175241762417724178241792418024181241822418324184241852418624187241882418924190241912419224193241942419524196241972419824199242002420124202242032420424205242062420724208242092421024211242122421324214242152421624217242182421924220242212422224223242242422524226242272422824229242302423124232242332423424235242362423724238242392424024241242422424324244242452424624247242482424924250242512425224253242542425524256242572425824259242602426124262242632426424265242662426724268242692427024271242722427324274242752427624277242782427924280242812428224283242842428524286242872428824289242902429124292242932429424295242962429724298242992430024301243022430324304243052430624307243082430924310243112431224313243142431524316243172431824319243202432124322243232432424325243262432724328243292433024331243322433324334243352433624337243382433924340243412434224343243442434524346243472434824349243502435124352243532435424355243562435724358243592436024361243622436324364243652436624367243682436924370243712437224373243742437524376243772437824379243802438124382243832438424385243862438724388243892439024391243922439324394243952439624397243982439924400244012440224403244042440524406244072440824409244102441124412244132441424415244162441724418244192442024421244222442324424244252442624427244282442924430244312443224433244342443524436244372443824439244402444124442244432444424445244462444724448244492445024451244522445324454244552445624457244582445924460244612446224463244642446524466244672446824469244702447124472244732447424475244762447724478244792448024481244822448324484244852448624487244882448924490244912449224493244942449524496244972449824499245002450124502245032450424505245062450724508245092451024511245122451324514245152451624517245182451924520245212452224523245242452524526245272452824529245302453124532245332453424535245362453724538245392454024541245422454324544245452454624547245482454924550245512455224553245542455524556245572455824559245602456124562245632456424565245662456724568245692457024571245722457324574245752457624577245782457924580245812458224583245842458524586245872458824589245902459124592245932459424595245962459724598245992460024601246022460324604246052460624607246082460924610246112461224613246142461524616246172461824619246202462124622246232462424625246262462724628246292463024631246322463324634246352463624637246382463924640246412464224643246442464524646246472464824649246502465124652246532465424655246562465724658246592466024661246622466324664246652466624667246682466924670246712467224673246742467524676246772467824679246802468124682246832468424685246862468724688246892469024691246922469324694246952469624697246982469924700247012470224703247042470524706247072470824709247102471124712247132471424715247162471724718247192472024721247222472324724247252472624727247282472924730247312473224733247342473524736247372473824739247402474124742247432474424745247462474724748247492475024751247522475324754247552475624757247582475924760247612476224763247642476524766247672476824769247702477124772247732477424775247762477724778247792478024781247822478324784247852478624787247882478924790247912479224793247942479524796247972479824799248002480124802248032480424805248062480724808248092481024811248122481324814248152481624817248182481924820248212482224823248242482524826248272482824829248302483124832248332483424835248362483724838248392484024841248422484324844248452484624847248482484924850248512485224853248542485524856248572485824859248602486124862248632486424865248662486724868248692487024871248722487324874248752487624877248782487924880248812488224883248842488524886248872488824889248902489124892248932489424895248962489724898248992490024901249022490324904249052490624907249082490924910249112491224913249142491524916249172491824919249202492124922249232492424925249262492724928249292493024931249322493324934249352493624937249382493924940249412494224943249442494524946249472494824949249502495124952249532495424955249562495724958249592496024961249622496324964249652496624967249682496924970249712497224973249742497524976249772497824979249802498124982249832498424985249862498724988249892499024991249922499324994249952499624997249982499925000250012500225003250042500525006250072500825009250102501125012250132501425015250162501725018250192502025021250222502325024250252502625027250282502925030250312503225033250342503525036250372503825039250402504125042250432504425045250462504725048250492505025051250522505325054250552505625057250582505925060250612506225063250642506525066250672506825069250702507125072250732507425075250762507725078250792508025081250822508325084250852508625087250882508925090250912509225093250942509525096250972509825099251002510125102251032510425105251062510725108251092511025111251122511325114251152511625117251182511925120251212512225123251242512525126251272512825129251302513125132251332513425135251362513725138251392514025141251422514325144251452514625147251482514925150251512515225153251542515525156251572515825159251602516125162251632516425165251662516725168251692517025171251722517325174251752517625177251782517925180251812518225183251842518525186251872518825189251902519125192251932519425195251962519725198251992520025201252022520325204252052520625207252082520925210252112521225213252142521525216252172521825219252202522125222252232522425225252262522725228252292523025231252322523325234252352523625237252382523925240252412524225243252442524525246252472524825249252502525125252252532525425255252562525725258252592526025261252622526325264252652526625267252682526925270252712527225273252742527525276252772527825279252802528125282252832528425285252862528725288252892529025291252922529325294252952529625297252982529925300253012530225303253042530525306253072530825309253102531125312253132531425315253162531725318253192532025321253222532325324253252532625327253282532925330253312533225333253342533525336253372533825339253402534125342253432534425345253462534725348253492535025351253522535325354253552535625357253582535925360253612536225363253642536525366253672536825369253702537125372253732537425375253762537725378253792538025381253822538325384253852538625387253882538925390253912539225393253942539525396253972539825399254002540125402254032540425405254062540725408254092541025411254122541325414254152541625417254182541925420254212542225423254242542525426254272542825429254302543125432254332543425435254362543725438254392544025441254422544325444254452544625447254482544925450254512545225453254542545525456254572545825459254602546125462254632546425465254662546725468254692547025471254722547325474254752547625477254782547925480254812548225483254842548525486254872548825489254902549125492254932549425495254962549725498254992550025501255022550325504255052550625507255082550925510255112551225513255142551525516255172551825519255202552125522255232552425525255262552725528255292553025531255322553325534255352553625537255382553925540255412554225543255442554525546255472554825549255502555125552255532555425555255562555725558255592556025561255622556325564255652556625567255682556925570255712557225573255742557525576255772557825579255802558125582255832558425585255862558725588255892559025591255922559325594255952559625597255982559925600256012560225603256042560525606256072560825609256102561125612256132561425615256162561725618256192562025621256222562325624256252562625627256282562925630256312563225633256342563525636256372563825639256402564125642256432564425645256462564725648256492565025651256522565325654256552565625657256582565925660256612566225663256642566525666256672566825669256702567125672256732567425675256762567725678256792568025681256822568325684256852568625687256882568925690256912569225693256942569525696256972569825699257002570125702257032570425705257062570725708257092571025711257122571325714257152571625717257182571925720257212572225723257242572525726257272572825729257302573125732257332573425735257362573725738257392574025741257422574325744257452574625747257482574925750257512575225753257542575525756257572575825759257602576125762257632576425765257662576725768257692577025771257722577325774257752577625777257782577925780257812578225783257842578525786257872578825789257902579125792257932579425795257962579725798257992580025801258022580325804258052580625807258082580925810258112581225813258142581525816258172581825819258202582125822258232582425825258262582725828258292583025831258322583325834258352583625837258382583925840258412584225843258442584525846258472584825849258502585125852258532585425855258562585725858258592586025861258622586325864258652586625867258682586925870258712587225873258742587525876258772587825879258802588125882258832588425885258862588725888258892589025891258922589325894258952589625897258982589925900259012590225903259042590525906259072590825909259102591125912259132591425915259162591725918259192592025921259222592325924259252592625927259282592925930259312593225933259342593525936259372593825939259402594125942259432594425945259462594725948259492595025951259522595325954259552595625957259582595925960259612596225963259642596525966259672596825969259702597125972259732597425975259762597725978259792598025981259822598325984259852598625987259882598925990259912599225993259942599525996259972599825999260002600126002260032600426005260062600726008260092601026011260122601326014260152601626017260182601926020260212602226023260242602526026260272602826029260302603126032260332603426035260362603726038260392604026041260422604326044260452604626047260482604926050260512605226053260542605526056260572605826059260602606126062260632606426065260662606726068260692607026071260722607326074260752607626077260782607926080260812608226083260842608526086260872608826089260902609126092260932609426095260962609726098260992610026101261022610326104261052610626107261082610926110261112611226113261142611526116261172611826119261202612126122261232612426125261262612726128261292613026131261322613326134261352613626137261382613926140261412614226143261442614526146261472614826149261502615126152261532615426155261562615726158261592616026161261622616326164261652616626167261682616926170261712617226173261742617526176261772617826179261802618126182261832618426185261862618726188261892619026191261922619326194261952619626197261982619926200262012620226203262042620526206262072620826209262102621126212262132621426215262162621726218262192622026221262222622326224262252622626227262282622926230262312623226233262342623526236262372623826239262402624126242262432624426245262462624726248262492625026251262522625326254262552625626257262582625926260262612626226263262642626526266262672626826269262702627126272262732627426275262762627726278262792628026281262822628326284262852628626287262882628926290262912629226293262942629526296262972629826299263002630126302263032630426305263062630726308263092631026311263122631326314263152631626317263182631926320263212632226323263242632526326263272632826329263302633126332263332633426335263362633726338263392634026341263422634326344263452634626347263482634926350263512635226353263542635526356263572635826359263602636126362263632636426365263662636726368263692637026371263722637326374263752637626377263782637926380263812638226383263842638526386263872638826389263902639126392263932639426395263962639726398263992640026401264022640326404264052640626407264082640926410264112641226413264142641526416264172641826419264202642126422264232642426425264262642726428264292643026431264322643326434264352643626437264382643926440264412644226443264442644526446264472644826449264502645126452264532645426455264562645726458264592646026461264622646326464264652646626467264682646926470264712647226473264742647526476264772647826479264802648126482264832648426485264862648726488264892649026491264922649326494264952649626497264982649926500265012650226503265042650526506265072650826509265102651126512265132651426515265162651726518265192652026521265222652326524265252652626527265282652926530265312653226533265342653526536265372653826539265402654126542265432654426545265462654726548265492655026551265522655326554265552655626557265582655926560265612656226563265642656526566265672656826569265702657126572265732657426575265762657726578265792658026581265822658326584265852658626587265882658926590265912659226593265942659526596265972659826599266002660126602266032660426605266062660726608266092661026611266122661326614266152661626617266182661926620266212662226623266242662526626266272662826629266302663126632266332663426635266362663726638266392664026641266422664326644266452664626647266482664926650266512665226653266542665526656266572665826659266602666126662266632666426665266662666726668266692667026671266722667326674266752667626677266782667926680266812668226683266842668526686266872668826689266902669126692266932669426695266962669726698266992670026701267022670326704267052670626707267082670926710267112671226713267142671526716267172671826719267202672126722267232672426725267262672726728267292673026731267322673326734267352673626737267382673926740267412674226743267442674526746267472674826749267502675126752267532675426755267562675726758267592676026761267622676326764267652676626767267682676926770267712677226773267742677526776267772677826779267802678126782267832678426785267862678726788267892679026791267922679326794267952679626797267982679926800268012680226803268042680526806268072680826809268102681126812268132681426815268162681726818268192682026821268222682326824268252682626827268282682926830268312683226833268342683526836268372683826839268402684126842268432684426845268462684726848268492685026851268522685326854268552685626857268582685926860268612686226863268642686526866268672686826869268702687126872268732687426875268762687726878268792688026881268822688326884268852688626887268882688926890268912689226893268942689526896268972689826899269002690126902269032690426905269062690726908269092691026911269122691326914269152691626917269182691926920269212692226923269242692526926269272692826929269302693126932269332693426935269362693726938269392694026941269422694326944269452694626947269482694926950269512695226953269542695526956269572695826959269602696126962269632696426965269662696726968269692697026971269722697326974269752697626977269782697926980269812698226983269842698526986269872698826989269902699126992269932699426995269962699726998269992700027001270022700327004270052700627007270082700927010270112701227013270142701527016270172701827019270202702127022270232702427025270262702727028270292703027031270322703327034270352703627037270382703927040270412704227043270442704527046270472704827049270502705127052270532705427055270562705727058270592706027061270622706327064270652706627067270682706927070270712707227073270742707527076270772707827079270802708127082270832708427085270862708727088270892709027091270922709327094270952709627097270982709927100271012710227103271042710527106271072710827109271102711127112271132711427115271162711727118271192712027121271222712327124271252712627127271282712927130271312713227133271342713527136271372713827139271402714127142271432714427145271462714727148271492715027151271522715327154271552715627157271582715927160271612716227163271642716527166271672716827169271702717127172271732717427175271762717727178271792718027181271822718327184271852718627187271882718927190271912719227193271942719527196271972719827199272002720127202272032720427205272062720727208272092721027211272122721327214272152721627217272182721927220272212722227223272242722527226272272722827229272302723127232272332723427235272362723727238272392724027241272422724327244272452724627247272482724927250272512725227253272542725527256272572725827259272602726127262272632726427265272662726727268272692727027271272722727327274272752727627277272782727927280272812728227283272842728527286272872728827289272902729127292272932729427295272962729727298272992730027301273022730327304273052730627307273082730927310273112731227313273142731527316273172731827319273202732127322273232732427325273262732727328273292733027331273322733327334273352733627337273382733927340273412734227343273442734527346273472734827349273502735127352273532735427355273562735727358273592736027361273622736327364273652736627367273682736927370273712737227373273742737527376273772737827379273802738127382273832738427385273862738727388273892739027391273922739327394273952739627397273982739927400274012740227403274042740527406274072740827409274102741127412274132741427415274162741727418274192742027421274222742327424274252742627427274282742927430274312743227433274342743527436274372743827439274402744127442274432744427445274462744727448274492745027451274522745327454274552745627457274582745927460274612746227463274642746527466274672746827469274702747127472274732747427475274762747727478274792748027481274822748327484274852748627487274882748927490274912749227493274942749527496274972749827499275002750127502275032750427505275062750727508275092751027511275122751327514275152751627517275182751927520275212752227523275242752527526275272752827529275302753127532275332753427535275362753727538275392754027541275422754327544275452754627547275482754927550275512755227553275542755527556275572755827559275602756127562275632756427565275662756727568275692757027571275722757327574275752757627577275782757927580275812758227583275842758527586275872758827589275902759127592275932759427595275962759727598275992760027601276022760327604276052760627607276082760927610276112761227613276142761527616276172761827619276202762127622276232762427625276262762727628276292763027631276322763327634276352763627637276382763927640276412764227643276442764527646276472764827649276502765127652276532765427655276562765727658276592766027661276622766327664276652766627667276682766927670276712767227673276742767527676276772767827679276802768127682276832768427685276862768727688276892769027691276922769327694276952769627697276982769927700277012770227703277042770527706277072770827709277102771127712277132771427715277162771727718277192772027721277222772327724277252772627727277282772927730277312773227733277342773527736277372773827739277402774127742277432774427745277462774727748277492775027751277522775327754277552775627757277582775927760277612776227763277642776527766277672776827769277702777127772277732777427775277762777727778277792778027781277822778327784277852778627787277882778927790277912779227793277942779527796277972779827799278002780127802278032780427805278062780727808278092781027811278122781327814278152781627817278182781927820278212782227823278242782527826278272782827829278302783127832278332783427835278362783727838278392784027841278422784327844278452784627847278482784927850278512785227853278542785527856278572785827859278602786127862278632786427865278662786727868278692787027871278722787327874278752787627877278782787927880278812788227883278842788527886278872788827889278902789127892278932789427895278962789727898278992790027901279022790327904279052790627907279082790927910279112791227913279142791527916279172791827919279202792127922279232792427925279262792727928279292793027931279322793327934279352793627937279382793927940279412794227943279442794527946279472794827949279502795127952279532795427955279562795727958279592796027961279622796327964279652796627967279682796927970279712797227973279742797527976279772797827979279802798127982279832798427985279862798727988279892799027991279922799327994279952799627997279982799928000280012800228003280042800528006280072800828009280102801128012280132801428015280162801728018280192802028021280222802328024280252802628027280282802928030280312803228033280342803528036280372803828039280402804128042280432804428045280462804728048280492805028051280522805328054280552805628057280582805928060280612806228063280642806528066280672806828069280702807128072280732807428075280762807728078280792808028081280822808328084280852808628087280882808928090280912809228093280942809528096280972809828099281002810128102281032810428105281062810728108281092811028111281122811328114281152811628117281182811928120281212812228123281242812528126281272812828129281302813128132281332813428135281362813728138281392814028141281422814328144281452814628147281482814928150281512815228153281542815528156281572815828159281602816128162281632816428165281662816728168281692817028171281722817328174281752817628177281782817928180281812818228183281842818528186281872818828189281902819128192281932819428195281962819728198281992820028201282022820328204282052820628207282082820928210282112821228213282142821528216282172821828219282202822128222282232822428225282262822728228282292823028231282322823328234282352823628237282382823928240282412824228243282442824528246282472824828249282502825128252282532825428255282562825728258282592826028261282622826328264282652826628267282682826928270282712827228273282742827528276282772827828279282802828128282282832828428285282862828728288282892829028291282922829328294282952829628297282982829928300283012830228303283042830528306283072830828309283102831128312283132831428315283162831728318283192832028321283222832328324283252832628327283282832928330283312833228333283342833528336283372833828339283402834128342283432834428345283462834728348283492835028351283522835328354283552835628357283582835928360283612836228363283642836528366283672836828369283702837128372283732837428375283762837728378283792838028381283822838328384283852838628387283882838928390283912839228393283942839528396283972839828399284002840128402284032840428405284062840728408284092841028411284122841328414284152841628417284182841928420284212842228423284242842528426284272842828429284302843128432284332843428435284362843728438284392844028441284422844328444284452844628447284482844928450284512845228453284542845528456284572845828459284602846128462284632846428465284662846728468284692847028471284722847328474284752847628477284782847928480284812848228483284842848528486284872848828489284902849128492284932849428495284962849728498284992850028501285022850328504285052850628507285082850928510285112851228513285142851528516285172851828519285202852128522285232852428525285262852728528285292853028531285322853328534285352853628537285382853928540285412854228543285442854528546285472854828549285502855128552285532855428555285562855728558285592856028561285622856328564285652856628567285682856928570285712857228573285742857528576285772857828579285802858128582285832858428585285862858728588285892859028591285922859328594285952859628597285982859928600286012860228603286042860528606286072860828609286102861128612286132861428615286162861728618286192862028621286222862328624286252862628627286282862928630286312863228633286342863528636286372863828639286402864128642286432864428645286462864728648286492865028651286522865328654286552865628657286582865928660286612866228663286642866528666286672866828669286702867128672286732867428675286762867728678286792868028681286822868328684286852868628687286882868928690286912869228693286942869528696286972869828699287002870128702287032870428705287062870728708287092871028711287122871328714287152871628717287182871928720287212872228723287242872528726287272872828729287302873128732287332873428735287362873728738287392874028741287422874328744287452874628747287482874928750287512875228753287542875528756287572875828759287602876128762287632876428765287662876728768287692877028771287722877328774287752877628777287782877928780287812878228783287842878528786287872878828789287902879128792287932879428795287962879728798287992880028801288022880328804288052880628807288082880928810288112881228813288142881528816288172881828819288202882128822288232882428825288262882728828288292883028831288322883328834288352883628837288382883928840288412884228843288442884528846288472884828849288502885128852288532885428855288562885728858288592886028861288622886328864288652886628867288682886928870288712887228873288742887528876288772887828879288802888128882288832888428885288862888728888288892889028891288922889328894288952889628897288982889928900289012890228903289042890528906289072890828909289102891128912289132891428915289162891728918289192892028921289222892328924289252892628927289282892928930289312893228933289342893528936289372893828939289402894128942289432894428945289462894728948289492895028951289522895328954289552895628957289582895928960289612896228963289642896528966289672896828969289702897128972289732897428975289762897728978289792898028981289822898328984289852898628987289882898928990289912899228993289942899528996289972899828999290002900129002290032900429005290062900729008290092901029011290122901329014290152901629017290182901929020290212902229023290242902529026290272902829029290302903129032290332903429035290362903729038290392904029041290422904329044290452904629047290482904929050290512905229053290542905529056290572905829059290602906129062290632906429065290662906729068290692907029071290722907329074290752907629077290782907929080290812908229083290842908529086290872908829089290902909129092290932909429095290962909729098290992910029101291022910329104291052910629107291082910929110291112911229113291142911529116291172911829119291202912129122291232912429125291262912729128291292913029131291322913329134291352913629137291382913929140291412914229143291442914529146291472914829149291502915129152291532915429155291562915729158291592916029161291622916329164291652916629167291682916929170291712917229173291742917529176291772917829179291802918129182291832918429185291862918729188291892919029191291922919329194291952919629197291982919929200292012920229203292042920529206292072920829209292102921129212292132921429215292162921729218292192922029221292222922329224292252922629227292282922929230292312923229233292342923529236292372923829239292402924129242292432924429245292462924729248292492925029251292522925329254292552925629257292582925929260292612926229263292642926529266292672926829269292702927129272292732927429275292762927729278292792928029281292822928329284292852928629287292882928929290292912929229293292942929529296292972929829299293002930129302293032930429305293062930729308293092931029311293122931329314293152931629317293182931929320293212932229323293242932529326293272932829329293302933129332293332933429335293362933729338293392934029341293422934329344293452934629347293482934929350293512935229353293542935529356293572935829359293602936129362293632936429365293662936729368293692937029371293722937329374293752937629377293782937929380293812938229383293842938529386293872938829389293902939129392293932939429395293962939729398293992940029401294022940329404294052940629407294082940929410294112941229413294142941529416294172941829419294202942129422294232942429425294262942729428294292943029431294322943329434294352943629437294382943929440294412944229443294442944529446294472944829449294502945129452294532945429455294562945729458294592946029461294622946329464294652946629467294682946929470294712947229473294742947529476294772947829479294802948129482294832948429485294862948729488294892949029491294922949329494294952949629497294982949929500295012950229503295042950529506295072950829509295102951129512295132951429515295162951729518295192952029521295222952329524295252952629527295282952929530295312953229533295342953529536295372953829539295402954129542295432954429545295462954729548295492955029551295522955329554295552955629557295582955929560295612956229563295642956529566295672956829569295702957129572295732957429575295762957729578295792958029581295822958329584295852958629587295882958929590295912959229593295942959529596295972959829599296002960129602296032960429605296062960729608296092961029611296122961329614296152961629617296182961929620296212962229623296242962529626296272962829629296302963129632296332963429635296362963729638296392964029641296422964329644296452964629647296482964929650296512965229653296542965529656296572965829659296602966129662296632966429665296662966729668296692967029671296722967329674296752967629677296782967929680296812968229683296842968529686296872968829689296902969129692296932969429695296962969729698296992970029701297022970329704297052970629707297082970929710297112971229713297142971529716297172971829719297202972129722297232972429725297262972729728297292973029731297322973329734297352973629737297382973929740297412974229743297442974529746297472974829749297502975129752297532975429755297562975729758297592976029761297622976329764297652976629767297682976929770297712977229773297742977529776297772977829779297802978129782297832978429785297862978729788297892979029791297922979329794297952979629797297982979929800298012980229803298042980529806298072980829809298102981129812298132981429815298162981729818298192982029821298222982329824298252982629827298282982929830298312983229833298342983529836298372983829839298402984129842298432984429845298462984729848298492985029851298522985329854298552985629857298582985929860298612986229863298642986529866298672986829869298702987129872298732987429875298762987729878298792988029881298822988329884298852988629887298882988929890298912989229893298942989529896298972989829899299002990129902299032990429905299062990729908299092991029911299122991329914299152991629917299182991929920299212992229923299242992529926299272992829929299302993129932299332993429935299362993729938299392994029941299422994329944299452994629947299482994929950299512995229953299542995529956299572995829959299602996129962299632996429965299662996729968299692997029971299722997329974299752997629977299782997929980299812998229983299842998529986299872998829989299902999129992299932999429995299962999729998299993000030001300023000330004300053000630007300083000930010300113001230013300143001530016300173001830019300203002130022300233002430025300263002730028300293003030031300323003330034300353003630037300383003930040300413004230043300443004530046300473004830049300503005130052300533005430055300563005730058300593006030061300623006330064300653006630067300683006930070300713007230073300743007530076300773007830079300803008130082300833008430085300863008730088300893009030091300923009330094300953009630097300983009930100301013010230103301043010530106301073010830109301103011130112301133011430115301163011730118301193012030121301223012330124301253012630127301283012930130301313013230133301343013530136301373013830139301403014130142301433014430145301463014730148301493015030151301523015330154301553015630157301583015930160301613016230163301643016530166301673016830169301703017130172301733017430175301763017730178301793018030181301823018330184301853018630187301883018930190301913019230193301943019530196301973019830199302003020130202302033020430205302063020730208302093021030211302123021330214302153021630217302183021930220302213022230223302243022530226302273022830229302303023130232302333023430235302363023730238302393024030241302423024330244302453024630247302483024930250302513025230253302543025530256302573025830259302603026130262302633026430265302663026730268302693027030271302723027330274302753027630277302783027930280302813028230283302843028530286302873028830289302903029130292302933029430295302963029730298302993030030301303023030330304303053030630307303083030930310303113031230313303143031530316303173031830319303203032130322303233032430325303263032730328303293033030331303323033330334303353033630337303383033930340303413034230343303443034530346303473034830349303503035130352303533035430355303563035730358303593036030361303623036330364303653036630367303683036930370303713037230373303743037530376303773037830379303803038130382303833038430385303863038730388303893039030391303923039330394303953039630397303983039930400304013040230403304043040530406304073040830409304103041130412304133041430415304163041730418304193042030421304223042330424304253042630427304283042930430304313043230433304343043530436304373043830439304403044130442304433044430445304463044730448304493045030451304523045330454304553045630457304583045930460304613046230463304643046530466304673046830469304703047130472304733047430475304763047730478304793048030481304823048330484304853048630487304883048930490304913049230493304943049530496304973049830499305003050130502305033050430505305063050730508305093051030511305123051330514305153051630517305183051930520305213052230523305243052530526305273052830529305303053130532305333053430535305363053730538305393054030541305423054330544305453054630547305483054930550305513055230553305543055530556305573055830559305603056130562305633056430565305663056730568305693057030571305723057330574305753057630577305783057930580305813058230583305843058530586305873058830589305903059130592305933059430595305963059730598305993060030601306023060330604306053060630607306083060930610306113061230613306143061530616306173061830619306203062130622306233062430625306263062730628306293063030631306323063330634306353063630637306383063930640306413064230643306443064530646306473064830649306503065130652306533065430655306563065730658306593066030661306623066330664306653066630667306683066930670306713067230673306743067530676306773067830679306803068130682306833068430685306863068730688306893069030691306923069330694306953069630697306983069930700307013070230703307043070530706307073070830709307103071130712307133071430715307163071730718307193072030721307223072330724307253072630727307283072930730307313073230733307343073530736307373073830739307403074130742307433074430745307463074730748307493075030751307523075330754307553075630757307583075930760307613076230763307643076530766307673076830769307703077130772307733077430775307763077730778307793078030781307823078330784307853078630787307883078930790307913079230793307943079530796307973079830799308003080130802308033080430805308063080730808308093081030811308123081330814308153081630817308183081930820308213082230823308243082530826308273082830829308303083130832308333083430835308363083730838308393084030841308423084330844308453084630847308483084930850308513085230853308543085530856308573085830859308603086130862308633086430865308663086730868308693087030871308723087330874308753087630877308783087930880308813088230883308843088530886308873088830889308903089130892308933089430895308963089730898308993090030901309023090330904309053090630907309083090930910309113091230913309143091530916309173091830919309203092130922309233092430925309263092730928309293093030931309323093330934309353093630937309383093930940309413094230943309443094530946309473094830949309503095130952309533095430955309563095730958309593096030961309623096330964309653096630967309683096930970309713097230973309743097530976309773097830979309803098130982309833098430985309863098730988309893099030991309923099330994309953099630997309983099931000310013100231003310043100531006310073100831009310103101131012310133101431015310163101731018310193102031021310223102331024310253102631027310283102931030310313103231033310343103531036310373103831039310403104131042310433104431045310463104731048310493105031051310523105331054310553105631057310583105931060310613106231063310643106531066310673106831069310703107131072310733107431075310763107731078310793108031081310823108331084310853108631087310883108931090310913109231093310943109531096310973109831099311003110131102311033110431105311063110731108311093111031111311123111331114311153111631117311183111931120311213112231123311243112531126311273112831129311303113131132311333113431135311363113731138311393114031141311423114331144311453114631147311483114931150311513115231153311543115531156311573115831159311603116131162311633116431165311663116731168311693117031171311723117331174311753117631177311783117931180311813118231183311843118531186311873118831189311903119131192311933119431195311963119731198311993120031201312023120331204312053120631207312083120931210312113121231213312143121531216312173121831219312203122131222312233122431225312263122731228312293123031231312323123331234312353123631237312383123931240312413124231243312443124531246312473124831249312503125131252312533125431255312563125731258312593126031261312623126331264312653126631267312683126931270312713127231273312743127531276312773127831279312803128131282312833128431285312863128731288312893129031291312923129331294312953129631297312983129931300313013130231303313043130531306313073130831309313103131131312313133131431315313163131731318313193132031321313223132331324313253132631327313283132931330313313133231333313343133531336313373133831339313403134131342313433134431345313463134731348313493135031351313523135331354313553135631357313583135931360313613136231363313643136531366313673136831369313703137131372313733137431375313763137731378313793138031381313823138331384313853138631387313883138931390313913139231393313943139531396313973139831399314003140131402314033140431405314063140731408314093141031411314123141331414314153141631417314183141931420314213142231423314243142531426314273142831429314303143131432314333143431435314363143731438314393144031441314423144331444314453144631447314483144931450314513145231453314543145531456314573145831459314603146131462314633146431465314663146731468314693147031471314723147331474314753147631477314783147931480314813148231483314843148531486314873148831489314903149131492314933149431495314963149731498314993150031501315023150331504315053150631507315083150931510315113151231513315143151531516315173151831519315203152131522315233152431525315263152731528315293153031531315323153331534315353153631537315383153931540315413154231543315443154531546315473154831549315503155131552315533155431555315563155731558315593156031561315623156331564315653156631567315683156931570315713157231573315743157531576315773157831579315803158131582315833158431585315863158731588315893159031591315923159331594315953159631597315983159931600316013160231603316043160531606316073160831609316103161131612316133161431615316163161731618316193162031621316223162331624316253162631627316283162931630316313163231633316343163531636316373163831639316403164131642316433164431645316463164731648316493165031651316523165331654316553165631657316583165931660316613166231663316643166531666316673166831669316703167131672316733167431675316763167731678316793168031681316823168331684316853168631687316883168931690316913169231693316943169531696316973169831699317003170131702317033170431705317063170731708317093171031711317123171331714317153171631717317183171931720317213172231723317243172531726317273172831729317303173131732317333173431735317363173731738317393174031741317423174331744317453174631747317483174931750317513175231753317543175531756317573175831759317603176131762317633176431765317663176731768317693177031771317723177331774317753177631777317783177931780317813178231783317843178531786317873178831789317903179131792317933179431795317963179731798317993180031801318023180331804318053180631807318083180931810318113181231813318143181531816318173181831819318203182131822318233182431825318263182731828318293183031831318323183331834318353183631837318383183931840318413184231843318443184531846318473184831849318503185131852318533185431855318563185731858318593186031861318623186331864318653186631867318683186931870318713187231873318743187531876318773187831879318803188131882318833188431885318863188731888318893189031891318923189331894318953189631897318983189931900319013190231903319043190531906319073190831909319103191131912319133191431915319163191731918319193192031921319223192331924319253192631927319283192931930319313193231933319343193531936319373193831939319403194131942319433194431945319463194731948319493195031951319523195331954319553195631957319583195931960319613196231963319643196531966319673196831969319703197131972319733197431975319763197731978319793198031981319823198331984319853198631987319883198931990319913199231993319943199531996319973199831999320003200132002320033200432005320063200732008320093201032011320123201332014320153201632017320183201932020320213202232023320243202532026320273202832029320303203132032320333203432035320363203732038320393204032041320423204332044320453204632047320483204932050320513205232053320543205532056320573205832059320603206132062320633206432065320663206732068320693207032071320723207332074320753207632077320783207932080320813208232083320843208532086320873208832089320903209132092320933209432095320963209732098320993210032101321023210332104321053210632107321083210932110321113211232113321143211532116321173211832119321203212132122321233212432125321263212732128321293213032131321323213332134321353213632137321383213932140321413214232143321443214532146321473214832149321503215132152321533215432155321563215732158321593216032161321623216332164321653216632167321683216932170321713217232173321743217532176321773217832179321803218132182321833218432185321863218732188321893219032191321923219332194321953219632197321983219932200322013220232203322043220532206322073220832209322103221132212322133221432215322163221732218322193222032221322223222332224322253222632227322283222932230322313223232233322343223532236322373223832239322403224132242322433224432245322463224732248322493225032251322523225332254322553225632257322583225932260322613226232263322643226532266322673226832269322703227132272322733227432275322763227732278322793228032281322823228332284322853228632287322883228932290322913229232293322943229532296322973229832299323003230132302323033230432305323063230732308323093231032311323123231332314323153231632317323183231932320323213232232323323243232532326323273232832329323303233132332323333233432335323363233732338323393234032341323423234332344323453234632347323483234932350323513235232353323543235532356323573235832359323603236132362323633236432365323663236732368323693237032371323723237332374323753237632377323783237932380323813238232383323843238532386323873238832389323903239132392323933239432395323963239732398323993240032401324023240332404324053240632407324083240932410324113241232413324143241532416324173241832419324203242132422324233242432425324263242732428324293243032431324323243332434324353243632437324383243932440324413244232443324443244532446324473244832449324503245132452324533245432455324563245732458324593246032461324623246332464324653246632467324683246932470324713247232473324743247532476324773247832479324803248132482324833248432485324863248732488324893249032491324923249332494324953249632497324983249932500325013250232503325043250532506325073250832509325103251132512325133251432515325163251732518325193252032521325223252332524325253252632527325283252932530325313253232533325343253532536325373253832539325403254132542325433254432545325463254732548325493255032551325523255332554325553255632557325583255932560325613256232563325643256532566325673256832569325703257132572325733257432575325763257732578325793258032581325823258332584325853258632587325883258932590325913259232593325943259532596325973259832599326003260132602326033260432605326063260732608326093261032611326123261332614326153261632617326183261932620326213262232623326243262532626326273262832629326303263132632326333263432635326363263732638326393264032641326423264332644326453264632647326483264932650326513265232653326543265532656326573265832659326603266132662326633266432665326663266732668326693267032671326723267332674326753267632677326783267932680326813268232683326843268532686326873268832689326903269132692326933269432695326963269732698326993270032701327023270332704327053270632707327083270932710327113271232713327143271532716327173271832719327203272132722327233272432725327263272732728327293273032731327323273332734327353273632737327383273932740327413274232743327443274532746327473274832749327503275132752327533275432755327563275732758327593276032761327623276332764327653276632767327683276932770327713277232773327743277532776327773277832779327803278132782327833278432785327863278732788327893279032791327923279332794327953279632797327983279932800328013280232803328043280532806328073280832809328103281132812328133281432815328163281732818328193282032821328223282332824328253282632827328283282932830328313283232833328343283532836328373283832839328403284132842328433284432845328463284732848328493285032851328523285332854328553285632857328583285932860328613286232863328643286532866328673286832869328703287132872328733287432875328763287732878328793288032881328823288332884328853288632887328883288932890328913289232893328943289532896328973289832899329003290132902329033290432905329063290732908329093291032911329123291332914329153291632917329183291932920329213292232923329243292532926329273292832929329303293132932329333293432935329363293732938329393294032941329423294332944329453294632947329483294932950329513295232953329543295532956329573295832959329603296132962329633296432965329663296732968329693297032971329723297332974329753297632977329783297932980329813298232983329843298532986329873298832989329903299132992329933299432995329963299732998329993300033001330023300333004330053300633007330083300933010330113301233013330143301533016330173301833019330203302133022330233302433025330263302733028330293303033031330323303333034330353303633037330383303933040330413304233043330443304533046330473304833049330503305133052330533305433055330563305733058330593306033061330623306333064330653306633067330683306933070330713307233073330743307533076330773307833079330803308133082330833308433085330863308733088330893309033091330923309333094330953309633097330983309933100331013310233103331043310533106331073310833109331103311133112331133311433115331163311733118331193312033121331223312333124331253312633127331283312933130331313313233133331343313533136331373313833139331403314133142331433314433145331463314733148331493315033151331523315333154331553315633157331583315933160331613316233163331643316533166331673316833169331703317133172331733317433175331763317733178331793318033181331823318333184331853318633187331883318933190331913319233193331943319533196331973319833199332003320133202332033320433205332063320733208332093321033211332123321333214332153321633217332183321933220332213322233223332243322533226332273322833229332303323133232332333323433235332363323733238332393324033241332423324333244332453324633247332483324933250332513325233253332543325533256332573325833259332603326133262332633326433265332663326733268332693327033271332723327333274332753327633277332783327933280332813328233283332843328533286332873328833289332903329133292332933329433295332963329733298332993330033301333023330333304333053330633307333083330933310333113331233313333143331533316333173331833319333203332133322333233332433325333263332733328333293333033331333323333333334333353333633337333383333933340333413334233343333443334533346333473334833349333503335133352333533335433355333563335733358333593336033361333623336333364333653336633367333683336933370333713337233373333743337533376333773337833379333803338133382333833338433385333863338733388333893339033391333923339333394333953339633397333983339933400334013340233403334043340533406334073340833409334103341133412334133341433415334163341733418334193342033421334223342333424334253342633427334283342933430334313343233433334343343533436334373343833439334403344133442334433344433445334463344733448334493345033451334523345333454334553345633457334583345933460334613346233463334643346533466334673346833469334703347133472334733347433475334763347733478334793348033481334823348333484334853348633487334883348933490334913349233493334943349533496334973349833499335003350133502335033350433505335063350733508335093351033511335123351333514335153351633517335183351933520335213352233523335243352533526335273352833529335303353133532335333353433535335363353733538335393354033541335423354333544335453354633547335483354933550335513355233553335543355533556335573355833559335603356133562335633356433565335663356733568335693357033571335723357333574335753357633577335783357933580335813358233583335843358533586335873358833589335903359133592335933359433595335963359733598335993360033601336023360333604336053360633607336083360933610336113361233613336143361533616336173361833619336203362133622336233362433625336263362733628336293363033631336323363333634336353363633637336383363933640336413364233643336443364533646336473364833649336503365133652336533365433655336563365733658336593366033661336623366333664336653366633667336683366933670336713367233673336743367533676336773367833679336803368133682336833368433685336863368733688336893369033691336923369333694336953369633697336983369933700337013370233703337043370533706337073370833709337103371133712337133371433715337163371733718337193372033721337223372333724337253372633727337283372933730337313373233733337343373533736337373373833739337403374133742337433374433745337463374733748337493375033751337523375333754337553375633757337583375933760337613376233763337643376533766337673376833769337703377133772337733377433775337763377733778337793378033781337823378333784337853378633787337883378933790337913379233793337943379533796337973379833799338003380133802338033380433805338063380733808338093381033811338123381333814338153381633817338183381933820338213382233823338243382533826338273382833829338303383133832338333383433835338363383733838338393384033841338423384333844338453384633847338483384933850338513385233853338543385533856338573385833859338603386133862338633386433865338663386733868338693387033871338723387333874338753387633877338783387933880338813388233883338843388533886338873388833889338903389133892338933389433895338963389733898338993390033901339023390333904339053390633907339083390933910339113391233913339143391533916339173391833919339203392133922339233392433925339263392733928339293393033931339323393333934339353393633937339383393933940339413394233943339443394533946339473394833949339503395133952339533395433955339563395733958339593396033961339623396333964339653396633967339683396933970339713397233973339743397533976339773397833979339803398133982339833398433985339863398733988339893399033991339923399333994339953399633997339983399934000340013400234003340043400534006340073400834009340103401134012340133401434015340163401734018340193402034021340223402334024340253402634027340283402934030340313403234033340343403534036340373403834039340403404134042340433404434045340463404734048340493405034051340523405334054340553405634057340583405934060340613406234063340643406534066340673406834069340703407134072340733407434075340763407734078340793408034081340823408334084340853408634087340883408934090340913409234093340943409534096340973409834099341003410134102341033410434105341063410734108341093411034111341123411334114341153411634117341183411934120341213412234123341243412534126341273412834129341303413134132341333413434135341363413734138341393414034141341423414334144341453414634147341483414934150341513415234153341543415534156341573415834159341603416134162341633416434165341663416734168341693417034171341723417334174341753417634177341783417934180341813418234183341843418534186341873418834189341903419134192341933419434195341963419734198341993420034201342023420334204342053420634207342083420934210342113421234213342143421534216342173421834219342203422134222342233422434225342263422734228342293423034231342323423334234342353423634237342383423934240342413424234243342443424534246342473424834249342503425134252342533425434255342563425734258342593426034261342623426334264342653426634267342683426934270342713427234273342743427534276342773427834279342803428134282342833428434285342863428734288342893429034291342923429334294342953429634297342983429934300343013430234303343043430534306343073430834309343103431134312343133431434315343163431734318343193432034321343223432334324343253432634327343283432934330 |
- /*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.82
- */
- 'use strict';
- Object.defineProperty(exports, '__esModule', { value: true });
- /*!
- Stencil Mock Doc v2.15.1 | MIT Licensed | https://stenciljs.com
- */
- const CONTENT_REF_ID = 'r';
- const ORG_LOCATION_ID = 'o';
- const SLOT_NODE_ID = 's';
- const TEXT_NODE_ID = 't';
- const XLINK_NS = 'http://www.w3.org/1999/xlink';
- const attrHandler = {
- get(obj, prop) {
- if (prop in obj) {
- return obj[prop];
- }
- if (typeof prop !== 'symbol' && !isNaN(prop)) {
- return obj.__items[prop];
- }
- return undefined;
- },
- };
- const createAttributeProxy = (caseInsensitive) => new Proxy(new MockAttributeMap(caseInsensitive), attrHandler);
- class MockAttributeMap {
- constructor(caseInsensitive = false) {
- this.caseInsensitive = caseInsensitive;
- this.__items = [];
- }
- get length() {
- return this.__items.length;
- }
- item(index) {
- return this.__items[index] || null;
- }
- setNamedItem(attr) {
- attr.namespaceURI = null;
- this.setNamedItemNS(attr);
- }
- setNamedItemNS(attr) {
- if (attr != null && attr.value != null) {
- attr.value = String(attr.value);
- }
- const existingAttr = this.__items.find((a) => a.name === attr.name && a.namespaceURI === attr.namespaceURI);
- if (existingAttr != null) {
- existingAttr.value = attr.value;
- }
- else {
- this.__items.push(attr);
- }
- }
- getNamedItem(attrName) {
- if (this.caseInsensitive) {
- attrName = attrName.toLowerCase();
- }
- return this.getNamedItemNS(null, attrName);
- }
- getNamedItemNS(namespaceURI, attrName) {
- namespaceURI = getNamespaceURI(namespaceURI);
- return (this.__items.find((attr) => attr.name === attrName && getNamespaceURI(attr.namespaceURI) === namespaceURI) || null);
- }
- removeNamedItem(attr) {
- this.removeNamedItemNS(attr);
- }
- removeNamedItemNS(attr) {
- for (let i = 0, ii = this.__items.length; i < ii; i++) {
- if (this.__items[i].name === attr.name && this.__items[i].namespaceURI === attr.namespaceURI) {
- this.__items.splice(i, 1);
- break;
- }
- }
- }
- [Symbol.iterator]() {
- let i = 0;
- return {
- next: () => ({
- done: i === this.length,
- value: this.item(i++),
- }),
- };
- }
- get [Symbol.toStringTag]() {
- return 'MockAttributeMap';
- }
- }
- function getNamespaceURI(namespaceURI) {
- return namespaceURI === XLINK_NS ? null : namespaceURI;
- }
- function cloneAttributes(srcAttrs, sortByName = false) {
- const dstAttrs = new MockAttributeMap(srcAttrs.caseInsensitive);
- if (srcAttrs != null) {
- const attrLen = srcAttrs.length;
- if (sortByName && attrLen > 1) {
- const sortedAttrs = [];
- for (let i = 0; i < attrLen; i++) {
- const srcAttr = srcAttrs.item(i);
- const dstAttr = new MockAttr(srcAttr.name, srcAttr.value, srcAttr.namespaceURI);
- sortedAttrs.push(dstAttr);
- }
- sortedAttrs.sort(sortAttributes).forEach((attr) => {
- dstAttrs.setNamedItemNS(attr);
- });
- }
- else {
- for (let i = 0; i < attrLen; i++) {
- const srcAttr = srcAttrs.item(i);
- const dstAttr = new MockAttr(srcAttr.name, srcAttr.value, srcAttr.namespaceURI);
- dstAttrs.setNamedItemNS(dstAttr);
- }
- }
- }
- return dstAttrs;
- }
- function sortAttributes(a, b) {
- if (a.name < b.name)
- return -1;
- if (a.name > b.name)
- return 1;
- return 0;
- }
- class MockAttr {
- constructor(attrName, attrValue, namespaceURI = null) {
- this._name = attrName;
- this._value = String(attrValue);
- this._namespaceURI = namespaceURI;
- }
- get name() {
- return this._name;
- }
- set name(value) {
- this._name = value;
- }
- get value() {
- return this._value;
- }
- set value(value) {
- this._value = String(value);
- }
- get nodeName() {
- return this._name;
- }
- set nodeName(value) {
- this._name = value;
- }
- get nodeValue() {
- return this._value;
- }
- set nodeValue(value) {
- this._value = String(value);
- }
- get namespaceURI() {
- return this._namespaceURI;
- }
- set namespaceURI(namespaceURI) {
- this._namespaceURI = namespaceURI;
- }
- }
- class MockCustomElementRegistry {
- constructor(win) {
- this.win = win;
- }
- define(tagName, cstr, options) {
- if (tagName.toLowerCase() !== tagName) {
- throw new Error(`Failed to execute 'define' on 'CustomElementRegistry': "${tagName}" is not a valid custom element name`);
- }
- if (this.__registry == null) {
- this.__registry = new Map();
- }
- this.__registry.set(tagName, { cstr, options });
- if (this.__whenDefined != null) {
- const whenDefinedResolveFns = this.__whenDefined.get(tagName);
- if (whenDefinedResolveFns != null) {
- whenDefinedResolveFns.forEach((whenDefinedResolveFn) => {
- whenDefinedResolveFn();
- });
- whenDefinedResolveFns.length = 0;
- this.__whenDefined.delete(tagName);
- }
- }
- const doc = this.win.document;
- if (doc != null) {
- const hosts = doc.querySelectorAll(tagName);
- hosts.forEach((host) => {
- if (upgradedElements.has(host) === false) {
- tempDisableCallbacks.add(doc);
- const upgradedCmp = createCustomElement(this, doc, tagName);
- for (let i = 0; i < host.childNodes.length; i++) {
- const childNode = host.childNodes[i];
- childNode.remove();
- upgradedCmp.appendChild(childNode);
- }
- tempDisableCallbacks.delete(doc);
- if (proxyElements.has(host)) {
- proxyElements.set(host, upgradedCmp);
- }
- }
- fireConnectedCallback(host);
- });
- }
- }
- get(tagName) {
- if (this.__registry != null) {
- const def = this.__registry.get(tagName.toLowerCase());
- if (def != null) {
- return def.cstr;
- }
- }
- return undefined;
- }
- upgrade(_rootNode) {
- //
- }
- clear() {
- if (this.__registry != null) {
- this.__registry.clear();
- }
- if (this.__whenDefined != null) {
- this.__whenDefined.clear();
- }
- }
- whenDefined(tagName) {
- tagName = tagName.toLowerCase();
- if (this.__registry != null && this.__registry.has(tagName) === true) {
- return Promise.resolve(this.__registry.get(tagName).cstr);
- }
- return new Promise((resolve) => {
- if (this.__whenDefined == null) {
- this.__whenDefined = new Map();
- }
- let whenDefinedResolveFns = this.__whenDefined.get(tagName);
- if (whenDefinedResolveFns == null) {
- whenDefinedResolveFns = [];
- this.__whenDefined.set(tagName, whenDefinedResolveFns);
- }
- whenDefinedResolveFns.push(resolve);
- });
- }
- }
- function createCustomElement(customElements, ownerDocument, tagName) {
- const Cstr = customElements.get(tagName);
- if (Cstr != null) {
- const cmp = new Cstr(ownerDocument);
- cmp.nodeName = tagName.toUpperCase();
- upgradedElements.add(cmp);
- return cmp;
- }
- const host = new Proxy({}, {
- get(obj, prop) {
- const elm = proxyElements.get(host);
- if (elm != null) {
- return elm[prop];
- }
- return obj[prop];
- },
- set(obj, prop, val) {
- const elm = proxyElements.get(host);
- if (elm != null) {
- elm[prop] = val;
- }
- else {
- obj[prop] = val;
- }
- return true;
- },
- has(obj, prop) {
- const elm = proxyElements.get(host);
- if (prop in elm) {
- return true;
- }
- if (prop in obj) {
- return true;
- }
- return false;
- },
- });
- const elm = new MockHTMLElement(ownerDocument, tagName);
- proxyElements.set(host, elm);
- return host;
- }
- const proxyElements = new WeakMap();
- const upgradedElements = new WeakSet();
- function connectNode(ownerDocument, node) {
- node.ownerDocument = ownerDocument;
- if (node.nodeType === 1 /* ELEMENT_NODE */) {
- if (ownerDocument != null && node.nodeName.includes('-')) {
- const win = ownerDocument.defaultView;
- if (win != null && typeof node.connectedCallback === 'function' && node.isConnected) {
- fireConnectedCallback(node);
- }
- const shadowRoot = node.shadowRoot;
- if (shadowRoot != null) {
- shadowRoot.childNodes.forEach((childNode) => {
- connectNode(ownerDocument, childNode);
- });
- }
- }
- node.childNodes.forEach((childNode) => {
- connectNode(ownerDocument, childNode);
- });
- }
- else {
- node.childNodes.forEach((childNode) => {
- childNode.ownerDocument = ownerDocument;
- });
- }
- }
- function fireConnectedCallback(node) {
- if (typeof node.connectedCallback === 'function') {
- if (tempDisableCallbacks.has(node.ownerDocument) === false) {
- try {
- node.connectedCallback();
- }
- catch (e) {
- console.error(e);
- }
- }
- }
- }
- function disconnectNode(node) {
- if (node.nodeType === 1 /* ELEMENT_NODE */) {
- if (node.nodeName.includes('-') === true && typeof node.disconnectedCallback === 'function') {
- if (tempDisableCallbacks.has(node.ownerDocument) === false) {
- try {
- node.disconnectedCallback();
- }
- catch (e) {
- console.error(e);
- }
- }
- }
- node.childNodes.forEach(disconnectNode);
- }
- }
- function attributeChanged(node, attrName, oldValue, newValue) {
- attrName = attrName.toLowerCase();
- const observedAttributes = node.constructor.observedAttributes;
- if (Array.isArray(observedAttributes) === true &&
- observedAttributes.some((obs) => obs.toLowerCase() === attrName) === true) {
- try {
- node.attributeChangedCallback(attrName, oldValue, newValue);
- }
- catch (e) {
- console.error(e);
- }
- }
- }
- function checkAttributeChanged(node) {
- return node.nodeName.includes('-') === true && typeof node.attributeChangedCallback === 'function';
- }
- const tempDisableCallbacks = new Set();
- function dataset(elm) {
- const ds = {};
- const attributes = elm.attributes;
- const attrLen = attributes.length;
- for (let i = 0; i < attrLen; i++) {
- const attr = attributes.item(i);
- const nodeName = attr.nodeName;
- if (nodeName.startsWith('data-')) {
- ds[dashToPascalCase(nodeName)] = attr.nodeValue;
- }
- }
- return new Proxy(ds, {
- get(_obj, camelCaseProp) {
- return ds[camelCaseProp];
- },
- set(_obj, camelCaseProp, value) {
- const dataAttr = toDataAttribute(camelCaseProp);
- elm.setAttribute(dataAttr, value);
- return true;
- },
- });
- }
- function toDataAttribute(str) {
- return ('data-' +
- String(str)
- .replace(/([A-Z0-9])/g, (g) => ' ' + g[0])
- .trim()
- .replace(/ /g, '-')
- .toLowerCase());
- }
- function dashToPascalCase(str) {
- str = String(str).slice(5);
- return str
- .split('-')
- .map((segment, index) => {
- if (index === 0) {
- return segment.charAt(0).toLowerCase() + segment.slice(1);
- }
- return segment.charAt(0).toUpperCase() + segment.slice(1);
- })
- .join('');
- }
- // Sizzle 2.3.6
- const Sizzle = (function() {
- const window = {
- document: {
- createElement() {
- return {};
- },
- nodeType: 9,
- documentElement: {
- nodeType: 1,
- nodeName: 'HTML'
- }
- }
- };
- const module = { exports: {} };
- /*! Sizzle v2.3.6 | (c) JS Foundation and other contributors | js.foundation */
- !function(e){var t,n,r,i,o,u,l,a,c,s,d,f,p,h,g,m,y,v,w,b="sizzle"+1*new Date,N=e.document,C=0,x=0,E=ae(),A=ae(),S=ae(),D=ae(),T=function(e,t){return e===t&&(d=!0),0},L={}.hasOwnProperty,q=[],I=q.pop,B=q.push,R=q.push,$=q.slice,k=function(e,t){for(var n=0,r=e.length;n<r;n++)if(e[n]===t)return n;return -1},H="checked|selected|async|autofocus|autoplay|controls|defer|disabled|hidden|ismap|loop|multiple|open|readonly|required|scoped",M="[\\x20\\t\\r\\n\\f]",P="(?:\\\\[\\da-fA-F]{1,6}"+M+"?|\\\\[^\\r\\n\\f]|[\\w-]|[^\0-\\x7f])+",z="\\["+M+"*("+P+")(?:"+M+"*([*^$|!~]?=)"+M+"*(?:'((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\"|("+P+"))|)"+M+"*\\]",F=":("+P+")(?:\\((('((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\")|((?:\\\\.|[^\\\\()[\\]]|"+z+")*)|.*)\\)|)",O=new RegExp(M+"+","g"),j=new RegExp("^"+M+"+|((?:^|[^\\\\])(?:\\\\.)*)"+M+"+$","g"),G=new RegExp("^"+M+"*,"+M+"*"),U=new RegExp("^"+M+"*([>+~]|"+M+")"+M+"*"),V=new RegExp(M+"|>"),X=new RegExp(F),J=new RegExp("^"+P+"$"),K={ID:new RegExp("^#("+P+")"),CLASS:new RegExp("^\\.("+P+")"),TAG:new RegExp("^("+P+"|[*])"),ATTR:new RegExp("^"+z),PSEUDO:new RegExp("^"+F),CHILD:new RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\("+M+"*(even|odd|(([+-]|)(\\d*)n|)"+M+"*(?:([+-]|)"+M+"*(\\d+)|))"+M+"*\\)|)","i"),bool:new RegExp("^(?:"+H+")$","i"),needsContext:new RegExp("^"+M+"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\("+M+"*((?:-\\d)?\\d*)"+M+"*\\)|)(?=[^-]|$)","i")},Q=/HTML$/i,W=/^(?:input|select|textarea|button)$/i,Y=/^h\d$/i,Z=/^[^{]+\{\s*\[native \w/,_=/^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,ee=/[+~]/,te=new RegExp("\\\\[\\da-fA-F]{1,6}"+M+"?|\\\\([^\\r\\n\\f])","g"),ne=function(e,t){var n="0x"+e.slice(1)-65536;return t||(n<0?String.fromCharCode(n+65536):String.fromCharCode(n>>10|55296,1023&n|56320))},re=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\0-\x1f\x7f-\uFFFF\w-]/g,ie=function(e,t){return t?"\0"===e?"\ufffd":e.slice(0,-1)+"\\"+e.charCodeAt(e.length-1).toString(16)+" ":"\\"+e},oe=function(){f();},ue=ve(function(e){return !0===e.disabled&&"fieldset"===e.nodeName.toLowerCase()},{dir:"parentNode",next:"legend"});try{R.apply(q=$.call(N.childNodes),N.childNodes),q[N.childNodes.length].nodeType;}catch(e){R={apply:q.length?function(e,t){B.apply(e,$.call(t));}:function(e,t){var n=e.length,r=0;while(e[n++]=t[r++]);e.length=n-1;}};}function le(e,t,r,i){var o,l,c,s,d,h,y,v=t&&t.ownerDocument,N=t?t.nodeType:9;if(r=r||[],"string"!=typeof e||!e||1!==N&&9!==N&&11!==N)return r;if(!i&&(f(t),t=t||p,g)){if(11!==N&&(d=_.exec(e)))if(o=d[1]){if(9===N){if(!(c=t.getElementById(o)))return r;if(c.id===o)return r.push(c),r}else if(v&&(c=v.getElementById(o))&&w(t,c)&&c.id===o)return r.push(c),r}else {if(d[2])return R.apply(r,t.getElementsByTagName(e)),r;if((o=d[3])&&n.getElementsByClassName&&t.getElementsByClassName)return R.apply(r,t.getElementsByClassName(o)),r}if(n.qsa&&!D[e+" "]&&(!m||!m.test(e))&&(1!==N||"object"!==t.nodeName.toLowerCase())){if(y=e,v=t,1===N&&(V.test(e)||U.test(e))){(v=ee.test(e)&&ge(t.parentNode)||t)===t&&n.scope||((s=t.getAttribute("id"))?s=s.replace(re,ie):t.setAttribute("id",s=b)),l=(h=u(e)).length;while(l--)h[l]=(s?"#"+s:":scope")+" "+ye(h[l]);y=h.join(",");}try{return R.apply(r,v.querySelectorAll(y)),r}catch(t){D(e,!0);}finally{s===b&&t.removeAttribute("id");}}}return a(e.replace(j,"$1"),t,r,i)}function ae(){var e=[];function t(n,i){return e.push(n+" ")>r.cacheLength&&delete t[e.shift()],t[n+" "]=i}return t}function ce(e){return e[b]=!0,e}function se(e){var t=p.createElement("fieldset");try{return !!e(t)}catch(e){return !1}finally{t.parentNode&&t.parentNode.removeChild(t),t=null;}}function de(e,t){var n=e.split("|"),i=n.length;while(i--)r.attrHandle[n[i]]=t;}function fe(e,t){var n=t&&e,r=n&&1===e.nodeType&&1===t.nodeType&&e.sourceIndex-t.sourceIndex;if(r)return r;if(n)while(n=n.nextSibling)if(n===t)return -1;return e?1:-1}function pe(e){return function(t){return "form"in t?t.parentNode&&!1===t.disabled?"label"in t?"label"in t.parentNode?t.parentNode.disabled===e:t.disabled===e:t.isDisabled===e||t.isDisabled!==!e&&ue(t)===e:t.disabled===e:"label"in t&&t.disabled===e}}function he(e){return ce(function(t){return t=+t,ce(function(n,r){var i,o=e([],n.length,t),u=o.length;while(u--)n[i=o[u]]&&(n[i]=!(r[i]=n[i]));})})}function ge(e){return e&&void 0!==e.getElementsByTagName&&e}n=le.support={},o=le.isXML=function(e){var t=e&&e.namespaceURI,n=e&&(e.ownerDocument||e).documentElement;return !Q.test(t||n&&n.nodeName||"HTML")},f=le.setDocument=function(e){var t,i,u=e?e.ownerDocument||e:N;return u!=p&&9===u.nodeType&&u.documentElement?(p=u,h=p.documentElement,g=!o(p),N!=p&&(i=p.defaultView)&&i.top!==i&&(i.addEventListener?i.addEventListener("unload",oe,!1):i.attachEvent&&i.attachEvent("onunload",oe)),n.scope=se(function(e){return h.appendChild(e).appendChild(p.createElement("div")),void 0!==e.querySelectorAll&&!e.querySelectorAll(":scope fieldset div").length}),n.attributes=se(function(e){return e.className="i",!e.getAttribute("className")}),n.getElementsByTagName=se(function(e){return e.appendChild(p.createComment("")),!e.getElementsByTagName("*").length}),n.getElementsByClassName=Z.test(p.getElementsByClassName),n.getById=se(function(e){return h.appendChild(e).id=b,!p.getElementsByName||!p.getElementsByName(b).length}),n.getById?(r.filter.ID=function(e){var t=e.replace(te,ne);return function(e){return e.getAttribute("id")===t}},r.find.ID=function(e,t){if(void 0!==t.getElementById&&g){var n=t.getElementById(e);return n?[n]:[]}}):(r.filter.ID=function(e){var t=e.replace(te,ne);return function(e){var n=void 0!==e.getAttributeNode&&e.getAttributeNode("id");return n&&n.value===t}},r.find.ID=function(e,t){if(void 0!==t.getElementById&&g){var n,r,i,o=t.getElementById(e);if(o){if((n=o.getAttributeNode("id"))&&n.value===e)return [o];i=t.getElementsByName(e),r=0;while(o=i[r++])if((n=o.getAttributeNode("id"))&&n.value===e)return [o]}return []}}),r.find.TAG=n.getElementsByTagName?function(e,t){return void 0!==t.getElementsByTagName?t.getElementsByTagName(e):n.qsa?t.querySelectorAll(e):void 0}:function(e,t){var n,r=[],i=0,o=t.getElementsByTagName(e);if("*"===e){while(n=o[i++])1===n.nodeType&&r.push(n);return r}return o},r.find.CLASS=n.getElementsByClassName&&function(e,t){if(void 0!==t.getElementsByClassName&&g)return t.getElementsByClassName(e)},y=[],m=[],(n.qsa=Z.test(p.querySelectorAll))&&(se(function(e){var t;h.appendChild(e).innerHTML="<a id='"+b+"'></a><select id='"+b+"-\r\\' msallowcapture=''><option selected=''></option></select>",e.querySelectorAll("[msallowcapture^='']").length&&m.push("[*^$]="+M+"*(?:''|\"\")"),e.querySelectorAll("[selected]").length||m.push("\\["+M+"*(?:value|"+H+")"),e.querySelectorAll("[id~="+b+"-]").length||m.push("~="),(t=p.createElement("input")).setAttribute("name",""),e.appendChild(t),e.querySelectorAll("[name='']").length||m.push("\\["+M+"*name"+M+"*="+M+"*(?:''|\"\")"),e.querySelectorAll(":checked").length||m.push(":checked"),e.querySelectorAll("a#"+b+"+*").length||m.push(".#.+[+~]"),e.querySelectorAll("\\\f"),m.push("[\\r\\n\\f]");}),se(function(e){e.innerHTML="<a href='' disabled='disabled'></a><select disabled='disabled'><option/></select>";var t=p.createElement("input");t.setAttribute("type","hidden"),e.appendChild(t).setAttribute("name","D"),e.querySelectorAll("[name=d]").length&&m.push("name"+M+"*[*^$|!~]?="),2!==e.querySelectorAll(":enabled").length&&m.push(":enabled",":disabled"),h.appendChild(e).disabled=!0,2!==e.querySelectorAll(":disabled").length&&m.push(":enabled",":disabled"),e.querySelectorAll("*,:x"),m.push(",.*:");})),(n.matchesSelector=Z.test(v=h.matches||h.webkitMatchesSelector||h.mozMatchesSelector||h.oMatchesSelector||h.msMatchesSelector))&&se(function(e){n.disconnectedMatch=v.call(e,"*"),v.call(e,"[s!='']:x"),y.push("!=",F);}),m=m.length&&new RegExp(m.join("|")),y=y.length&&new RegExp(y.join("|")),t=Z.test(h.compareDocumentPosition),w=t||Z.test(h.contains)?function(e,t){var n=9===e.nodeType?e.documentElement:e,r=t&&t.parentNode;return e===r||!(!r||1!==r.nodeType||!(n.contains?n.contains(r):e.compareDocumentPosition&&16&e.compareDocumentPosition(r)))}:function(e,t){if(t)while(t=t.parentNode)if(t===e)return !0;return !1},T=t?function(e,t){if(e===t)return d=!0,0;var r=!e.compareDocumentPosition-!t.compareDocumentPosition;return r||(1&(r=(e.ownerDocument||e)==(t.ownerDocument||t)?e.compareDocumentPosition(t):1)||!n.sortDetached&&t.compareDocumentPosition(e)===r?e==p||e.ownerDocument==N&&w(N,e)?-1:t==p||t.ownerDocument==N&&w(N,t)?1:s?k(s,e)-k(s,t):0:4&r?-1:1)}:function(e,t){if(e===t)return d=!0,0;var n,r=0,i=e.parentNode,o=t.parentNode,u=[e],l=[t];if(!i||!o)return e==p?-1:t==p?1:i?-1:o?1:s?k(s,e)-k(s,t):0;if(i===o)return fe(e,t);n=e;while(n=n.parentNode)u.unshift(n);n=t;while(n=n.parentNode)l.unshift(n);while(u[r]===l[r])r++;return r?fe(u[r],l[r]):u[r]==N?-1:l[r]==N?1:0},p):p},le.matches=function(e,t){return le(e,null,null,t)},le.matchesSelector=function(e,t){if(f(e),n.matchesSelector&&g&&!D[t+" "]&&(!y||!y.test(t))&&(!m||!m.test(t)))try{var r=v.call(e,t);if(r||n.disconnectedMatch||e.document&&11!==e.document.nodeType)return r}catch(e){D(t,!0);}return le(t,p,null,[e]).length>0},le.contains=function(e,t){return (e.ownerDocument||e)!=p&&f(e),w(e,t)},le.attr=function(e,t){(e.ownerDocument||e)!=p&&f(e);var i=r.attrHandle[t.toLowerCase()],o=i&&L.call(r.attrHandle,t.toLowerCase())?i(e,t,!g):void 0;return void 0!==o?o:n.attributes||!g?e.getAttribute(t):(o=e.getAttributeNode(t))&&o.specified?o.value:null},le.escape=function(e){return (e+"").replace(re,ie)},le.error=function(e){throw new Error("Syntax error, unrecognized expression: "+e)},le.uniqueSort=function(e){var t,r=[],i=0,o=0;if(d=!n.detectDuplicates,s=!n.sortStable&&e.slice(0),e.sort(T),d){while(t=e[o++])t===e[o]&&(i=r.push(o));while(i--)e.splice(r[i],1);}return s=null,e},i=le.getText=function(e){var t,n="",r=0,o=e.nodeType;if(o){if(1===o||9===o||11===o){if("string"==typeof e.textContent)return e.textContent;for(e=e.firstChild;e;e=e.nextSibling)n+=i(e);}else if(3===o||4===o)return e.nodeValue}else while(t=e[r++])n+=i(t);return n},(r=le.selectors={cacheLength:50,createPseudo:ce,match:K,attrHandle:{},find:{},relative:{">":{dir:"parentNode",first:!0}," ":{dir:"parentNode"},"+":{dir:"previousSibling",first:!0},"~":{dir:"previousSibling"}},preFilter:{ATTR:function(e){return e[1]=e[1].replace(te,ne),e[3]=(e[3]||e[4]||e[5]||"").replace(te,ne),"~="===e[2]&&(e[3]=" "+e[3]+" "),e.slice(0,4)},CHILD:function(e){return e[1]=e[1].toLowerCase(),"nth"===e[1].slice(0,3)?(e[3]||le.error(e[0]),e[4]=+(e[4]?e[5]+(e[6]||1):2*("even"===e[3]||"odd"===e[3])),e[5]=+(e[7]+e[8]||"odd"===e[3])):e[3]&&le.error(e[0]),e},PSEUDO:function(e){var t,n=!e[6]&&e[2];return K.CHILD.test(e[0])?null:(e[3]?e[2]=e[4]||e[5]||"":n&&X.test(n)&&(t=u(n,!0))&&(t=n.indexOf(")",n.length-t)-n.length)&&(e[0]=e[0].slice(0,t),e[2]=n.slice(0,t)),e.slice(0,3))}},filter:{TAG:function(e){var t=e.replace(te,ne).toLowerCase();return "*"===e?function(){return !0}:function(e){return e.nodeName&&e.nodeName.toLowerCase()===t}},CLASS:function(e){var t=E[e+" "];return t||(t=new RegExp("(^|"+M+")"+e+"("+M+"|$)"))&&E(e,function(e){return t.test("string"==typeof e.className&&e.className||void 0!==e.getAttribute&&e.getAttribute("class")||"")})},ATTR:function(e,t,n){return function(r){var i=le.attr(r,e);return null==i?"!="===t:!t||(i+="","="===t?i===n:"!="===t?i!==n:"^="===t?n&&0===i.indexOf(n):"*="===t?n&&i.indexOf(n)>-1:"$="===t?n&&i.slice(-n.length)===n:"~="===t?(" "+i.replace(O," ")+" ").indexOf(n)>-1:"|="===t&&(i===n||i.slice(0,n.length+1)===n+"-"))}},CHILD:function(e,t,n,r,i){var o="nth"!==e.slice(0,3),u="last"!==e.slice(-4),l="of-type"===t;return 1===r&&0===i?function(e){return !!e.parentNode}:function(t,n,a){var c,s,d,f,p,h,g=o!==u?"nextSibling":"previousSibling",m=t.parentNode,y=l&&t.nodeName.toLowerCase(),v=!a&&!l,w=!1;if(m){if(o){while(g){f=t;while(f=f[g])if(l?f.nodeName.toLowerCase()===y:1===f.nodeType)return !1;h=g="only"===e&&!h&&"nextSibling";}return !0}if(h=[u?m.firstChild:m.lastChild],u&&v){w=(p=(c=(s=(d=(f=m)[b]||(f[b]={}))[f.uniqueID]||(d[f.uniqueID]={}))[e]||[])[0]===C&&c[1])&&c[2],f=p&&m.childNodes[p];while(f=++p&&f&&f[g]||(w=p=0)||h.pop())if(1===f.nodeType&&++w&&f===t){s[e]=[C,p,w];break}}else if(v&&(w=p=(c=(s=(d=(f=t)[b]||(f[b]={}))[f.uniqueID]||(d[f.uniqueID]={}))[e]||[])[0]===C&&c[1]),!1===w)while(f=++p&&f&&f[g]||(w=p=0)||h.pop())if((l?f.nodeName.toLowerCase()===y:1===f.nodeType)&&++w&&(v&&((s=(d=f[b]||(f[b]={}))[f.uniqueID]||(d[f.uniqueID]={}))[e]=[C,w]),f===t))break;return (w-=i)===r||w%r==0&&w/r>=0}}},PSEUDO:function(e,t){var n,i=r.pseudos[e]||r.setFilters[e.toLowerCase()]||le.error("unsupported pseudo: "+e);return i[b]?i(t):i.length>1?(n=[e,e,"",t],r.setFilters.hasOwnProperty(e.toLowerCase())?ce(function(e,n){var r,o=i(e,t),u=o.length;while(u--)e[r=k(e,o[u])]=!(n[r]=o[u]);}):function(e){return i(e,0,n)}):i}},pseudos:{not:ce(function(e){var t=[],n=[],r=l(e.replace(j,"$1"));return r[b]?ce(function(e,t,n,i){var o,u=r(e,null,i,[]),l=e.length;while(l--)(o=u[l])&&(e[l]=!(t[l]=o));}):function(e,i,o){return t[0]=e,r(t,null,o,n),t[0]=null,!n.pop()}}),has:ce(function(e){return function(t){return le(e,t).length>0}}),contains:ce(function(e){return e=e.replace(te,ne),function(t){return (t.textContent||i(t)).indexOf(e)>-1}}),lang:ce(function(e){return J.test(e||"")||le.error("unsupported lang: "+e),e=e.replace(te,ne).toLowerCase(),function(t){var n;do{if(n=g?t.lang:t.getAttribute("xml:lang")||t.getAttribute("lang"))return (n=n.toLowerCase())===e||0===n.indexOf(e+"-")}while((t=t.parentNode)&&1===t.nodeType);return !1}}),target:function(t){var n=e.location&&e.location.hash;return n&&n.slice(1)===t.id},root:function(e){return e===h},focus:function(e){return e===p.activeElement&&(!p.hasFocus||p.hasFocus())&&!!(e.type||e.href||~e.tabIndex)},enabled:pe(!1),disabled:pe(!0),checked:function(e){var t=e.nodeName.toLowerCase();return "input"===t&&!!e.checked||"option"===t&&!!e.selected},selected:function(e){return e.parentNode&&e.parentNode.selectedIndex,!0===e.selected},empty:function(e){for(e=e.firstChild;e;e=e.nextSibling)if(e.nodeType<6)return !1;return !0},parent:function(e){return !r.pseudos.empty(e)},header:function(e){return Y.test(e.nodeName)},input:function(e){return W.test(e.nodeName)},button:function(e){var t=e.nodeName.toLowerCase();return "input"===t&&"button"===e.type||"button"===t},text:function(e){var t;return "input"===e.nodeName.toLowerCase()&&"text"===e.type&&(null==(t=e.getAttribute("type"))||"text"===t.toLowerCase())},first:he(function(){return [0]}),last:he(function(e,t){return [t-1]}),eq:he(function(e,t,n){return [n<0?n+t:n]}),even:he(function(e,t){for(var n=0;n<t;n+=2)e.push(n);return e}),odd:he(function(e,t){for(var n=1;n<t;n+=2)e.push(n);return e}),lt:he(function(e,t,n){for(var r=n<0?n+t:n>t?t:n;--r>=0;)e.push(r);return e}),gt:he(function(e,t,n){for(var r=n<0?n+t:n;++r<t;)e.push(r);return e})}}).pseudos.nth=r.pseudos.eq;for(t in {radio:!0,checkbox:!0,file:!0,password:!0,image:!0})r.pseudos[t]=function(e){return function(t){return "input"===t.nodeName.toLowerCase()&&t.type===e}}(t);for(t in {submit:!0,reset:!0})r.pseudos[t]=function(e){return function(t){var n=t.nodeName.toLowerCase();return ("input"===n||"button"===n)&&t.type===e}}(t);function me(){}me.prototype=r.filters=r.pseudos,r.setFilters=new me,u=le.tokenize=function(e,t){var n,i,o,u,l,a,c,s=A[e+" "];if(s)return t?0:s.slice(0);l=e,a=[],c=r.preFilter;while(l){n&&!(i=G.exec(l))||(i&&(l=l.slice(i[0].length)||l),a.push(o=[])),n=!1,(i=U.exec(l))&&(n=i.shift(),o.push({value:n,type:i[0].replace(j," ")}),l=l.slice(n.length));for(u in r.filter)!(i=K[u].exec(l))||c[u]&&!(i=c[u](i))||(n=i.shift(),o.push({value:n,type:u,matches:i}),l=l.slice(n.length));if(!n)break}return t?l.length:l?le.error(e):A(e,a).slice(0)};function ye(e){for(var t=0,n=e.length,r="";t<n;t++)r+=e[t].value;return r}function ve(e,t,n){var r=t.dir,i=t.next,o=i||r,u=n&&"parentNode"===o,l=x++;return t.first?function(t,n,i){while(t=t[r])if(1===t.nodeType||u)return e(t,n,i);return !1}:function(t,n,a){var c,s,d,f=[C,l];if(a){while(t=t[r])if((1===t.nodeType||u)&&e(t,n,a))return !0}else while(t=t[r])if(1===t.nodeType||u)if(d=t[b]||(t[b]={}),s=d[t.uniqueID]||(d[t.uniqueID]={}),i&&i===t.nodeName.toLowerCase())t=t[r]||t;else {if((c=s[o])&&c[0]===C&&c[1]===l)return f[2]=c[2];if(s[o]=f,f[2]=e(t,n,a))return !0}return !1}}function we(e){return e.length>1?function(t,n,r){var i=e.length;while(i--)if(!e[i](t,n,r))return !1;return !0}:e[0]}function be(e,t,n){for(var r=0,i=t.length;r<i;r++)le(e,t[r],n);return n}function Ne(e,t,n,r,i){for(var o,u=[],l=0,a=e.length,c=null!=t;l<a;l++)(o=e[l])&&(n&&!n(o,r,i)||(u.push(o),c&&t.push(l)));return u}function Ce(e,t,n,r,i,o){return r&&!r[b]&&(r=Ce(r)),i&&!i[b]&&(i=Ce(i,o)),ce(function(o,u,l,a){var c,s,d,f=[],p=[],h=u.length,g=o||be(t||"*",l.nodeType?[l]:l,[]),m=!e||!o&&t?g:Ne(g,f,e,l,a),y=n?i||(o?e:h||r)?[]:u:m;if(n&&n(m,y,l,a),r){c=Ne(y,p),r(c,[],l,a),s=c.length;while(s--)(d=c[s])&&(y[p[s]]=!(m[p[s]]=d));}if(o){if(i||e){if(i){c=[],s=y.length;while(s--)(d=y[s])&&c.push(m[s]=d);i(null,y=[],c,a);}s=y.length;while(s--)(d=y[s])&&(c=i?k(o,d):f[s])>-1&&(o[c]=!(u[c]=d));}}else y=Ne(y===u?y.splice(h,y.length):y),i?i(null,u,y,a):R.apply(u,y);})}function xe(e){for(var t,n,i,o=e.length,u=r.relative[e[0].type],l=u||r.relative[" "],a=u?1:0,s=ve(function(e){return e===t},l,!0),d=ve(function(e){return k(t,e)>-1},l,!0),f=[function(e,n,r){var i=!u&&(r||n!==c)||((t=n).nodeType?s(e,n,r):d(e,n,r));return t=null,i}];a<o;a++)if(n=r.relative[e[a].type])f=[ve(we(f),n)];else {if((n=r.filter[e[a].type].apply(null,e[a].matches))[b]){for(i=++a;i<o;i++)if(r.relative[e[i].type])break;return Ce(a>1&&we(f),a>1&&ye(e.slice(0,a-1).concat({value:" "===e[a-2].type?"*":""})).replace(j,"$1"),n,a<i&&xe(e.slice(a,i)),i<o&&xe(e=e.slice(i)),i<o&&ye(e))}f.push(n);}return we(f)}function Ee(e,t){var n=t.length>0,i=e.length>0,o=function(o,u,l,a,s){var d,h,m,y=0,v="0",w=o&&[],b=[],N=c,x=o||i&&r.find.TAG("*",s),E=C+=null==N?1:Math.random()||.1,A=x.length;for(s&&(c=u==p||u||s);v!==A&&null!=(d=x[v]);v++){if(i&&d){h=0,u||d.ownerDocument==p||(f(d),l=!g);while(m=e[h++])if(m(d,u||p,l)){a.push(d);break}s&&(C=E);}n&&((d=!m&&d)&&y--,o&&w.push(d));}if(y+=v,n&&v!==y){h=0;while(m=t[h++])m(w,b,u,l);if(o){if(y>0)while(v--)w[v]||b[v]||(b[v]=I.call(a));b=Ne(b);}R.apply(a,b),s&&!o&&b.length>0&&y+t.length>1&&le.uniqueSort(a);}return s&&(C=E,c=N),w};return n?ce(o):o}l=le.compile=function(e,t){var n,r=[],i=[],o=S[e+" "];if(!o){t||(t=u(e)),n=t.length;while(n--)(o=xe(t[n]))[b]?r.push(o):i.push(o);(o=S(e,Ee(i,r))).selector=e;}return o},a=le.select=function(e,t,n,i){var o,a,c,s,d,f="function"==typeof e&&e,p=!i&&u(e=f.selector||e);if(n=n||[],1===p.length){if((a=p[0]=p[0].slice(0)).length>2&&"ID"===(c=a[0]).type&&9===t.nodeType&&g&&r.relative[a[1].type]){if(!(t=(r.find.ID(c.matches[0].replace(te,ne),t)||[])[0]))return n;f&&(t=t.parentNode),e=e.slice(a.shift().value.length);}o=K.needsContext.test(e)?0:a.length;while(o--){if(c=a[o],r.relative[s=c.type])break;if((d=r.find[s])&&(i=d(c.matches[0].replace(te,ne),ee.test(a[0].type)&&ge(t.parentNode)||t))){if(a.splice(o,1),!(e=i.length&&ye(a)))return R.apply(n,i),n;break}}}return (f||l(e,p))(i,t,!g,n,!t||ee.test(e)&&ge(t.parentNode)||t),n},n.sortStable=b.split("").sort(T).join("")===b,n.detectDuplicates=!!d,f(),n.sortDetached=se(function(e){return 1&e.compareDocumentPosition(p.createElement("fieldset"))}),se(function(e){return e.innerHTML="<a href='#'></a>","#"===e.firstChild.getAttribute("href")})||de("type|href|height|width",function(e,t,n){if(!n)return e.getAttribute(t,"type"===t.toLowerCase()?1:2)}),n.attributes&&se(function(e){return e.innerHTML="<input/>",e.firstChild.setAttribute("value",""),""===e.firstChild.getAttribute("value")})||de("value",function(e,t,n){if(!n&&"input"===e.nodeName.toLowerCase())return e.defaultValue}),se(function(e){return null==e.getAttribute("disabled")})||de(H,function(e,t,n){var r;if(!n)return !0===e[t]?t.toLowerCase():(r=e.getAttributeNode(t))&&r.specified?r.value:null});var Ae=e.Sizzle;le.noConflict=function(){return e.Sizzle===le&&(e.Sizzle=Ae),le},"function"==typeof define&&define.amd?define(function(){return le}):"undefined"!=typeof module&&module.exports?module.exports=le:e.Sizzle=le;}(window);
- //# sourceMappingURL=sizzle.min.map
- return module.exports;
- })();
- function matches(selector, elm) {
- const r = Sizzle.matches(selector, [elm]);
- return r.length > 0;
- }
- function selectOne(selector, elm) {
- const r = Sizzle(selector, elm);
- return r[0] || null;
- }
- function selectAll(selector, elm) {
- return Sizzle(selector, elm);
- }
- class MockClassList {
- constructor(elm) {
- this.elm = elm;
- }
- add(...classNames) {
- const clsNames = getItems(this.elm);
- let updated = false;
- classNames.forEach((className) => {
- className = String(className);
- validateClass(className);
- if (clsNames.includes(className) === false) {
- clsNames.push(className);
- updated = true;
- }
- });
- if (updated) {
- this.elm.setAttributeNS(null, 'class', clsNames.join(' '));
- }
- }
- remove(...classNames) {
- const clsNames = getItems(this.elm);
- let updated = false;
- classNames.forEach((className) => {
- className = String(className);
- validateClass(className);
- const index = clsNames.indexOf(className);
- if (index > -1) {
- clsNames.splice(index, 1);
- updated = true;
- }
- });
- if (updated) {
- this.elm.setAttributeNS(null, 'class', clsNames.filter((c) => c.length > 0).join(' '));
- }
- }
- contains(className) {
- className = String(className);
- return getItems(this.elm).includes(className);
- }
- toggle(className) {
- className = String(className);
- if (this.contains(className) === true) {
- this.remove(className);
- }
- else {
- this.add(className);
- }
- }
- get length() {
- return getItems(this.elm).length;
- }
- item(index) {
- return getItems(this.elm)[index];
- }
- toString() {
- return getItems(this.elm).join(' ');
- }
- }
- function validateClass(className) {
- if (className === '') {
- throw new Error('The token provided must not be empty.');
- }
- if (/\s/.test(className)) {
- throw new Error(`The token provided ('${className}') contains HTML space characters, which are not valid in tokens.`);
- }
- }
- function getItems(elm) {
- const className = elm.getAttribute('class');
- if (typeof className === 'string' && className.length > 0) {
- return className
- .trim()
- .split(' ')
- .filter((c) => c.length > 0);
- }
- return [];
- }
- class MockCSSStyleDeclaration {
- constructor() {
- this._styles = new Map();
- }
- setProperty(prop, value) {
- prop = jsCaseToCssCase(prop);
- if (value == null || value === '') {
- this._styles.delete(prop);
- }
- else {
- this._styles.set(prop, String(value));
- }
- }
- getPropertyValue(prop) {
- prop = jsCaseToCssCase(prop);
- return String(this._styles.get(prop) || '');
- }
- removeProperty(prop) {
- prop = jsCaseToCssCase(prop);
- this._styles.delete(prop);
- }
- get length() {
- return this._styles.size;
- }
- get cssText() {
- const cssText = [];
- this._styles.forEach((value, prop) => {
- cssText.push(`${prop}: ${value};`);
- });
- return cssText.join(' ').trim();
- }
- set cssText(cssText) {
- if (cssText == null || cssText === '') {
- this._styles.clear();
- return;
- }
- cssText.split(';').forEach((rule) => {
- rule = rule.trim();
- if (rule.length > 0) {
- const splt = rule.split(':');
- if (splt.length > 1) {
- const prop = splt[0].trim();
- const value = splt.slice(1).join(':').trim();
- if (prop !== '' && value !== '') {
- this._styles.set(jsCaseToCssCase(prop), value);
- }
- }
- }
- });
- }
- }
- function createCSSStyleDeclaration() {
- return new Proxy(new MockCSSStyleDeclaration(), cssProxyHandler);
- }
- const cssProxyHandler = {
- get(cssStyle, prop) {
- if (prop in cssStyle) {
- return cssStyle[prop];
- }
- prop = cssCaseToJsCase(prop);
- return cssStyle.getPropertyValue(prop);
- },
- set(cssStyle, prop, value) {
- if (prop in cssStyle) {
- cssStyle[prop] = value;
- }
- else {
- cssStyle.setProperty(prop, value);
- }
- return true;
- },
- };
- function cssCaseToJsCase(str) {
- // font-size to fontSize
- if (str.length > 1 && str.includes('-') === true) {
- str = str
- .toLowerCase()
- .split('-')
- .map((segment) => segment.charAt(0).toUpperCase() + segment.slice(1))
- .join('');
- str = str.slice(0, 1).toLowerCase() + str.slice(1);
- }
- return str;
- }
- function jsCaseToCssCase(str) {
- // fontSize to font-size
- if (str.length > 1 && str.includes('-') === false && /[A-Z]/.test(str) === true) {
- str = str
- .replace(/([A-Z])/g, (g) => ' ' + g[0])
- .trim()
- .replace(/ /g, '-')
- .toLowerCase();
- }
- return str;
- }
- class MockEvent {
- constructor(type, eventInitDict) {
- this.bubbles = false;
- this.cancelBubble = false;
- this.cancelable = false;
- this.composed = false;
- this.currentTarget = null;
- this.defaultPrevented = false;
- this.srcElement = null;
- this.target = null;
- if (typeof type !== 'string') {
- throw new Error(`Event type required`);
- }
- this.type = type;
- this.timeStamp = Date.now();
- if (eventInitDict != null) {
- Object.assign(this, eventInitDict);
- }
- }
- preventDefault() {
- this.defaultPrevented = true;
- }
- stopPropagation() {
- this.cancelBubble = true;
- }
- stopImmediatePropagation() {
- this.cancelBubble = true;
- }
- composedPath() {
- const composedPath = [];
- let currentElement = this.target;
- while (currentElement) {
- composedPath.push(currentElement);
- if (!currentElement.parentElement && currentElement.nodeName === "#document" /* DOCUMENT_NODE */) {
- // the current element doesn't have a parent, but we've detected it's our root document node. push the window
- // object associated with the document onto the path
- composedPath.push(currentElement.defaultView);
- break;
- }
- currentElement = currentElement.parentElement;
- }
- return composedPath;
- }
- }
- class MockCustomEvent extends MockEvent {
- constructor(type, customEventInitDic) {
- super(type);
- this.detail = null;
- if (customEventInitDic != null) {
- Object.assign(this, customEventInitDic);
- }
- }
- }
- class MockKeyboardEvent extends MockEvent {
- constructor(type, keyboardEventInitDic) {
- super(type);
- this.code = '';
- this.key = '';
- this.altKey = false;
- this.ctrlKey = false;
- this.metaKey = false;
- this.shiftKey = false;
- this.location = 0;
- this.repeat = false;
- if (keyboardEventInitDic != null) {
- Object.assign(this, keyboardEventInitDic);
- }
- }
- }
- class MockMouseEvent extends MockEvent {
- constructor(type, mouseEventInitDic) {
- super(type);
- this.screenX = 0;
- this.screenY = 0;
- this.clientX = 0;
- this.clientY = 0;
- this.ctrlKey = false;
- this.shiftKey = false;
- this.altKey = false;
- this.metaKey = false;
- this.button = 0;
- this.buttons = 0;
- this.relatedTarget = null;
- if (mouseEventInitDic != null) {
- Object.assign(this, mouseEventInitDic);
- }
- }
- }
- class MockEventListener {
- constructor(type, handler) {
- this.type = type;
- this.handler = handler;
- }
- }
- function addEventListener(elm, type, handler) {
- const target = elm;
- if (target.__listeners == null) {
- target.__listeners = [];
- }
- target.__listeners.push(new MockEventListener(type, handler));
- }
- function removeEventListener(elm, type, handler) {
- const target = elm;
- if (target != null && Array.isArray(target.__listeners) === true) {
- const elmListener = target.__listeners.find((e) => e.type === type && e.handler === handler);
- if (elmListener != null) {
- const index = target.__listeners.indexOf(elmListener);
- target.__listeners.splice(index, 1);
- }
- }
- }
- function resetEventListeners(target) {
- if (target != null && target.__listeners != null) {
- target.__listeners = null;
- }
- }
- function triggerEventListener(elm, ev) {
- if (elm == null || ev.cancelBubble === true) {
- return;
- }
- const target = elm;
- ev.currentTarget = elm;
- if (Array.isArray(target.__listeners) === true) {
- const listeners = target.__listeners.filter((e) => e.type === ev.type);
- listeners.forEach((listener) => {
- try {
- listener.handler.call(target, ev);
- }
- catch (err) {
- console.error(err);
- }
- });
- }
- if (ev.bubbles === false) {
- return;
- }
- if (elm.nodeName === "#document" /* DOCUMENT_NODE */) {
- triggerEventListener(elm.defaultView, ev);
- }
- else {
- triggerEventListener(elm.parentElement, ev);
- }
- }
- function dispatchEvent(currentTarget, ev) {
- ev.target = currentTarget;
- triggerEventListener(currentTarget, ev);
- return true;
- }
- function serializeNodeToHtml(elm, opts = {}) {
- const output = {
- currentLineWidth: 0,
- indent: 0,
- isWithinBody: false,
- text: [],
- };
- if (opts.prettyHtml) {
- if (typeof opts.indentSpaces !== 'number') {
- opts.indentSpaces = 2;
- }
- if (typeof opts.newLines !== 'boolean') {
- opts.newLines = true;
- }
- opts.approximateLineWidth = -1;
- }
- else {
- opts.prettyHtml = false;
- if (typeof opts.newLines !== 'boolean') {
- opts.newLines = false;
- }
- if (typeof opts.indentSpaces !== 'number') {
- opts.indentSpaces = 0;
- }
- }
- if (typeof opts.approximateLineWidth !== 'number') {
- opts.approximateLineWidth = -1;
- }
- if (typeof opts.removeEmptyAttributes !== 'boolean') {
- opts.removeEmptyAttributes = true;
- }
- if (typeof opts.removeAttributeQuotes !== 'boolean') {
- opts.removeAttributeQuotes = false;
- }
- if (typeof opts.removeBooleanAttributeQuotes !== 'boolean') {
- opts.removeBooleanAttributeQuotes = false;
- }
- if (typeof opts.removeHtmlComments !== 'boolean') {
- opts.removeHtmlComments = false;
- }
- if (typeof opts.serializeShadowRoot !== 'boolean') {
- opts.serializeShadowRoot = false;
- }
- if (opts.outerHtml) {
- serializeToHtml(elm, opts, output, false);
- }
- else {
- for (let i = 0, ii = elm.childNodes.length; i < ii; i++) {
- serializeToHtml(elm.childNodes[i], opts, output, false);
- }
- }
- if (output.text[0] === '\n') {
- output.text.shift();
- }
- if (output.text[output.text.length - 1] === '\n') {
- output.text.pop();
- }
- return output.text.join('');
- }
- function serializeToHtml(node, opts, output, isShadowRoot) {
- if (node.nodeType === 1 /* ELEMENT_NODE */ || isShadowRoot) {
- const tagName = isShadowRoot ? 'mock:shadow-root' : getTagName(node);
- if (tagName === 'body') {
- output.isWithinBody = true;
- }
- const ignoreTag = opts.excludeTags != null && opts.excludeTags.includes(tagName);
- if (ignoreTag === false) {
- const isWithinWhitespaceSensitiveNode = opts.newLines || opts.indentSpaces > 0 ? isWithinWhitespaceSensitive(node) : false;
- if (opts.newLines && !isWithinWhitespaceSensitiveNode) {
- output.text.push('\n');
- output.currentLineWidth = 0;
- }
- if (opts.indentSpaces > 0 && !isWithinWhitespaceSensitiveNode) {
- for (let i = 0; i < output.indent; i++) {
- output.text.push(' ');
- }
- output.currentLineWidth += output.indent;
- }
- output.text.push('<' + tagName);
- output.currentLineWidth += tagName.length + 1;
- const attrsLength = node.attributes.length;
- const attributes = opts.prettyHtml && attrsLength > 1
- ? cloneAttributes(node.attributes, true)
- : node.attributes;
- for (let i = 0; i < attrsLength; i++) {
- const attr = attributes.item(i);
- const attrName = attr.name;
- if (attrName === 'style') {
- continue;
- }
- let attrValue = attr.value;
- if (opts.removeEmptyAttributes && attrValue === '' && REMOVE_EMPTY_ATTR.has(attrName)) {
- continue;
- }
- const attrNamespaceURI = attr.namespaceURI;
- if (attrNamespaceURI == null) {
- output.currentLineWidth += attrName.length + 1;
- if (opts.approximateLineWidth > 0 && output.currentLineWidth > opts.approximateLineWidth) {
- output.text.push('\n' + attrName);
- output.currentLineWidth = 0;
- }
- else {
- output.text.push(' ' + attrName);
- }
- }
- else if (attrNamespaceURI === 'http://www.w3.org/XML/1998/namespace') {
- output.text.push(' xml:' + attrName);
- output.currentLineWidth += attrName.length + 5;
- }
- else if (attrNamespaceURI === 'http://www.w3.org/2000/xmlns/') {
- if (attrName !== 'xmlns') {
- output.text.push(' xmlns:' + attrName);
- output.currentLineWidth += attrName.length + 7;
- }
- else {
- output.text.push(' ' + attrName);
- output.currentLineWidth += attrName.length + 1;
- }
- }
- else if (attrNamespaceURI === XLINK_NS) {
- output.text.push(' xlink:' + attrName);
- output.currentLineWidth += attrName.length + 7;
- }
- else {
- output.text.push(' ' + attrNamespaceURI + ':' + attrName);
- output.currentLineWidth += attrNamespaceURI.length + attrName.length + 2;
- }
- if (opts.prettyHtml && attrName === 'class') {
- attrValue = attr.value = attrValue
- .split(' ')
- .filter((t) => t !== '')
- .sort()
- .join(' ')
- .trim();
- }
- if (attrValue === '') {
- if (opts.removeBooleanAttributeQuotes && BOOLEAN_ATTR.has(attrName)) {
- continue;
- }
- if (opts.removeEmptyAttributes && attrName.startsWith('data-')) {
- continue;
- }
- }
- if (opts.removeAttributeQuotes && CAN_REMOVE_ATTR_QUOTES.test(attrValue)) {
- output.text.push('=' + escapeString(attrValue, true));
- output.currentLineWidth += attrValue.length + 1;
- }
- else {
- output.text.push('="' + escapeString(attrValue, true) + '"');
- output.currentLineWidth += attrValue.length + 3;
- }
- }
- if (node.hasAttribute('style')) {
- const cssText = node.style.cssText;
- if (opts.approximateLineWidth > 0 &&
- output.currentLineWidth + cssText.length + 10 > opts.approximateLineWidth) {
- output.text.push(`\nstyle="${cssText}">`);
- output.currentLineWidth = 0;
- }
- else {
- output.text.push(` style="${cssText}">`);
- output.currentLineWidth += cssText.length + 10;
- }
- }
- else {
- output.text.push('>');
- output.currentLineWidth += 1;
- }
- }
- if (EMPTY_ELEMENTS.has(tagName) === false) {
- if (opts.serializeShadowRoot && node.shadowRoot != null) {
- output.indent = output.indent + opts.indentSpaces;
- serializeToHtml(node.shadowRoot, opts, output, true);
- output.indent = output.indent - opts.indentSpaces;
- if (opts.newLines &&
- (node.childNodes.length === 0 ||
- (node.childNodes.length === 1 &&
- node.childNodes[0].nodeType === 3 /* TEXT_NODE */ &&
- node.childNodes[0].nodeValue.trim() === ''))) {
- output.text.push('\n');
- output.currentLineWidth = 0;
- for (let i = 0; i < output.indent; i++) {
- output.text.push(' ');
- }
- output.currentLineWidth += output.indent;
- }
- }
- if (opts.excludeTagContent == null || opts.excludeTagContent.includes(tagName) === false) {
- const childNodes = tagName === 'template' ? node.content.childNodes : node.childNodes;
- const childNodeLength = childNodes.length;
- if (childNodeLength > 0) {
- if (childNodeLength === 1 &&
- childNodes[0].nodeType === 3 /* TEXT_NODE */ &&
- (typeof childNodes[0].nodeValue !== 'string' || childNodes[0].nodeValue.trim() === '')) ;
- else {
- const isWithinWhitespaceSensitiveNode = opts.newLines || opts.indentSpaces > 0 ? isWithinWhitespaceSensitive(node) : false;
- if (!isWithinWhitespaceSensitiveNode && opts.indentSpaces > 0 && ignoreTag === false) {
- output.indent = output.indent + opts.indentSpaces;
- }
- for (let i = 0; i < childNodeLength; i++) {
- serializeToHtml(childNodes[i], opts, output, false);
- }
- if (ignoreTag === false) {
- if (opts.newLines && !isWithinWhitespaceSensitiveNode) {
- output.text.push('\n');
- output.currentLineWidth = 0;
- }
- if (opts.indentSpaces > 0 && !isWithinWhitespaceSensitiveNode) {
- output.indent = output.indent - opts.indentSpaces;
- for (let i = 0; i < output.indent; i++) {
- output.text.push(' ');
- }
- output.currentLineWidth += output.indent;
- }
- }
- }
- }
- if (ignoreTag === false) {
- output.text.push('</' + tagName + '>');
- output.currentLineWidth += tagName.length + 3;
- }
- }
- }
- if (opts.approximateLineWidth > 0 && STRUCTURE_ELEMENTS.has(tagName)) {
- output.text.push('\n');
- output.currentLineWidth = 0;
- }
- if (tagName === 'body') {
- output.isWithinBody = false;
- }
- }
- else if (node.nodeType === 3 /* TEXT_NODE */) {
- let textContent = node.nodeValue;
- if (typeof textContent === 'string') {
- const trimmedTextContent = textContent.trim();
- if (trimmedTextContent === '') {
- // this text node is whitespace only
- if (isWithinWhitespaceSensitive(node)) {
- // whitespace matters within this element
- // just add the exact text we were given
- output.text.push(textContent);
- output.currentLineWidth += textContent.length;
- }
- else if (opts.approximateLineWidth > 0 && !output.isWithinBody) ;
- else if (!opts.prettyHtml) {
- // this text node is only whitespace, and it's not
- // within a whitespace sensitive element like <pre> or <code>
- // so replace the entire white space with a single new line
- output.currentLineWidth += 1;
- if (opts.approximateLineWidth > 0 && output.currentLineWidth > opts.approximateLineWidth) {
- // good enough for a new line
- // for perf these are all just estimates
- // we don't care to ensure exact line lengths
- output.text.push('\n');
- output.currentLineWidth = 0;
- }
- else {
- // let's keep it all on the same line yet
- output.text.push(' ');
- }
- }
- }
- else {
- // this text node has text content
- const isWithinWhitespaceSensitiveNode = opts.newLines || opts.indentSpaces > 0 || opts.prettyHtml ? isWithinWhitespaceSensitive(node) : false;
- if (opts.newLines && !isWithinWhitespaceSensitiveNode) {
- output.text.push('\n');
- output.currentLineWidth = 0;
- }
- if (opts.indentSpaces > 0 && !isWithinWhitespaceSensitiveNode) {
- for (let i = 0; i < output.indent; i++) {
- output.text.push(' ');
- }
- output.currentLineWidth += output.indent;
- }
- let textContentLength = textContent.length;
- if (textContentLength > 0) {
- // this text node has text content
- const parentTagName = node.parentNode != null && node.parentNode.nodeType === 1 /* ELEMENT_NODE */
- ? node.parentNode.nodeName
- : null;
- if (NON_ESCAPABLE_CONTENT.has(parentTagName)) {
- // this text node cannot have its content escaped since it's going
- // into an element like <style> or <script>
- if (isWithinWhitespaceSensitive(node)) {
- output.text.push(textContent);
- }
- else {
- output.text.push(trimmedTextContent);
- textContentLength = trimmedTextContent.length;
- }
- output.currentLineWidth += textContentLength;
- }
- else {
- // this text node is going into a normal element and html can be escaped
- if (opts.prettyHtml && !isWithinWhitespaceSensitiveNode) {
- // pretty print the text node
- output.text.push(escapeString(textContent.replace(/\s\s+/g, ' ').trim(), false));
- output.currentLineWidth += textContentLength;
- }
- else {
- // not pretty printing the text node
- if (isWithinWhitespaceSensitive(node)) {
- output.currentLineWidth += textContentLength;
- }
- else {
- // this element is not a whitespace sensitive one, like <pre> or <code> so
- // any whitespace at the start and end can be cleaned up to just be one space
- if (/\s/.test(textContent.charAt(0))) {
- textContent = ' ' + textContent.trimLeft();
- }
- textContentLength = textContent.length;
- if (textContentLength > 1) {
- if (/\s/.test(textContent.charAt(textContentLength - 1))) {
- if (opts.approximateLineWidth > 0 &&
- output.currentLineWidth + textContentLength > opts.approximateLineWidth) {
- textContent = textContent.trimRight() + '\n';
- output.currentLineWidth = 0;
- }
- else {
- textContent = textContent.trimRight() + ' ';
- }
- }
- }
- output.currentLineWidth += textContentLength;
- }
- output.text.push(escapeString(textContent, false));
- }
- }
- }
- }
- }
- }
- else if (node.nodeType === 8 /* COMMENT_NODE */) {
- const nodeValue = node.nodeValue;
- if (opts.removeHtmlComments) {
- const isHydrateAnnotation = nodeValue.startsWith(CONTENT_REF_ID + '.') ||
- nodeValue.startsWith(ORG_LOCATION_ID + '.') ||
- nodeValue.startsWith(SLOT_NODE_ID + '.') ||
- nodeValue.startsWith(TEXT_NODE_ID + '.');
- if (!isHydrateAnnotation) {
- return;
- }
- }
- const isWithinWhitespaceSensitiveNode = opts.newLines || opts.indentSpaces > 0 ? isWithinWhitespaceSensitive(node) : false;
- if (opts.newLines && !isWithinWhitespaceSensitiveNode) {
- output.text.push('\n');
- output.currentLineWidth = 0;
- }
- if (opts.indentSpaces > 0 && !isWithinWhitespaceSensitiveNode) {
- for (let i = 0; i < output.indent; i++) {
- output.text.push(' ');
- }
- output.currentLineWidth += output.indent;
- }
- output.text.push('<!--' + nodeValue + '-->');
- output.currentLineWidth += nodeValue.length + 7;
- }
- else if (node.nodeType === 10 /* DOCUMENT_TYPE_NODE */) {
- output.text.push('<!doctype html>');
- }
- }
- const AMP_REGEX = /&/g;
- const NBSP_REGEX = /\u00a0/g;
- const DOUBLE_QUOTE_REGEX = /"/g;
- const LT_REGEX = /</g;
- const GT_REGEX = />/g;
- const CAN_REMOVE_ATTR_QUOTES = /^[^ \t\n\f\r"'`=<>\/\\-]+$/;
- function getTagName(element) {
- if (element.namespaceURI === 'http://www.w3.org/1999/xhtml') {
- return element.nodeName.toLowerCase();
- }
- else {
- return element.nodeName;
- }
- }
- function escapeString(str, attrMode) {
- str = str.replace(AMP_REGEX, '&').replace(NBSP_REGEX, ' ');
- if (attrMode) {
- return str.replace(DOUBLE_QUOTE_REGEX, '"');
- }
- return str.replace(LT_REGEX, '<').replace(GT_REGEX, '>');
- }
- function isWithinWhitespaceSensitive(node) {
- while (node != null) {
- if (WHITESPACE_SENSITIVE.has(node.nodeName)) {
- return true;
- }
- node = node.parentNode;
- }
- return false;
- }
- /*@__PURE__*/ const NON_ESCAPABLE_CONTENT = new Set([
- 'STYLE',
- 'SCRIPT',
- 'IFRAME',
- 'NOSCRIPT',
- 'XMP',
- 'NOEMBED',
- 'NOFRAMES',
- 'PLAINTEXT',
- ]);
- /*@__PURE__*/ const WHITESPACE_SENSITIVE = new Set([
- 'CODE',
- 'OUTPUT',
- 'PLAINTEXT',
- 'PRE',
- 'SCRIPT',
- 'TEMPLATE',
- 'TEXTAREA',
- ]);
- /*@__PURE__*/ const EMPTY_ELEMENTS = new Set([
- 'area',
- 'base',
- 'basefont',
- 'bgsound',
- 'br',
- 'col',
- 'embed',
- 'frame',
- 'hr',
- 'img',
- 'input',
- 'keygen',
- 'link',
- 'meta',
- 'param',
- 'source',
- 'trace',
- 'wbr',
- ]);
- /*@__PURE__*/ const REMOVE_EMPTY_ATTR = new Set(['class', 'dir', 'id', 'lang', 'name', 'title']);
- /*@__PURE__*/ const BOOLEAN_ATTR = new Set([
- 'allowfullscreen',
- 'async',
- 'autofocus',
- 'autoplay',
- 'checked',
- 'compact',
- 'controls',
- 'declare',
- 'default',
- 'defaultchecked',
- 'defaultmuted',
- 'defaultselected',
- 'defer',
- 'disabled',
- 'enabled',
- 'formnovalidate',
- 'hidden',
- 'indeterminate',
- 'inert',
- 'ismap',
- 'itemscope',
- 'loop',
- 'multiple',
- 'muted',
- 'nohref',
- 'nomodule',
- 'noresize',
- 'noshade',
- 'novalidate',
- 'nowrap',
- 'open',
- 'pauseonexit',
- 'readonly',
- 'required',
- 'reversed',
- 'scoped',
- 'seamless',
- 'selected',
- 'sortable',
- 'truespeed',
- 'typemustmatch',
- 'visible',
- ]);
- /*@__PURE__*/ const STRUCTURE_ELEMENTS = new Set([
- 'html',
- 'body',
- 'head',
- 'iframe',
- 'meta',
- 'link',
- 'base',
- 'title',
- 'script',
- 'style',
- ]);
- // Parse5 6.0.1
- const e=function(e){const t=[65534,65535,131070,131071,196606,196607,262142,262143,327678,327679,393214,393215,458750,458751,524286,524287,589822,589823,655358,655359,720894,720895,786430,786431,851966,851967,917502,917503,983038,983039,1048574,1048575,1114110,1114111];var n="�",s={EOF:-1,NULL:0,TABULATION:9,CARRIAGE_RETURN:13,LINE_FEED:10,FORM_FEED:12,SPACE:32,EXCLAMATION_MARK:33,QUOTATION_MARK:34,NUMBER_SIGN:35,AMPERSAND:38,APOSTROPHE:39,HYPHEN_MINUS:45,SOLIDUS:47,DIGIT_0:48,DIGIT_9:57,SEMICOLON:59,LESS_THAN_SIGN:60,EQUALS_SIGN:61,GREATER_THAN_SIGN:62,QUESTION_MARK:63,LATIN_CAPITAL_A:65,LATIN_CAPITAL_F:70,LATIN_CAPITAL_X:88,LATIN_CAPITAL_Z:90,RIGHT_SQUARE_BRACKET:93,GRAVE_ACCENT:96,LATIN_SMALL_A:97,LATIN_SMALL_F:102,LATIN_SMALL_X:120,LATIN_SMALL_Z:122,REPLACEMENT_CHARACTER:65533},r=function(e){return e>=55296&&e<=57343},i=function(e){return 32!==e&&10!==e&&13!==e&&9!==e&&12!==e&&e>=1&&e<=31||e>=127&&e<=159},o=function(e){return e>=64976&&e<=65007||t.indexOf(e)>-1},a="unexpected-null-character",T="invalid-first-character-of-tag-name",E="missing-semicolon-after-character-reference",h="eof-before-tag-name",c="eof-in-tag",_="missing-whitespace-after-doctype-public-keyword",l="missing-whitespace-between-doctype-public-and-system-identifiers",m="missing-whitespace-after-doctype-system-keyword",p="missing-quote-before-doctype-public-identifier",A="missing-quote-before-doctype-system-identifier",u="missing-doctype-public-identifier",N="missing-doctype-system-identifier",d="abrupt-doctype-public-identifier",C="abrupt-doctype-system-identifier",O="eof-in-script-html-comment-like-text",f="eof-in-doctype",S="abrupt-closing-of-empty-comment",R="eof-in-comment",I="absence-of-digits-in-numeric-character-reference",L="end-tag-without-matching-open-element",k="misplaced-start-tag-for-head-element";const M=s;var g=new Uint16Array([4,52,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,97,98,99,100,101,102,103,104,105,106,107,108,109,110,111,112,113,114,115,116,117,118,119,120,121,122,106,303,412,810,1432,1701,1796,1987,2114,2360,2420,2484,3170,3251,4140,4393,4575,4610,5106,5512,5728,6117,6274,6315,6345,6427,6516,7002,7910,8733,9323,9870,10170,10631,10893,11318,11386,11467,12773,13092,14474,14922,15448,15542,16419,17666,18166,18611,19004,19095,19298,19397,4,16,69,77,97,98,99,102,103,108,109,110,111,112,114,115,116,117,140,150,158,169,176,194,199,210,216,222,226,242,256,266,283,294,108,105,103,5,198,1,59,148,1,198,80,5,38,1,59,156,1,38,99,117,116,101,5,193,1,59,167,1,193,114,101,118,101,59,1,258,4,2,105,121,182,191,114,99,5,194,1,59,189,1,194,59,1,1040,114,59,3,55349,56580,114,97,118,101,5,192,1,59,208,1,192,112,104,97,59,1,913,97,99,114,59,1,256,100,59,1,10835,4,2,103,112,232,237,111,110,59,1,260,102,59,3,55349,56632,112,108,121,70,117,110,99,116,105,111,110,59,1,8289,105,110,103,5,197,1,59,264,1,197,4,2,99,115,272,277,114,59,3,55349,56476,105,103,110,59,1,8788,105,108,100,101,5,195,1,59,292,1,195,109,108,5,196,1,59,301,1,196,4,8,97,99,101,102,111,114,115,117,321,350,354,383,388,394,400,405,4,2,99,114,327,336,107,115,108,97,115,104,59,1,8726,4,2,118,119,342,345,59,1,10983,101,100,59,1,8966,121,59,1,1041,4,3,99,114,116,362,369,379,97,117,115,101,59,1,8757,110,111,117,108,108,105,115,59,1,8492,97,59,1,914,114,59,3,55349,56581,112,102,59,3,55349,56633,101,118,101,59,1,728,99,114,59,1,8492,109,112,101,113,59,1,8782,4,14,72,79,97,99,100,101,102,104,105,108,111,114,115,117,442,447,456,504,542,547,569,573,577,616,678,784,790,796,99,121,59,1,1063,80,89,5,169,1,59,454,1,169,4,3,99,112,121,464,470,497,117,116,101,59,1,262,4,2,59,105,476,478,1,8914,116,97,108,68,105,102,102,101,114,101,110,116,105,97,108,68,59,1,8517,108,101,121,115,59,1,8493,4,4,97,101,105,111,514,520,530,535,114,111,110,59,1,268,100,105,108,5,199,1,59,528,1,199,114,99,59,1,264,110,105,110,116,59,1,8752,111,116,59,1,266,4,2,100,110,553,560,105,108,108,97,59,1,184,116,101,114,68,111,116,59,1,183,114,59,1,8493,105,59,1,935,114,99,108,101,4,4,68,77,80,84,591,596,603,609,111,116,59,1,8857,105,110,117,115,59,1,8854,108,117,115,59,1,8853,105,109,101,115,59,1,8855,111,4,2,99,115,623,646,107,119,105,115,101,67,111,110,116,111,117,114,73,110,116,101,103,114,97,108,59,1,8754,101,67,117,114,108,121,4,2,68,81,658,671,111,117,98,108,101,81,117,111,116,101,59,1,8221,117,111,116,101,59,1,8217,4,4,108,110,112,117,688,701,736,753,111,110,4,2,59,101,696,698,1,8759,59,1,10868,4,3,103,105,116,709,717,722,114,117,101,110,116,59,1,8801,110,116,59,1,8751,111,117,114,73,110,116,101,103,114,97,108,59,1,8750,4,2,102,114,742,745,59,1,8450,111,100,117,99,116,59,1,8720,110,116,101,114,67,108,111,99,107,119,105,115,101,67,111,110,116,111,117,114,73,110,116,101,103,114,97,108,59,1,8755,111,115,115,59,1,10799,99,114,59,3,55349,56478,112,4,2,59,67,803,805,1,8915,97,112,59,1,8781,4,11,68,74,83,90,97,99,101,102,105,111,115,834,850,855,860,865,888,903,916,921,1011,1415,4,2,59,111,840,842,1,8517,116,114,97,104,100,59,1,10513,99,121,59,1,1026,99,121,59,1,1029,99,121,59,1,1039,4,3,103,114,115,873,879,883,103,101,114,59,1,8225,114,59,1,8609,104,118,59,1,10980,4,2,97,121,894,900,114,111,110,59,1,270,59,1,1044,108,4,2,59,116,910,912,1,8711,97,59,1,916,114,59,3,55349,56583,4,2,97,102,927,998,4,2,99,109,933,992,114,105,116,105,99,97,108,4,4,65,68,71,84,950,957,978,985,99,117,116,101,59,1,180,111,4,2,116,117,964,967,59,1,729,98,108,101,65,99,117,116,101,59,1,733,114,97,118,101,59,1,96,105,108,100,101,59,1,732,111,110,100,59,1,8900,102,101,114,101,110,116,105,97,108,68,59,1,8518,4,4,112,116,117,119,1021,1026,1048,1249,102,59,3,55349,56635,4,3,59,68,69,1034,1036,1041,1,168,111,116,59,1,8412,113,117,97,108,59,1,8784,98,108,101,4,6,67,68,76,82,85,86,1065,1082,1101,1189,1211,1236,111,110,116,111,117,114,73,110,116,101,103,114,97,108,59,1,8751,111,4,2,116,119,1089,1092,59,1,168,110,65,114,114,111,119,59,1,8659,4,2,101,111,1107,1141,102,116,4,3,65,82,84,1117,1124,1136,114,114,111,119,59,1,8656,105,103,104,116,65,114,114,111,119,59,1,8660,101,101,59,1,10980,110,103,4,2,76,82,1149,1177,101,102,116,4,2,65,82,1158,1165,114,114,111,119,59,1,10232,105,103,104,116,65,114,114,111,119,59,1,10234,105,103,104,116,65,114,114,111,119,59,1,10233,105,103,104,116,4,2,65,84,1199,1206,114,114,111,119,59,1,8658,101,101,59,1,8872,112,4,2,65,68,1218,1225,114,114,111,119,59,1,8657,111,119,110,65,114,114,111,119,59,1,8661,101,114,116,105,99,97,108,66,97,114,59,1,8741,110,4,6,65,66,76,82,84,97,1264,1292,1299,1352,1391,1408,114,114,111,119,4,3,59,66,85,1276,1278,1283,1,8595,97,114,59,1,10515,112,65,114,114,111,119,59,1,8693,114,101,118,101,59,1,785,101,102,116,4,3,82,84,86,1310,1323,1334,105,103,104,116,86,101,99,116,111,114,59,1,10576,101,101,86,101,99,116,111,114,59,1,10590,101,99,116,111,114,4,2,59,66,1345,1347,1,8637,97,114,59,1,10582,105,103,104,116,4,2,84,86,1362,1373,101,101,86,101,99,116,111,114,59,1,10591,101,99,116,111,114,4,2,59,66,1384,1386,1,8641,97,114,59,1,10583,101,101,4,2,59,65,1399,1401,1,8868,114,114,111,119,59,1,8615,114,114,111,119,59,1,8659,4,2,99,116,1421,1426,114,59,3,55349,56479,114,111,107,59,1,272,4,16,78,84,97,99,100,102,103,108,109,111,112,113,115,116,117,120,1466,1470,1478,1489,1515,1520,1525,1536,1544,1593,1609,1617,1650,1664,1668,1677,71,59,1,330,72,5,208,1,59,1476,1,208,99,117,116,101,5,201,1,59,1487,1,201,4,3,97,105,121,1497,1503,1512,114,111,110,59,1,282,114,99,5,202,1,59,1510,1,202,59,1,1069,111,116,59,1,278,114,59,3,55349,56584,114,97,118,101,5,200,1,59,1534,1,200,101,109,101,110,116,59,1,8712,4,2,97,112,1550,1555,99,114,59,1,274,116,121,4,2,83,86,1563,1576,109,97,108,108,83,113,117,97,114,101,59,1,9723,101,114,121,83,109,97,108,108,83,113,117,97,114,101,59,1,9643,4,2,103,112,1599,1604,111,110,59,1,280,102,59,3,55349,56636,115,105,108,111,110,59,1,917,117,4,2,97,105,1624,1640,108,4,2,59,84,1631,1633,1,10869,105,108,100,101,59,1,8770,108,105,98,114,105,117,109,59,1,8652,4,2,99,105,1656,1660,114,59,1,8496,109,59,1,10867,97,59,1,919,109,108,5,203,1,59,1675,1,203,4,2,105,112,1683,1689,115,116,115,59,1,8707,111,110,101,110,116,105,97,108,69,59,1,8519,4,5,99,102,105,111,115,1713,1717,1722,1762,1791,121,59,1,1060,114,59,3,55349,56585,108,108,101,100,4,2,83,86,1732,1745,109,97,108,108,83,113,117,97,114,101,59,1,9724,101,114,121,83,109,97,108,108,83,113,117,97,114,101,59,1,9642,4,3,112,114,117,1770,1775,1781,102,59,3,55349,56637,65,108,108,59,1,8704,114,105,101,114,116,114,102,59,1,8497,99,114,59,1,8497,4,12,74,84,97,98,99,100,102,103,111,114,115,116,1822,1827,1834,1848,1855,1877,1882,1887,1890,1896,1978,1984,99,121,59,1,1027,5,62,1,59,1832,1,62,109,109,97,4,2,59,100,1843,1845,1,915,59,1,988,114,101,118,101,59,1,286,4,3,101,105,121,1863,1869,1874,100,105,108,59,1,290,114,99,59,1,284,59,1,1043,111,116,59,1,288,114,59,3,55349,56586,59,1,8921,112,102,59,3,55349,56638,101,97,116,101,114,4,6,69,70,71,76,83,84,1915,1933,1944,1953,1959,1971,113,117,97,108,4,2,59,76,1925,1927,1,8805,101,115,115,59,1,8923,117,108,108,69,113,117,97,108,59,1,8807,114,101,97,116,101,114,59,1,10914,101,115,115,59,1,8823,108,97,110,116,69,113,117,97,108,59,1,10878,105,108,100,101,59,1,8819,99,114,59,3,55349,56482,59,1,8811,4,8,65,97,99,102,105,111,115,117,2005,2012,2026,2032,2036,2049,2073,2089,82,68,99,121,59,1,1066,4,2,99,116,2018,2023,101,107,59,1,711,59,1,94,105,114,99,59,1,292,114,59,1,8460,108,98,101,114,116,83,112,97,99,101,59,1,8459,4,2,112,114,2055,2059,102,59,1,8461,105,122,111,110,116,97,108,76,105,110,101,59,1,9472,4,2,99,116,2079,2083,114,59,1,8459,114,111,107,59,1,294,109,112,4,2,68,69,2097,2107,111,119,110,72,117,109,112,59,1,8782,113,117,97,108,59,1,8783,4,14,69,74,79,97,99,100,102,103,109,110,111,115,116,117,2144,2149,2155,2160,2171,2189,2194,2198,2209,2245,2307,2329,2334,2341,99,121,59,1,1045,108,105,103,59,1,306,99,121,59,1,1025,99,117,116,101,5,205,1,59,2169,1,205,4,2,105,121,2177,2186,114,99,5,206,1,59,2184,1,206,59,1,1048,111,116,59,1,304,114,59,1,8465,114,97,118,101,5,204,1,59,2207,1,204,4,3,59,97,112,2217,2219,2238,1,8465,4,2,99,103,2225,2229,114,59,1,298,105,110,97,114,121,73,59,1,8520,108,105,101,115,59,1,8658,4,2,116,118,2251,2281,4,2,59,101,2257,2259,1,8748,4,2,103,114,2265,2271,114,97,108,59,1,8747,115,101,99,116,105,111,110,59,1,8898,105,115,105,98,108,101,4,2,67,84,2293,2300,111,109,109,97,59,1,8291,105,109,101,115,59,1,8290,4,3,103,112,116,2315,2320,2325,111,110,59,1,302,102,59,3,55349,56640,97,59,1,921,99,114,59,1,8464,105,108,100,101,59,1,296,4,2,107,109,2347,2352,99,121,59,1,1030,108,5,207,1,59,2358,1,207,4,5,99,102,111,115,117,2372,2386,2391,2397,2414,4,2,105,121,2378,2383,114,99,59,1,308,59,1,1049,114,59,3,55349,56589,112,102,59,3,55349,56641,4,2,99,101,2403,2408,114,59,3,55349,56485,114,99,121,59,1,1032,107,99,121,59,1,1028,4,7,72,74,97,99,102,111,115,2436,2441,2446,2452,2467,2472,2478,99,121,59,1,1061,99,121,59,1,1036,112,112,97,59,1,922,4,2,101,121,2458,2464,100,105,108,59,1,310,59,1,1050,114,59,3,55349,56590,112,102,59,3,55349,56642,99,114,59,3,55349,56486,4,11,74,84,97,99,101,102,108,109,111,115,116,2508,2513,2520,2562,2585,2981,2986,3004,3011,3146,3167,99,121,59,1,1033,5,60,1,59,2518,1,60,4,5,99,109,110,112,114,2532,2538,2544,2548,2558,117,116,101,59,1,313,98,100,97,59,1,923,103,59,1,10218,108,97,99,101,116,114,102,59,1,8466,114,59,1,8606,4,3,97,101,121,2570,2576,2582,114,111,110,59,1,317,100,105,108,59,1,315,59,1,1051,4,2,102,115,2591,2907,116,4,10,65,67,68,70,82,84,85,86,97,114,2614,2663,2672,2728,2735,2760,2820,2870,2888,2895,4,2,110,114,2620,2633,103,108,101,66,114,97,99,107,101,116,59,1,10216,114,111,119,4,3,59,66,82,2644,2646,2651,1,8592,97,114,59,1,8676,105,103,104,116,65,114,114,111,119,59,1,8646,101,105,108,105,110,103,59,1,8968,111,4,2,117,119,2679,2692,98,108,101,66,114,97,99,107,101,116,59,1,10214,110,4,2,84,86,2699,2710,101,101,86,101,99,116,111,114,59,1,10593,101,99,116,111,114,4,2,59,66,2721,2723,1,8643,97,114,59,1,10585,108,111,111,114,59,1,8970,105,103,104,116,4,2,65,86,2745,2752,114,114,111,119,59,1,8596,101,99,116,111,114,59,1,10574,4,2,101,114,2766,2792,101,4,3,59,65,86,2775,2777,2784,1,8867,114,114,111,119,59,1,8612,101,99,116,111,114,59,1,10586,105,97,110,103,108,101,4,3,59,66,69,2806,2808,2813,1,8882,97,114,59,1,10703,113,117,97,108,59,1,8884,112,4,3,68,84,86,2829,2841,2852,111,119,110,86,101,99,116,111,114,59,1,10577,101,101,86,101,99,116,111,114,59,1,10592,101,99,116,111,114,4,2,59,66,2863,2865,1,8639,97,114,59,1,10584,101,99,116,111,114,4,2,59,66,2881,2883,1,8636,97,114,59,1,10578,114,114,111,119,59,1,8656,105,103,104,116,97,114,114,111,119,59,1,8660,115,4,6,69,70,71,76,83,84,2922,2936,2947,2956,2962,2974,113,117,97,108,71,114,101,97,116,101,114,59,1,8922,117,108,108,69,113,117,97,108,59,1,8806,114,101,97,116,101,114,59,1,8822,101,115,115,59,1,10913,108,97,110,116,69,113,117,97,108,59,1,10877,105,108,100,101,59,1,8818,114,59,3,55349,56591,4,2,59,101,2992,2994,1,8920,102,116,97,114,114,111,119,59,1,8666,105,100,111,116,59,1,319,4,3,110,112,119,3019,3110,3115,103,4,4,76,82,108,114,3030,3058,3070,3098,101,102,116,4,2,65,82,3039,3046,114,114,111,119,59,1,10229,105,103,104,116,65,114,114,111,119,59,1,10231,105,103,104,116,65,114,114,111,119,59,1,10230,101,102,116,4,2,97,114,3079,3086,114,114,111,119,59,1,10232,105,103,104,116,97,114,114,111,119,59,1,10234,105,103,104,116,97,114,114,111,119,59,1,10233,102,59,3,55349,56643,101,114,4,2,76,82,3123,3134,101,102,116,65,114,114,111,119,59,1,8601,105,103,104,116,65,114,114,111,119,59,1,8600,4,3,99,104,116,3154,3158,3161,114,59,1,8466,59,1,8624,114,111,107,59,1,321,59,1,8810,4,8,97,99,101,102,105,111,115,117,3188,3192,3196,3222,3227,3237,3243,3248,112,59,1,10501,121,59,1,1052,4,2,100,108,3202,3213,105,117,109,83,112,97,99,101,59,1,8287,108,105,110,116,114,102,59,1,8499,114,59,3,55349,56592,110,117,115,80,108,117,115,59,1,8723,112,102,59,3,55349,56644,99,114,59,1,8499,59,1,924,4,9,74,97,99,101,102,111,115,116,117,3271,3276,3283,3306,3422,3427,4120,4126,4137,99,121,59,1,1034,99,117,116,101,59,1,323,4,3,97,101,121,3291,3297,3303,114,111,110,59,1,327,100,105,108,59,1,325,59,1,1053,4,3,103,115,119,3314,3380,3415,97,116,105,118,101,4,3,77,84,86,3327,3340,3365,101,100,105,117,109,83,112,97,99,101,59,1,8203,104,105,4,2,99,110,3348,3357,107,83,112,97,99,101,59,1,8203,83,112,97,99,101,59,1,8203,101,114,121,84,104,105,110,83,112,97,99,101,59,1,8203,116,101,100,4,2,71,76,3389,3405,114,101,97,116,101,114,71,114,101,97,116,101,114,59,1,8811,101,115,115,76,101,115,115,59,1,8810,76,105,110,101,59,1,10,114,59,3,55349,56593,4,4,66,110,112,116,3437,3444,3460,3464,114,101,97,107,59,1,8288,66,114,101,97,107,105,110,103,83,112,97,99,101,59,1,160,102,59,1,8469,4,13,59,67,68,69,71,72,76,78,80,82,83,84,86,3492,3494,3517,3536,3578,3657,3685,3784,3823,3860,3915,4066,4107,1,10988,4,2,111,117,3500,3510,110,103,114,117,101,110,116,59,1,8802,112,67,97,112,59,1,8813,111,117,98,108,101,86,101,114,116,105,99,97,108,66,97,114,59,1,8742,4,3,108,113,120,3544,3552,3571,101,109,101,110,116,59,1,8713,117,97,108,4,2,59,84,3561,3563,1,8800,105,108,100,101,59,3,8770,824,105,115,116,115,59,1,8708,114,101,97,116,101,114,4,7,59,69,70,71,76,83,84,3600,3602,3609,3621,3631,3637,3650,1,8815,113,117,97,108,59,1,8817,117,108,108,69,113,117,97,108,59,3,8807,824,114,101,97,116,101,114,59,3,8811,824,101,115,115,59,1,8825,108,97,110,116,69,113,117,97,108,59,3,10878,824,105,108,100,101,59,1,8821,117,109,112,4,2,68,69,3666,3677,111,119,110,72,117,109,112,59,3,8782,824,113,117,97,108,59,3,8783,824,101,4,2,102,115,3692,3724,116,84,114,105,97,110,103,108,101,4,3,59,66,69,3709,3711,3717,1,8938,97,114,59,3,10703,824,113,117,97,108,59,1,8940,115,4,6,59,69,71,76,83,84,3739,3741,3748,3757,3764,3777,1,8814,113,117,97,108,59,1,8816,114,101,97,116,101,114,59,1,8824,101,115,115,59,3,8810,824,108,97,110,116,69,113,117,97,108,59,3,10877,824,105,108,100,101,59,1,8820,101,115,116,101,100,4,2,71,76,3795,3812,114,101,97,116,101,114,71,114,101,97,116,101,114,59,3,10914,824,101,115,115,76,101,115,115,59,3,10913,824,114,101,99,101,100,101,115,4,3,59,69,83,3838,3840,3848,1,8832,113,117,97,108,59,3,10927,824,108,97,110,116,69,113,117,97,108,59,1,8928,4,2,101,105,3866,3881,118,101,114,115,101,69,108,101,109,101,110,116,59,1,8716,103,104,116,84,114,105,97,110,103,108,101,4,3,59,66,69,3900,3902,3908,1,8939,97,114,59,3,10704,824,113,117,97,108,59,1,8941,4,2,113,117,3921,3973,117,97,114,101,83,117,4,2,98,112,3933,3952,115,101,116,4,2,59,69,3942,3945,3,8847,824,113,117,97,108,59,1,8930,101,114,115,101,116,4,2,59,69,3963,3966,3,8848,824,113,117,97,108,59,1,8931,4,3,98,99,112,3981,4e3,4045,115,101,116,4,2,59,69,3990,3993,3,8834,8402,113,117,97,108,59,1,8840,99,101,101,100,115,4,4,59,69,83,84,4015,4017,4025,4037,1,8833,113,117,97,108,59,3,10928,824,108,97,110,116,69,113,117,97,108,59,1,8929,105,108,100,101,59,3,8831,824,101,114,115,101,116,4,2,59,69,4056,4059,3,8835,8402,113,117,97,108,59,1,8841,105,108,100,101,4,4,59,69,70,84,4080,4082,4089,4100,1,8769,113,117,97,108,59,1,8772,117,108,108,69,113,117,97,108,59,1,8775,105,108,100,101,59,1,8777,101,114,116,105,99,97,108,66,97,114,59,1,8740,99,114,59,3,55349,56489,105,108,100,101,5,209,1,59,4135,1,209,59,1,925,4,14,69,97,99,100,102,103,109,111,112,114,115,116,117,118,4170,4176,4187,4205,4212,4217,4228,4253,4259,4292,4295,4316,4337,4346,108,105,103,59,1,338,99,117,116,101,5,211,1,59,4185,1,211,4,2,105,121,4193,4202,114,99,5,212,1,59,4200,1,212,59,1,1054,98,108,97,99,59,1,336,114,59,3,55349,56594,114,97,118,101,5,210,1,59,4226,1,210,4,3,97,101,105,4236,4241,4246,99,114,59,1,332,103,97,59,1,937,99,114,111,110,59,1,927,112,102,59,3,55349,56646,101,110,67,117,114,108,121,4,2,68,81,4272,4285,111,117,98,108,101,81,117,111,116,101,59,1,8220,117,111,116,101,59,1,8216,59,1,10836,4,2,99,108,4301,4306,114,59,3,55349,56490,97,115,104,5,216,1,59,4314,1,216,105,4,2,108,109,4323,4332,100,101,5,213,1,59,4330,1,213,101,115,59,1,10807,109,108,5,214,1,59,4344,1,214,101,114,4,2,66,80,4354,4380,4,2,97,114,4360,4364,114,59,1,8254,97,99,4,2,101,107,4372,4375,59,1,9182,101,116,59,1,9140,97,114,101,110,116,104,101,115,105,115,59,1,9180,4,9,97,99,102,104,105,108,111,114,115,4413,4422,4426,4431,4435,4438,4448,4471,4561,114,116,105,97,108,68,59,1,8706,121,59,1,1055,114,59,3,55349,56595,105,59,1,934,59,1,928,117,115,77,105,110,117,115,59,1,177,4,2,105,112,4454,4467,110,99,97,114,101,112,108,97,110,101,59,1,8460,102,59,1,8473,4,4,59,101,105,111,4481,4483,4526,4531,1,10939,99,101,100,101,115,4,4,59,69,83,84,4498,4500,4507,4519,1,8826,113,117,97,108,59,1,10927,108,97,110,116,69,113,117,97,108,59,1,8828,105,108,100,101,59,1,8830,109,101,59,1,8243,4,2,100,112,4537,4543,117,99,116,59,1,8719,111,114,116,105,111,110,4,2,59,97,4555,4557,1,8759,108,59,1,8733,4,2,99,105,4567,4572,114,59,3,55349,56491,59,1,936,4,4,85,102,111,115,4585,4594,4599,4604,79,84,5,34,1,59,4592,1,34,114,59,3,55349,56596,112,102,59,1,8474,99,114,59,3,55349,56492,4,12,66,69,97,99,101,102,104,105,111,114,115,117,4636,4642,4650,4681,4704,4763,4767,4771,5047,5069,5081,5094,97,114,114,59,1,10512,71,5,174,1,59,4648,1,174,4,3,99,110,114,4658,4664,4668,117,116,101,59,1,340,103,59,1,10219,114,4,2,59,116,4675,4677,1,8608,108,59,1,10518,4,3,97,101,121,4689,4695,4701,114,111,110,59,1,344,100,105,108,59,1,342,59,1,1056,4,2,59,118,4710,4712,1,8476,101,114,115,101,4,2,69,85,4722,4748,4,2,108,113,4728,4736,101,109,101,110,116,59,1,8715,117,105,108,105,98,114,105,117,109,59,1,8651,112,69,113,117,105,108,105,98,114,105,117,109,59,1,10607,114,59,1,8476,111,59,1,929,103,104,116,4,8,65,67,68,70,84,85,86,97,4792,4840,4849,4905,4912,4972,5022,5040,4,2,110,114,4798,4811,103,108,101,66,114,97,99,107,101,116,59,1,10217,114,111,119,4,3,59,66,76,4822,4824,4829,1,8594,97,114,59,1,8677,101,102,116,65,114,114,111,119,59,1,8644,101,105,108,105,110,103,59,1,8969,111,4,2,117,119,4856,4869,98,108,101,66,114,97,99,107,101,116,59,1,10215,110,4,2,84,86,4876,4887,101,101,86,101,99,116,111,114,59,1,10589,101,99,116,111,114,4,2,59,66,4898,4900,1,8642,97,114,59,1,10581,108,111,111,114,59,1,8971,4,2,101,114,4918,4944,101,4,3,59,65,86,4927,4929,4936,1,8866,114,114,111,119,59,1,8614,101,99,116,111,114,59,1,10587,105,97,110,103,108,101,4,3,59,66,69,4958,4960,4965,1,8883,97,114,59,1,10704,113,117,97,108,59,1,8885,112,4,3,68,84,86,4981,4993,5004,111,119,110,86,101,99,116,111,114,59,1,10575,101,101,86,101,99,116,111,114,59,1,10588,101,99,116,111,114,4,2,59,66,5015,5017,1,8638,97,114,59,1,10580,101,99,116,111,114,4,2,59,66,5033,5035,1,8640,97,114,59,1,10579,114,114,111,119,59,1,8658,4,2,112,117,5053,5057,102,59,1,8477,110,100,73,109,112,108,105,101,115,59,1,10608,105,103,104,116,97,114,114,111,119,59,1,8667,4,2,99,104,5087,5091,114,59,1,8475,59,1,8625,108,101,68,101,108,97,121,101,100,59,1,10740,4,13,72,79,97,99,102,104,105,109,111,113,115,116,117,5134,5150,5157,5164,5198,5203,5259,5265,5277,5283,5374,5380,5385,4,2,67,99,5140,5146,72,99,121,59,1,1065,121,59,1,1064,70,84,99,121,59,1,1068,99,117,116,101,59,1,346,4,5,59,97,101,105,121,5176,5178,5184,5190,5195,1,10940,114,111,110,59,1,352,100,105,108,59,1,350,114,99,59,1,348,59,1,1057,114,59,3,55349,56598,111,114,116,4,4,68,76,82,85,5216,5227,5238,5250,111,119,110,65,114,114,111,119,59,1,8595,101,102,116,65,114,114,111,119,59,1,8592,105,103,104,116,65,114,114,111,119,59,1,8594,112,65,114,114,111,119,59,1,8593,103,109,97,59,1,931,97,108,108,67,105,114,99,108,101,59,1,8728,112,102,59,3,55349,56650,4,2,114,117,5289,5293,116,59,1,8730,97,114,101,4,4,59,73,83,85,5306,5308,5322,5367,1,9633,110,116,101,114,115,101,99,116,105,111,110,59,1,8851,117,4,2,98,112,5329,5347,115,101,116,4,2,59,69,5338,5340,1,8847,113,117,97,108,59,1,8849,101,114,115,101,116,4,2,59,69,5358,5360,1,8848,113,117,97,108,59,1,8850,110,105,111,110,59,1,8852,99,114,59,3,55349,56494,97,114,59,1,8902,4,4,98,99,109,112,5395,5420,5475,5478,4,2,59,115,5401,5403,1,8912,101,116,4,2,59,69,5411,5413,1,8912,113,117,97,108,59,1,8838,4,2,99,104,5426,5468,101,101,100,115,4,4,59,69,83,84,5440,5442,5449,5461,1,8827,113,117,97,108,59,1,10928,108,97,110,116,69,113,117,97,108,59,1,8829,105,108,100,101,59,1,8831,84,104,97,116,59,1,8715,59,1,8721,4,3,59,101,115,5486,5488,5507,1,8913,114,115,101,116,4,2,59,69,5498,5500,1,8835,113,117,97,108,59,1,8839,101,116,59,1,8913,4,11,72,82,83,97,99,102,104,105,111,114,115,5536,5546,5552,5567,5579,5602,5607,5655,5695,5701,5711,79,82,78,5,222,1,59,5544,1,222,65,68,69,59,1,8482,4,2,72,99,5558,5563,99,121,59,1,1035,121,59,1,1062,4,2,98,117,5573,5576,59,1,9,59,1,932,4,3,97,101,121,5587,5593,5599,114,111,110,59,1,356,100,105,108,59,1,354,59,1,1058,114,59,3,55349,56599,4,2,101,105,5613,5631,4,2,114,116,5619,5627,101,102,111,114,101,59,1,8756,97,59,1,920,4,2,99,110,5637,5647,107,83,112,97,99,101,59,3,8287,8202,83,112,97,99,101,59,1,8201,108,100,101,4,4,59,69,70,84,5668,5670,5677,5688,1,8764,113,117,97,108,59,1,8771,117,108,108,69,113,117,97,108,59,1,8773,105,108,100,101,59,1,8776,112,102,59,3,55349,56651,105,112,108,101,68,111,116,59,1,8411,4,2,99,116,5717,5722,114,59,3,55349,56495,114,111,107,59,1,358,4,14,97,98,99,100,102,103,109,110,111,112,114,115,116,117,5758,5789,5805,5823,5830,5835,5846,5852,5921,5937,6089,6095,6101,6108,4,2,99,114,5764,5774,117,116,101,5,218,1,59,5772,1,218,114,4,2,59,111,5781,5783,1,8607,99,105,114,59,1,10569,114,4,2,99,101,5796,5800,121,59,1,1038,118,101,59,1,364,4,2,105,121,5811,5820,114,99,5,219,1,59,5818,1,219,59,1,1059,98,108,97,99,59,1,368,114,59,3,55349,56600,114,97,118,101,5,217,1,59,5844,1,217,97,99,114,59,1,362,4,2,100,105,5858,5905,101,114,4,2,66,80,5866,5892,4,2,97,114,5872,5876,114,59,1,95,97,99,4,2,101,107,5884,5887,59,1,9183,101,116,59,1,9141,97,114,101,110,116,104,101,115,105,115,59,1,9181,111,110,4,2,59,80,5913,5915,1,8899,108,117,115,59,1,8846,4,2,103,112,5927,5932,111,110,59,1,370,102,59,3,55349,56652,4,8,65,68,69,84,97,100,112,115,5955,5985,5996,6009,6026,6033,6044,6075,114,114,111,119,4,3,59,66,68,5967,5969,5974,1,8593,97,114,59,1,10514,111,119,110,65,114,114,111,119,59,1,8645,111,119,110,65,114,114,111,119,59,1,8597,113,117,105,108,105,98,114,105,117,109,59,1,10606,101,101,4,2,59,65,6017,6019,1,8869,114,114,111,119,59,1,8613,114,114,111,119,59,1,8657,111,119,110,97,114,114,111,119,59,1,8661,101,114,4,2,76,82,6052,6063,101,102,116,65,114,114,111,119,59,1,8598,105,103,104,116,65,114,114,111,119,59,1,8599,105,4,2,59,108,6082,6084,1,978,111,110,59,1,933,105,110,103,59,1,366,99,114,59,3,55349,56496,105,108,100,101,59,1,360,109,108,5,220,1,59,6115,1,220,4,9,68,98,99,100,101,102,111,115,118,6137,6143,6148,6152,6166,6250,6255,6261,6267,97,115,104,59,1,8875,97,114,59,1,10987,121,59,1,1042,97,115,104,4,2,59,108,6161,6163,1,8873,59,1,10982,4,2,101,114,6172,6175,59,1,8897,4,3,98,116,121,6183,6188,6238,97,114,59,1,8214,4,2,59,105,6194,6196,1,8214,99,97,108,4,4,66,76,83,84,6209,6214,6220,6231,97,114,59,1,8739,105,110,101,59,1,124,101,112,97,114,97,116,111,114,59,1,10072,105,108,100,101,59,1,8768,84,104,105,110,83,112,97,99,101,59,1,8202,114,59,3,55349,56601,112,102,59,3,55349,56653,99,114,59,3,55349,56497,100,97,115,104,59,1,8874,4,5,99,101,102,111,115,6286,6292,6298,6303,6309,105,114,99,59,1,372,100,103,101,59,1,8896,114,59,3,55349,56602,112,102,59,3,55349,56654,99,114,59,3,55349,56498,4,4,102,105,111,115,6325,6330,6333,6339,114,59,3,55349,56603,59,1,926,112,102,59,3,55349,56655,99,114,59,3,55349,56499,4,9,65,73,85,97,99,102,111,115,117,6365,6370,6375,6380,6391,6405,6410,6416,6422,99,121,59,1,1071,99,121,59,1,1031,99,121,59,1,1070,99,117,116,101,5,221,1,59,6389,1,221,4,2,105,121,6397,6402,114,99,59,1,374,59,1,1067,114,59,3,55349,56604,112,102,59,3,55349,56656,99,114,59,3,55349,56500,109,108,59,1,376,4,8,72,97,99,100,101,102,111,115,6445,6450,6457,6472,6477,6501,6505,6510,99,121,59,1,1046,99,117,116,101,59,1,377,4,2,97,121,6463,6469,114,111,110,59,1,381,59,1,1047,111,116,59,1,379,4,2,114,116,6483,6497,111,87,105,100,116,104,83,112,97,99,101,59,1,8203,97,59,1,918,114,59,1,8488,112,102,59,1,8484,99,114,59,3,55349,56501,4,16,97,98,99,101,102,103,108,109,110,111,112,114,115,116,117,119,6550,6561,6568,6612,6622,6634,6645,6672,6699,6854,6870,6923,6933,6963,6974,6983,99,117,116,101,5,225,1,59,6559,1,225,114,101,118,101,59,1,259,4,6,59,69,100,105,117,121,6582,6584,6588,6591,6600,6609,1,8766,59,3,8766,819,59,1,8767,114,99,5,226,1,59,6598,1,226,116,101,5,180,1,59,6607,1,180,59,1,1072,108,105,103,5,230,1,59,6620,1,230,4,2,59,114,6628,6630,1,8289,59,3,55349,56606,114,97,118,101,5,224,1,59,6643,1,224,4,2,101,112,6651,6667,4,2,102,112,6657,6663,115,121,109,59,1,8501,104,59,1,8501,104,97,59,1,945,4,2,97,112,6678,6692,4,2,99,108,6684,6688,114,59,1,257,103,59,1,10815,5,38,1,59,6697,1,38,4,2,100,103,6705,6737,4,5,59,97,100,115,118,6717,6719,6724,6727,6734,1,8743,110,100,59,1,10837,59,1,10844,108,111,112,101,59,1,10840,59,1,10842,4,7,59,101,108,109,114,115,122,6753,6755,6758,6762,6814,6835,6848,1,8736,59,1,10660,101,59,1,8736,115,100,4,2,59,97,6770,6772,1,8737,4,8,97,98,99,100,101,102,103,104,6790,6793,6796,6799,6802,6805,6808,6811,59,1,10664,59,1,10665,59,1,10666,59,1,10667,59,1,10668,59,1,10669,59,1,10670,59,1,10671,116,4,2,59,118,6821,6823,1,8735,98,4,2,59,100,6830,6832,1,8894,59,1,10653,4,2,112,116,6841,6845,104,59,1,8738,59,1,197,97,114,114,59,1,9084,4,2,103,112,6860,6865,111,110,59,1,261,102,59,3,55349,56658,4,7,59,69,97,101,105,111,112,6886,6888,6891,6897,6900,6904,6908,1,8776,59,1,10864,99,105,114,59,1,10863,59,1,8778,100,59,1,8779,115,59,1,39,114,111,120,4,2,59,101,6917,6919,1,8776,113,59,1,8778,105,110,103,5,229,1,59,6931,1,229,4,3,99,116,121,6941,6946,6949,114,59,3,55349,56502,59,1,42,109,112,4,2,59,101,6957,6959,1,8776,113,59,1,8781,105,108,100,101,5,227,1,59,6972,1,227,109,108,5,228,1,59,6981,1,228,4,2,99,105,6989,6997,111,110,105,110,116,59,1,8755,110,116,59,1,10769,4,16,78,97,98,99,100,101,102,105,107,108,110,111,112,114,115,117,7036,7041,7119,7135,7149,7155,7219,7224,7347,7354,7463,7489,7786,7793,7814,7866,111,116,59,1,10989,4,2,99,114,7047,7094,107,4,4,99,101,112,115,7058,7064,7073,7080,111,110,103,59,1,8780,112,115,105,108,111,110,59,1,1014,114,105,109,101,59,1,8245,105,109,4,2,59,101,7088,7090,1,8765,113,59,1,8909,4,2,118,119,7100,7105,101,101,59,1,8893,101,100,4,2,59,103,7113,7115,1,8965,101,59,1,8965,114,107,4,2,59,116,7127,7129,1,9141,98,114,107,59,1,9142,4,2,111,121,7141,7146,110,103,59,1,8780,59,1,1073,113,117,111,59,1,8222,4,5,99,109,112,114,116,7167,7181,7188,7193,7199,97,117,115,4,2,59,101,7176,7178,1,8757,59,1,8757,112,116,121,118,59,1,10672,115,105,59,1,1014,110,111,117,59,1,8492,4,3,97,104,119,7207,7210,7213,59,1,946,59,1,8502,101,101,110,59,1,8812,114,59,3,55349,56607,103,4,7,99,111,115,116,117,118,119,7241,7262,7288,7305,7328,7335,7340,4,3,97,105,117,7249,7253,7258,112,59,1,8898,114,99,59,1,9711,112,59,1,8899,4,3,100,112,116,7270,7275,7281,111,116,59,1,10752,108,117,115,59,1,10753,105,109,101,115,59,1,10754,4,2,113,116,7294,7300,99,117,112,59,1,10758,97,114,59,1,9733,114,105,97,110,103,108,101,4,2,100,117,7318,7324,111,119,110,59,1,9661,112,59,1,9651,112,108,117,115,59,1,10756,101,101,59,1,8897,101,100,103,101,59,1,8896,97,114,111,119,59,1,10509,4,3,97,107,111,7362,7436,7458,4,2,99,110,7368,7432,107,4,3,108,115,116,7377,7386,7394,111,122,101,110,103,101,59,1,10731,113,117,97,114,101,59,1,9642,114,105,97,110,103,108,101,4,4,59,100,108,114,7411,7413,7419,7425,1,9652,111,119,110,59,1,9662,101,102,116,59,1,9666,105,103,104,116,59,1,9656,107,59,1,9251,4,2,49,51,7442,7454,4,2,50,52,7448,7451,59,1,9618,59,1,9617,52,59,1,9619,99,107,59,1,9608,4,2,101,111,7469,7485,4,2,59,113,7475,7478,3,61,8421,117,105,118,59,3,8801,8421,116,59,1,8976,4,4,112,116,119,120,7499,7504,7517,7523,102,59,3,55349,56659,4,2,59,116,7510,7512,1,8869,111,109,59,1,8869,116,105,101,59,1,8904,4,12,68,72,85,86,98,100,104,109,112,116,117,118,7549,7571,7597,7619,7655,7660,7682,7708,7715,7721,7728,7750,4,4,76,82,108,114,7559,7562,7565,7568,59,1,9559,59,1,9556,59,1,9558,59,1,9555,4,5,59,68,85,100,117,7583,7585,7588,7591,7594,1,9552,59,1,9574,59,1,9577,59,1,9572,59,1,9575,4,4,76,82,108,114,7607,7610,7613,7616,59,1,9565,59,1,9562,59,1,9564,59,1,9561,4,7,59,72,76,82,104,108,114,7635,7637,7640,7643,7646,7649,7652,1,9553,59,1,9580,59,1,9571,59,1,9568,59,1,9579,59,1,9570,59,1,9567,111,120,59,1,10697,4,4,76,82,108,114,7670,7673,7676,7679,59,1,9557,59,1,9554,59,1,9488,59,1,9484,4,5,59,68,85,100,117,7694,7696,7699,7702,7705,1,9472,59,1,9573,59,1,9576,59,1,9516,59,1,9524,105,110,117,115,59,1,8863,108,117,115,59,1,8862,105,109,101,115,59,1,8864,4,4,76,82,108,114,7738,7741,7744,7747,59,1,9563,59,1,9560,59,1,9496,59,1,9492,4,7,59,72,76,82,104,108,114,7766,7768,7771,7774,7777,7780,7783,1,9474,59,1,9578,59,1,9569,59,1,9566,59,1,9532,59,1,9508,59,1,9500,114,105,109,101,59,1,8245,4,2,101,118,7799,7804,118,101,59,1,728,98,97,114,5,166,1,59,7812,1,166,4,4,99,101,105,111,7824,7829,7834,7846,114,59,3,55349,56503,109,105,59,1,8271,109,4,2,59,101,7841,7843,1,8765,59,1,8909,108,4,3,59,98,104,7855,7857,7860,1,92,59,1,10693,115,117,98,59,1,10184,4,2,108,109,7872,7885,108,4,2,59,101,7879,7881,1,8226,116,59,1,8226,112,4,3,59,69,101,7894,7896,7899,1,8782,59,1,10926,4,2,59,113,7905,7907,1,8783,59,1,8783,4,15,97,99,100,101,102,104,105,108,111,114,115,116,117,119,121,7942,8021,8075,8080,8121,8126,8157,8279,8295,8430,8446,8485,8491,8707,8726,4,3,99,112,114,7950,7956,8007,117,116,101,59,1,263,4,6,59,97,98,99,100,115,7970,7972,7977,7984,7998,8003,1,8745,110,100,59,1,10820,114,99,117,112,59,1,10825,4,2,97,117,7990,7994,112,59,1,10827,112,59,1,10823,111,116,59,1,10816,59,3,8745,65024,4,2,101,111,8013,8017,116,59,1,8257,110,59,1,711,4,4,97,101,105,117,8031,8046,8056,8061,4,2,112,114,8037,8041,115,59,1,10829,111,110,59,1,269,100,105,108,5,231,1,59,8054,1,231,114,99,59,1,265,112,115,4,2,59,115,8069,8071,1,10828,109,59,1,10832,111,116,59,1,267,4,3,100,109,110,8088,8097,8104,105,108,5,184,1,59,8095,1,184,112,116,121,118,59,1,10674,116,5,162,2,59,101,8112,8114,1,162,114,100,111,116,59,1,183,114,59,3,55349,56608,4,3,99,101,105,8134,8138,8154,121,59,1,1095,99,107,4,2,59,109,8146,8148,1,10003,97,114,107,59,1,10003,59,1,967,114,4,7,59,69,99,101,102,109,115,8174,8176,8179,8258,8261,8268,8273,1,9675,59,1,10691,4,3,59,101,108,8187,8189,8193,1,710,113,59,1,8791,101,4,2,97,100,8200,8223,114,114,111,119,4,2,108,114,8210,8216,101,102,116,59,1,8634,105,103,104,116,59,1,8635,4,5,82,83,97,99,100,8235,8238,8241,8246,8252,59,1,174,59,1,9416,115,116,59,1,8859,105,114,99,59,1,8858,97,115,104,59,1,8861,59,1,8791,110,105,110,116,59,1,10768,105,100,59,1,10991,99,105,114,59,1,10690,117,98,115,4,2,59,117,8288,8290,1,9827,105,116,59,1,9827,4,4,108,109,110,112,8305,8326,8376,8400,111,110,4,2,59,101,8313,8315,1,58,4,2,59,113,8321,8323,1,8788,59,1,8788,4,2,109,112,8332,8344,97,4,2,59,116,8339,8341,1,44,59,1,64,4,3,59,102,108,8352,8354,8358,1,8705,110,59,1,8728,101,4,2,109,120,8365,8371,101,110,116,59,1,8705,101,115,59,1,8450,4,2,103,105,8382,8395,4,2,59,100,8388,8390,1,8773,111,116,59,1,10861,110,116,59,1,8750,4,3,102,114,121,8408,8412,8417,59,3,55349,56660,111,100,59,1,8720,5,169,2,59,115,8424,8426,1,169,114,59,1,8471,4,2,97,111,8436,8441,114,114,59,1,8629,115,115,59,1,10007,4,2,99,117,8452,8457,114,59,3,55349,56504,4,2,98,112,8463,8474,4,2,59,101,8469,8471,1,10959,59,1,10961,4,2,59,101,8480,8482,1,10960,59,1,10962,100,111,116,59,1,8943,4,7,100,101,108,112,114,118,119,8507,8522,8536,8550,8600,8697,8702,97,114,114,4,2,108,114,8516,8519,59,1,10552,59,1,10549,4,2,112,115,8528,8532,114,59,1,8926,99,59,1,8927,97,114,114,4,2,59,112,8545,8547,1,8630,59,1,10557,4,6,59,98,99,100,111,115,8564,8566,8573,8587,8592,8596,1,8746,114,99,97,112,59,1,10824,4,2,97,117,8579,8583,112,59,1,10822,112,59,1,10826,111,116,59,1,8845,114,59,1,10821,59,3,8746,65024,4,4,97,108,114,118,8610,8623,8663,8672,114,114,4,2,59,109,8618,8620,1,8631,59,1,10556,121,4,3,101,118,119,8632,8651,8656,113,4,2,112,115,8639,8645,114,101,99,59,1,8926,117,99,99,59,1,8927,101,101,59,1,8910,101,100,103,101,59,1,8911,101,110,5,164,1,59,8670,1,164,101,97,114,114,111,119,4,2,108,114,8684,8690,101,102,116,59,1,8630,105,103,104,116,59,1,8631,101,101,59,1,8910,101,100,59,1,8911,4,2,99,105,8713,8721,111,110,105,110,116,59,1,8754,110,116,59,1,8753,108,99,116,121,59,1,9005,4,19,65,72,97,98,99,100,101,102,104,105,106,108,111,114,115,116,117,119,122,8773,8778,8783,8821,8839,8854,8887,8914,8930,8944,9036,9041,9058,9197,9227,9258,9281,9297,9305,114,114,59,1,8659,97,114,59,1,10597,4,4,103,108,114,115,8793,8799,8805,8809,103,101,114,59,1,8224,101,116,104,59,1,8504,114,59,1,8595,104,4,2,59,118,8816,8818,1,8208,59,1,8867,4,2,107,108,8827,8834,97,114,111,119,59,1,10511,97,99,59,1,733,4,2,97,121,8845,8851,114,111,110,59,1,271,59,1,1076,4,3,59,97,111,8862,8864,8880,1,8518,4,2,103,114,8870,8876,103,101,114,59,1,8225,114,59,1,8650,116,115,101,113,59,1,10871,4,3,103,108,109,8895,8902,8907,5,176,1,59,8900,1,176,116,97,59,1,948,112,116,121,118,59,1,10673,4,2,105,114,8920,8926,115,104,116,59,1,10623,59,3,55349,56609,97,114,4,2,108,114,8938,8941,59,1,8643,59,1,8642,4,5,97,101,103,115,118,8956,8986,8989,8996,9001,109,4,3,59,111,115,8965,8967,8983,1,8900,110,100,4,2,59,115,8975,8977,1,8900,117,105,116,59,1,9830,59,1,9830,59,1,168,97,109,109,97,59,1,989,105,110,59,1,8946,4,3,59,105,111,9009,9011,9031,1,247,100,101,5,247,2,59,111,9020,9022,1,247,110,116,105,109,101,115,59,1,8903,110,120,59,1,8903,99,121,59,1,1106,99,4,2,111,114,9048,9053,114,110,59,1,8990,111,112,59,1,8973,4,5,108,112,116,117,119,9070,9076,9081,9130,9144,108,97,114,59,1,36,102,59,3,55349,56661,4,5,59,101,109,112,115,9093,9095,9109,9116,9122,1,729,113,4,2,59,100,9102,9104,1,8784,111,116,59,1,8785,105,110,117,115,59,1,8760,108,117,115,59,1,8724,113,117,97,114,101,59,1,8865,98,108,101,98,97,114,119,101,100,103,101,59,1,8966,110,4,3,97,100,104,9153,9160,9172,114,114,111,119,59,1,8595,111,119,110,97,114,114,111,119,115,59,1,8650,97,114,112,111,111,110,4,2,108,114,9184,9190,101,102,116,59,1,8643,105,103,104,116,59,1,8642,4,2,98,99,9203,9211,107,97,114,111,119,59,1,10512,4,2,111,114,9217,9222,114,110,59,1,8991,111,112,59,1,8972,4,3,99,111,116,9235,9248,9252,4,2,114,121,9241,9245,59,3,55349,56505,59,1,1109,108,59,1,10742,114,111,107,59,1,273,4,2,100,114,9264,9269,111,116,59,1,8945,105,4,2,59,102,9276,9278,1,9663,59,1,9662,4,2,97,104,9287,9292,114,114,59,1,8693,97,114,59,1,10607,97,110,103,108,101,59,1,10662,4,2,99,105,9311,9315,121,59,1,1119,103,114,97,114,114,59,1,10239,4,18,68,97,99,100,101,102,103,108,109,110,111,112,113,114,115,116,117,120,9361,9376,9398,9439,9444,9447,9462,9495,9531,9585,9598,9614,9659,9755,9771,9792,9808,9826,4,2,68,111,9367,9372,111,116,59,1,10871,116,59,1,8785,4,2,99,115,9382,9392,117,116,101,5,233,1,59,9390,1,233,116,101,114,59,1,10862,4,4,97,105,111,121,9408,9414,9430,9436,114,111,110,59,1,283,114,4,2,59,99,9421,9423,1,8790,5,234,1,59,9428,1,234,108,111,110,59,1,8789,59,1,1101,111,116,59,1,279,59,1,8519,4,2,68,114,9453,9458,111,116,59,1,8786,59,3,55349,56610,4,3,59,114,115,9470,9472,9482,1,10906,97,118,101,5,232,1,59,9480,1,232,4,2,59,100,9488,9490,1,10902,111,116,59,1,10904,4,4,59,105,108,115,9505,9507,9515,9518,1,10905,110,116,101,114,115,59,1,9191,59,1,8467,4,2,59,100,9524,9526,1,10901,111,116,59,1,10903,4,3,97,112,115,9539,9544,9564,99,114,59,1,275,116,121,4,3,59,115,118,9554,9556,9561,1,8709,101,116,59,1,8709,59,1,8709,112,4,2,49,59,9571,9583,4,2,51,52,9577,9580,59,1,8196,59,1,8197,1,8195,4,2,103,115,9591,9594,59,1,331,112,59,1,8194,4,2,103,112,9604,9609,111,110,59,1,281,102,59,3,55349,56662,4,3,97,108,115,9622,9635,9640,114,4,2,59,115,9629,9631,1,8917,108,59,1,10723,117,115,59,1,10865,105,4,3,59,108,118,9649,9651,9656,1,949,111,110,59,1,949,59,1,1013,4,4,99,115,117,118,9669,9686,9716,9747,4,2,105,111,9675,9680,114,99,59,1,8790,108,111,110,59,1,8789,4,2,105,108,9692,9696,109,59,1,8770,97,110,116,4,2,103,108,9705,9710,116,114,59,1,10902,101,115,115,59,1,10901,4,3,97,101,105,9724,9729,9734,108,115,59,1,61,115,116,59,1,8799,118,4,2,59,68,9741,9743,1,8801,68,59,1,10872,112,97,114,115,108,59,1,10725,4,2,68,97,9761,9766,111,116,59,1,8787,114,114,59,1,10609,4,3,99,100,105,9779,9783,9788,114,59,1,8495,111,116,59,1,8784,109,59,1,8770,4,2,97,104,9798,9801,59,1,951,5,240,1,59,9806,1,240,4,2,109,114,9814,9822,108,5,235,1,59,9820,1,235,111,59,1,8364,4,3,99,105,112,9834,9838,9843,108,59,1,33,115,116,59,1,8707,4,2,101,111,9849,9859,99,116,97,116,105,111,110,59,1,8496,110,101,110,116,105,97,108,101,59,1,8519,4,12,97,99,101,102,105,106,108,110,111,112,114,115,9896,9910,9914,9921,9954,9960,9967,9989,9994,10027,10036,10164,108,108,105,110,103,100,111,116,115,101,113,59,1,8786,121,59,1,1092,109,97,108,101,59,1,9792,4,3,105,108,114,9929,9935,9950,108,105,103,59,1,64259,4,2,105,108,9941,9945,103,59,1,64256,105,103,59,1,64260,59,3,55349,56611,108,105,103,59,1,64257,108,105,103,59,3,102,106,4,3,97,108,116,9975,9979,9984,116,59,1,9837,105,103,59,1,64258,110,115,59,1,9649,111,102,59,1,402,4,2,112,114,1e4,10005,102,59,3,55349,56663,4,2,97,107,10011,10016,108,108,59,1,8704,4,2,59,118,10022,10024,1,8916,59,1,10969,97,114,116,105,110,116,59,1,10765,4,2,97,111,10042,10159,4,2,99,115,10048,10155,4,6,49,50,51,52,53,55,10062,10102,10114,10135,10139,10151,4,6,50,51,52,53,54,56,10076,10083,10086,10093,10096,10099,5,189,1,59,10081,1,189,59,1,8531,5,188,1,59,10091,1,188,59,1,8533,59,1,8537,59,1,8539,4,2,51,53,10108,10111,59,1,8532,59,1,8534,4,3,52,53,56,10122,10129,10132,5,190,1,59,10127,1,190,59,1,8535,59,1,8540,53,59,1,8536,4,2,54,56,10145,10148,59,1,8538,59,1,8541,56,59,1,8542,108,59,1,8260,119,110,59,1,8994,99,114,59,3,55349,56507,4,17,69,97,98,99,100,101,102,103,105,106,108,110,111,114,115,116,118,10206,10217,10247,10254,10268,10273,10358,10363,10374,10380,10385,10406,10458,10464,10470,10497,10610,4,2,59,108,10212,10214,1,8807,59,1,10892,4,3,99,109,112,10225,10231,10244,117,116,101,59,1,501,109,97,4,2,59,100,10239,10241,1,947,59,1,989,59,1,10886,114,101,118,101,59,1,287,4,2,105,121,10260,10265,114,99,59,1,285,59,1,1075,111,116,59,1,289,4,4,59,108,113,115,10283,10285,10288,10308,1,8805,59,1,8923,4,3,59,113,115,10296,10298,10301,1,8805,59,1,8807,108,97,110,116,59,1,10878,4,4,59,99,100,108,10318,10320,10324,10345,1,10878,99,59,1,10921,111,116,4,2,59,111,10332,10334,1,10880,4,2,59,108,10340,10342,1,10882,59,1,10884,4,2,59,101,10351,10354,3,8923,65024,115,59,1,10900,114,59,3,55349,56612,4,2,59,103,10369,10371,1,8811,59,1,8921,109,101,108,59,1,8503,99,121,59,1,1107,4,4,59,69,97,106,10395,10397,10400,10403,1,8823,59,1,10898,59,1,10917,59,1,10916,4,4,69,97,101,115,10416,10419,10434,10453,59,1,8809,112,4,2,59,112,10426,10428,1,10890,114,111,120,59,1,10890,4,2,59,113,10440,10442,1,10888,4,2,59,113,10448,10450,1,10888,59,1,8809,105,109,59,1,8935,112,102,59,3,55349,56664,97,118,101,59,1,96,4,2,99,105,10476,10480,114,59,1,8458,109,4,3,59,101,108,10489,10491,10494,1,8819,59,1,10894,59,1,10896,5,62,6,59,99,100,108,113,114,10512,10514,10527,10532,10538,10545,1,62,4,2,99,105,10520,10523,59,1,10919,114,59,1,10874,111,116,59,1,8919,80,97,114,59,1,10645,117,101,115,116,59,1,10876,4,5,97,100,101,108,115,10557,10574,10579,10599,10605,4,2,112,114,10563,10570,112,114,111,120,59,1,10886,114,59,1,10616,111,116,59,1,8919,113,4,2,108,113,10586,10592,101,115,115,59,1,8923,108,101,115,115,59,1,10892,101,115,115,59,1,8823,105,109,59,1,8819,4,2,101,110,10616,10626,114,116,110,101,113,113,59,3,8809,65024,69,59,3,8809,65024,4,10,65,97,98,99,101,102,107,111,115,121,10653,10658,10713,10718,10724,10760,10765,10786,10850,10875,114,114,59,1,8660,4,4,105,108,109,114,10668,10674,10678,10684,114,115,112,59,1,8202,102,59,1,189,105,108,116,59,1,8459,4,2,100,114,10690,10695,99,121,59,1,1098,4,3,59,99,119,10703,10705,10710,1,8596,105,114,59,1,10568,59,1,8621,97,114,59,1,8463,105,114,99,59,1,293,4,3,97,108,114,10732,10748,10754,114,116,115,4,2,59,117,10741,10743,1,9829,105,116,59,1,9829,108,105,112,59,1,8230,99,111,110,59,1,8889,114,59,3,55349,56613,115,4,2,101,119,10772,10779,97,114,111,119,59,1,10533,97,114,111,119,59,1,10534,4,5,97,109,111,112,114,10798,10803,10809,10839,10844,114,114,59,1,8703,116,104,116,59,1,8763,107,4,2,108,114,10816,10827,101,102,116,97,114,114,111,119,59,1,8617,105,103,104,116,97,114,114,111,119,59,1,8618,102,59,3,55349,56665,98,97,114,59,1,8213,4,3,99,108,116,10858,10863,10869,114,59,3,55349,56509,97,115,104,59,1,8463,114,111,107,59,1,295,4,2,98,112,10881,10887,117,108,108,59,1,8259,104,101,110,59,1,8208,4,15,97,99,101,102,103,105,106,109,110,111,112,113,115,116,117,10925,10936,10958,10977,10990,11001,11039,11045,11101,11192,11220,11226,11237,11285,11299,99,117,116,101,5,237,1,59,10934,1,237,4,3,59,105,121,10944,10946,10955,1,8291,114,99,5,238,1,59,10953,1,238,59,1,1080,4,2,99,120,10964,10968,121,59,1,1077,99,108,5,161,1,59,10975,1,161,4,2,102,114,10983,10986,59,1,8660,59,3,55349,56614,114,97,118,101,5,236,1,59,10999,1,236,4,4,59,105,110,111,11011,11013,11028,11034,1,8520,4,2,105,110,11019,11024,110,116,59,1,10764,116,59,1,8749,102,105,110,59,1,10716,116,97,59,1,8489,108,105,103,59,1,307,4,3,97,111,112,11053,11092,11096,4,3,99,103,116,11061,11065,11088,114,59,1,299,4,3,101,108,112,11073,11076,11082,59,1,8465,105,110,101,59,1,8464,97,114,116,59,1,8465,104,59,1,305,102,59,1,8887,101,100,59,1,437,4,5,59,99,102,111,116,11113,11115,11121,11136,11142,1,8712,97,114,101,59,1,8453,105,110,4,2,59,116,11129,11131,1,8734,105,101,59,1,10717,100,111,116,59,1,305,4,5,59,99,101,108,112,11154,11156,11161,11179,11186,1,8747,97,108,59,1,8890,4,2,103,114,11167,11173,101,114,115,59,1,8484,99,97,108,59,1,8890,97,114,104,107,59,1,10775,114,111,100,59,1,10812,4,4,99,103,112,116,11202,11206,11211,11216,121,59,1,1105,111,110,59,1,303,102,59,3,55349,56666,97,59,1,953,114,111,100,59,1,10812,117,101,115,116,5,191,1,59,11235,1,191,4,2,99,105,11243,11248,114,59,3,55349,56510,110,4,5,59,69,100,115,118,11261,11263,11266,11271,11282,1,8712,59,1,8953,111,116,59,1,8949,4,2,59,118,11277,11279,1,8948,59,1,8947,59,1,8712,4,2,59,105,11291,11293,1,8290,108,100,101,59,1,297,4,2,107,109,11305,11310,99,121,59,1,1110,108,5,239,1,59,11316,1,239,4,6,99,102,109,111,115,117,11332,11346,11351,11357,11363,11380,4,2,105,121,11338,11343,114,99,59,1,309,59,1,1081,114,59,3,55349,56615,97,116,104,59,1,567,112,102,59,3,55349,56667,4,2,99,101,11369,11374,114,59,3,55349,56511,114,99,121,59,1,1112,107,99,121,59,1,1108,4,8,97,99,102,103,104,106,111,115,11404,11418,11433,11438,11445,11450,11455,11461,112,112,97,4,2,59,118,11413,11415,1,954,59,1,1008,4,2,101,121,11424,11430,100,105,108,59,1,311,59,1,1082,114,59,3,55349,56616,114,101,101,110,59,1,312,99,121,59,1,1093,99,121,59,1,1116,112,102,59,3,55349,56668,99,114,59,3,55349,56512,4,23,65,66,69,72,97,98,99,100,101,102,103,104,106,108,109,110,111,112,114,115,116,117,118,11515,11538,11544,11555,11560,11721,11780,11818,11868,12136,12160,12171,12203,12208,12246,12275,12327,12509,12523,12569,12641,12732,12752,4,3,97,114,116,11523,11528,11532,114,114,59,1,8666,114,59,1,8656,97,105,108,59,1,10523,97,114,114,59,1,10510,4,2,59,103,11550,11552,1,8806,59,1,10891,97,114,59,1,10594,4,9,99,101,103,109,110,112,113,114,116,11580,11586,11594,11600,11606,11624,11627,11636,11694,117,116,101,59,1,314,109,112,116,121,118,59,1,10676,114,97,110,59,1,8466,98,100,97,59,1,955,103,4,3,59,100,108,11615,11617,11620,1,10216,59,1,10641,101,59,1,10216,59,1,10885,117,111,5,171,1,59,11634,1,171,114,4,8,59,98,102,104,108,112,115,116,11655,11657,11669,11673,11677,11681,11685,11690,1,8592,4,2,59,102,11663,11665,1,8676,115,59,1,10527,115,59,1,10525,107,59,1,8617,112,59,1,8619,108,59,1,10553,105,109,59,1,10611,108,59,1,8610,4,3,59,97,101,11702,11704,11709,1,10923,105,108,59,1,10521,4,2,59,115,11715,11717,1,10925,59,3,10925,65024,4,3,97,98,114,11729,11734,11739,114,114,59,1,10508,114,107,59,1,10098,4,2,97,107,11745,11758,99,4,2,101,107,11752,11755,59,1,123,59,1,91,4,2,101,115,11764,11767,59,1,10635,108,4,2,100,117,11774,11777,59,1,10639,59,1,10637,4,4,97,101,117,121,11790,11796,11811,11815,114,111,110,59,1,318,4,2,100,105,11802,11807,105,108,59,1,316,108,59,1,8968,98,59,1,123,59,1,1083,4,4,99,113,114,115,11828,11832,11845,11864,97,59,1,10550,117,111,4,2,59,114,11840,11842,1,8220,59,1,8222,4,2,100,117,11851,11857,104,97,114,59,1,10599,115,104,97,114,59,1,10571,104,59,1,8626,4,5,59,102,103,113,115,11880,11882,12008,12011,12031,1,8804,116,4,5,97,104,108,114,116,11895,11913,11935,11947,11996,114,114,111,119,4,2,59,116,11905,11907,1,8592,97,105,108,59,1,8610,97,114,112,111,111,110,4,2,100,117,11925,11931,111,119,110,59,1,8637,112,59,1,8636,101,102,116,97,114,114,111,119,115,59,1,8647,105,103,104,116,4,3,97,104,115,11959,11974,11984,114,114,111,119,4,2,59,115,11969,11971,1,8596,59,1,8646,97,114,112,111,111,110,115,59,1,8651,113,117,105,103,97,114,114,111,119,59,1,8621,104,114,101,101,116,105,109,101,115,59,1,8907,59,1,8922,4,3,59,113,115,12019,12021,12024,1,8804,59,1,8806,108,97,110,116,59,1,10877,4,5,59,99,100,103,115,12043,12045,12049,12070,12083,1,10877,99,59,1,10920,111,116,4,2,59,111,12057,12059,1,10879,4,2,59,114,12065,12067,1,10881,59,1,10883,4,2,59,101,12076,12079,3,8922,65024,115,59,1,10899,4,5,97,100,101,103,115,12095,12103,12108,12126,12131,112,112,114,111,120,59,1,10885,111,116,59,1,8918,113,4,2,103,113,12115,12120,116,114,59,1,8922,103,116,114,59,1,10891,116,114,59,1,8822,105,109,59,1,8818,4,3,105,108,114,12144,12150,12156,115,104,116,59,1,10620,111,111,114,59,1,8970,59,3,55349,56617,4,2,59,69,12166,12168,1,8822,59,1,10897,4,2,97,98,12177,12198,114,4,2,100,117,12184,12187,59,1,8637,4,2,59,108,12193,12195,1,8636,59,1,10602,108,107,59,1,9604,99,121,59,1,1113,4,5,59,97,99,104,116,12220,12222,12227,12235,12241,1,8810,114,114,59,1,8647,111,114,110,101,114,59,1,8990,97,114,100,59,1,10603,114,105,59,1,9722,4,2,105,111,12252,12258,100,111,116,59,1,320,117,115,116,4,2,59,97,12267,12269,1,9136,99,104,101,59,1,9136,4,4,69,97,101,115,12285,12288,12303,12322,59,1,8808,112,4,2,59,112,12295,12297,1,10889,114,111,120,59,1,10889,4,2,59,113,12309,12311,1,10887,4,2,59,113,12317,12319,1,10887,59,1,8808,105,109,59,1,8934,4,8,97,98,110,111,112,116,119,122,12345,12359,12364,12421,12446,12467,12474,12490,4,2,110,114,12351,12355,103,59,1,10220,114,59,1,8701,114,107,59,1,10214,103,4,3,108,109,114,12373,12401,12409,101,102,116,4,2,97,114,12382,12389,114,114,111,119,59,1,10229,105,103,104,116,97,114,114,111,119,59,1,10231,97,112,115,116,111,59,1,10236,105,103,104,116,97,114,114,111,119,59,1,10230,112,97,114,114,111,119,4,2,108,114,12433,12439,101,102,116,59,1,8619,105,103,104,116,59,1,8620,4,3,97,102,108,12454,12458,12462,114,59,1,10629,59,3,55349,56669,117,115,59,1,10797,105,109,101,115,59,1,10804,4,2,97,98,12480,12485,115,116,59,1,8727,97,114,59,1,95,4,3,59,101,102,12498,12500,12506,1,9674,110,103,101,59,1,9674,59,1,10731,97,114,4,2,59,108,12517,12519,1,40,116,59,1,10643,4,5,97,99,104,109,116,12535,12540,12548,12561,12564,114,114,59,1,8646,111,114,110,101,114,59,1,8991,97,114,4,2,59,100,12556,12558,1,8651,59,1,10605,59,1,8206,114,105,59,1,8895,4,6,97,99,104,105,113,116,12583,12589,12594,12597,12614,12635,113,117,111,59,1,8249,114,59,3,55349,56513,59,1,8624,109,4,3,59,101,103,12606,12608,12611,1,8818,59,1,10893,59,1,10895,4,2,98,117,12620,12623,59,1,91,111,4,2,59,114,12630,12632,1,8216,59,1,8218,114,111,107,59,1,322,5,60,8,59,99,100,104,105,108,113,114,12660,12662,12675,12680,12686,12692,12698,12705,1,60,4,2,99,105,12668,12671,59,1,10918,114,59,1,10873,111,116,59,1,8918,114,101,101,59,1,8907,109,101,115,59,1,8905,97,114,114,59,1,10614,117,101,115,116,59,1,10875,4,2,80,105,12711,12716,97,114,59,1,10646,4,3,59,101,102,12724,12726,12729,1,9667,59,1,8884,59,1,9666,114,4,2,100,117,12739,12746,115,104,97,114,59,1,10570,104,97,114,59,1,10598,4,2,101,110,12758,12768,114,116,110,101,113,113,59,3,8808,65024,69,59,3,8808,65024,4,14,68,97,99,100,101,102,104,105,108,110,111,112,115,117,12803,12809,12893,12908,12914,12928,12933,12937,13011,13025,13032,13049,13052,13069,68,111,116,59,1,8762,4,4,99,108,112,114,12819,12827,12849,12887,114,5,175,1,59,12825,1,175,4,2,101,116,12833,12836,59,1,9794,4,2,59,101,12842,12844,1,10016,115,101,59,1,10016,4,2,59,115,12855,12857,1,8614,116,111,4,4,59,100,108,117,12869,12871,12877,12883,1,8614,111,119,110,59,1,8615,101,102,116,59,1,8612,112,59,1,8613,107,101,114,59,1,9646,4,2,111,121,12899,12905,109,109,97,59,1,10793,59,1,1084,97,115,104,59,1,8212,97,115,117,114,101,100,97,110,103,108,101,59,1,8737,114,59,3,55349,56618,111,59,1,8487,4,3,99,100,110,12945,12954,12985,114,111,5,181,1,59,12952,1,181,4,4,59,97,99,100,12964,12966,12971,12976,1,8739,115,116,59,1,42,105,114,59,1,10992,111,116,5,183,1,59,12983,1,183,117,115,4,3,59,98,100,12995,12997,13e3,1,8722,59,1,8863,4,2,59,117,13006,13008,1,8760,59,1,10794,4,2,99,100,13017,13021,112,59,1,10971,114,59,1,8230,112,108,117,115,59,1,8723,4,2,100,112,13038,13044,101,108,115,59,1,8871,102,59,3,55349,56670,59,1,8723,4,2,99,116,13058,13063,114,59,3,55349,56514,112,111,115,59,1,8766,4,3,59,108,109,13077,13079,13087,1,956,116,105,109,97,112,59,1,8888,97,112,59,1,8888,4,24,71,76,82,86,97,98,99,100,101,102,103,104,105,106,108,109,111,112,114,115,116,117,118,119,13142,13165,13217,13229,13247,13330,13359,13414,13420,13508,13513,13579,13602,13626,13631,13762,13767,13855,13936,13995,14214,14285,14312,14432,4,2,103,116,13148,13152,59,3,8921,824,4,2,59,118,13158,13161,3,8811,8402,59,3,8811,824,4,3,101,108,116,13173,13200,13204,102,116,4,2,97,114,13181,13188,114,114,111,119,59,1,8653,105,103,104,116,97,114,114,111,119,59,1,8654,59,3,8920,824,4,2,59,118,13210,13213,3,8810,8402,59,3,8810,824,105,103,104,116,97,114,114,111,119,59,1,8655,4,2,68,100,13235,13241,97,115,104,59,1,8879,97,115,104,59,1,8878,4,5,98,99,110,112,116,13259,13264,13270,13275,13308,108,97,59,1,8711,117,116,101,59,1,324,103,59,3,8736,8402,4,5,59,69,105,111,112,13287,13289,13293,13298,13302,1,8777,59,3,10864,824,100,59,3,8779,824,115,59,1,329,114,111,120,59,1,8777,117,114,4,2,59,97,13316,13318,1,9838,108,4,2,59,115,13325,13327,1,9838,59,1,8469,4,2,115,117,13336,13344,112,5,160,1,59,13342,1,160,109,112,4,2,59,101,13352,13355,3,8782,824,59,3,8783,824,4,5,97,101,111,117,121,13371,13385,13391,13407,13411,4,2,112,114,13377,13380,59,1,10819,111,110,59,1,328,100,105,108,59,1,326,110,103,4,2,59,100,13399,13401,1,8775,111,116,59,3,10861,824,112,59,1,10818,59,1,1085,97,115,104,59,1,8211,4,7,59,65,97,100,113,115,120,13436,13438,13443,13466,13472,13478,13494,1,8800,114,114,59,1,8663,114,4,2,104,114,13450,13454,107,59,1,10532,4,2,59,111,13460,13462,1,8599,119,59,1,8599,111,116,59,3,8784,824,117,105,118,59,1,8802,4,2,101,105,13484,13489,97,114,59,1,10536,109,59,3,8770,824,105,115,116,4,2,59,115,13503,13505,1,8708,59,1,8708,114,59,3,55349,56619,4,4,69,101,115,116,13523,13527,13563,13568,59,3,8807,824,4,3,59,113,115,13535,13537,13559,1,8817,4,3,59,113,115,13545,13547,13551,1,8817,59,3,8807,824,108,97,110,116,59,3,10878,824,59,3,10878,824,105,109,59,1,8821,4,2,59,114,13574,13576,1,8815,59,1,8815,4,3,65,97,112,13587,13592,13597,114,114,59,1,8654,114,114,59,1,8622,97,114,59,1,10994,4,3,59,115,118,13610,13612,13623,1,8715,4,2,59,100,13618,13620,1,8956,59,1,8954,59,1,8715,99,121,59,1,1114,4,7,65,69,97,100,101,115,116,13647,13652,13656,13661,13665,13737,13742,114,114,59,1,8653,59,3,8806,824,114,114,59,1,8602,114,59,1,8229,4,4,59,102,113,115,13675,13677,13703,13725,1,8816,116,4,2,97,114,13684,13691,114,114,111,119,59,1,8602,105,103,104,116,97,114,114,111,119,59,1,8622,4,3,59,113,115,13711,13713,13717,1,8816,59,3,8806,824,108,97,110,116,59,3,10877,824,4,2,59,115,13731,13734,3,10877,824,59,1,8814,105,109,59,1,8820,4,2,59,114,13748,13750,1,8814,105,4,2,59,101,13757,13759,1,8938,59,1,8940,105,100,59,1,8740,4,2,112,116,13773,13778,102,59,3,55349,56671,5,172,3,59,105,110,13787,13789,13829,1,172,110,4,4,59,69,100,118,13800,13802,13806,13812,1,8713,59,3,8953,824,111,116,59,3,8949,824,4,3,97,98,99,13820,13823,13826,59,1,8713,59,1,8951,59,1,8950,105,4,2,59,118,13836,13838,1,8716,4,3,97,98,99,13846,13849,13852,59,1,8716,59,1,8958,59,1,8957,4,3,97,111,114,13863,13892,13899,114,4,4,59,97,115,116,13874,13876,13883,13888,1,8742,108,108,101,108,59,1,8742,108,59,3,11005,8421,59,3,8706,824,108,105,110,116,59,1,10772,4,3,59,99,101,13907,13909,13914,1,8832,117,101,59,1,8928,4,2,59,99,13920,13923,3,10927,824,4,2,59,101,13929,13931,1,8832,113,59,3,10927,824,4,4,65,97,105,116,13946,13951,13971,13982,114,114,59,1,8655,114,114,4,3,59,99,119,13961,13963,13967,1,8603,59,3,10547,824,59,3,8605,824,103,104,116,97,114,114,111,119,59,1,8603,114,105,4,2,59,101,13990,13992,1,8939,59,1,8941,4,7,99,104,105,109,112,113,117,14011,14036,14060,14080,14085,14090,14106,4,4,59,99,101,114,14021,14023,14028,14032,1,8833,117,101,59,1,8929,59,3,10928,824,59,3,55349,56515,111,114,116,4,2,109,112,14045,14050,105,100,59,1,8740,97,114,97,108,108,101,108,59,1,8742,109,4,2,59,101,14067,14069,1,8769,4,2,59,113,14075,14077,1,8772,59,1,8772,105,100,59,1,8740,97,114,59,1,8742,115,117,4,2,98,112,14098,14102,101,59,1,8930,101,59,1,8931,4,3,98,99,112,14114,14157,14171,4,4,59,69,101,115,14124,14126,14130,14133,1,8836,59,3,10949,824,59,1,8840,101,116,4,2,59,101,14141,14144,3,8834,8402,113,4,2,59,113,14151,14153,1,8840,59,3,10949,824,99,4,2,59,101,14164,14166,1,8833,113,59,3,10928,824,4,4,59,69,101,115,14181,14183,14187,14190,1,8837,59,3,10950,824,59,1,8841,101,116,4,2,59,101,14198,14201,3,8835,8402,113,4,2,59,113,14208,14210,1,8841,59,3,10950,824,4,4,103,105,108,114,14224,14228,14238,14242,108,59,1,8825,108,100,101,5,241,1,59,14236,1,241,103,59,1,8824,105,97,110,103,108,101,4,2,108,114,14254,14269,101,102,116,4,2,59,101,14263,14265,1,8938,113,59,1,8940,105,103,104,116,4,2,59,101,14279,14281,1,8939,113,59,1,8941,4,2,59,109,14291,14293,1,957,4,3,59,101,115,14301,14303,14308,1,35,114,111,59,1,8470,112,59,1,8199,4,9,68,72,97,100,103,105,108,114,115,14332,14338,14344,14349,14355,14369,14376,14408,14426,97,115,104,59,1,8877,97,114,114,59,1,10500,112,59,3,8781,8402,97,115,104,59,1,8876,4,2,101,116,14361,14365,59,3,8805,8402,59,3,62,8402,110,102,105,110,59,1,10718,4,3,65,101,116,14384,14389,14393,114,114,59,1,10498,59,3,8804,8402,4,2,59,114,14399,14402,3,60,8402,105,101,59,3,8884,8402,4,2,65,116,14414,14419,114,114,59,1,10499,114,105,101,59,3,8885,8402,105,109,59,3,8764,8402,4,3,65,97,110,14440,14445,14468,114,114,59,1,8662,114,4,2,104,114,14452,14456,107,59,1,10531,4,2,59,111,14462,14464,1,8598,119,59,1,8598,101,97,114,59,1,10535,4,18,83,97,99,100,101,102,103,104,105,108,109,111,112,114,115,116,117,118,14512,14515,14535,14560,14597,14603,14618,14643,14657,14662,14701,14741,14747,14769,14851,14877,14907,14916,59,1,9416,4,2,99,115,14521,14531,117,116,101,5,243,1,59,14529,1,243,116,59,1,8859,4,2,105,121,14541,14557,114,4,2,59,99,14548,14550,1,8858,5,244,1,59,14555,1,244,59,1,1086,4,5,97,98,105,111,115,14572,14577,14583,14587,14591,115,104,59,1,8861,108,97,99,59,1,337,118,59,1,10808,116,59,1,8857,111,108,100,59,1,10684,108,105,103,59,1,339,4,2,99,114,14609,14614,105,114,59,1,10687,59,3,55349,56620,4,3,111,114,116,14626,14630,14640,110,59,1,731,97,118,101,5,242,1,59,14638,1,242,59,1,10689,4,2,98,109,14649,14654,97,114,59,1,10677,59,1,937,110,116,59,1,8750,4,4,97,99,105,116,14672,14677,14693,14698,114,114,59,1,8634,4,2,105,114,14683,14687,114,59,1,10686,111,115,115,59,1,10683,110,101,59,1,8254,59,1,10688,4,3,97,101,105,14709,14714,14719,99,114,59,1,333,103,97,59,1,969,4,3,99,100,110,14727,14733,14736,114,111,110,59,1,959,59,1,10678,117,115,59,1,8854,112,102,59,3,55349,56672,4,3,97,101,108,14755,14759,14764,114,59,1,10679,114,112,59,1,10681,117,115,59,1,8853,4,7,59,97,100,105,111,115,118,14785,14787,14792,14831,14837,14841,14848,1,8744,114,114,59,1,8635,4,4,59,101,102,109,14802,14804,14817,14824,1,10845,114,4,2,59,111,14811,14813,1,8500,102,59,1,8500,5,170,1,59,14822,1,170,5,186,1,59,14829,1,186,103,111,102,59,1,8886,114,59,1,10838,108,111,112,101,59,1,10839,59,1,10843,4,3,99,108,111,14859,14863,14873,114,59,1,8500,97,115,104,5,248,1,59,14871,1,248,108,59,1,8856,105,4,2,108,109,14884,14893,100,101,5,245,1,59,14891,1,245,101,115,4,2,59,97,14901,14903,1,8855,115,59,1,10806,109,108,5,246,1,59,14914,1,246,98,97,114,59,1,9021,4,12,97,99,101,102,104,105,108,109,111,114,115,117,14948,14992,14996,15033,15038,15068,15090,15189,15192,15222,15427,15441,114,4,4,59,97,115,116,14959,14961,14976,14989,1,8741,5,182,2,59,108,14968,14970,1,182,108,101,108,59,1,8741,4,2,105,108,14982,14986,109,59,1,10995,59,1,11005,59,1,8706,121,59,1,1087,114,4,5,99,105,109,112,116,15009,15014,15019,15024,15027,110,116,59,1,37,111,100,59,1,46,105,108,59,1,8240,59,1,8869,101,110,107,59,1,8241,114,59,3,55349,56621,4,3,105,109,111,15046,15057,15063,4,2,59,118,15052,15054,1,966,59,1,981,109,97,116,59,1,8499,110,101,59,1,9742,4,3,59,116,118,15076,15078,15087,1,960,99,104,102,111,114,107,59,1,8916,59,1,982,4,2,97,117,15096,15119,110,4,2,99,107,15103,15115,107,4,2,59,104,15110,15112,1,8463,59,1,8462,118,59,1,8463,115,4,9,59,97,98,99,100,101,109,115,116,15140,15142,15148,15151,15156,15168,15171,15179,15184,1,43,99,105,114,59,1,10787,59,1,8862,105,114,59,1,10786,4,2,111,117,15162,15165,59,1,8724,59,1,10789,59,1,10866,110,5,177,1,59,15177,1,177,105,109,59,1,10790,119,111,59,1,10791,59,1,177,4,3,105,112,117,15200,15208,15213,110,116,105,110,116,59,1,10773,102,59,3,55349,56673,110,100,5,163,1,59,15220,1,163,4,10,59,69,97,99,101,105,110,111,115,117,15244,15246,15249,15253,15258,15334,15347,15367,15416,15421,1,8826,59,1,10931,112,59,1,10935,117,101,59,1,8828,4,2,59,99,15264,15266,1,10927,4,6,59,97,99,101,110,115,15280,15282,15290,15299,15303,15329,1,8826,112,112,114,111,120,59,1,10935,117,114,108,121,101,113,59,1,8828,113,59,1,10927,4,3,97,101,115,15311,15319,15324,112,112,114,111,120,59,1,10937,113,113,59,1,10933,105,109,59,1,8936,105,109,59,1,8830,109,101,4,2,59,115,15342,15344,1,8242,59,1,8473,4,3,69,97,115,15355,15358,15362,59,1,10933,112,59,1,10937,105,109,59,1,8936,4,3,100,102,112,15375,15378,15404,59,1,8719,4,3,97,108,115,15386,15392,15398,108,97,114,59,1,9006,105,110,101,59,1,8978,117,114,102,59,1,8979,4,2,59,116,15410,15412,1,8733,111,59,1,8733,105,109,59,1,8830,114,101,108,59,1,8880,4,2,99,105,15433,15438,114,59,3,55349,56517,59,1,968,110,99,115,112,59,1,8200,4,6,102,105,111,112,115,117,15462,15467,15472,15478,15485,15491,114,59,3,55349,56622,110,116,59,1,10764,112,102,59,3,55349,56674,114,105,109,101,59,1,8279,99,114,59,3,55349,56518,4,3,97,101,111,15499,15520,15534,116,4,2,101,105,15506,15515,114,110,105,111,110,115,59,1,8461,110,116,59,1,10774,115,116,4,2,59,101,15528,15530,1,63,113,59,1,8799,116,5,34,1,59,15540,1,34,4,21,65,66,72,97,98,99,100,101,102,104,105,108,109,110,111,112,114,115,116,117,120,15586,15609,15615,15620,15796,15855,15893,15931,15977,16001,16039,16183,16204,16222,16228,16285,16312,16318,16363,16408,16416,4,3,97,114,116,15594,15599,15603,114,114,59,1,8667,114,59,1,8658,97,105,108,59,1,10524,97,114,114,59,1,10511,97,114,59,1,10596,4,7,99,100,101,110,113,114,116,15636,15651,15656,15664,15687,15696,15770,4,2,101,117,15642,15646,59,3,8765,817,116,101,59,1,341,105,99,59,1,8730,109,112,116,121,118,59,1,10675,103,4,4,59,100,101,108,15675,15677,15680,15683,1,10217,59,1,10642,59,1,10661,101,59,1,10217,117,111,5,187,1,59,15694,1,187,114,4,11,59,97,98,99,102,104,108,112,115,116,119,15721,15723,15727,15739,15742,15746,15750,15754,15758,15763,15767,1,8594,112,59,1,10613,4,2,59,102,15733,15735,1,8677,115,59,1,10528,59,1,10547,115,59,1,10526,107,59,1,8618,112,59,1,8620,108,59,1,10565,105,109,59,1,10612,108,59,1,8611,59,1,8605,4,2,97,105,15776,15781,105,108,59,1,10522,111,4,2,59,110,15788,15790,1,8758,97,108,115,59,1,8474,4,3,97,98,114,15804,15809,15814,114,114,59,1,10509,114,107,59,1,10099,4,2,97,107,15820,15833,99,4,2,101,107,15827,15830,59,1,125,59,1,93,4,2,101,115,15839,15842,59,1,10636,108,4,2,100,117,15849,15852,59,1,10638,59,1,10640,4,4,97,101,117,121,15865,15871,15886,15890,114,111,110,59,1,345,4,2,100,105,15877,15882,105,108,59,1,343,108,59,1,8969,98,59,1,125,59,1,1088,4,4,99,108,113,115,15903,15907,15914,15927,97,59,1,10551,100,104,97,114,59,1,10601,117,111,4,2,59,114,15922,15924,1,8221,59,1,8221,104,59,1,8627,4,3,97,99,103,15939,15966,15970,108,4,4,59,105,112,115,15950,15952,15957,15963,1,8476,110,101,59,1,8475,97,114,116,59,1,8476,59,1,8477,116,59,1,9645,5,174,1,59,15975,1,174,4,3,105,108,114,15985,15991,15997,115,104,116,59,1,10621,111,111,114,59,1,8971,59,3,55349,56623,4,2,97,111,16007,16028,114,4,2,100,117,16014,16017,59,1,8641,4,2,59,108,16023,16025,1,8640,59,1,10604,4,2,59,118,16034,16036,1,961,59,1,1009,4,3,103,110,115,16047,16167,16171,104,116,4,6,97,104,108,114,115,116,16063,16081,16103,16130,16143,16155,114,114,111,119,4,2,59,116,16073,16075,1,8594,97,105,108,59,1,8611,97,114,112,111,111,110,4,2,100,117,16093,16099,111,119,110,59,1,8641,112,59,1,8640,101,102,116,4,2,97,104,16112,16120,114,114,111,119,115,59,1,8644,97,114,112,111,111,110,115,59,1,8652,105,103,104,116,97,114,114,111,119,115,59,1,8649,113,117,105,103,97,114,114,111,119,59,1,8605,104,114,101,101,116,105,109,101,115,59,1,8908,103,59,1,730,105,110,103,100,111,116,115,101,113,59,1,8787,4,3,97,104,109,16191,16196,16201,114,114,59,1,8644,97,114,59,1,8652,59,1,8207,111,117,115,116,4,2,59,97,16214,16216,1,9137,99,104,101,59,1,9137,109,105,100,59,1,10990,4,4,97,98,112,116,16238,16252,16257,16278,4,2,110,114,16244,16248,103,59,1,10221,114,59,1,8702,114,107,59,1,10215,4,3,97,102,108,16265,16269,16273,114,59,1,10630,59,3,55349,56675,117,115,59,1,10798,105,109,101,115,59,1,10805,4,2,97,112,16291,16304,114,4,2,59,103,16298,16300,1,41,116,59,1,10644,111,108,105,110,116,59,1,10770,97,114,114,59,1,8649,4,4,97,99,104,113,16328,16334,16339,16342,113,117,111,59,1,8250,114,59,3,55349,56519,59,1,8625,4,2,98,117,16348,16351,59,1,93,111,4,2,59,114,16358,16360,1,8217,59,1,8217,4,3,104,105,114,16371,16377,16383,114,101,101,59,1,8908,109,101,115,59,1,8906,105,4,4,59,101,102,108,16394,16396,16399,16402,1,9657,59,1,8885,59,1,9656,116,114,105,59,1,10702,108,117,104,97,114,59,1,10600,59,1,8478,4,19,97,98,99,100,101,102,104,105,108,109,111,112,113,114,115,116,117,119,122,16459,16466,16472,16572,16590,16672,16687,16746,16844,16850,16924,16963,16988,17115,17121,17154,17206,17614,17656,99,117,116,101,59,1,347,113,117,111,59,1,8218,4,10,59,69,97,99,101,105,110,112,115,121,16494,16496,16499,16513,16518,16531,16536,16556,16564,16569,1,8827,59,1,10932,4,2,112,114,16505,16508,59,1,10936,111,110,59,1,353,117,101,59,1,8829,4,2,59,100,16524,16526,1,10928,105,108,59,1,351,114,99,59,1,349,4,3,69,97,115,16544,16547,16551,59,1,10934,112,59,1,10938,105,109,59,1,8937,111,108,105,110,116,59,1,10771,105,109,59,1,8831,59,1,1089,111,116,4,3,59,98,101,16582,16584,16587,1,8901,59,1,8865,59,1,10854,4,7,65,97,99,109,115,116,120,16606,16611,16634,16642,16646,16652,16668,114,114,59,1,8664,114,4,2,104,114,16618,16622,107,59,1,10533,4,2,59,111,16628,16630,1,8600,119,59,1,8600,116,5,167,1,59,16640,1,167,105,59,1,59,119,97,114,59,1,10537,109,4,2,105,110,16659,16665,110,117,115,59,1,8726,59,1,8726,116,59,1,10038,114,4,2,59,111,16679,16682,3,55349,56624,119,110,59,1,8994,4,4,97,99,111,121,16697,16702,16716,16739,114,112,59,1,9839,4,2,104,121,16708,16713,99,121,59,1,1097,59,1,1096,114,116,4,2,109,112,16724,16729,105,100,59,1,8739,97,114,97,108,108,101,108,59,1,8741,5,173,1,59,16744,1,173,4,2,103,109,16752,16770,109,97,4,3,59,102,118,16762,16764,16767,1,963,59,1,962,59,1,962,4,8,59,100,101,103,108,110,112,114,16788,16790,16795,16806,16817,16828,16832,16838,1,8764,111,116,59,1,10858,4,2,59,113,16801,16803,1,8771,59,1,8771,4,2,59,69,16812,16814,1,10910,59,1,10912,4,2,59,69,16823,16825,1,10909,59,1,10911,101,59,1,8774,108,117,115,59,1,10788,97,114,114,59,1,10610,97,114,114,59,1,8592,4,4,97,101,105,116,16860,16883,16891,16904,4,2,108,115,16866,16878,108,115,101,116,109,105,110,117,115,59,1,8726,104,112,59,1,10803,112,97,114,115,108,59,1,10724,4,2,100,108,16897,16900,59,1,8739,101,59,1,8995,4,2,59,101,16910,16912,1,10922,4,2,59,115,16918,16920,1,10924,59,3,10924,65024,4,3,102,108,112,16932,16938,16958,116,99,121,59,1,1100,4,2,59,98,16944,16946,1,47,4,2,59,97,16952,16954,1,10692,114,59,1,9023,102,59,3,55349,56676,97,4,2,100,114,16970,16985,101,115,4,2,59,117,16978,16980,1,9824,105,116,59,1,9824,59,1,8741,4,3,99,115,117,16996,17028,17089,4,2,97,117,17002,17015,112,4,2,59,115,17009,17011,1,8851,59,3,8851,65024,112,4,2,59,115,17022,17024,1,8852,59,3,8852,65024,117,4,2,98,112,17035,17062,4,3,59,101,115,17043,17045,17048,1,8847,59,1,8849,101,116,4,2,59,101,17056,17058,1,8847,113,59,1,8849,4,3,59,101,115,17070,17072,17075,1,8848,59,1,8850,101,116,4,2,59,101,17083,17085,1,8848,113,59,1,8850,4,3,59,97,102,17097,17099,17112,1,9633,114,4,2,101,102,17106,17109,59,1,9633,59,1,9642,59,1,9642,97,114,114,59,1,8594,4,4,99,101,109,116,17131,17136,17142,17148,114,59,3,55349,56520,116,109,110,59,1,8726,105,108,101,59,1,8995,97,114,102,59,1,8902,4,2,97,114,17160,17172,114,4,2,59,102,17167,17169,1,9734,59,1,9733,4,2,97,110,17178,17202,105,103,104,116,4,2,101,112,17188,17197,112,115,105,108,111,110,59,1,1013,104,105,59,1,981,115,59,1,175,4,5,98,99,109,110,112,17218,17351,17420,17423,17427,4,9,59,69,100,101,109,110,112,114,115,17238,17240,17243,17248,17261,17267,17279,17285,17291,1,8834,59,1,10949,111,116,59,1,10941,4,2,59,100,17254,17256,1,8838,111,116,59,1,10947,117,108,116,59,1,10945,4,2,69,101,17273,17276,59,1,10955,59,1,8842,108,117,115,59,1,10943,97,114,114,59,1,10617,4,3,101,105,117,17299,17335,17339,116,4,3,59,101,110,17308,17310,17322,1,8834,113,4,2,59,113,17317,17319,1,8838,59,1,10949,101,113,4,2,59,113,17330,17332,1,8842,59,1,10955,109,59,1,10951,4,2,98,112,17345,17348,59,1,10965,59,1,10963,99,4,6,59,97,99,101,110,115,17366,17368,17376,17385,17389,17415,1,8827,112,112,114,111,120,59,1,10936,117,114,108,121,101,113,59,1,8829,113,59,1,10928,4,3,97,101,115,17397,17405,17410,112,112,114,111,120,59,1,10938,113,113,59,1,10934,105,109,59,1,8937,105,109,59,1,8831,59,1,8721,103,59,1,9834,4,13,49,50,51,59,69,100,101,104,108,109,110,112,115,17455,17462,17469,17476,17478,17481,17496,17509,17524,17530,17536,17548,17554,5,185,1,59,17460,1,185,5,178,1,59,17467,1,178,5,179,1,59,17474,1,179,1,8835,59,1,10950,4,2,111,115,17487,17491,116,59,1,10942,117,98,59,1,10968,4,2,59,100,17502,17504,1,8839,111,116,59,1,10948,115,4,2,111,117,17516,17520,108,59,1,10185,98,59,1,10967,97,114,114,59,1,10619,117,108,116,59,1,10946,4,2,69,101,17542,17545,59,1,10956,59,1,8843,108,117,115,59,1,10944,4,3,101,105,117,17562,17598,17602,116,4,3,59,101,110,17571,17573,17585,1,8835,113,4,2,59,113,17580,17582,1,8839,59,1,10950,101,113,4,2,59,113,17593,17595,1,8843,59,1,10956,109,59,1,10952,4,2,98,112,17608,17611,59,1,10964,59,1,10966,4,3,65,97,110,17622,17627,17650,114,114,59,1,8665,114,4,2,104,114,17634,17638,107,59,1,10534,4,2,59,111,17644,17646,1,8601,119,59,1,8601,119,97,114,59,1,10538,108,105,103,5,223,1,59,17664,1,223,4,13,97,98,99,100,101,102,104,105,111,112,114,115,119,17694,17709,17714,17737,17742,17749,17754,17860,17905,17957,17964,18090,18122,4,2,114,117,17700,17706,103,101,116,59,1,8982,59,1,964,114,107,59,1,9140,4,3,97,101,121,17722,17728,17734,114,111,110,59,1,357,100,105,108,59,1,355,59,1,1090,111,116,59,1,8411,108,114,101,99,59,1,8981,114,59,3,55349,56625,4,4,101,105,107,111,17764,17805,17836,17851,4,2,114,116,17770,17786,101,4,2,52,102,17777,17780,59,1,8756,111,114,101,59,1,8756,97,4,3,59,115,118,17795,17797,17802,1,952,121,109,59,1,977,59,1,977,4,2,99,110,17811,17831,107,4,2,97,115,17818,17826,112,112,114,111,120,59,1,8776,105,109,59,1,8764,115,112,59,1,8201,4,2,97,115,17842,17846,112,59,1,8776,105,109,59,1,8764,114,110,5,254,1,59,17858,1,254,4,3,108,109,110,17868,17873,17901,100,101,59,1,732,101,115,5,215,3,59,98,100,17884,17886,17898,1,215,4,2,59,97,17892,17894,1,8864,114,59,1,10801,59,1,10800,116,59,1,8749,4,3,101,112,115,17913,17917,17953,97,59,1,10536,4,4,59,98,99,102,17927,17929,17934,17939,1,8868,111,116,59,1,9014,105,114,59,1,10993,4,2,59,111,17945,17948,3,55349,56677,114,107,59,1,10970,97,59,1,10537,114,105,109,101,59,1,8244,4,3,97,105,112,17972,17977,18082,100,101,59,1,8482,4,7,97,100,101,109,112,115,116,17993,18051,18056,18059,18066,18072,18076,110,103,108,101,4,5,59,100,108,113,114,18009,18011,18017,18032,18035,1,9653,111,119,110,59,1,9663,101,102,116,4,2,59,101,18026,18028,1,9667,113,59,1,8884,59,1,8796,105,103,104,116,4,2,59,101,18045,18047,1,9657,113,59,1,8885,111,116,59,1,9708,59,1,8796,105,110,117,115,59,1,10810,108,117,115,59,1,10809,98,59,1,10701,105,109,101,59,1,10811,101,122,105,117,109,59,1,9186,4,3,99,104,116,18098,18111,18116,4,2,114,121,18104,18108,59,3,55349,56521,59,1,1094,99,121,59,1,1115,114,111,107,59,1,359,4,2,105,111,18128,18133,120,116,59,1,8812,104,101,97,100,4,2,108,114,18143,18154,101,102,116,97,114,114,111,119,59,1,8606,105,103,104,116,97,114,114,111,119,59,1,8608,4,18,65,72,97,98,99,100,102,103,104,108,109,111,112,114,115,116,117,119,18204,18209,18214,18234,18250,18268,18292,18308,18319,18343,18379,18397,18413,18504,18547,18553,18584,18603,114,114,59,1,8657,97,114,59,1,10595,4,2,99,114,18220,18230,117,116,101,5,250,1,59,18228,1,250,114,59,1,8593,114,4,2,99,101,18241,18245,121,59,1,1118,118,101,59,1,365,4,2,105,121,18256,18265,114,99,5,251,1,59,18263,1,251,59,1,1091,4,3,97,98,104,18276,18281,18287,114,114,59,1,8645,108,97,99,59,1,369,97,114,59,1,10606,4,2,105,114,18298,18304,115,104,116,59,1,10622,59,3,55349,56626,114,97,118,101,5,249,1,59,18317,1,249,4,2,97,98,18325,18338,114,4,2,108,114,18332,18335,59,1,8639,59,1,8638,108,107,59,1,9600,4,2,99,116,18349,18374,4,2,111,114,18355,18369,114,110,4,2,59,101,18363,18365,1,8988,114,59,1,8988,111,112,59,1,8975,114,105,59,1,9720,4,2,97,108,18385,18390,99,114,59,1,363,5,168,1,59,18395,1,168,4,2,103,112,18403,18408,111,110,59,1,371,102,59,3,55349,56678,4,6,97,100,104,108,115,117,18427,18434,18445,18470,18475,18494,114,114,111,119,59,1,8593,111,119,110,97,114,114,111,119,59,1,8597,97,114,112,111,111,110,4,2,108,114,18457,18463,101,102,116,59,1,8639,105,103,104,116,59,1,8638,117,115,59,1,8846,105,4,3,59,104,108,18484,18486,18489,1,965,59,1,978,111,110,59,1,965,112,97,114,114,111,119,115,59,1,8648,4,3,99,105,116,18512,18537,18542,4,2,111,114,18518,18532,114,110,4,2,59,101,18526,18528,1,8989,114,59,1,8989,111,112,59,1,8974,110,103,59,1,367,114,105,59,1,9721,99,114,59,3,55349,56522,4,3,100,105,114,18561,18566,18572,111,116,59,1,8944,108,100,101,59,1,361,105,4,2,59,102,18579,18581,1,9653,59,1,9652,4,2,97,109,18590,18595,114,114,59,1,8648,108,5,252,1,59,18601,1,252,97,110,103,108,101,59,1,10663,4,15,65,66,68,97,99,100,101,102,108,110,111,112,114,115,122,18643,18648,18661,18667,18847,18851,18857,18904,18909,18915,18931,18937,18943,18949,18996,114,114,59,1,8661,97,114,4,2,59,118,18656,18658,1,10984,59,1,10985,97,115,104,59,1,8872,4,2,110,114,18673,18679,103,114,116,59,1,10652,4,7,101,107,110,112,114,115,116,18695,18704,18711,18720,18742,18754,18810,112,115,105,108,111,110,59,1,1013,97,112,112,97,59,1,1008,111,116,104,105,110,103,59,1,8709,4,3,104,105,114,18728,18732,18735,105,59,1,981,59,1,982,111,112,116,111,59,1,8733,4,2,59,104,18748,18750,1,8597,111,59,1,1009,4,2,105,117,18760,18766,103,109,97,59,1,962,4,2,98,112,18772,18791,115,101,116,110,101,113,4,2,59,113,18784,18787,3,8842,65024,59,3,10955,65024,115,101,116,110,101,113,4,2,59,113,18803,18806,3,8843,65024,59,3,10956,65024,4,2,104,114,18816,18822,101,116,97,59,1,977,105,97,110,103,108,101,4,2,108,114,18834,18840,101,102,116,59,1,8882,105,103,104,116,59,1,8883,121,59,1,1074,97,115,104,59,1,8866,4,3,101,108,114,18865,18884,18890,4,3,59,98,101,18873,18875,18880,1,8744,97,114,59,1,8891,113,59,1,8794,108,105,112,59,1,8942,4,2,98,116,18896,18901,97,114,59,1,124,59,1,124,114,59,3,55349,56627,116,114,105,59,1,8882,115,117,4,2,98,112,18923,18927,59,3,8834,8402,59,3,8835,8402,112,102,59,3,55349,56679,114,111,112,59,1,8733,116,114,105,59,1,8883,4,2,99,117,18955,18960,114,59,3,55349,56523,4,2,98,112,18966,18981,110,4,2,69,101,18973,18977,59,3,10955,65024,59,3,8842,65024,110,4,2,69,101,18988,18992,59,3,10956,65024,59,3,8843,65024,105,103,122,97,103,59,1,10650,4,7,99,101,102,111,112,114,115,19020,19026,19061,19066,19072,19075,19089,105,114,99,59,1,373,4,2,100,105,19032,19055,4,2,98,103,19038,19043,97,114,59,1,10847,101,4,2,59,113,19050,19052,1,8743,59,1,8793,101,114,112,59,1,8472,114,59,3,55349,56628,112,102,59,3,55349,56680,59,1,8472,4,2,59,101,19081,19083,1,8768,97,116,104,59,1,8768,99,114,59,3,55349,56524,4,14,99,100,102,104,105,108,109,110,111,114,115,117,118,119,19125,19146,19152,19157,19173,19176,19192,19197,19202,19236,19252,19269,19286,19291,4,3,97,105,117,19133,19137,19142,112,59,1,8898,114,99,59,1,9711,112,59,1,8899,116,114,105,59,1,9661,114,59,3,55349,56629,4,2,65,97,19163,19168,114,114,59,1,10234,114,114,59,1,10231,59,1,958,4,2,65,97,19182,19187,114,114,59,1,10232,114,114,59,1,10229,97,112,59,1,10236,105,115,59,1,8955,4,3,100,112,116,19210,19215,19230,111,116,59,1,10752,4,2,102,108,19221,19225,59,3,55349,56681,117,115,59,1,10753,105,109,101,59,1,10754,4,2,65,97,19242,19247,114,114,59,1,10233,114,114,59,1,10230,4,2,99,113,19258,19263,114,59,3,55349,56525,99,117,112,59,1,10758,4,2,112,116,19275,19281,108,117,115,59,1,10756,114,105,59,1,9651,101,101,59,1,8897,101,100,103,101,59,1,8896,4,8,97,99,101,102,105,111,115,117,19316,19335,19349,19357,19362,19367,19373,19379,99,4,2,117,121,19323,19332,116,101,5,253,1,59,19330,1,253,59,1,1103,4,2,105,121,19341,19346,114,99,59,1,375,59,1,1099,110,5,165,1,59,19355,1,165,114,59,3,55349,56630,99,121,59,1,1111,112,102,59,3,55349,56682,99,114,59,3,55349,56526,4,2,99,109,19385,19389,121,59,1,1102,108,5,255,1,59,19395,1,255,4,10,97,99,100,101,102,104,105,111,115,119,19419,19426,19441,19446,19462,19467,19472,19480,19486,19492,99,117,116,101,59,1,378,4,2,97,121,19432,19438,114,111,110,59,1,382,59,1,1079,111,116,59,1,380,4,2,101,116,19452,19458,116,114,102,59,1,8488,97,59,1,950,114,59,3,55349,56631,99,121,59,1,1078,103,114,97,114,114,59,1,8669,112,102,59,3,55349,56683,99,114,59,3,55349,56527,4,2,106,110,19498,19501,59,1,8205,106,59,1,8204]);const P=s,H={DASH_DASH_STRING:[45,45],DOCTYPE_STRING:[68,79,67,84,89,80,69],CDATA_START_STRING:[91,67,68,65,84,65,91],SCRIPT_STRING:[115,99,114,105,112,116],PUBLIC_STRING:[80,85,66,76,73,67],SYSTEM_STRING:[83,89,83,84,69,77]},D={128:8364,130:8218,131:402,132:8222,133:8230,134:8224,135:8225,136:710,137:8240,138:352,139:8249,140:338,142:381,145:8216,146:8217,147:8220,148:8221,149:8226,150:8211,151:8212,152:732,153:8482,154:353,155:8250,156:339,158:382,159:376},F="DATA_STATE",U="RCDATA_STATE",G="RAWTEXT_STATE",B="SCRIPT_DATA_STATE",K="PLAINTEXT_STATE",b="TAG_OPEN_STATE",x="END_TAG_OPEN_STATE",y="TAG_NAME_STATE",v="RCDATA_LESS_THAN_SIGN_STATE",Y="RCDATA_END_TAG_OPEN_STATE",w="RCDATA_END_TAG_NAME_STATE",Q="RAWTEXT_LESS_THAN_SIGN_STATE",X="RAWTEXT_END_TAG_OPEN_STATE",W="RAWTEXT_END_TAG_NAME_STATE",V="SCRIPT_DATA_LESS_THAN_SIGN_STATE",j="SCRIPT_DATA_END_TAG_OPEN_STATE",z="SCRIPT_DATA_END_TAG_NAME_STATE",q="SCRIPT_DATA_ESCAPE_START_STATE",J="SCRIPT_DATA_ESCAPE_START_DASH_STATE",Z="SCRIPT_DATA_ESCAPED_STATE",$="SCRIPT_DATA_ESCAPED_DASH_STATE",ee="SCRIPT_DATA_ESCAPED_DASH_DASH_STATE",te="SCRIPT_DATA_ESCAPED_LESS_THAN_SIGN_STATE",ne="SCRIPT_DATA_ESCAPED_END_TAG_OPEN_STATE",se="SCRIPT_DATA_ESCAPED_END_TAG_NAME_STATE",re="SCRIPT_DATA_DOUBLE_ESCAPE_START_STATE",ie="SCRIPT_DATA_DOUBLE_ESCAPED_STATE",oe="SCRIPT_DATA_DOUBLE_ESCAPED_DASH_STATE",ae="SCRIPT_DATA_DOUBLE_ESCAPED_DASH_DASH_STATE",Te="SCRIPT_DATA_DOUBLE_ESCAPED_LESS_THAN_SIGN_STATE",Ee="SCRIPT_DATA_DOUBLE_ESCAPE_END_STATE",he="BEFORE_ATTRIBUTE_NAME_STATE",ce="ATTRIBUTE_NAME_STATE",_e="AFTER_ATTRIBUTE_NAME_STATE",le="BEFORE_ATTRIBUTE_VALUE_STATE",me="ATTRIBUTE_VALUE_DOUBLE_QUOTED_STATE",pe="ATTRIBUTE_VALUE_SINGLE_QUOTED_STATE",Ae="ATTRIBUTE_VALUE_UNQUOTED_STATE",ue="AFTER_ATTRIBUTE_VALUE_QUOTED_STATE",Ne="SELF_CLOSING_START_TAG_STATE",de="BOGUS_COMMENT_STATE",Ce="MARKUP_DECLARATION_OPEN_STATE",Oe="COMMENT_START_STATE",fe="COMMENT_START_DASH_STATE",Se="COMMENT_STATE",Re="COMMENT_LESS_THAN_SIGN_STATE",Ie="COMMENT_LESS_THAN_SIGN_BANG_STATE",Le="COMMENT_LESS_THAN_SIGN_BANG_DASH_STATE",ke="COMMENT_LESS_THAN_SIGN_BANG_DASH_DASH_STATE",Me="COMMENT_END_DASH_STATE",ge="COMMENT_END_STATE",Pe="COMMENT_END_BANG_STATE",He="DOCTYPE_STATE",De="BEFORE_DOCTYPE_NAME_STATE",Fe="DOCTYPE_NAME_STATE",Ue="AFTER_DOCTYPE_NAME_STATE",Ge="AFTER_DOCTYPE_PUBLIC_KEYWORD_STATE",Be="BEFORE_DOCTYPE_PUBLIC_IDENTIFIER_STATE",Ke="DOCTYPE_PUBLIC_IDENTIFIER_DOUBLE_QUOTED_STATE",be="DOCTYPE_PUBLIC_IDENTIFIER_SINGLE_QUOTED_STATE",xe="AFTER_DOCTYPE_PUBLIC_IDENTIFIER_STATE",ye="BETWEEN_DOCTYPE_PUBLIC_AND_SYSTEM_IDENTIFIERS_STATE",ve="AFTER_DOCTYPE_SYSTEM_KEYWORD_STATE",Ye="BEFORE_DOCTYPE_SYSTEM_IDENTIFIER_STATE",we="DOCTYPE_SYSTEM_IDENTIFIER_DOUBLE_QUOTED_STATE",Qe="DOCTYPE_SYSTEM_IDENTIFIER_SINGLE_QUOTED_STATE",Xe="AFTER_DOCTYPE_SYSTEM_IDENTIFIER_STATE",We="BOGUS_DOCTYPE_STATE",Ve="CDATA_SECTION_STATE",je="CDATA_SECTION_BRACKET_STATE",ze="CDATA_SECTION_END_STATE",qe="CHARACTER_REFERENCE_STATE",Je="NAMED_CHARACTER_REFERENCE_STATE",Ze="AMBIGUOS_AMPERSAND_STATE",$e="NUMERIC_CHARACTER_REFERENCE_STATE",et="HEXADEMICAL_CHARACTER_REFERENCE_START_STATE",tt="DECIMAL_CHARACTER_REFERENCE_START_STATE",nt="HEXADEMICAL_CHARACTER_REFERENCE_STATE",st="DECIMAL_CHARACTER_REFERENCE_STATE",rt="NUMERIC_CHARACTER_REFERENCE_END_STATE";function it(e){return e===P.SPACE||e===P.LINE_FEED||e===P.TABULATION||e===P.FORM_FEED}function ot(e){return e>=P.DIGIT_0&&e<=P.DIGIT_9}function at(e){return e>=P.LATIN_CAPITAL_A&&e<=P.LATIN_CAPITAL_Z}function Tt(e){return e>=P.LATIN_SMALL_A&&e<=P.LATIN_SMALL_Z}function Et(e){return Tt(e)||at(e)}function ht(e){return Et(e)||ot(e)}function ct(e){return e>=P.LATIN_CAPITAL_A&&e<=P.LATIN_CAPITAL_F}function _t(e){return e>=P.LATIN_SMALL_A&&e<=P.LATIN_SMALL_F}function lt(e){return e+32}function mt(e){return e<=65535?String.fromCharCode(e):(e-=65536,String.fromCharCode(e>>>10&1023|55296)+String.fromCharCode(56320|1023&e))}function pt(e){return String.fromCharCode(lt(e))}function At(e,t){const n=g[++e];let s=++e,r=s+n-1;for(;s<=r;){const e=s+r>>>1,i=g[e];if(i<t)s=e+1;else {if(!(i>t))return g[e+n];r=e-1;}}return -1}class ut{constructor(){this.preprocessor=new class{constructor(){this.html=null,this.pos=-1,this.lastGapPos=-1,this.lastCharPos=-1,this.gapStack=[],this.skipNextNewLine=!1,this.lastChunkWritten=!1,this.endOfChunkHit=!1,this.bufferWaterline=65536;}_err(){}_addGap(){this.gapStack.push(this.lastGapPos),this.lastGapPos=this.pos;}_processSurrogate(e){if(this.pos!==this.lastCharPos){const t=this.html.charCodeAt(this.pos+1);if(function(e){return e>=56320&&e<=57343}(t))return this.pos++,this._addGap(),1024*(e-55296)+9216+t}else if(!this.lastChunkWritten)return this.endOfChunkHit=!0,M.EOF;return this._err("surrogate-in-input-stream"),e}dropParsedChunk(){this.pos>this.bufferWaterline&&(this.lastCharPos-=this.pos,this.html=this.html.substring(this.pos),this.pos=0,this.lastGapPos=-1,this.gapStack=[]);}write(e,t){this.html?this.html+=e:this.html=e,this.lastCharPos=this.html.length-1,this.endOfChunkHit=!1,this.lastChunkWritten=t;}insertHtmlAtCurrentPos(e){this.html=this.html.substring(0,this.pos+1)+e+this.html.substring(this.pos+1,this.html.length),this.lastCharPos=this.html.length-1,this.endOfChunkHit=!1;}advance(){if(this.pos++,this.pos>this.lastCharPos)return this.endOfChunkHit=!this.lastChunkWritten,M.EOF;let e=this.html.charCodeAt(this.pos);return this.skipNextNewLine&&e===M.LINE_FEED?(this.skipNextNewLine=!1,this._addGap(),this.advance()):e===M.CARRIAGE_RETURN?(this.skipNextNewLine=!0,M.LINE_FEED):(this.skipNextNewLine=!1,r(e)&&(e=this._processSurrogate(e)),e>31&&e<127||e===M.LINE_FEED||e===M.CARRIAGE_RETURN||e>159&&e<64976||this._checkForProblematicCharacters(e),e)}_checkForProblematicCharacters(e){i(e)?this._err("control-character-in-input-stream"):o(e)&&this._err("noncharacter-in-input-stream");}retreat(){this.pos===this.lastGapPos&&(this.lastGapPos=this.gapStack.pop(),this.pos--),this.pos--;}},this.tokenQueue=[],this.allowCDATA=!1,this.state=F,this.returnState="",this.charRefCode=-1,this.tempBuff=[],this.lastStartTagName="",this.consumedAfterSnapshot=-1,this.active=!1,this.currentCharacterToken=null,this.currentToken=null,this.currentAttr=null;}_err(){}_errOnNextCodePoint(e){this._consume(),this._err(e),this._unconsume();}getNextToken(){for(;!this.tokenQueue.length&&this.active;){this.consumedAfterSnapshot=0;const e=this._consume();this._ensureHibernation()||this[this.state](e);}return this.tokenQueue.shift()}write(e,t){this.active=!0,this.preprocessor.write(e,t);}insertHtmlAtCurrentPos(e){this.active=!0,this.preprocessor.insertHtmlAtCurrentPos(e);}_ensureHibernation(){if(this.preprocessor.endOfChunkHit){for(;this.consumedAfterSnapshot>0;this.consumedAfterSnapshot--)this.preprocessor.retreat();return this.active=!1,this.tokenQueue.push({type:ut.HIBERNATION_TOKEN}),!0}return !1}_consume(){return this.consumedAfterSnapshot++,this.preprocessor.advance()}_unconsume(){this.consumedAfterSnapshot--,this.preprocessor.retreat();}_reconsumeInState(e){this.state=e,this._unconsume();}_consumeSequenceIfMatch(e,t,n){let s=0,r=!0;const i=e.length;let o,a=0,T=t;for(;a<i;a++){if(a>0&&(T=this._consume(),s++),T===P.EOF){r=!1;break}if(o=e[a],T!==o&&(n||T!==lt(o))){r=!1;break}}if(!r)for(;s--;)this._unconsume();return r}_isTempBufferEqualToScriptString(){if(this.tempBuff.length!==H.SCRIPT_STRING.length)return !1;for(let e=0;e<this.tempBuff.length;e++)if(this.tempBuff[e]!==H.SCRIPT_STRING[e])return !1;return !0}_createStartTagToken(){this.currentToken={type:ut.START_TAG_TOKEN,tagName:"",selfClosing:!1,ackSelfClosing:!1,attrs:[]};}_createEndTagToken(){this.currentToken={type:ut.END_TAG_TOKEN,tagName:"",selfClosing:!1,attrs:[]};}_createCommentToken(){this.currentToken={type:ut.COMMENT_TOKEN,data:""};}_createDoctypeToken(e){this.currentToken={type:ut.DOCTYPE_TOKEN,name:e,forceQuirks:!1,publicId:null,systemId:null};}_createCharacterToken(e,t){this.currentCharacterToken={type:e,chars:t};}_createEOFToken(){this.currentToken={type:ut.EOF_TOKEN};}_createAttr(e){this.currentAttr={name:e,value:""};}_leaveAttrName(e){null===ut.getTokenAttr(this.currentToken,this.currentAttr.name)?this.currentToken.attrs.push(this.currentAttr):this._err("duplicate-attribute"),this.state=e;}_leaveAttrValue(e){this.state=e;}_emitCurrentToken(){this._emitCurrentCharacterToken();const e=this.currentToken;this.currentToken=null,e.type===ut.START_TAG_TOKEN?this.lastStartTagName=e.tagName:e.type===ut.END_TAG_TOKEN&&(e.attrs.length>0&&this._err("end-tag-with-attributes"),e.selfClosing&&this._err("end-tag-with-trailing-solidus")),this.tokenQueue.push(e);}_emitCurrentCharacterToken(){this.currentCharacterToken&&(this.tokenQueue.push(this.currentCharacterToken),this.currentCharacterToken=null);}_emitEOFToken(){this._createEOFToken(),this._emitCurrentToken();}_appendCharToCurrentCharacterToken(e,t){this.currentCharacterToken&&this.currentCharacterToken.type!==e&&this._emitCurrentCharacterToken(),this.currentCharacterToken?this.currentCharacterToken.chars+=t:this._createCharacterToken(e,t);}_emitCodePoint(e){let t=ut.CHARACTER_TOKEN;it(e)?t=ut.WHITESPACE_CHARACTER_TOKEN:e===P.NULL&&(t=ut.NULL_CHARACTER_TOKEN),this._appendCharToCurrentCharacterToken(t,mt(e));}_emitSeveralCodePoints(e){for(let t=0;t<e.length;t++)this._emitCodePoint(e[t]);}_emitChars(e){this._appendCharToCurrentCharacterToken(ut.CHARACTER_TOKEN,e);}_matchNamedCharacterReference(e){let t=null,n=1,s=At(0,e);for(this.tempBuff.push(e);s>-1;){const e=g[s],r=e<7;r&&1&e&&(t=2&e?[g[++s],g[++s]]:[g[++s]],n=0);const i=this._consume();if(this.tempBuff.push(i),n++,i===P.EOF)break;s=r?4&e?At(s,i):-1:i===e?++s:-1;}for(;n--;)this.tempBuff.pop(),this._unconsume();return t}_isCharacterReferenceInAttribute(){return this.returnState===me||this.returnState===pe||this.returnState===Ae}_isCharacterReferenceAttributeQuirk(e){if(!e&&this._isCharacterReferenceInAttribute()){const e=this._consume();return this._unconsume(),e===P.EQUALS_SIGN||ht(e)}return !1}_flushCodePointsConsumedAsCharacterReference(){if(this._isCharacterReferenceInAttribute())for(let e=0;e<this.tempBuff.length;e++)this.currentAttr.value+=mt(this.tempBuff[e]);else this._emitSeveralCodePoints(this.tempBuff);this.tempBuff=[];}[F](e){this.preprocessor.dropParsedChunk(),e===P.LESS_THAN_SIGN?this.state=b:e===P.AMPERSAND?(this.returnState=F,this.state=qe):e===P.NULL?(this._err(a),this._emitCodePoint(e)):e===P.EOF?this._emitEOFToken():this._emitCodePoint(e);}[U](e){this.preprocessor.dropParsedChunk(),e===P.AMPERSAND?(this.returnState=U,this.state=qe):e===P.LESS_THAN_SIGN?this.state=v:e===P.NULL?(this._err(a),this._emitChars(n)):e===P.EOF?this._emitEOFToken():this._emitCodePoint(e);}[G](e){this.preprocessor.dropParsedChunk(),e===P.LESS_THAN_SIGN?this.state=Q:e===P.NULL?(this._err(a),this._emitChars(n)):e===P.EOF?this._emitEOFToken():this._emitCodePoint(e);}[B](e){this.preprocessor.dropParsedChunk(),e===P.LESS_THAN_SIGN?this.state=V:e===P.NULL?(this._err(a),this._emitChars(n)):e===P.EOF?this._emitEOFToken():this._emitCodePoint(e);}[K](e){this.preprocessor.dropParsedChunk(),e===P.NULL?(this._err(a),this._emitChars(n)):e===P.EOF?this._emitEOFToken():this._emitCodePoint(e);}[b](e){e===P.EXCLAMATION_MARK?this.state=Ce:e===P.SOLIDUS?this.state=x:Et(e)?(this._createStartTagToken(),this._reconsumeInState(y)):e===P.QUESTION_MARK?(this._err("unexpected-question-mark-instead-of-tag-name"),this._createCommentToken(),this._reconsumeInState(de)):e===P.EOF?(this._err(h),this._emitChars("<"),this._emitEOFToken()):(this._err(T),this._emitChars("<"),this._reconsumeInState(F));}[x](e){Et(e)?(this._createEndTagToken(),this._reconsumeInState(y)):e===P.GREATER_THAN_SIGN?(this._err("missing-end-tag-name"),this.state=F):e===P.EOF?(this._err(h),this._emitChars("</"),this._emitEOFToken()):(this._err(T),this._createCommentToken(),this._reconsumeInState(de));}[y](e){it(e)?this.state=he:e===P.SOLIDUS?this.state=Ne:e===P.GREATER_THAN_SIGN?(this.state=F,this._emitCurrentToken()):at(e)?this.currentToken.tagName+=pt(e):e===P.NULL?(this._err(a),this.currentToken.tagName+=n):e===P.EOF?(this._err(c),this._emitEOFToken()):this.currentToken.tagName+=mt(e);}[v](e){e===P.SOLIDUS?(this.tempBuff=[],this.state=Y):(this._emitChars("<"),this._reconsumeInState(U));}[Y](e){Et(e)?(this._createEndTagToken(),this._reconsumeInState(w)):(this._emitChars("</"),this._reconsumeInState(U));}[w](e){if(at(e))this.currentToken.tagName+=pt(e),this.tempBuff.push(e);else if(Tt(e))this.currentToken.tagName+=mt(e),this.tempBuff.push(e);else {if(this.lastStartTagName===this.currentToken.tagName){if(it(e))return void(this.state=he);if(e===P.SOLIDUS)return void(this.state=Ne);if(e===P.GREATER_THAN_SIGN)return this.state=F,void this._emitCurrentToken()}this._emitChars("</"),this._emitSeveralCodePoints(this.tempBuff),this._reconsumeInState(U);}}[Q](e){e===P.SOLIDUS?(this.tempBuff=[],this.state=X):(this._emitChars("<"),this._reconsumeInState(G));}[X](e){Et(e)?(this._createEndTagToken(),this._reconsumeInState(W)):(this._emitChars("</"),this._reconsumeInState(G));}[W](e){if(at(e))this.currentToken.tagName+=pt(e),this.tempBuff.push(e);else if(Tt(e))this.currentToken.tagName+=mt(e),this.tempBuff.push(e);else {if(this.lastStartTagName===this.currentToken.tagName){if(it(e))return void(this.state=he);if(e===P.SOLIDUS)return void(this.state=Ne);if(e===P.GREATER_THAN_SIGN)return this._emitCurrentToken(),void(this.state=F)}this._emitChars("</"),this._emitSeveralCodePoints(this.tempBuff),this._reconsumeInState(G);}}[V](e){e===P.SOLIDUS?(this.tempBuff=[],this.state=j):e===P.EXCLAMATION_MARK?(this.state=q,this._emitChars("<!")):(this._emitChars("<"),this._reconsumeInState(B));}[j](e){Et(e)?(this._createEndTagToken(),this._reconsumeInState(z)):(this._emitChars("</"),this._reconsumeInState(B));}[z](e){if(at(e))this.currentToken.tagName+=pt(e),this.tempBuff.push(e);else if(Tt(e))this.currentToken.tagName+=mt(e),this.tempBuff.push(e);else {if(this.lastStartTagName===this.currentToken.tagName){if(it(e))return void(this.state=he);if(e===P.SOLIDUS)return void(this.state=Ne);if(e===P.GREATER_THAN_SIGN)return this._emitCurrentToken(),void(this.state=F)}this._emitChars("</"),this._emitSeveralCodePoints(this.tempBuff),this._reconsumeInState(B);}}[q](e){e===P.HYPHEN_MINUS?(this.state=J,this._emitChars("-")):this._reconsumeInState(B);}[J](e){e===P.HYPHEN_MINUS?(this.state=ee,this._emitChars("-")):this._reconsumeInState(B);}[Z](e){e===P.HYPHEN_MINUS?(this.state=$,this._emitChars("-")):e===P.LESS_THAN_SIGN?this.state=te:e===P.NULL?(this._err(a),this._emitChars(n)):e===P.EOF?(this._err(O),this._emitEOFToken()):this._emitCodePoint(e);}[$](e){e===P.HYPHEN_MINUS?(this.state=ee,this._emitChars("-")):e===P.LESS_THAN_SIGN?this.state=te:e===P.NULL?(this._err(a),this.state=Z,this._emitChars(n)):e===P.EOF?(this._err(O),this._emitEOFToken()):(this.state=Z,this._emitCodePoint(e));}[ee](e){e===P.HYPHEN_MINUS?this._emitChars("-"):e===P.LESS_THAN_SIGN?this.state=te:e===P.GREATER_THAN_SIGN?(this.state=B,this._emitChars(">")):e===P.NULL?(this._err(a),this.state=Z,this._emitChars(n)):e===P.EOF?(this._err(O),this._emitEOFToken()):(this.state=Z,this._emitCodePoint(e));}[te](e){e===P.SOLIDUS?(this.tempBuff=[],this.state=ne):Et(e)?(this.tempBuff=[],this._emitChars("<"),this._reconsumeInState(re)):(this._emitChars("<"),this._reconsumeInState(Z));}[ne](e){Et(e)?(this._createEndTagToken(),this._reconsumeInState(se)):(this._emitChars("</"),this._reconsumeInState(Z));}[se](e){if(at(e))this.currentToken.tagName+=pt(e),this.tempBuff.push(e);else if(Tt(e))this.currentToken.tagName+=mt(e),this.tempBuff.push(e);else {if(this.lastStartTagName===this.currentToken.tagName){if(it(e))return void(this.state=he);if(e===P.SOLIDUS)return void(this.state=Ne);if(e===P.GREATER_THAN_SIGN)return this._emitCurrentToken(),void(this.state=F)}this._emitChars("</"),this._emitSeveralCodePoints(this.tempBuff),this._reconsumeInState(Z);}}[re](e){it(e)||e===P.SOLIDUS||e===P.GREATER_THAN_SIGN?(this.state=this._isTempBufferEqualToScriptString()?ie:Z,this._emitCodePoint(e)):at(e)?(this.tempBuff.push(lt(e)),this._emitCodePoint(e)):Tt(e)?(this.tempBuff.push(e),this._emitCodePoint(e)):this._reconsumeInState(Z);}[ie](e){e===P.HYPHEN_MINUS?(this.state=oe,this._emitChars("-")):e===P.LESS_THAN_SIGN?(this.state=Te,this._emitChars("<")):e===P.NULL?(this._err(a),this._emitChars(n)):e===P.EOF?(this._err(O),this._emitEOFToken()):this._emitCodePoint(e);}[oe](e){e===P.HYPHEN_MINUS?(this.state=ae,this._emitChars("-")):e===P.LESS_THAN_SIGN?(this.state=Te,this._emitChars("<")):e===P.NULL?(this._err(a),this.state=ie,this._emitChars(n)):e===P.EOF?(this._err(O),this._emitEOFToken()):(this.state=ie,this._emitCodePoint(e));}[ae](e){e===P.HYPHEN_MINUS?this._emitChars("-"):e===P.LESS_THAN_SIGN?(this.state=Te,this._emitChars("<")):e===P.GREATER_THAN_SIGN?(this.state=B,this._emitChars(">")):e===P.NULL?(this._err(a),this.state=ie,this._emitChars(n)):e===P.EOF?(this._err(O),this._emitEOFToken()):(this.state=ie,this._emitCodePoint(e));}[Te](e){e===P.SOLIDUS?(this.tempBuff=[],this.state=Ee,this._emitChars("/")):this._reconsumeInState(ie);}[Ee](e){it(e)||e===P.SOLIDUS||e===P.GREATER_THAN_SIGN?(this.state=this._isTempBufferEqualToScriptString()?Z:ie,this._emitCodePoint(e)):at(e)?(this.tempBuff.push(lt(e)),this._emitCodePoint(e)):Tt(e)?(this.tempBuff.push(e),this._emitCodePoint(e)):this._reconsumeInState(ie);}[he](e){it(e)||(e===P.SOLIDUS||e===P.GREATER_THAN_SIGN||e===P.EOF?this._reconsumeInState(_e):e===P.EQUALS_SIGN?(this._err("unexpected-equals-sign-before-attribute-name"),this._createAttr("="),this.state=ce):(this._createAttr(""),this._reconsumeInState(ce)));}[ce](e){it(e)||e===P.SOLIDUS||e===P.GREATER_THAN_SIGN||e===P.EOF?(this._leaveAttrName(_e),this._unconsume()):e===P.EQUALS_SIGN?this._leaveAttrName(le):at(e)?this.currentAttr.name+=pt(e):e===P.QUOTATION_MARK||e===P.APOSTROPHE||e===P.LESS_THAN_SIGN?(this._err("unexpected-character-in-attribute-name"),this.currentAttr.name+=mt(e)):e===P.NULL?(this._err(a),this.currentAttr.name+=n):this.currentAttr.name+=mt(e);}[_e](e){it(e)||(e===P.SOLIDUS?this.state=Ne:e===P.EQUALS_SIGN?this.state=le:e===P.GREATER_THAN_SIGN?(this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(c),this._emitEOFToken()):(this._createAttr(""),this._reconsumeInState(ce)));}[le](e){it(e)||(e===P.QUOTATION_MARK?this.state=me:e===P.APOSTROPHE?this.state=pe:e===P.GREATER_THAN_SIGN?(this._err("missing-attribute-value"),this.state=F,this._emitCurrentToken()):this._reconsumeInState(Ae));}[me](e){e===P.QUOTATION_MARK?this.state=ue:e===P.AMPERSAND?(this.returnState=me,this.state=qe):e===P.NULL?(this._err(a),this.currentAttr.value+=n):e===P.EOF?(this._err(c),this._emitEOFToken()):this.currentAttr.value+=mt(e);}[pe](e){e===P.APOSTROPHE?this.state=ue:e===P.AMPERSAND?(this.returnState=pe,this.state=qe):e===P.NULL?(this._err(a),this.currentAttr.value+=n):e===P.EOF?(this._err(c),this._emitEOFToken()):this.currentAttr.value+=mt(e);}[Ae](e){it(e)?this._leaveAttrValue(he):e===P.AMPERSAND?(this.returnState=Ae,this.state=qe):e===P.GREATER_THAN_SIGN?(this._leaveAttrValue(F),this._emitCurrentToken()):e===P.NULL?(this._err(a),this.currentAttr.value+=n):e===P.QUOTATION_MARK||e===P.APOSTROPHE||e===P.LESS_THAN_SIGN||e===P.EQUALS_SIGN||e===P.GRAVE_ACCENT?(this._err("unexpected-character-in-unquoted-attribute-value"),this.currentAttr.value+=mt(e)):e===P.EOF?(this._err(c),this._emitEOFToken()):this.currentAttr.value+=mt(e);}[ue](e){it(e)?this._leaveAttrValue(he):e===P.SOLIDUS?this._leaveAttrValue(Ne):e===P.GREATER_THAN_SIGN?(this._leaveAttrValue(F),this._emitCurrentToken()):e===P.EOF?(this._err(c),this._emitEOFToken()):(this._err("missing-whitespace-between-attributes"),this._reconsumeInState(he));}[Ne](e){e===P.GREATER_THAN_SIGN?(this.currentToken.selfClosing=!0,this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(c),this._emitEOFToken()):(this._err("unexpected-solidus-in-tag"),this._reconsumeInState(he));}[de](e){e===P.GREATER_THAN_SIGN?(this.state=F,this._emitCurrentToken()):e===P.EOF?(this._emitCurrentToken(),this._emitEOFToken()):e===P.NULL?(this._err(a),this.currentToken.data+=n):this.currentToken.data+=mt(e);}[Ce](e){this._consumeSequenceIfMatch(H.DASH_DASH_STRING,e,!0)?(this._createCommentToken(),this.state=Oe):this._consumeSequenceIfMatch(H.DOCTYPE_STRING,e,!1)?this.state=He:this._consumeSequenceIfMatch(H.CDATA_START_STRING,e,!0)?this.allowCDATA?this.state=Ve:(this._err("cdata-in-html-content"),this._createCommentToken(),this.currentToken.data="[CDATA[",this.state=de):this._ensureHibernation()||(this._err("incorrectly-opened-comment"),this._createCommentToken(),this._reconsumeInState(de));}[Oe](e){e===P.HYPHEN_MINUS?this.state=fe:e===P.GREATER_THAN_SIGN?(this._err(S),this.state=F,this._emitCurrentToken()):this._reconsumeInState(Se);}[fe](e){e===P.HYPHEN_MINUS?this.state=ge:e===P.GREATER_THAN_SIGN?(this._err(S),this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(R),this._emitCurrentToken(),this._emitEOFToken()):(this.currentToken.data+="-",this._reconsumeInState(Se));}[Se](e){e===P.HYPHEN_MINUS?this.state=Me:e===P.LESS_THAN_SIGN?(this.currentToken.data+="<",this.state=Re):e===P.NULL?(this._err(a),this.currentToken.data+=n):e===P.EOF?(this._err(R),this._emitCurrentToken(),this._emitEOFToken()):this.currentToken.data+=mt(e);}[Re](e){e===P.EXCLAMATION_MARK?(this.currentToken.data+="!",this.state=Ie):e===P.LESS_THAN_SIGN?this.currentToken.data+="!":this._reconsumeInState(Se);}[Ie](e){e===P.HYPHEN_MINUS?this.state=Le:this._reconsumeInState(Se);}[Le](e){e===P.HYPHEN_MINUS?this.state=ke:this._reconsumeInState(Me);}[ke](e){e!==P.GREATER_THAN_SIGN&&e!==P.EOF&&this._err("nested-comment"),this._reconsumeInState(ge);}[Me](e){e===P.HYPHEN_MINUS?this.state=ge:e===P.EOF?(this._err(R),this._emitCurrentToken(),this._emitEOFToken()):(this.currentToken.data+="-",this._reconsumeInState(Se));}[ge](e){e===P.GREATER_THAN_SIGN?(this.state=F,this._emitCurrentToken()):e===P.EXCLAMATION_MARK?this.state=Pe:e===P.HYPHEN_MINUS?this.currentToken.data+="-":e===P.EOF?(this._err(R),this._emitCurrentToken(),this._emitEOFToken()):(this.currentToken.data+="--",this._reconsumeInState(Se));}[Pe](e){e===P.HYPHEN_MINUS?(this.currentToken.data+="--!",this.state=Me):e===P.GREATER_THAN_SIGN?(this._err("incorrectly-closed-comment"),this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(R),this._emitCurrentToken(),this._emitEOFToken()):(this.currentToken.data+="--!",this._reconsumeInState(Se));}[He](e){it(e)?this.state=De:e===P.GREATER_THAN_SIGN?this._reconsumeInState(De):e===P.EOF?(this._err(f),this._createDoctypeToken(null),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._err("missing-whitespace-before-doctype-name"),this._reconsumeInState(De));}[De](e){it(e)||(at(e)?(this._createDoctypeToken(pt(e)),this.state=Fe):e===P.NULL?(this._err(a),this._createDoctypeToken(n),this.state=Fe):e===P.GREATER_THAN_SIGN?(this._err("missing-doctype-name"),this._createDoctypeToken(null),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this.state=F):e===P.EOF?(this._err(f),this._createDoctypeToken(null),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._createDoctypeToken(mt(e)),this.state=Fe));}[Fe](e){it(e)?this.state=Ue:e===P.GREATER_THAN_SIGN?(this.state=F,this._emitCurrentToken()):at(e)?this.currentToken.name+=pt(e):e===P.NULL?(this._err(a),this.currentToken.name+=n):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):this.currentToken.name+=mt(e);}[Ue](e){it(e)||(e===P.GREATER_THAN_SIGN?(this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):this._consumeSequenceIfMatch(H.PUBLIC_STRING,e,!1)?this.state=Ge:this._consumeSequenceIfMatch(H.SYSTEM_STRING,e,!1)?this.state=ve:this._ensureHibernation()||(this._err("invalid-character-sequence-after-doctype-name"),this.currentToken.forceQuirks=!0,this._reconsumeInState(We)));}[Ge](e){it(e)?this.state=Be:e===P.QUOTATION_MARK?(this._err(_),this.currentToken.publicId="",this.state=Ke):e===P.APOSTROPHE?(this._err(_),this.currentToken.publicId="",this.state=be):e===P.GREATER_THAN_SIGN?(this._err(u),this.currentToken.forceQuirks=!0,this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._err(p),this.currentToken.forceQuirks=!0,this._reconsumeInState(We));}[Be](e){it(e)||(e===P.QUOTATION_MARK?(this.currentToken.publicId="",this.state=Ke):e===P.APOSTROPHE?(this.currentToken.publicId="",this.state=be):e===P.GREATER_THAN_SIGN?(this._err(u),this.currentToken.forceQuirks=!0,this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._err(p),this.currentToken.forceQuirks=!0,this._reconsumeInState(We)));}[Ke](e){e===P.QUOTATION_MARK?this.state=xe:e===P.NULL?(this._err(a),this.currentToken.publicId+=n):e===P.GREATER_THAN_SIGN?(this._err(d),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this.state=F):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):this.currentToken.publicId+=mt(e);}[be](e){e===P.APOSTROPHE?this.state=xe:e===P.NULL?(this._err(a),this.currentToken.publicId+=n):e===P.GREATER_THAN_SIGN?(this._err(d),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this.state=F):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):this.currentToken.publicId+=mt(e);}[xe](e){it(e)?this.state=ye:e===P.GREATER_THAN_SIGN?(this.state=F,this._emitCurrentToken()):e===P.QUOTATION_MARK?(this._err(l),this.currentToken.systemId="",this.state=we):e===P.APOSTROPHE?(this._err(l),this.currentToken.systemId="",this.state=Qe):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._err(A),this.currentToken.forceQuirks=!0,this._reconsumeInState(We));}[ye](e){it(e)||(e===P.GREATER_THAN_SIGN?(this._emitCurrentToken(),this.state=F):e===P.QUOTATION_MARK?(this.currentToken.systemId="",this.state=we):e===P.APOSTROPHE?(this.currentToken.systemId="",this.state=Qe):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._err(A),this.currentToken.forceQuirks=!0,this._reconsumeInState(We)));}[ve](e){it(e)?this.state=Ye:e===P.QUOTATION_MARK?(this._err(m),this.currentToken.systemId="",this.state=we):e===P.APOSTROPHE?(this._err(m),this.currentToken.systemId="",this.state=Qe):e===P.GREATER_THAN_SIGN?(this._err(N),this.currentToken.forceQuirks=!0,this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._err(A),this.currentToken.forceQuirks=!0,this._reconsumeInState(We));}[Ye](e){it(e)||(e===P.QUOTATION_MARK?(this.currentToken.systemId="",this.state=we):e===P.APOSTROPHE?(this.currentToken.systemId="",this.state=Qe):e===P.GREATER_THAN_SIGN?(this._err(N),this.currentToken.forceQuirks=!0,this.state=F,this._emitCurrentToken()):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._err(A),this.currentToken.forceQuirks=!0,this._reconsumeInState(We)));}[we](e){e===P.QUOTATION_MARK?this.state=Xe:e===P.NULL?(this._err(a),this.currentToken.systemId+=n):e===P.GREATER_THAN_SIGN?(this._err(C),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this.state=F):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):this.currentToken.systemId+=mt(e);}[Qe](e){e===P.APOSTROPHE?this.state=Xe:e===P.NULL?(this._err(a),this.currentToken.systemId+=n):e===P.GREATER_THAN_SIGN?(this._err(C),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this.state=F):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):this.currentToken.systemId+=mt(e);}[Xe](e){it(e)||(e===P.GREATER_THAN_SIGN?(this._emitCurrentToken(),this.state=F):e===P.EOF?(this._err(f),this.currentToken.forceQuirks=!0,this._emitCurrentToken(),this._emitEOFToken()):(this._err("unexpected-character-after-doctype-system-identifier"),this._reconsumeInState(We)));}[We](e){e===P.GREATER_THAN_SIGN?(this._emitCurrentToken(),this.state=F):e===P.NULL?this._err(a):e===P.EOF&&(this._emitCurrentToken(),this._emitEOFToken());}[Ve](e){e===P.RIGHT_SQUARE_BRACKET?this.state=je:e===P.EOF?(this._err("eof-in-cdata"),this._emitEOFToken()):this._emitCodePoint(e);}[je](e){e===P.RIGHT_SQUARE_BRACKET?this.state=ze:(this._emitChars("]"),this._reconsumeInState(Ve));}[ze](e){e===P.GREATER_THAN_SIGN?this.state=F:e===P.RIGHT_SQUARE_BRACKET?this._emitChars("]"):(this._emitChars("]]"),this._reconsumeInState(Ve));}[qe](e){this.tempBuff=[P.AMPERSAND],e===P.NUMBER_SIGN?(this.tempBuff.push(e),this.state=$e):ht(e)?this._reconsumeInState(Je):(this._flushCodePointsConsumedAsCharacterReference(),this._reconsumeInState(this.returnState));}[Je](e){const t=this._matchNamedCharacterReference(e);if(this._ensureHibernation())this.tempBuff=[P.AMPERSAND];else if(t){const e=this.tempBuff[this.tempBuff.length-1]===P.SEMICOLON;this._isCharacterReferenceAttributeQuirk(e)||(e||this._errOnNextCodePoint(E),this.tempBuff=t),this._flushCodePointsConsumedAsCharacterReference(),this.state=this.returnState;}else this._flushCodePointsConsumedAsCharacterReference(),this.state=Ze;}[Ze](e){ht(e)?this._isCharacterReferenceInAttribute()?this.currentAttr.value+=mt(e):this._emitCodePoint(e):(e===P.SEMICOLON&&this._err("unknown-named-character-reference"),this._reconsumeInState(this.returnState));}[$e](e){this.charRefCode=0,e===P.LATIN_SMALL_X||e===P.LATIN_CAPITAL_X?(this.tempBuff.push(e),this.state=et):this._reconsumeInState(tt);}[et](e){!function(e){return ot(e)||ct(e)||_t(e)}(e)?(this._err(I),this._flushCodePointsConsumedAsCharacterReference(),this._reconsumeInState(this.returnState)):this._reconsumeInState(nt);}[tt](e){ot(e)?this._reconsumeInState(st):(this._err(I),this._flushCodePointsConsumedAsCharacterReference(),this._reconsumeInState(this.returnState));}[nt](e){ct(e)?this.charRefCode=16*this.charRefCode+e-55:_t(e)?this.charRefCode=16*this.charRefCode+e-87:ot(e)?this.charRefCode=16*this.charRefCode+e-48:e===P.SEMICOLON?this.state=rt:(this._err(E),this._reconsumeInState(rt));}[st](e){ot(e)?this.charRefCode=10*this.charRefCode+e-48:e===P.SEMICOLON?this.state=rt:(this._err(E),this._reconsumeInState(rt));}[rt](){if(this.charRefCode===P.NULL)this._err("null-character-reference"),this.charRefCode=P.REPLACEMENT_CHARACTER;else if(this.charRefCode>1114111)this._err("character-reference-outside-unicode-range"),this.charRefCode=P.REPLACEMENT_CHARACTER;else if(r(this.charRefCode))this._err("surrogate-character-reference"),this.charRefCode=P.REPLACEMENT_CHARACTER;else if(o(this.charRefCode))this._err("noncharacter-character-reference");else if(i(this.charRefCode)||this.charRefCode===P.CARRIAGE_RETURN){this._err("control-character-reference");const e=D[this.charRefCode];e&&(this.charRefCode=e);}this.tempBuff=[this.charRefCode],this._flushCodePointsConsumedAsCharacterReference(),this._reconsumeInState(this.returnState);}}ut.CHARACTER_TOKEN="CHARACTER_TOKEN",ut.NULL_CHARACTER_TOKEN="NULL_CHARACTER_TOKEN",ut.WHITESPACE_CHARACTER_TOKEN="WHITESPACE_CHARACTER_TOKEN",ut.START_TAG_TOKEN="START_TAG_TOKEN",ut.END_TAG_TOKEN="END_TAG_TOKEN",ut.COMMENT_TOKEN="COMMENT_TOKEN",ut.DOCTYPE_TOKEN="DOCTYPE_TOKEN",ut.EOF_TOKEN="EOF_TOKEN",ut.HIBERNATION_TOKEN="HIBERNATION_TOKEN",ut.MODE={DATA:F,RCDATA:U,RAWTEXT:G,SCRIPT_DATA:B,PLAINTEXT:K},ut.getTokenAttr=function(e,t){for(let n=e.attrs.length-1;n>=0;n--)if(e.attrs[n].name===t)return e.attrs[n].value;return null};var Nt=ut;function dt(e,t,n){return e(n={path:t,exports:{},require:function(e,t){return function(){throw new Error("Dynamic requires are not currently supported by @rollup/plugin-commonjs")}(null==t&&n.path)}},n.exports),n.exports}var Ct=dt((function(e,t){const n=t.NAMESPACES={HTML:"http://www.w3.org/1999/xhtml",MATHML:"http://www.w3.org/1998/Math/MathML",SVG:"http://www.w3.org/2000/svg",XLINK:"http://www.w3.org/1999/xlink",XML:"http://www.w3.org/XML/1998/namespace",XMLNS:"http://www.w3.org/2000/xmlns/"};t.ATTRS={TYPE:"type",ACTION:"action",ENCODING:"encoding",PROMPT:"prompt",NAME:"name",COLOR:"color",FACE:"face",SIZE:"size"},t.DOCUMENT_MODE={NO_QUIRKS:"no-quirks",QUIRKS:"quirks",LIMITED_QUIRKS:"limited-quirks"};const s=t.TAG_NAMES={A:"a",ADDRESS:"address",ANNOTATION_XML:"annotation-xml",APPLET:"applet",AREA:"area",ARTICLE:"article",ASIDE:"aside",B:"b",BASE:"base",BASEFONT:"basefont",BGSOUND:"bgsound",BIG:"big",BLOCKQUOTE:"blockquote",BODY:"body",BR:"br",BUTTON:"button",CAPTION:"caption",CENTER:"center",CODE:"code",COL:"col",COLGROUP:"colgroup",DD:"dd",DESC:"desc",DETAILS:"details",DIALOG:"dialog",DIR:"dir",DIV:"div",DL:"dl",DT:"dt",EM:"em",EMBED:"embed",FIELDSET:"fieldset",FIGCAPTION:"figcaption",FIGURE:"figure",FONT:"font",FOOTER:"footer",FOREIGN_OBJECT:"foreignObject",FORM:"form",FRAME:"frame",FRAMESET:"frameset",H1:"h1",H2:"h2",H3:"h3",H4:"h4",H5:"h5",H6:"h6",HEAD:"head",HEADER:"header",HGROUP:"hgroup",HR:"hr",HTML:"html",I:"i",IMG:"img",IMAGE:"image",INPUT:"input",IFRAME:"iframe",KEYGEN:"keygen",LABEL:"label",LI:"li",LINK:"link",LISTING:"listing",MAIN:"main",MALIGNMARK:"malignmark",MARQUEE:"marquee",MATH:"math",MENU:"menu",META:"meta",MGLYPH:"mglyph",MI:"mi",MO:"mo",MN:"mn",MS:"ms",MTEXT:"mtext",NAV:"nav",NOBR:"nobr",NOFRAMES:"noframes",NOEMBED:"noembed",NOSCRIPT:"noscript",OBJECT:"object",OL:"ol",OPTGROUP:"optgroup",OPTION:"option",P:"p",PARAM:"param",PLAINTEXT:"plaintext",PRE:"pre",RB:"rb",RP:"rp",RT:"rt",RTC:"rtc",RUBY:"ruby",S:"s",SCRIPT:"script",SECTION:"section",SELECT:"select",SOURCE:"source",SMALL:"small",SPAN:"span",STRIKE:"strike",STRONG:"strong",STYLE:"style",SUB:"sub",SUMMARY:"summary",SUP:"sup",TABLE:"table",TBODY:"tbody",TEMPLATE:"template",TEXTAREA:"textarea",TFOOT:"tfoot",TD:"td",TH:"th",THEAD:"thead",TITLE:"title",TR:"tr",TRACK:"track",TT:"tt",U:"u",UL:"ul",SVG:"svg",VAR:"var",WBR:"wbr",XMP:"xmp"};t.SPECIAL_ELEMENTS={[n.HTML]:{[s.ADDRESS]:!0,[s.APPLET]:!0,[s.AREA]:!0,[s.ARTICLE]:!0,[s.ASIDE]:!0,[s.BASE]:!0,[s.BASEFONT]:!0,[s.BGSOUND]:!0,[s.BLOCKQUOTE]:!0,[s.BODY]:!0,[s.BR]:!0,[s.BUTTON]:!0,[s.CAPTION]:!0,[s.CENTER]:!0,[s.COL]:!0,[s.COLGROUP]:!0,[s.DD]:!0,[s.DETAILS]:!0,[s.DIR]:!0,[s.DIV]:!0,[s.DL]:!0,[s.DT]:!0,[s.EMBED]:!0,[s.FIELDSET]:!0,[s.FIGCAPTION]:!0,[s.FIGURE]:!0,[s.FOOTER]:!0,[s.FORM]:!0,[s.FRAME]:!0,[s.FRAMESET]:!0,[s.H1]:!0,[s.H2]:!0,[s.H3]:!0,[s.H4]:!0,[s.H5]:!0,[s.H6]:!0,[s.HEAD]:!0,[s.HEADER]:!0,[s.HGROUP]:!0,[s.HR]:!0,[s.HTML]:!0,[s.IFRAME]:!0,[s.IMG]:!0,[s.INPUT]:!0,[s.LI]:!0,[s.LINK]:!0,[s.LISTING]:!0,[s.MAIN]:!0,[s.MARQUEE]:!0,[s.MENU]:!0,[s.META]:!0,[s.NAV]:!0,[s.NOEMBED]:!0,[s.NOFRAMES]:!0,[s.NOSCRIPT]:!0,[s.OBJECT]:!0,[s.OL]:!0,[s.P]:!0,[s.PARAM]:!0,[s.PLAINTEXT]:!0,[s.PRE]:!0,[s.SCRIPT]:!0,[s.SECTION]:!0,[s.SELECT]:!0,[s.SOURCE]:!0,[s.STYLE]:!0,[s.SUMMARY]:!0,[s.TABLE]:!0,[s.TBODY]:!0,[s.TD]:!0,[s.TEMPLATE]:!0,[s.TEXTAREA]:!0,[s.TFOOT]:!0,[s.TH]:!0,[s.THEAD]:!0,[s.TITLE]:!0,[s.TR]:!0,[s.TRACK]:!0,[s.UL]:!0,[s.WBR]:!0,[s.XMP]:!0},[n.MATHML]:{[s.MI]:!0,[s.MO]:!0,[s.MN]:!0,[s.MS]:!0,[s.MTEXT]:!0,[s.ANNOTATION_XML]:!0},[n.SVG]:{[s.TITLE]:!0,[s.FOREIGN_OBJECT]:!0,[s.DESC]:!0}};}));const Ot=Ct.TAG_NAMES,ft=Ct.NAMESPACES;function St(e){switch(e.length){case 1:return e===Ot.P;case 2:return e===Ot.RB||e===Ot.RP||e===Ot.RT||e===Ot.DD||e===Ot.DT||e===Ot.LI;case 3:return e===Ot.RTC;case 6:return e===Ot.OPTION;case 8:return e===Ot.OPTGROUP}return !1}function Rt(e){switch(e.length){case 1:return e===Ot.P;case 2:return e===Ot.RB||e===Ot.RP||e===Ot.RT||e===Ot.DD||e===Ot.DT||e===Ot.LI||e===Ot.TD||e===Ot.TH||e===Ot.TR;case 3:return e===Ot.RTC;case 5:return e===Ot.TBODY||e===Ot.TFOOT||e===Ot.THEAD;case 6:return e===Ot.OPTION;case 7:return e===Ot.CAPTION;case 8:return e===Ot.OPTGROUP||e===Ot.COLGROUP}return !1}function It(e,t){switch(e.length){case 2:if(e===Ot.TD||e===Ot.TH)return t===ft.HTML;if(e===Ot.MI||e===Ot.MO||e===Ot.MN||e===Ot.MS)return t===ft.MATHML;break;case 4:if(e===Ot.HTML)return t===ft.HTML;if(e===Ot.DESC)return t===ft.SVG;break;case 5:if(e===Ot.TABLE)return t===ft.HTML;if(e===Ot.MTEXT)return t===ft.MATHML;if(e===Ot.TITLE)return t===ft.SVG;break;case 6:return (e===Ot.APPLET||e===Ot.OBJECT)&&t===ft.HTML;case 7:return (e===Ot.CAPTION||e===Ot.MARQUEE)&&t===ft.HTML;case 8:return e===Ot.TEMPLATE&&t===ft.HTML;case 13:return e===Ot.FOREIGN_OBJECT&&t===ft.SVG;case 14:return e===Ot.ANNOTATION_XML&&t===ft.MATHML}return !1}class Lt{constructor(e){this.length=0,this.entries=[],this.treeAdapter=e,this.bookmark=null;}_getNoahArkConditionCandidates(e){const t=[];if(this.length>=3){const n=this.treeAdapter.getAttrList(e).length,s=this.treeAdapter.getTagName(e),r=this.treeAdapter.getNamespaceURI(e);for(let e=this.length-1;e>=0;e--){const i=this.entries[e];if(i.type===Lt.MARKER_ENTRY)break;const o=i.element,a=this.treeAdapter.getAttrList(o);this.treeAdapter.getTagName(o)===s&&this.treeAdapter.getNamespaceURI(o)===r&&a.length===n&&t.push({idx:e,attrs:a});}}return t.length<3?[]:t}_ensureNoahArkCondition(e){const t=this._getNoahArkConditionCandidates(e);let n=t.length;if(n){const s=this.treeAdapter.getAttrList(e),r=s.length,i=Object.create(null);for(let e=0;e<r;e++){const t=s[e];i[t.name]=t.value;}for(let e=0;e<r;e++)for(let s=0;s<n;s++){const r=t[s].attrs[e];if(i[r.name]!==r.value&&(t.splice(s,1),n--),t.length<3)return}for(let e=n-1;e>=2;e--)this.entries.splice(t[e].idx,1),this.length--;}}insertMarker(){this.entries.push({type:Lt.MARKER_ENTRY}),this.length++;}pushElement(e,t){this._ensureNoahArkCondition(e),this.entries.push({type:Lt.ELEMENT_ENTRY,element:e,token:t}),this.length++;}insertElementAfterBookmark(e,t){let n=this.length-1;for(;n>=0&&this.entries[n]!==this.bookmark;n--);this.entries.splice(n+1,0,{type:Lt.ELEMENT_ENTRY,element:e,token:t}),this.length++;}removeEntry(e){for(let t=this.length-1;t>=0;t--)if(this.entries[t]===e){this.entries.splice(t,1),this.length--;break}}clearToLastMarker(){for(;this.length;){const e=this.entries.pop();if(this.length--,e.type===Lt.MARKER_ENTRY)break}}getElementEntryInScopeWithTagName(e){for(let t=this.length-1;t>=0;t--){const n=this.entries[t];if(n.type===Lt.MARKER_ENTRY)return null;if(this.treeAdapter.getTagName(n.element)===e)return n}return null}getElementEntry(e){for(let t=this.length-1;t>=0;t--){const n=this.entries[t];if(n.type===Lt.ELEMENT_ENTRY&&n.element===e)return n}return null}}Lt.MARKER_ENTRY="MARKER_ENTRY",Lt.ELEMENT_ENTRY="ELEMENT_ENTRY";var kt=Lt;class Mt{constructor(e){const t={},n=this._getOverriddenMethods(this,t);for(const s of Object.keys(n))"function"==typeof n[s]&&(t[s]=e[s],e[s]=n[s]);}_getOverriddenMethods(){throw new Error("Not implemented")}}Mt.install=function(e,t,n){e.__mixins||(e.__mixins=[]);for(let n=0;n<e.__mixins.length;n++)if(e.__mixins[n].constructor===t)return e.__mixins[n];const s=new t(e,n);return e.__mixins.push(s),s};var gt=Mt,Pt=class extends gt{constructor(e){super(e),this.preprocessor=e,this.isEol=!1,this.lineStartPos=0,this.droppedBufferSize=0,this.offset=0,this.col=0,this.line=1;}_getOverriddenMethods(e,t){return {advance(){const n=this.pos+1,s=this.html[n];return e.isEol&&(e.isEol=!1,e.line++,e.lineStartPos=n),("\n"===s||"\r"===s&&"\n"!==this.html[n+1])&&(e.isEol=!0),e.col=n-e.lineStartPos+1,e.offset=e.droppedBufferSize+n,t.advance.call(this)},retreat(){t.retreat.call(this),e.isEol=!1,e.col=this.pos-e.lineStartPos+1;},dropParsedChunk(){const n=this.pos;t.dropParsedChunk.call(this);const s=n-this.pos;e.lineStartPos-=s,e.droppedBufferSize+=s,e.offset=e.droppedBufferSize+this.pos;}}}},Ht=class extends gt{constructor(e){super(e),this.tokenizer=e,this.posTracker=gt.install(e.preprocessor,Pt),this.currentAttrLocation=null,this.ctLoc=null;}_getCurrentLocation(){return {startLine:this.posTracker.line,startCol:this.posTracker.col,startOffset:this.posTracker.offset,endLine:-1,endCol:-1,endOffset:-1}}_attachCurrentAttrLocationInfo(){this.currentAttrLocation.endLine=this.posTracker.line,this.currentAttrLocation.endCol=this.posTracker.col,this.currentAttrLocation.endOffset=this.posTracker.offset;const e=this.tokenizer.currentToken,t=this.tokenizer.currentAttr;e.location.attrs||(e.location.attrs=Object.create(null)),e.location.attrs[t.name]=this.currentAttrLocation;}_getOverriddenMethods(e,t){const n={_createStartTagToken(){t._createStartTagToken.call(this),this.currentToken.location=e.ctLoc;},_createEndTagToken(){t._createEndTagToken.call(this),this.currentToken.location=e.ctLoc;},_createCommentToken(){t._createCommentToken.call(this),this.currentToken.location=e.ctLoc;},_createDoctypeToken(n){t._createDoctypeToken.call(this,n),this.currentToken.location=e.ctLoc;},_createCharacterToken(n,s){t._createCharacterToken.call(this,n,s),this.currentCharacterToken.location=e.ctLoc;},_createEOFToken(){t._createEOFToken.call(this),this.currentToken.location=e._getCurrentLocation();},_createAttr(n){t._createAttr.call(this,n),e.currentAttrLocation=e._getCurrentLocation();},_leaveAttrName(n){t._leaveAttrName.call(this,n),e._attachCurrentAttrLocationInfo();},_leaveAttrValue(n){t._leaveAttrValue.call(this,n),e._attachCurrentAttrLocationInfo();},_emitCurrentToken(){const n=this.currentToken.location;this.currentCharacterToken&&(this.currentCharacterToken.location.endLine=n.startLine,this.currentCharacterToken.location.endCol=n.startCol,this.currentCharacterToken.location.endOffset=n.startOffset),this.currentToken.type===Nt.EOF_TOKEN?(n.endLine=n.startLine,n.endCol=n.startCol,n.endOffset=n.startOffset):(n.endLine=e.posTracker.line,n.endCol=e.posTracker.col+1,n.endOffset=e.posTracker.offset+1),t._emitCurrentToken.call(this);},_emitCurrentCharacterToken(){const n=this.currentCharacterToken&&this.currentCharacterToken.location;n&&-1===n.endOffset&&(n.endLine=e.posTracker.line,n.endCol=e.posTracker.col,n.endOffset=e.posTracker.offset),t._emitCurrentCharacterToken.call(this);}};return Object.keys(Nt.MODE).forEach((s=>{const r=Nt.MODE[s];n[r]=function(n){e.ctLoc=e._getCurrentLocation(),t[r].call(this,n);};})),n}},Dt=class extends gt{constructor(e,t){super(e),this.onItemPop=t.onItemPop;}_getOverriddenMethods(e,t){return {pop(){e.onItemPop(this.current),t.pop.call(this);},popAllUpToHtmlElement(){for(let t=this.stackTop;t>0;t--)e.onItemPop(this.items[t]);t.popAllUpToHtmlElement.call(this);},remove(n){e.onItemPop(this.current),t.remove.call(this,n);}}}};const Ft=Ct.TAG_NAMES;var Ut=class extends gt{constructor(e){super(e),this.parser=e,this.treeAdapter=this.parser.treeAdapter,this.posTracker=null,this.lastStartTagToken=null,this.lastFosterParentingLocation=null,this.currentToken=null;}_setStartLocation(e){let t=null;this.lastStartTagToken&&(t=Object.assign({},this.lastStartTagToken.location),t.startTag=this.lastStartTagToken.location),this.treeAdapter.setNodeSourceCodeLocation(e,t);}_setEndLocation(e,t){if(this.treeAdapter.getNodeSourceCodeLocation(e)&&t.location){const n=t.location,s=this.treeAdapter.getTagName(e),r={};t.type===Nt.END_TAG_TOKEN&&s===t.tagName?(r.endTag=Object.assign({},n),r.endLine=n.endLine,r.endCol=n.endCol,r.endOffset=n.endOffset):(r.endLine=n.startLine,r.endCol=n.startCol,r.endOffset=n.startOffset),this.treeAdapter.updateNodeSourceCodeLocation(e,r);}}_getOverriddenMethods(e,t){return {_bootstrap(n,s){t._bootstrap.call(this,n,s),e.lastStartTagToken=null,e.lastFosterParentingLocation=null,e.currentToken=null;const r=gt.install(this.tokenizer,Ht);e.posTracker=r.posTracker,gt.install(this.openElements,Dt,{onItemPop:function(t){e._setEndLocation(t,e.currentToken);}});},_runParsingLoop(n){t._runParsingLoop.call(this,n);for(let t=this.openElements.stackTop;t>=0;t--)e._setEndLocation(this.openElements.items[t],e.currentToken);},_processTokenInForeignContent(n){e.currentToken=n,t._processTokenInForeignContent.call(this,n);},_processToken(n){if(e.currentToken=n,t._processToken.call(this,n),n.type===Nt.END_TAG_TOKEN&&(n.tagName===Ft.HTML||n.tagName===Ft.BODY&&this.openElements.hasInScope(Ft.BODY)))for(let t=this.openElements.stackTop;t>=0;t--){const s=this.openElements.items[t];if(this.treeAdapter.getTagName(s)===n.tagName){e._setEndLocation(s,n);break}}},_setDocumentType(e){t._setDocumentType.call(this,e);const n=this.treeAdapter.getChildNodes(this.document),s=n.length;for(let t=0;t<s;t++){const s=n[t];if(this.treeAdapter.isDocumentTypeNode(s)){this.treeAdapter.setNodeSourceCodeLocation(s,e.location);break}}},_attachElementToTree(n){e._setStartLocation(n),e.lastStartTagToken=null,t._attachElementToTree.call(this,n);},_appendElement(n,s){e.lastStartTagToken=n,t._appendElement.call(this,n,s);},_insertElement(n,s){e.lastStartTagToken=n,t._insertElement.call(this,n,s);},_insertTemplate(n){e.lastStartTagToken=n,t._insertTemplate.call(this,n);const s=this.treeAdapter.getTemplateContent(this.openElements.current);this.treeAdapter.setNodeSourceCodeLocation(s,null);},_insertFakeRootElement(){t._insertFakeRootElement.call(this),this.treeAdapter.setNodeSourceCodeLocation(this.openElements.current,null);},_appendCommentNode(e,n){t._appendCommentNode.call(this,e,n);const s=this.treeAdapter.getChildNodes(n),r=s[s.length-1];this.treeAdapter.setNodeSourceCodeLocation(r,e.location);},_findFosterParentingLocation(){return e.lastFosterParentingLocation=t._findFosterParentingLocation.call(this),e.lastFosterParentingLocation},_insertCharacters(n){t._insertCharacters.call(this,n);const s=this._shouldFosterParentOnInsertion(),r=s&&e.lastFosterParentingLocation.parent||this.openElements.currentTmplContent||this.openElements.current,i=this.treeAdapter.getChildNodes(r),o=s&&e.lastFosterParentingLocation.beforeElement?i.indexOf(e.lastFosterParentingLocation.beforeElement)-1:i.length-1,a=i[o];if(this.treeAdapter.getNodeSourceCodeLocation(a)){const{endLine:e,endCol:t,endOffset:s}=n.location;this.treeAdapter.updateNodeSourceCodeLocation(a,{endLine:e,endCol:t,endOffset:s});}else this.treeAdapter.setNodeSourceCodeLocation(a,n.location);}}}},Gt=class extends gt{constructor(e,t){super(e),this.posTracker=null,this.onParseError=t.onParseError;}_setErrorLocation(e){e.startLine=e.endLine=this.posTracker.line,e.startCol=e.endCol=this.posTracker.col,e.startOffset=e.endOffset=this.posTracker.offset;}_reportError(e){const t={code:e,startLine:-1,startCol:-1,startOffset:-1,endLine:-1,endCol:-1,endOffset:-1};this._setErrorLocation(t),this.onParseError(t);}_getOverriddenMethods(e){return {_err(t){e._reportError(t);}}}},Bt=class extends Gt{constructor(e,t){super(e,t),this.posTracker=gt.install(e,Pt),this.lastErrOffset=-1;}_reportError(e){this.lastErrOffset!==this.posTracker.offset&&(this.lastErrOffset=this.posTracker.offset,super._reportError(e));}},Kt=class extends Gt{constructor(e,t){super(e,t);const n=gt.install(e.preprocessor,Bt,t);this.posTracker=n.posTracker;}},bt=class extends Gt{constructor(e,t){super(e,t),this.opts=t,this.ctLoc=null,this.locBeforeToken=!1;}_setErrorLocation(e){this.ctLoc&&(e.startLine=this.ctLoc.startLine,e.startCol=this.ctLoc.startCol,e.startOffset=this.ctLoc.startOffset,e.endLine=this.locBeforeToken?this.ctLoc.startLine:this.ctLoc.endLine,e.endCol=this.locBeforeToken?this.ctLoc.startCol:this.ctLoc.endCol,e.endOffset=this.locBeforeToken?this.ctLoc.startOffset:this.ctLoc.endOffset);}_getOverriddenMethods(e,t){return {_bootstrap(n,s){t._bootstrap.call(this,n,s),gt.install(this.tokenizer,Kt,e.opts),gt.install(this.tokenizer,Ht);},_processInputToken(n){e.ctLoc=n.location,t._processInputToken.call(this,n);},_err(t,n){e.locBeforeToken=n&&n.beforeToken,e._reportError(t);}}}},xt=dt((function(e,t){const{DOCUMENT_MODE:n}=Ct;t.createDocument=function(){return {nodeName:"#document",mode:n.NO_QUIRKS,childNodes:[]}},t.createDocumentFragment=function(){return {nodeName:"#document-fragment",childNodes:[]}},t.createElement=function(e,t,n){return {nodeName:e,tagName:e,attrs:n,namespaceURI:t,childNodes:[],parentNode:null}},t.createCommentNode=function(e){return {nodeName:"#comment",data:e,parentNode:null}};const s=function(e){return {nodeName:"#text",value:e,parentNode:null}},r=t.appendChild=function(e,t){e.childNodes.push(t),t.parentNode=e;},i=t.insertBefore=function(e,t,n){const s=e.childNodes.indexOf(n);e.childNodes.splice(s,0,t),t.parentNode=e;};t.setTemplateContent=function(e,t){e.content=t;},t.getTemplateContent=function(e){return e.content},t.setDocumentType=function(e,t,n,s){let i=null;for(let t=0;t<e.childNodes.length;t++)if("#documentType"===e.childNodes[t].nodeName){i=e.childNodes[t];break}i?(i.name=t,i.publicId=n,i.systemId=s):r(e,{nodeName:"#documentType",name:t,publicId:n,systemId:s});},t.setDocumentMode=function(e,t){e.mode=t;},t.getDocumentMode=function(e){return e.mode},t.detachNode=function(e){if(e.parentNode){const t=e.parentNode.childNodes.indexOf(e);e.parentNode.childNodes.splice(t,1),e.parentNode=null;}},t.insertText=function(e,t){if(e.childNodes.length){const n=e.childNodes[e.childNodes.length-1];if("#text"===n.nodeName)return void(n.value+=t)}r(e,s(t));},t.insertTextBefore=function(e,t,n){const r=e.childNodes[e.childNodes.indexOf(n)-1];r&&"#text"===r.nodeName?r.value+=t:i(e,s(t),n);},t.adoptAttributes=function(e,t){const n=[];for(let t=0;t<e.attrs.length;t++)n.push(e.attrs[t].name);for(let s=0;s<t.length;s++)-1===n.indexOf(t[s].name)&&e.attrs.push(t[s]);},t.getFirstChild=function(e){return e.childNodes[0]},t.getChildNodes=function(e){return e.childNodes},t.getParentNode=function(e){return e.parentNode},t.getAttrList=function(e){return e.attrs},t.getTagName=function(e){return e.tagName},t.getNamespaceURI=function(e){return e.namespaceURI},t.getTextNodeContent=function(e){return e.value},t.getCommentNodeContent=function(e){return e.data},t.getDocumentTypeNodeName=function(e){return e.name},t.getDocumentTypeNodePublicId=function(e){return e.publicId},t.getDocumentTypeNodeSystemId=function(e){return e.systemId},t.isTextNode=function(e){return "#text"===e.nodeName},t.isCommentNode=function(e){return "#comment"===e.nodeName},t.isDocumentTypeNode=function(e){return "#documentType"===e.nodeName},t.isElementNode=function(e){return !!e.tagName},t.setNodeSourceCodeLocation=function(e,t){e.sourceCodeLocation=t;},t.getNodeSourceCodeLocation=function(e){return e.sourceCodeLocation},t.updateNodeSourceCodeLocation=function(e,t){e.sourceCodeLocation=Object.assign(e.sourceCodeLocation,t);};}));const{DOCUMENT_MODE:yt}=Ct,vt="html",Yt=["+//silmaril//dtd html pro v0r11 19970101//","-//as//dtd html 3.0 aswedit + extensions//","-//advasoft ltd//dtd html 3.0 aswedit + extensions//","-//ietf//dtd html 2.0 level 1//","-//ietf//dtd html 2.0 level 2//","-//ietf//dtd html 2.0 strict level 1//","-//ietf//dtd html 2.0 strict level 2//","-//ietf//dtd html 2.0 strict//","-//ietf//dtd html 2.0//","-//ietf//dtd html 2.1e//","-//ietf//dtd html 3.0//","-//ietf//dtd html 3.2 final//","-//ietf//dtd html 3.2//","-//ietf//dtd html 3//","-//ietf//dtd html level 0//","-//ietf//dtd html level 1//","-//ietf//dtd html level 2//","-//ietf//dtd html level 3//","-//ietf//dtd html strict level 0//","-//ietf//dtd html strict level 1//","-//ietf//dtd html strict level 2//","-//ietf//dtd html strict level 3//","-//ietf//dtd html strict//","-//ietf//dtd html//","-//metrius//dtd metrius presentational//","-//microsoft//dtd internet explorer 2.0 html strict//","-//microsoft//dtd internet explorer 2.0 html//","-//microsoft//dtd internet explorer 2.0 tables//","-//microsoft//dtd internet explorer 3.0 html strict//","-//microsoft//dtd internet explorer 3.0 html//","-//microsoft//dtd internet explorer 3.0 tables//","-//netscape comm. corp.//dtd html//","-//netscape comm. corp.//dtd strict html//","-//o'reilly and associates//dtd html 2.0//","-//o'reilly and associates//dtd html extended 1.0//","-//o'reilly and associates//dtd html extended relaxed 1.0//","-//sq//dtd html 2.0 hotmetal + extensions//","-//softquad software//dtd hotmetal pro 6.0::19990601::extensions to html 4.0//","-//softquad//dtd hotmetal pro 4.0::19971010::extensions to html 4.0//","-//spyglass//dtd html 2.0 extended//","-//sun microsystems corp.//dtd hotjava html//","-//sun microsystems corp.//dtd hotjava strict html//","-//w3c//dtd html 3 1995-03-24//","-//w3c//dtd html 3.2 draft//","-//w3c//dtd html 3.2 final//","-//w3c//dtd html 3.2//","-//w3c//dtd html 3.2s draft//","-//w3c//dtd html 4.0 frameset//","-//w3c//dtd html 4.0 transitional//","-//w3c//dtd html experimental 19960712//","-//w3c//dtd html experimental 970421//","-//w3c//dtd w3 html//","-//w3o//dtd w3 html 3.0//","-//webtechs//dtd mozilla html 2.0//","-//webtechs//dtd mozilla html//"],wt=Yt.concat(["-//w3c//dtd html 4.01 frameset//","-//w3c//dtd html 4.01 transitional//"]),Qt=["-//w3o//dtd w3 html strict 3.0//en//","-/w3c/dtd html 4.0 transitional/en","html"],Xt=["-//w3c//dtd xhtml 1.0 frameset//","-//w3c//dtd xhtml 1.0 transitional//"],Wt=Xt.concat(["-//w3c//dtd html 4.01 frameset//","-//w3c//dtd html 4.01 transitional//"]);function Vt(e,t){for(let n=0;n<t.length;n++)if(0===e.indexOf(t[n]))return !0;return !1}var jt=dt((function(e,t){const n=Ct.TAG_NAMES,s=Ct.NAMESPACES,r=Ct.ATTRS,i={attributename:"attributeName",attributetype:"attributeType",basefrequency:"baseFrequency",baseprofile:"baseProfile",calcmode:"calcMode",clippathunits:"clipPathUnits",diffuseconstant:"diffuseConstant",edgemode:"edgeMode",filterunits:"filterUnits",glyphref:"glyphRef",gradienttransform:"gradientTransform",gradientunits:"gradientUnits",kernelmatrix:"kernelMatrix",kernelunitlength:"kernelUnitLength",keypoints:"keyPoints",keysplines:"keySplines",keytimes:"keyTimes",lengthadjust:"lengthAdjust",limitingconeangle:"limitingConeAngle",markerheight:"markerHeight",markerunits:"markerUnits",markerwidth:"markerWidth",maskcontentunits:"maskContentUnits",maskunits:"maskUnits",numoctaves:"numOctaves",pathlength:"pathLength",patterncontentunits:"patternContentUnits",patterntransform:"patternTransform",patternunits:"patternUnits",pointsatx:"pointsAtX",pointsaty:"pointsAtY",pointsatz:"pointsAtZ",preservealpha:"preserveAlpha",preserveaspectratio:"preserveAspectRatio",primitiveunits:"primitiveUnits",refx:"refX",refy:"refY",repeatcount:"repeatCount",repeatdur:"repeatDur",requiredextensions:"requiredExtensions",requiredfeatures:"requiredFeatures",specularconstant:"specularConstant",specularexponent:"specularExponent",spreadmethod:"spreadMethod",startoffset:"startOffset",stddeviation:"stdDeviation",stitchtiles:"stitchTiles",surfacescale:"surfaceScale",systemlanguage:"systemLanguage",tablevalues:"tableValues",targetx:"targetX",targety:"targetY",textlength:"textLength",viewbox:"viewBox",viewtarget:"viewTarget",xchannelselector:"xChannelSelector",ychannelselector:"yChannelSelector",zoomandpan:"zoomAndPan"},o={"xlink:actuate":{prefix:"xlink",name:"actuate",namespace:s.XLINK},"xlink:arcrole":{prefix:"xlink",name:"arcrole",namespace:s.XLINK},"xlink:href":{prefix:"xlink",name:"href",namespace:s.XLINK},"xlink:role":{prefix:"xlink",name:"role",namespace:s.XLINK},"xlink:show":{prefix:"xlink",name:"show",namespace:s.XLINK},"xlink:title":{prefix:"xlink",name:"title",namespace:s.XLINK},"xlink:type":{prefix:"xlink",name:"type",namespace:s.XLINK},"xml:base":{prefix:"xml",name:"base",namespace:s.XML},"xml:lang":{prefix:"xml",name:"lang",namespace:s.XML},"xml:space":{prefix:"xml",name:"space",namespace:s.XML},xmlns:{prefix:"",name:"xmlns",namespace:s.XMLNS},"xmlns:xlink":{prefix:"xmlns",name:"xlink",namespace:s.XMLNS}},a=t.SVG_TAG_NAMES_ADJUSTMENT_MAP={altglyph:"altGlyph",altglyphdef:"altGlyphDef",altglyphitem:"altGlyphItem",animatecolor:"animateColor",animatemotion:"animateMotion",animatetransform:"animateTransform",clippath:"clipPath",feblend:"feBlend",fecolormatrix:"feColorMatrix",fecomponenttransfer:"feComponentTransfer",fecomposite:"feComposite",feconvolvematrix:"feConvolveMatrix",fediffuselighting:"feDiffuseLighting",fedisplacementmap:"feDisplacementMap",fedistantlight:"feDistantLight",feflood:"feFlood",fefunca:"feFuncA",fefuncb:"feFuncB",fefuncg:"feFuncG",fefuncr:"feFuncR",fegaussianblur:"feGaussianBlur",feimage:"feImage",femerge:"feMerge",femergenode:"feMergeNode",femorphology:"feMorphology",feoffset:"feOffset",fepointlight:"fePointLight",fespecularlighting:"feSpecularLighting",fespotlight:"feSpotLight",fetile:"feTile",feturbulence:"feTurbulence",foreignobject:"foreignObject",glyphref:"glyphRef",lineargradient:"linearGradient",radialgradient:"radialGradient",textpath:"textPath"},T={[n.B]:!0,[n.BIG]:!0,[n.BLOCKQUOTE]:!0,[n.BODY]:!0,[n.BR]:!0,[n.CENTER]:!0,[n.CODE]:!0,[n.DD]:!0,[n.DIV]:!0,[n.DL]:!0,[n.DT]:!0,[n.EM]:!0,[n.EMBED]:!0,[n.H1]:!0,[n.H2]:!0,[n.H3]:!0,[n.H4]:!0,[n.H5]:!0,[n.H6]:!0,[n.HEAD]:!0,[n.HR]:!0,[n.I]:!0,[n.IMG]:!0,[n.LI]:!0,[n.LISTING]:!0,[n.MENU]:!0,[n.META]:!0,[n.NOBR]:!0,[n.OL]:!0,[n.P]:!0,[n.PRE]:!0,[n.RUBY]:!0,[n.S]:!0,[n.SMALL]:!0,[n.SPAN]:!0,[n.STRONG]:!0,[n.STRIKE]:!0,[n.SUB]:!0,[n.SUP]:!0,[n.TABLE]:!0,[n.TT]:!0,[n.U]:!0,[n.UL]:!0,[n.VAR]:!0};t.causesExit=function(e){const t=e.tagName;return !(t!==n.FONT||null===Nt.getTokenAttr(e,r.COLOR)&&null===Nt.getTokenAttr(e,r.SIZE)&&null===Nt.getTokenAttr(e,r.FACE))||T[t]},t.adjustTokenMathMLAttrs=function(e){for(let t=0;t<e.attrs.length;t++)if("definitionurl"===e.attrs[t].name){e.attrs[t].name="definitionURL";break}},t.adjustTokenSVGAttrs=function(e){for(let t=0;t<e.attrs.length;t++){const n=i[e.attrs[t].name];n&&(e.attrs[t].name=n);}},t.adjustTokenXMLAttrs=function(e){for(let t=0;t<e.attrs.length;t++){const n=o[e.attrs[t].name];n&&(e.attrs[t].prefix=n.prefix,e.attrs[t].name=n.name,e.attrs[t].namespace=n.namespace);}},t.adjustTokenSVGTagName=function(e){const t=a[e.tagName];t&&(e.tagName=t);},t.isIntegrationPoint=function(e,t,i,o){return !(o&&o!==s.HTML||!function(e,t,i){if(t===s.MATHML&&e===n.ANNOTATION_XML)for(let e=0;e<i.length;e++)if(i[e].name===r.ENCODING){const t=i[e].value.toLowerCase();return "text/html"===t||"application/xhtml+xml"===t}return t===s.SVG&&(e===n.FOREIGN_OBJECT||e===n.DESC||e===n.TITLE)}(e,t,i))||!(o&&o!==s.MATHML||!function(e,t){return t===s.MATHML&&(e===n.MI||e===n.MO||e===n.MN||e===n.MS||e===n.MTEXT)}(e,t))};}));const zt=Ct.TAG_NAMES,qt=Ct.NAMESPACES,Jt=Ct.ATTRS,Zt={scriptingEnabled:!0,sourceCodeLocationInfo:!1,onParseError:null,treeAdapter:xt},$t="hidden",en="INITIAL_MODE",tn="BEFORE_HTML_MODE",nn="BEFORE_HEAD_MODE",sn="IN_HEAD_MODE",rn="IN_HEAD_NO_SCRIPT_MODE",on="AFTER_HEAD_MODE",an="IN_BODY_MODE",Tn="TEXT_MODE",En="IN_TABLE_MODE",hn="IN_TABLE_TEXT_MODE",cn="IN_CAPTION_MODE",_n="IN_COLUMN_GROUP_MODE",ln="IN_TABLE_BODY_MODE",mn="IN_ROW_MODE",pn="IN_CELL_MODE",An="IN_SELECT_MODE",un="IN_SELECT_IN_TABLE_MODE",Nn="IN_TEMPLATE_MODE",dn="AFTER_BODY_MODE",Cn="IN_FRAMESET_MODE",On="AFTER_FRAMESET_MODE",fn="AFTER_AFTER_BODY_MODE",Sn="AFTER_AFTER_FRAMESET_MODE",Rn={[zt.TR]:mn,[zt.TBODY]:ln,[zt.THEAD]:ln,[zt.TFOOT]:ln,[zt.CAPTION]:cn,[zt.COLGROUP]:_n,[zt.TABLE]:En,[zt.BODY]:an,[zt.FRAMESET]:Cn},In={[zt.CAPTION]:En,[zt.COLGROUP]:En,[zt.TBODY]:En,[zt.TFOOT]:En,[zt.THEAD]:En,[zt.COL]:_n,[zt.TR]:ln,[zt.TD]:mn,[zt.TH]:mn},Ln={[en]:{[Nt.CHARACTER_TOKEN]:vn,[Nt.NULL_CHARACTER_TOKEN]:vn,[Nt.WHITESPACE_CHARACTER_TOKEN]:Gn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:function(e,t){e._setDocumentType(t);const n=t.forceQuirks?Ct.DOCUMENT_MODE.QUIRKS:function(e){if(e.name!==vt)return yt.QUIRKS;const t=e.systemId;if(t&&"http://www.ibm.com/data/dtd/v11/ibmxhtml1-transitional.dtd"===t.toLowerCase())return yt.QUIRKS;let n=e.publicId;if(null!==n){if(n=n.toLowerCase(),Qt.indexOf(n)>-1)return yt.QUIRKS;let e=null===t?wt:Yt;if(Vt(n,e))return yt.QUIRKS;if(e=null===t?Xt:Wt,Vt(n,e))return yt.LIMITED_QUIRKS}return yt.NO_QUIRKS}(t);(function(e){return e.name===vt&&null===e.publicId&&(null===e.systemId||"about:legacy-compat"===e.systemId)})(t)||e._err("non-conforming-doctype"),e.treeAdapter.setDocumentMode(e.document,n),e.insertionMode=tn;},[Nt.START_TAG_TOKEN]:vn,[Nt.END_TAG_TOKEN]:vn,[Nt.EOF_TOKEN]:vn},[tn]:{[Nt.CHARACTER_TOKEN]:Yn,[Nt.NULL_CHARACTER_TOKEN]:Yn,[Nt.WHITESPACE_CHARACTER_TOKEN]:Gn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){t.tagName===zt.HTML?(e._insertElement(t,qt.HTML),e.insertionMode=nn):Yn(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n!==zt.HTML&&n!==zt.HEAD&&n!==zt.BODY&&n!==zt.BR||Yn(e,t);},[Nt.EOF_TOKEN]:Yn},[nn]:{[Nt.CHARACTER_TOKEN]:wn,[Nt.NULL_CHARACTER_TOKEN]:wn,[Nt.WHITESPACE_CHARACTER_TOKEN]:Gn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Bn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.HEAD?(e._insertElement(t,qt.HTML),e.headElement=e.openElements.current,e.insertionMode=sn):wn(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.HEAD||n===zt.BODY||n===zt.HTML||n===zt.BR?wn(e,t):e._err(L);},[Nt.EOF_TOKEN]:wn},[sn]:{[Nt.CHARACTER_TOKEN]:Wn,[Nt.NULL_CHARACTER_TOKEN]:Wn,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Bn,[Nt.START_TAG_TOKEN]:Qn,[Nt.END_TAG_TOKEN]:Xn,[Nt.EOF_TOKEN]:Wn},[rn]:{[Nt.CHARACTER_TOKEN]:Vn,[Nt.NULL_CHARACTER_TOKEN]:Vn,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Bn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.BASEFONT||n===zt.BGSOUND||n===zt.HEAD||n===zt.LINK||n===zt.META||n===zt.NOFRAMES||n===zt.STYLE?Qn(e,t):n===zt.NOSCRIPT?e._err("nested-noscript-in-head"):Vn(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.NOSCRIPT?(e.openElements.pop(),e.insertionMode=sn):n===zt.BR?Vn(e,t):e._err(L);},[Nt.EOF_TOKEN]:Vn},[on]:{[Nt.CHARACTER_TOKEN]:jn,[Nt.NULL_CHARACTER_TOKEN]:jn,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Bn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.BODY?(e._insertElement(t,qt.HTML),e.framesetOk=!1,e.insertionMode=an):n===zt.FRAMESET?(e._insertElement(t,qt.HTML),e.insertionMode=Cn):n===zt.BASE||n===zt.BASEFONT||n===zt.BGSOUND||n===zt.LINK||n===zt.META||n===zt.NOFRAMES||n===zt.SCRIPT||n===zt.STYLE||n===zt.TEMPLATE||n===zt.TITLE?(e._err("abandoned-head-element-child"),e.openElements.push(e.headElement),Qn(e,t),e.openElements.remove(e.headElement)):n===zt.HEAD?e._err(k):jn(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.BODY||n===zt.HTML||n===zt.BR?jn(e,t):n===zt.TEMPLATE?Xn(e,t):e._err(L);},[Nt.EOF_TOKEN]:jn},[an]:{[Nt.CHARACTER_TOKEN]:qn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:zn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:as,[Nt.END_TAG_TOKEN]:cs,[Nt.EOF_TOKEN]:_s},[Tn]:{[Nt.CHARACTER_TOKEN]:xn,[Nt.NULL_CHARACTER_TOKEN]:xn,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Gn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:Gn,[Nt.END_TAG_TOKEN]:function(e,t){t.tagName===zt.SCRIPT&&(e.pendingScript=e.openElements.current),e.openElements.pop(),e.insertionMode=e.originalInsertionMode;},[Nt.EOF_TOKEN]:function(e,t){e._err("eof-in-element-that-can-contain-only-text"),e.openElements.pop(),e.insertionMode=e.originalInsertionMode,e._processToken(t);}},[En]:{[Nt.CHARACTER_TOKEN]:ls,[Nt.NULL_CHARACTER_TOKEN]:ls,[Nt.WHITESPACE_CHARACTER_TOKEN]:ls,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:ms,[Nt.END_TAG_TOKEN]:ps,[Nt.EOF_TOKEN]:_s},[hn]:{[Nt.CHARACTER_TOKEN]:function(e,t){e.pendingCharacterTokens.push(t),e.hasNonWhitespacePendingCharacterToken=!0;},[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:function(e,t){e.pendingCharacterTokens.push(t);},[Nt.COMMENT_TOKEN]:us,[Nt.DOCTYPE_TOKEN]:us,[Nt.START_TAG_TOKEN]:us,[Nt.END_TAG_TOKEN]:us,[Nt.EOF_TOKEN]:us},[cn]:{[Nt.CHARACTER_TOKEN]:qn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:zn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.CAPTION||n===zt.COL||n===zt.COLGROUP||n===zt.TBODY||n===zt.TD||n===zt.TFOOT||n===zt.TH||n===zt.THEAD||n===zt.TR?e.openElements.hasInTableScope(zt.CAPTION)&&(e.openElements.generateImpliedEndTags(),e.openElements.popUntilTagNamePopped(zt.CAPTION),e.activeFormattingElements.clearToLastMarker(),e.insertionMode=En,e._processToken(t)):as(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.CAPTION||n===zt.TABLE?e.openElements.hasInTableScope(zt.CAPTION)&&(e.openElements.generateImpliedEndTags(),e.openElements.popUntilTagNamePopped(zt.CAPTION),e.activeFormattingElements.clearToLastMarker(),e.insertionMode=En,n===zt.TABLE&&e._processToken(t)):n!==zt.BODY&&n!==zt.COL&&n!==zt.COLGROUP&&n!==zt.HTML&&n!==zt.TBODY&&n!==zt.TD&&n!==zt.TFOOT&&n!==zt.TH&&n!==zt.THEAD&&n!==zt.TR&&cs(e,t);},[Nt.EOF_TOKEN]:_s},[_n]:{[Nt.CHARACTER_TOKEN]:Ns,[Nt.NULL_CHARACTER_TOKEN]:Ns,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.COL?(e._appendElement(t,qt.HTML),t.ackSelfClosing=!0):n===zt.TEMPLATE?Qn(e,t):Ns(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.COLGROUP?e.openElements.currentTagName===zt.COLGROUP&&(e.openElements.pop(),e.insertionMode=En):n===zt.TEMPLATE?Xn(e,t):n!==zt.COL&&Ns(e,t);},[Nt.EOF_TOKEN]:_s},[ln]:{[Nt.CHARACTER_TOKEN]:ls,[Nt.NULL_CHARACTER_TOKEN]:ls,[Nt.WHITESPACE_CHARACTER_TOKEN]:ls,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.TR?(e.openElements.clearBackToTableBodyContext(),e._insertElement(t,qt.HTML),e.insertionMode=mn):n===zt.TH||n===zt.TD?(e.openElements.clearBackToTableBodyContext(),e._insertFakeElement(zt.TR),e.insertionMode=mn,e._processToken(t)):n===zt.CAPTION||n===zt.COL||n===zt.COLGROUP||n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD?e.openElements.hasTableBodyContextInTableScope()&&(e.openElements.clearBackToTableBodyContext(),e.openElements.pop(),e.insertionMode=En,e._processToken(t)):ms(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD?e.openElements.hasInTableScope(n)&&(e.openElements.clearBackToTableBodyContext(),e.openElements.pop(),e.insertionMode=En):n===zt.TABLE?e.openElements.hasTableBodyContextInTableScope()&&(e.openElements.clearBackToTableBodyContext(),e.openElements.pop(),e.insertionMode=En,e._processToken(t)):(n!==zt.BODY&&n!==zt.CAPTION&&n!==zt.COL&&n!==zt.COLGROUP||n!==zt.HTML&&n!==zt.TD&&n!==zt.TH&&n!==zt.TR)&&ps(e,t);},[Nt.EOF_TOKEN]:_s},[mn]:{[Nt.CHARACTER_TOKEN]:ls,[Nt.NULL_CHARACTER_TOKEN]:ls,[Nt.WHITESPACE_CHARACTER_TOKEN]:ls,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.TH||n===zt.TD?(e.openElements.clearBackToTableRowContext(),e._insertElement(t,qt.HTML),e.insertionMode=pn,e.activeFormattingElements.insertMarker()):n===zt.CAPTION||n===zt.COL||n===zt.COLGROUP||n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD||n===zt.TR?e.openElements.hasInTableScope(zt.TR)&&(e.openElements.clearBackToTableRowContext(),e.openElements.pop(),e.insertionMode=ln,e._processToken(t)):ms(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.TR?e.openElements.hasInTableScope(zt.TR)&&(e.openElements.clearBackToTableRowContext(),e.openElements.pop(),e.insertionMode=ln):n===zt.TABLE?e.openElements.hasInTableScope(zt.TR)&&(e.openElements.clearBackToTableRowContext(),e.openElements.pop(),e.insertionMode=ln,e._processToken(t)):n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD?(e.openElements.hasInTableScope(n)||e.openElements.hasInTableScope(zt.TR))&&(e.openElements.clearBackToTableRowContext(),e.openElements.pop(),e.insertionMode=ln,e._processToken(t)):(n!==zt.BODY&&n!==zt.CAPTION&&n!==zt.COL&&n!==zt.COLGROUP||n!==zt.HTML&&n!==zt.TD&&n!==zt.TH)&&ps(e,t);},[Nt.EOF_TOKEN]:_s},[pn]:{[Nt.CHARACTER_TOKEN]:qn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:zn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.CAPTION||n===zt.COL||n===zt.COLGROUP||n===zt.TBODY||n===zt.TD||n===zt.TFOOT||n===zt.TH||n===zt.THEAD||n===zt.TR?(e.openElements.hasInTableScope(zt.TD)||e.openElements.hasInTableScope(zt.TH))&&(e._closeTableCell(),e._processToken(t)):as(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.TD||n===zt.TH?e.openElements.hasInTableScope(n)&&(e.openElements.generateImpliedEndTags(),e.openElements.popUntilTagNamePopped(n),e.activeFormattingElements.clearToLastMarker(),e.insertionMode=mn):n===zt.TABLE||n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD||n===zt.TR?e.openElements.hasInTableScope(n)&&(e._closeTableCell(),e._processToken(t)):n!==zt.BODY&&n!==zt.CAPTION&&n!==zt.COL&&n!==zt.COLGROUP&&n!==zt.HTML&&cs(e,t);},[Nt.EOF_TOKEN]:_s},[An]:{[Nt.CHARACTER_TOKEN]:xn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:ds,[Nt.END_TAG_TOKEN]:Cs,[Nt.EOF_TOKEN]:_s},[un]:{[Nt.CHARACTER_TOKEN]:xn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.CAPTION||n===zt.TABLE||n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD||n===zt.TR||n===zt.TD||n===zt.TH?(e.openElements.popUntilTagNamePopped(zt.SELECT),e._resetInsertionMode(),e._processToken(t)):ds(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.CAPTION||n===zt.TABLE||n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD||n===zt.TR||n===zt.TD||n===zt.TH?e.openElements.hasInTableScope(n)&&(e.openElements.popUntilTagNamePopped(zt.SELECT),e._resetInsertionMode(),e._processToken(t)):Cs(e,t);},[Nt.EOF_TOKEN]:_s},[Nn]:{[Nt.CHARACTER_TOKEN]:qn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:zn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;if(n===zt.BASE||n===zt.BASEFONT||n===zt.BGSOUND||n===zt.LINK||n===zt.META||n===zt.NOFRAMES||n===zt.SCRIPT||n===zt.STYLE||n===zt.TEMPLATE||n===zt.TITLE)Qn(e,t);else {const s=In[n]||an;e._popTmplInsertionMode(),e._pushTmplInsertionMode(s),e.insertionMode=s,e._processToken(t);}},[Nt.END_TAG_TOKEN]:function(e,t){t.tagName===zt.TEMPLATE&&Xn(e,t);},[Nt.EOF_TOKEN]:Os},[dn]:{[Nt.CHARACTER_TOKEN]:fs,[Nt.NULL_CHARACTER_TOKEN]:fs,[Nt.WHITESPACE_CHARACTER_TOKEN]:zn,[Nt.COMMENT_TOKEN]:function(e,t){e._appendCommentNode(t,e.openElements.items[0]);},[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){t.tagName===zt.HTML?as(e,t):fs(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){t.tagName===zt.HTML?e.fragmentContext||(e.insertionMode=fn):fs(e,t);},[Nt.EOF_TOKEN]:yn},[Cn]:{[Nt.CHARACTER_TOKEN]:Gn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.FRAMESET?e._insertElement(t,qt.HTML):n===zt.FRAME?(e._appendElement(t,qt.HTML),t.ackSelfClosing=!0):n===zt.NOFRAMES&&Qn(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){t.tagName!==zt.FRAMESET||e.openElements.isRootHtmlElementCurrent()||(e.openElements.pop(),e.fragmentContext||e.openElements.currentTagName===zt.FRAMESET||(e.insertionMode=On));},[Nt.EOF_TOKEN]:yn},[On]:{[Nt.CHARACTER_TOKEN]:Gn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:xn,[Nt.COMMENT_TOKEN]:Kn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.NOFRAMES&&Qn(e,t);},[Nt.END_TAG_TOKEN]:function(e,t){t.tagName===zt.HTML&&(e.insertionMode=Sn);},[Nt.EOF_TOKEN]:yn},[fn]:{[Nt.CHARACTER_TOKEN]:Ss,[Nt.NULL_CHARACTER_TOKEN]:Ss,[Nt.WHITESPACE_CHARACTER_TOKEN]:zn,[Nt.COMMENT_TOKEN]:bn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){t.tagName===zt.HTML?as(e,t):Ss(e,t);},[Nt.END_TAG_TOKEN]:Ss,[Nt.EOF_TOKEN]:yn},[Sn]:{[Nt.CHARACTER_TOKEN]:Gn,[Nt.NULL_CHARACTER_TOKEN]:Gn,[Nt.WHITESPACE_CHARACTER_TOKEN]:zn,[Nt.COMMENT_TOKEN]:bn,[Nt.DOCTYPE_TOKEN]:Gn,[Nt.START_TAG_TOKEN]:function(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.NOFRAMES&&Qn(e,t);},[Nt.END_TAG_TOKEN]:Gn,[Nt.EOF_TOKEN]:yn}};var kn=class{constructor(e){this.options=function(e,t){return [e,t=t||Object.create(null)].reduce(((e,t)=>(Object.keys(t).forEach((n=>{e[n]=t[n];})),e)),Object.create(null))}(Zt,e),this.treeAdapter=this.options.treeAdapter,this.pendingScript=null,this.options.sourceCodeLocationInfo&>.install(this,Ut),this.options.onParseError&>.install(this,bt,{onParseError:this.options.onParseError});}parse(e){const t=this.treeAdapter.createDocument();return this._bootstrap(t,null),this.tokenizer.write(e,!0),this._runParsingLoop(null),t}parseFragment(e,t){t||(t=this.treeAdapter.createElement(zt.TEMPLATE,qt.HTML,[]));const n=this.treeAdapter.createElement("documentmock",qt.HTML,[]);this._bootstrap(n,t),this.treeAdapter.getTagName(t)===zt.TEMPLATE&&this._pushTmplInsertionMode(Nn),this._initTokenizerForFragmentParsing(),this._insertFakeRootElement(),this._resetInsertionMode(),this._findFormInFragmentContext(),this.tokenizer.write(e,!0),this._runParsingLoop(null);const s=this.treeAdapter.getFirstChild(n),r=this.treeAdapter.createDocumentFragment();return this._adoptNodes(s,r),r}_bootstrap(e,t){this.tokenizer=new Nt(this.options),this.stopped=!1,this.insertionMode=en,this.originalInsertionMode="",this.document=e,this.fragmentContext=t,this.headElement=null,this.formElement=null,this.openElements=new class{constructor(e,t){this.stackTop=-1,this.items=[],this.current=e,this.currentTagName=null,this.currentTmplContent=null,this.tmplCount=0,this.treeAdapter=t;}_indexOf(e){let t=-1;for(let n=this.stackTop;n>=0;n--)if(this.items[n]===e){t=n;break}return t}_isInTemplate(){return this.currentTagName===Ot.TEMPLATE&&this.treeAdapter.getNamespaceURI(this.current)===ft.HTML}_updateCurrentElement(){this.current=this.items[this.stackTop],this.currentTagName=this.current&&this.treeAdapter.getTagName(this.current),this.currentTmplContent=this._isInTemplate()?this.treeAdapter.getTemplateContent(this.current):null;}push(e){this.items[++this.stackTop]=e,this._updateCurrentElement(),this._isInTemplate()&&this.tmplCount++;}pop(){this.stackTop--,this.tmplCount>0&&this._isInTemplate()&&this.tmplCount--,this._updateCurrentElement();}replace(e,t){const n=this._indexOf(e);this.items[n]=t,n===this.stackTop&&this._updateCurrentElement();}insertAfter(e,t){const n=this._indexOf(e)+1;this.items.splice(n,0,t),n===++this.stackTop&&this._updateCurrentElement();}popUntilTagNamePopped(e){for(;this.stackTop>-1;){const t=this.currentTagName,n=this.treeAdapter.getNamespaceURI(this.current);if(this.pop(),t===e&&n===ft.HTML)break}}popUntilElementPopped(e){for(;this.stackTop>-1;){const t=this.current;if(this.pop(),t===e)break}}popUntilNumberedHeaderPopped(){for(;this.stackTop>-1;){const e=this.currentTagName,t=this.treeAdapter.getNamespaceURI(this.current);if(this.pop(),e===Ot.H1||e===Ot.H2||e===Ot.H3||e===Ot.H4||e===Ot.H5||e===Ot.H6&&t===ft.HTML)break}}popUntilTableCellPopped(){for(;this.stackTop>-1;){const e=this.currentTagName,t=this.treeAdapter.getNamespaceURI(this.current);if(this.pop(),e===Ot.TD||e===Ot.TH&&t===ft.HTML)break}}popAllUpToHtmlElement(){this.stackTop=0,this._updateCurrentElement();}clearBackToTableContext(){for(;this.currentTagName!==Ot.TABLE&&this.currentTagName!==Ot.TEMPLATE&&this.currentTagName!==Ot.HTML||this.treeAdapter.getNamespaceURI(this.current)!==ft.HTML;)this.pop();}clearBackToTableBodyContext(){for(;this.currentTagName!==Ot.TBODY&&this.currentTagName!==Ot.TFOOT&&this.currentTagName!==Ot.THEAD&&this.currentTagName!==Ot.TEMPLATE&&this.currentTagName!==Ot.HTML||this.treeAdapter.getNamespaceURI(this.current)!==ft.HTML;)this.pop();}clearBackToTableRowContext(){for(;this.currentTagName!==Ot.TR&&this.currentTagName!==Ot.TEMPLATE&&this.currentTagName!==Ot.HTML||this.treeAdapter.getNamespaceURI(this.current)!==ft.HTML;)this.pop();}remove(e){for(let t=this.stackTop;t>=0;t--)if(this.items[t]===e){this.items.splice(t,1),this.stackTop--,this._updateCurrentElement();break}}tryPeekProperlyNestedBodyElement(){const e=this.items[1];return e&&this.treeAdapter.getTagName(e)===Ot.BODY?e:null}contains(e){return this._indexOf(e)>-1}getCommonAncestor(e){let t=this._indexOf(e);return --t>=0?this.items[t]:null}isRootHtmlElementCurrent(){return 0===this.stackTop&&this.currentTagName===Ot.HTML}hasInScope(e){for(let t=this.stackTop;t>=0;t--){const n=this.treeAdapter.getTagName(this.items[t]),s=this.treeAdapter.getNamespaceURI(this.items[t]);if(n===e&&s===ft.HTML)return !0;if(It(n,s))return !1}return !0}hasNumberedHeaderInScope(){for(let e=this.stackTop;e>=0;e--){const t=this.treeAdapter.getTagName(this.items[e]),n=this.treeAdapter.getNamespaceURI(this.items[e]);if((t===Ot.H1||t===Ot.H2||t===Ot.H3||t===Ot.H4||t===Ot.H5||t===Ot.H6)&&n===ft.HTML)return !0;if(It(t,n))return !1}return !0}hasInListItemScope(e){for(let t=this.stackTop;t>=0;t--){const n=this.treeAdapter.getTagName(this.items[t]),s=this.treeAdapter.getNamespaceURI(this.items[t]);if(n===e&&s===ft.HTML)return !0;if((n===Ot.UL||n===Ot.OL)&&s===ft.HTML||It(n,s))return !1}return !0}hasInButtonScope(e){for(let t=this.stackTop;t>=0;t--){const n=this.treeAdapter.getTagName(this.items[t]),s=this.treeAdapter.getNamespaceURI(this.items[t]);if(n===e&&s===ft.HTML)return !0;if(n===Ot.BUTTON&&s===ft.HTML||It(n,s))return !1}return !0}hasInTableScope(e){for(let t=this.stackTop;t>=0;t--){const n=this.treeAdapter.getTagName(this.items[t]);if(this.treeAdapter.getNamespaceURI(this.items[t])===ft.HTML){if(n===e)return !0;if(n===Ot.TABLE||n===Ot.TEMPLATE||n===Ot.HTML)return !1}}return !0}hasTableBodyContextInTableScope(){for(let e=this.stackTop;e>=0;e--){const t=this.treeAdapter.getTagName(this.items[e]);if(this.treeAdapter.getNamespaceURI(this.items[e])===ft.HTML){if(t===Ot.TBODY||t===Ot.THEAD||t===Ot.TFOOT)return !0;if(t===Ot.TABLE||t===Ot.HTML)return !1}}return !0}hasInSelectScope(e){for(let t=this.stackTop;t>=0;t--){const n=this.treeAdapter.getTagName(this.items[t]);if(this.treeAdapter.getNamespaceURI(this.items[t])===ft.HTML){if(n===e)return !0;if(n!==Ot.OPTION&&n!==Ot.OPTGROUP)return !1}}return !0}generateImpliedEndTags(){for(;St(this.currentTagName);)this.pop();}generateImpliedEndTagsThoroughly(){for(;Rt(this.currentTagName);)this.pop();}generateImpliedEndTagsWithExclusion(e){for(;St(this.currentTagName)&&this.currentTagName!==e;)this.pop();}}(this.document,this.treeAdapter),this.activeFormattingElements=new kt(this.treeAdapter),this.tmplInsertionModeStack=[],this.tmplInsertionModeStackTop=-1,this.currentTmplInsertionMode=null,this.pendingCharacterTokens=[],this.hasNonWhitespacePendingCharacterToken=!1,this.framesetOk=!0,this.skipNextNewLine=!1,this.fosterParentingEnabled=!1;}_err(){}_runParsingLoop(e){for(;!this.stopped;){this._setupTokenizerCDATAMode();const t=this.tokenizer.getNextToken();if(t.type===Nt.HIBERNATION_TOKEN)break;if(this.skipNextNewLine&&(this.skipNextNewLine=!1,t.type===Nt.WHITESPACE_CHARACTER_TOKEN&&"\n"===t.chars[0])){if(1===t.chars.length)continue;t.chars=t.chars.substr(1);}if(this._processInputToken(t),e&&this.pendingScript)break}}runParsingLoopForCurrentChunk(e,t){if(this._runParsingLoop(t),t&&this.pendingScript){const e=this.pendingScript;return this.pendingScript=null,void t(e)}e&&e();}_setupTokenizerCDATAMode(){const e=this._getAdjustedCurrentElement();this.tokenizer.allowCDATA=e&&e!==this.document&&this.treeAdapter.getNamespaceURI(e)!==qt.HTML&&!this._isIntegrationPoint(e);}_switchToTextParsing(e,t){this._insertElement(e,qt.HTML),this.tokenizer.state=t,this.originalInsertionMode=this.insertionMode,this.insertionMode=Tn;}switchToPlaintextParsing(){this.insertionMode=Tn,this.originalInsertionMode=an,this.tokenizer.state=Nt.MODE.PLAINTEXT;}_getAdjustedCurrentElement(){return 0===this.openElements.stackTop&&this.fragmentContext?this.fragmentContext:this.openElements.current}_findFormInFragmentContext(){let e=this.fragmentContext;do{if(this.treeAdapter.getTagName(e)===zt.FORM){this.formElement=e;break}e=this.treeAdapter.getParentNode(e);}while(e)}_initTokenizerForFragmentParsing(){if(this.treeAdapter.getNamespaceURI(this.fragmentContext)===qt.HTML){const e=this.treeAdapter.getTagName(this.fragmentContext);e===zt.TITLE||e===zt.TEXTAREA?this.tokenizer.state=Nt.MODE.RCDATA:e===zt.STYLE||e===zt.XMP||e===zt.IFRAME||e===zt.NOEMBED||e===zt.NOFRAMES||e===zt.NOSCRIPT?this.tokenizer.state=Nt.MODE.RAWTEXT:e===zt.SCRIPT?this.tokenizer.state=Nt.MODE.SCRIPT_DATA:e===zt.PLAINTEXT&&(this.tokenizer.state=Nt.MODE.PLAINTEXT);}}_setDocumentType(e){const t=e.name||"",n=e.publicId||"",s=e.systemId||"";this.treeAdapter.setDocumentType(this.document,t,n,s);}_attachElementToTree(e){if(this._shouldFosterParentOnInsertion())this._fosterParentElement(e);else {const t=this.openElements.currentTmplContent||this.openElements.current;this.treeAdapter.appendChild(t,e);}}_appendElement(e,t){const n=this.treeAdapter.createElement(e.tagName,t,e.attrs);this._attachElementToTree(n);}_insertElement(e,t){const n=this.treeAdapter.createElement(e.tagName,t,e.attrs);this._attachElementToTree(n),this.openElements.push(n);}_insertFakeElement(e){const t=this.treeAdapter.createElement(e,qt.HTML,[]);this._attachElementToTree(t),this.openElements.push(t);}_insertTemplate(e){const t=this.treeAdapter.createElement(e.tagName,qt.HTML,e.attrs),n=this.treeAdapter.createDocumentFragment();this.treeAdapter.setTemplateContent(t,n),this._attachElementToTree(t),this.openElements.push(t);}_insertFakeRootElement(){const e=this.treeAdapter.createElement(zt.HTML,qt.HTML,[]);this.treeAdapter.appendChild(this.openElements.current,e),this.openElements.push(e);}_appendCommentNode(e,t){const n=this.treeAdapter.createCommentNode(e.data);this.treeAdapter.appendChild(t,n);}_insertCharacters(e){if(this._shouldFosterParentOnInsertion())this._fosterParentText(e.chars);else {const t=this.openElements.currentTmplContent||this.openElements.current;this.treeAdapter.insertText(t,e.chars);}}_adoptNodes(e,t){for(let n=this.treeAdapter.getFirstChild(e);n;n=this.treeAdapter.getFirstChild(e))this.treeAdapter.detachNode(n),this.treeAdapter.appendChild(t,n);}_shouldProcessTokenInForeignContent(e){const t=this._getAdjustedCurrentElement();if(!t||t===this.document)return !1;const n=this.treeAdapter.getNamespaceURI(t);if(n===qt.HTML)return !1;if(this.treeAdapter.getTagName(t)===zt.ANNOTATION_XML&&n===qt.MATHML&&e.type===Nt.START_TAG_TOKEN&&e.tagName===zt.SVG)return !1;const s=e.type===Nt.CHARACTER_TOKEN||e.type===Nt.NULL_CHARACTER_TOKEN||e.type===Nt.WHITESPACE_CHARACTER_TOKEN;return !((e.type===Nt.START_TAG_TOKEN&&e.tagName!==zt.MGLYPH&&e.tagName!==zt.MALIGNMARK||s)&&this._isIntegrationPoint(t,qt.MATHML)||(e.type===Nt.START_TAG_TOKEN||s)&&this._isIntegrationPoint(t,qt.HTML)||e.type===Nt.EOF_TOKEN)}_processToken(e){Ln[this.insertionMode][e.type](this,e);}_processTokenInBodyMode(e){Ln.IN_BODY_MODE[e.type](this,e);}_processTokenInForeignContent(e){e.type===Nt.CHARACTER_TOKEN?function(e,t){e._insertCharacters(t),e.framesetOk=!1;}(this,e):e.type===Nt.NULL_CHARACTER_TOKEN?function(e,t){t.chars=n,e._insertCharacters(t);}(this,e):e.type===Nt.WHITESPACE_CHARACTER_TOKEN?xn(this,e):e.type===Nt.COMMENT_TOKEN?Kn(this,e):e.type===Nt.START_TAG_TOKEN?function(e,t){if(jt.causesExit(t)&&!e.fragmentContext){for(;e.treeAdapter.getNamespaceURI(e.openElements.current)!==qt.HTML&&!e._isIntegrationPoint(e.openElements.current);)e.openElements.pop();e._processToken(t);}else {const n=e._getAdjustedCurrentElement(),s=e.treeAdapter.getNamespaceURI(n);s===qt.MATHML?jt.adjustTokenMathMLAttrs(t):s===qt.SVG&&(jt.adjustTokenSVGTagName(t),jt.adjustTokenSVGAttrs(t)),jt.adjustTokenXMLAttrs(t),t.selfClosing?e._appendElement(t,s):e._insertElement(t,s),t.ackSelfClosing=!0;}}(this,e):e.type===Nt.END_TAG_TOKEN&&function(e,t){for(let n=e.openElements.stackTop;n>0;n--){const s=e.openElements.items[n];if(e.treeAdapter.getNamespaceURI(s)===qt.HTML){e._processToken(t);break}if(e.treeAdapter.getTagName(s).toLowerCase()===t.tagName){e.openElements.popUntilElementPopped(s);break}}}(this,e);}_processInputToken(e){this._shouldProcessTokenInForeignContent(e)?this._processTokenInForeignContent(e):this._processToken(e),e.type===Nt.START_TAG_TOKEN&&e.selfClosing&&!e.ackSelfClosing&&this._err("non-void-html-element-start-tag-with-trailing-solidus");}_isIntegrationPoint(e,t){const n=this.treeAdapter.getTagName(e),s=this.treeAdapter.getNamespaceURI(e),r=this.treeAdapter.getAttrList(e);return jt.isIntegrationPoint(n,s,r,t)}_reconstructActiveFormattingElements(){const e=this.activeFormattingElements.length;if(e){let t=e,n=null;do{if(t--,n=this.activeFormattingElements.entries[t],n.type===kt.MARKER_ENTRY||this.openElements.contains(n.element)){t++;break}}while(t>0);for(let s=t;s<e;s++)n=this.activeFormattingElements.entries[s],this._insertElement(n.token,this.treeAdapter.getNamespaceURI(n.element)),n.element=this.openElements.current;}}_closeTableCell(){this.openElements.generateImpliedEndTags(),this.openElements.popUntilTableCellPopped(),this.activeFormattingElements.clearToLastMarker(),this.insertionMode=mn;}_closePElement(){this.openElements.generateImpliedEndTagsWithExclusion(zt.P),this.openElements.popUntilTagNamePopped(zt.P);}_resetInsertionMode(){for(let e=this.openElements.stackTop,t=!1;e>=0;e--){let n=this.openElements.items[e];0===e&&(t=!0,this.fragmentContext&&(n=this.fragmentContext));const s=this.treeAdapter.getTagName(n),r=Rn[s];if(r){this.insertionMode=r;break}if(!(t||s!==zt.TD&&s!==zt.TH)){this.insertionMode=pn;break}if(!t&&s===zt.HEAD){this.insertionMode=sn;break}if(s===zt.SELECT){this._resetInsertionModeForSelect(e);break}if(s===zt.TEMPLATE){this.insertionMode=this.currentTmplInsertionMode;break}if(s===zt.HTML){this.insertionMode=this.headElement?on:nn;break}if(t){this.insertionMode=an;break}}}_resetInsertionModeForSelect(e){if(e>0)for(let t=e-1;t>0;t--){const e=this.openElements.items[t],n=this.treeAdapter.getTagName(e);if(n===zt.TEMPLATE)break;if(n===zt.TABLE)return void(this.insertionMode=un)}this.insertionMode=An;}_pushTmplInsertionMode(e){this.tmplInsertionModeStack.push(e),this.tmplInsertionModeStackTop++,this.currentTmplInsertionMode=e;}_popTmplInsertionMode(){this.tmplInsertionModeStack.pop(),this.tmplInsertionModeStackTop--,this.currentTmplInsertionMode=this.tmplInsertionModeStack[this.tmplInsertionModeStackTop];}_isElementCausesFosterParenting(e){const t=this.treeAdapter.getTagName(e);return t===zt.TABLE||t===zt.TBODY||t===zt.TFOOT||t===zt.THEAD||t===zt.TR}_shouldFosterParentOnInsertion(){return this.fosterParentingEnabled&&this._isElementCausesFosterParenting(this.openElements.current)}_findFosterParentingLocation(){const e={parent:null,beforeElement:null};for(let t=this.openElements.stackTop;t>=0;t--){const n=this.openElements.items[t],s=this.treeAdapter.getTagName(n),r=this.treeAdapter.getNamespaceURI(n);if(s===zt.TEMPLATE&&r===qt.HTML){e.parent=this.treeAdapter.getTemplateContent(n);break}if(s===zt.TABLE){e.parent=this.treeAdapter.getParentNode(n),e.parent?e.beforeElement=n:e.parent=this.openElements.items[t-1];break}}return e.parent||(e.parent=this.openElements.items[0]),e}_fosterParentElement(e){const t=this._findFosterParentingLocation();t.beforeElement?this.treeAdapter.insertBefore(t.parent,e,t.beforeElement):this.treeAdapter.appendChild(t.parent,e);}_fosterParentText(e){const t=this._findFosterParentingLocation();t.beforeElement?this.treeAdapter.insertTextBefore(t.parent,e,t.beforeElement):this.treeAdapter.insertText(t.parent,e);}_isSpecialElement(e){const t=this.treeAdapter.getTagName(e),n=this.treeAdapter.getNamespaceURI(e);return Ct.SPECIAL_ELEMENTS[n][t]}};function Mn(e,t){let n=e.activeFormattingElements.getElementEntryInScopeWithTagName(t.tagName);return n?e.openElements.contains(n.element)?e.openElements.hasInScope(t.tagName)||(n=null):(e.activeFormattingElements.removeEntry(n),n=null):hs(e,t),n}function gn(e,t){let n=null;for(let s=e.openElements.stackTop;s>=0;s--){const r=e.openElements.items[s];if(r===t.element)break;e._isSpecialElement(r)&&(n=r);}return n||(e.openElements.popUntilElementPopped(t.element),e.activeFormattingElements.removeEntry(t)),n}function Pn(e,t,n){let s=t,r=e.openElements.getCommonAncestor(t);for(let i=0,o=r;o!==n;i++,o=r){r=e.openElements.getCommonAncestor(o);const n=e.activeFormattingElements.getElementEntry(o),a=n&&i>=3;!n||a?(a&&e.activeFormattingElements.removeEntry(n),e.openElements.remove(o)):(o=Hn(e,n),s===t&&(e.activeFormattingElements.bookmark=n),e.treeAdapter.detachNode(s),e.treeAdapter.appendChild(o,s),s=o);}return s}function Hn(e,t){const n=e.treeAdapter.getNamespaceURI(t.element),s=e.treeAdapter.createElement(t.token.tagName,n,t.token.attrs);return e.openElements.replace(t.element,s),t.element=s,s}function Dn(e,t,n){if(e._isElementCausesFosterParenting(t))e._fosterParentElement(n);else {const s=e.treeAdapter.getTagName(t),r=e.treeAdapter.getNamespaceURI(t);s===zt.TEMPLATE&&r===qt.HTML&&(t=e.treeAdapter.getTemplateContent(t)),e.treeAdapter.appendChild(t,n);}}function Fn(e,t,n){const s=e.treeAdapter.getNamespaceURI(n.element),r=n.token,i=e.treeAdapter.createElement(r.tagName,s,r.attrs);e._adoptNodes(t,i),e.treeAdapter.appendChild(t,i),e.activeFormattingElements.insertElementAfterBookmark(i,n.token),e.activeFormattingElements.removeEntry(n),e.openElements.remove(n.element),e.openElements.insertAfter(t,i);}function Un(e,t){let n;for(let s=0;s<8&&(n=Mn(e,t),n);s++){const t=gn(e,n);if(!t)break;e.activeFormattingElements.bookmark=n;const s=Pn(e,t,n.element),r=e.openElements.getCommonAncestor(n.element);e.treeAdapter.detachNode(s),Dn(e,r,s),Fn(e,t,n);}}function Gn(){}function Bn(e){e._err("misplaced-doctype");}function Kn(e,t){e._appendCommentNode(t,e.openElements.currentTmplContent||e.openElements.current);}function bn(e,t){e._appendCommentNode(t,e.document);}function xn(e,t){e._insertCharacters(t);}function yn(e){e.stopped=!0;}function vn(e,t){e._err("missing-doctype",{beforeToken:!0}),e.treeAdapter.setDocumentMode(e.document,Ct.DOCUMENT_MODE.QUIRKS),e.insertionMode=tn,e._processToken(t);}function Yn(e,t){e._insertFakeRootElement(),e.insertionMode=nn,e._processToken(t);}function wn(e,t){e._insertFakeElement(zt.HEAD),e.headElement=e.openElements.current,e.insertionMode=sn,e._processToken(t);}function Qn(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.BASE||n===zt.BASEFONT||n===zt.BGSOUND||n===zt.LINK||n===zt.META?(e._appendElement(t,qt.HTML),t.ackSelfClosing=!0):n===zt.TITLE?e._switchToTextParsing(t,Nt.MODE.RCDATA):n===zt.NOSCRIPT?e.options.scriptingEnabled?e._switchToTextParsing(t,Nt.MODE.RAWTEXT):(e._insertElement(t,qt.HTML),e.insertionMode=rn):n===zt.NOFRAMES||n===zt.STYLE?e._switchToTextParsing(t,Nt.MODE.RAWTEXT):n===zt.SCRIPT?e._switchToTextParsing(t,Nt.MODE.SCRIPT_DATA):n===zt.TEMPLATE?(e._insertTemplate(t,qt.HTML),e.activeFormattingElements.insertMarker(),e.framesetOk=!1,e.insertionMode=Nn,e._pushTmplInsertionMode(Nn)):n===zt.HEAD?e._err(k):Wn(e,t);}function Xn(e,t){const n=t.tagName;n===zt.HEAD?(e.openElements.pop(),e.insertionMode=on):n===zt.BODY||n===zt.BR||n===zt.HTML?Wn(e,t):n===zt.TEMPLATE&&e.openElements.tmplCount>0?(e.openElements.generateImpliedEndTagsThoroughly(),e.openElements.currentTagName!==zt.TEMPLATE&&e._err("closing-of-element-with-open-child-elements"),e.openElements.popUntilTagNamePopped(zt.TEMPLATE),e.activeFormattingElements.clearToLastMarker(),e._popTmplInsertionMode(),e._resetInsertionMode()):e._err(L);}function Wn(e,t){e.openElements.pop(),e.insertionMode=on,e._processToken(t);}function Vn(e,t){const n=t.type===Nt.EOF_TOKEN?"open-elements-left-after-eof":"disallowed-content-in-noscript-in-head";e._err(n),e.openElements.pop(),e.insertionMode=sn,e._processToken(t);}function jn(e,t){e._insertFakeElement(zt.BODY),e.insertionMode=an,e._processToken(t);}function zn(e,t){e._reconstructActiveFormattingElements(),e._insertCharacters(t);}function qn(e,t){e._reconstructActiveFormattingElements(),e._insertCharacters(t),e.framesetOk=!1;}function Jn(e,t){e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._insertElement(t,qt.HTML);}function Zn(e,t){e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._insertElement(t,qt.HTML),e.skipNextNewLine=!0,e.framesetOk=!1;}function $n(e,t){e._reconstructActiveFormattingElements(),e._insertElement(t,qt.HTML),e.activeFormattingElements.pushElement(e.openElements.current,t);}function es(e,t){e._reconstructActiveFormattingElements(),e._insertElement(t,qt.HTML),e.activeFormattingElements.insertMarker(),e.framesetOk=!1;}function ts(e,t){e._reconstructActiveFormattingElements(),e._appendElement(t,qt.HTML),e.framesetOk=!1,t.ackSelfClosing=!0;}function ns(e,t){e._appendElement(t,qt.HTML),t.ackSelfClosing=!0;}function ss(e,t){e._switchToTextParsing(t,Nt.MODE.RAWTEXT);}function rs(e,t){e.openElements.currentTagName===zt.OPTION&&e.openElements.pop(),e._reconstructActiveFormattingElements(),e._insertElement(t,qt.HTML);}function is(e,t){e.openElements.hasInScope(zt.RUBY)&&e.openElements.generateImpliedEndTags(),e._insertElement(t,qt.HTML);}function os(e,t){e._reconstructActiveFormattingElements(),e._insertElement(t,qt.HTML);}function as(e,t){const n=t.tagName;switch(n.length){case 1:n===zt.I||n===zt.S||n===zt.B||n===zt.U?$n(e,t):n===zt.P?Jn(e,t):n===zt.A?function(e,t){const n=e.activeFormattingElements.getElementEntryInScopeWithTagName(zt.A);n&&(Un(e,t),e.openElements.remove(n.element),e.activeFormattingElements.removeEntry(n)),e._reconstructActiveFormattingElements(),e._insertElement(t,qt.HTML),e.activeFormattingElements.pushElement(e.openElements.current,t);}(e,t):os(e,t);break;case 2:n===zt.DL||n===zt.OL||n===zt.UL?Jn(e,t):n===zt.H1||n===zt.H2||n===zt.H3||n===zt.H4||n===zt.H5||n===zt.H6?function(e,t){e.openElements.hasInButtonScope(zt.P)&&e._closePElement();const n=e.openElements.currentTagName;n!==zt.H1&&n!==zt.H2&&n!==zt.H3&&n!==zt.H4&&n!==zt.H5&&n!==zt.H6||e.openElements.pop(),e._insertElement(t,qt.HTML);}(e,t):n===zt.LI||n===zt.DD||n===zt.DT?function(e,t){e.framesetOk=!1;const n=t.tagName;for(let t=e.openElements.stackTop;t>=0;t--){const s=e.openElements.items[t],r=e.treeAdapter.getTagName(s);let i=null;if(n===zt.LI&&r===zt.LI?i=zt.LI:n!==zt.DD&&n!==zt.DT||r!==zt.DD&&r!==zt.DT||(i=r),i){e.openElements.generateImpliedEndTagsWithExclusion(i),e.openElements.popUntilTagNamePopped(i);break}if(r!==zt.ADDRESS&&r!==zt.DIV&&r!==zt.P&&e._isSpecialElement(s))break}e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._insertElement(t,qt.HTML);}(e,t):n===zt.EM||n===zt.TT?$n(e,t):n===zt.BR?ts(e,t):n===zt.HR?function(e,t){e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._appendElement(t,qt.HTML),e.framesetOk=!1,t.ackSelfClosing=!0;}(e,t):n===zt.RB?is(e,t):n===zt.RT||n===zt.RP?function(e,t){e.openElements.hasInScope(zt.RUBY)&&e.openElements.generateImpliedEndTagsWithExclusion(zt.RTC),e._insertElement(t,qt.HTML);}(e,t):n!==zt.TH&&n!==zt.TD&&n!==zt.TR&&os(e,t);break;case 3:n===zt.DIV||n===zt.DIR||n===zt.NAV?Jn(e,t):n===zt.PRE?Zn(e,t):n===zt.BIG?$n(e,t):n===zt.IMG||n===zt.WBR?ts(e,t):n===zt.XMP?function(e,t){e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._reconstructActiveFormattingElements(),e.framesetOk=!1,e._switchToTextParsing(t,Nt.MODE.RAWTEXT);}(e,t):n===zt.SVG?function(e,t){e._reconstructActiveFormattingElements(),jt.adjustTokenSVGAttrs(t),jt.adjustTokenXMLAttrs(t),t.selfClosing?e._appendElement(t,qt.SVG):e._insertElement(t,qt.SVG),t.ackSelfClosing=!0;}(e,t):n===zt.RTC?is(e,t):n!==zt.COL&&os(e,t);break;case 4:n===zt.HTML?function(e,t){0===e.openElements.tmplCount&&e.treeAdapter.adoptAttributes(e.openElements.items[0],t.attrs);}(e,t):n===zt.BASE||n===zt.LINK||n===zt.META?Qn(e,t):n===zt.BODY?function(e,t){const n=e.openElements.tryPeekProperlyNestedBodyElement();n&&0===e.openElements.tmplCount&&(e.framesetOk=!1,e.treeAdapter.adoptAttributes(n,t.attrs));}(e,t):n===zt.MAIN||n===zt.MENU?Jn(e,t):n===zt.FORM?function(e,t){const n=e.openElements.tmplCount>0;e.formElement&&!n||(e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._insertElement(t,qt.HTML),n||(e.formElement=e.openElements.current));}(e,t):n===zt.CODE||n===zt.FONT?$n(e,t):n===zt.NOBR?function(e,t){e._reconstructActiveFormattingElements(),e.openElements.hasInScope(zt.NOBR)&&(Un(e,t),e._reconstructActiveFormattingElements()),e._insertElement(t,qt.HTML),e.activeFormattingElements.pushElement(e.openElements.current,t);}(e,t):n===zt.AREA?ts(e,t):n===zt.MATH?function(e,t){e._reconstructActiveFormattingElements(),jt.adjustTokenMathMLAttrs(t),jt.adjustTokenXMLAttrs(t),t.selfClosing?e._appendElement(t,qt.MATHML):e._insertElement(t,qt.MATHML),t.ackSelfClosing=!0;}(e,t):n===zt.MENU?function(e,t){e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._insertElement(t,qt.HTML);}(e,t):n!==zt.HEAD&&os(e,t);break;case 5:n===zt.STYLE||n===zt.TITLE?Qn(e,t):n===zt.ASIDE?Jn(e,t):n===zt.SMALL?$n(e,t):n===zt.TABLE?function(e,t){e.treeAdapter.getDocumentMode(e.document)!==Ct.DOCUMENT_MODE.QUIRKS&&e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._insertElement(t,qt.HTML),e.framesetOk=!1,e.insertionMode=En;}(e,t):n===zt.EMBED?ts(e,t):n===zt.INPUT?function(e,t){e._reconstructActiveFormattingElements(),e._appendElement(t,qt.HTML);const n=Nt.getTokenAttr(t,Jt.TYPE);n&&n.toLowerCase()===$t||(e.framesetOk=!1),t.ackSelfClosing=!0;}(e,t):n===zt.PARAM||n===zt.TRACK?ns(e,t):n===zt.IMAGE?function(e,t){t.tagName=zt.IMG,ts(e,t);}(e,t):n!==zt.FRAME&&n!==zt.TBODY&&n!==zt.TFOOT&&n!==zt.THEAD&&os(e,t);break;case 6:n===zt.SCRIPT?Qn(e,t):n===zt.CENTER||n===zt.FIGURE||n===zt.FOOTER||n===zt.HEADER||n===zt.HGROUP||n===zt.DIALOG?Jn(e,t):n===zt.BUTTON?function(e,t){e.openElements.hasInScope(zt.BUTTON)&&(e.openElements.generateImpliedEndTags(),e.openElements.popUntilTagNamePopped(zt.BUTTON)),e._reconstructActiveFormattingElements(),e._insertElement(t,qt.HTML),e.framesetOk=!1;}(e,t):n===zt.STRIKE||n===zt.STRONG?$n(e,t):n===zt.APPLET||n===zt.OBJECT?es(e,t):n===zt.KEYGEN?ts(e,t):n===zt.SOURCE?ns(e,t):n===zt.IFRAME?function(e,t){e.framesetOk=!1,e._switchToTextParsing(t,Nt.MODE.RAWTEXT);}(e,t):n===zt.SELECT?function(e,t){e._reconstructActiveFormattingElements(),e._insertElement(t,qt.HTML),e.framesetOk=!1,e.insertionMode===En||e.insertionMode===cn||e.insertionMode===ln||e.insertionMode===mn||e.insertionMode===pn?e.insertionMode=un:e.insertionMode=An;}(e,t):n===zt.OPTION?rs(e,t):os(e,t);break;case 7:n===zt.BGSOUND?Qn(e,t):n===zt.DETAILS||n===zt.ADDRESS||n===zt.ARTICLE||n===zt.SECTION||n===zt.SUMMARY?Jn(e,t):n===zt.LISTING?Zn(e,t):n===zt.MARQUEE?es(e,t):n===zt.NOEMBED?ss(e,t):n!==zt.CAPTION&&os(e,t);break;case 8:n===zt.BASEFONT?Qn(e,t):n===zt.FRAMESET?function(e,t){const n=e.openElements.tryPeekProperlyNestedBodyElement();e.framesetOk&&n&&(e.treeAdapter.detachNode(n),e.openElements.popAllUpToHtmlElement(),e._insertElement(t,qt.HTML),e.insertionMode=Cn);}(e,t):n===zt.FIELDSET?Jn(e,t):n===zt.TEXTAREA?function(e,t){e._insertElement(t,qt.HTML),e.skipNextNewLine=!0,e.tokenizer.state=Nt.MODE.RCDATA,e.originalInsertionMode=e.insertionMode,e.framesetOk=!1,e.insertionMode=Tn;}(e,t):n===zt.TEMPLATE?Qn(e,t):n===zt.NOSCRIPT?e.options.scriptingEnabled?ss(e,t):os(e,t):n===zt.OPTGROUP?rs(e,t):n!==zt.COLGROUP&&os(e,t);break;case 9:n===zt.PLAINTEXT?function(e,t){e.openElements.hasInButtonScope(zt.P)&&e._closePElement(),e._insertElement(t,qt.HTML),e.tokenizer.state=Nt.MODE.PLAINTEXT;}(e,t):os(e,t);break;case 10:n===zt.BLOCKQUOTE||n===zt.FIGCAPTION?Jn(e,t):os(e,t);break;default:os(e,t);}}function Ts(e,t){const n=t.tagName;e.openElements.hasInScope(n)&&(e.openElements.generateImpliedEndTags(),e.openElements.popUntilTagNamePopped(n));}function Es(e,t){const n=t.tagName;e.openElements.hasInScope(n)&&(e.openElements.generateImpliedEndTags(),e.openElements.popUntilTagNamePopped(n),e.activeFormattingElements.clearToLastMarker());}function hs(e,t){const n=t.tagName;for(let t=e.openElements.stackTop;t>0;t--){const s=e.openElements.items[t];if(e.treeAdapter.getTagName(s)===n){e.openElements.generateImpliedEndTagsWithExclusion(n),e.openElements.popUntilElementPopped(s);break}if(e._isSpecialElement(s))break}}function cs(e,t){const n=t.tagName;switch(n.length){case 1:n===zt.A||n===zt.B||n===zt.I||n===zt.S||n===zt.U?Un(e,t):n===zt.P?function(e){e.openElements.hasInButtonScope(zt.P)||e._insertFakeElement(zt.P),e._closePElement();}(e):hs(e,t);break;case 2:n===zt.DL||n===zt.UL||n===zt.OL?Ts(e,t):n===zt.LI?function(e){e.openElements.hasInListItemScope(zt.LI)&&(e.openElements.generateImpliedEndTagsWithExclusion(zt.LI),e.openElements.popUntilTagNamePopped(zt.LI));}(e):n===zt.DD||n===zt.DT?function(e,t){const n=t.tagName;e.openElements.hasInScope(n)&&(e.openElements.generateImpliedEndTagsWithExclusion(n),e.openElements.popUntilTagNamePopped(n));}(e,t):n===zt.H1||n===zt.H2||n===zt.H3||n===zt.H4||n===zt.H5||n===zt.H6?function(e){e.openElements.hasNumberedHeaderInScope()&&(e.openElements.generateImpliedEndTags(),e.openElements.popUntilNumberedHeaderPopped());}(e):n===zt.BR?function(e){e._reconstructActiveFormattingElements(),e._insertFakeElement(zt.BR),e.openElements.pop(),e.framesetOk=!1;}(e):n===zt.EM||n===zt.TT?Un(e,t):hs(e,t);break;case 3:n===zt.BIG?Un(e,t):n===zt.DIR||n===zt.DIV||n===zt.NAV||n===zt.PRE?Ts(e,t):hs(e,t);break;case 4:n===zt.BODY?function(e){e.openElements.hasInScope(zt.BODY)&&(e.insertionMode=dn);}(e):n===zt.HTML?function(e,t){e.openElements.hasInScope(zt.BODY)&&(e.insertionMode=dn,e._processToken(t));}(e,t):n===zt.FORM?function(e){const t=e.openElements.tmplCount>0,n=e.formElement;t||(e.formElement=null),(n||t)&&e.openElements.hasInScope(zt.FORM)&&(e.openElements.generateImpliedEndTags(),t?e.openElements.popUntilTagNamePopped(zt.FORM):e.openElements.remove(n));}(e):n===zt.CODE||n===zt.FONT||n===zt.NOBR?Un(e,t):n===zt.MAIN||n===zt.MENU?Ts(e,t):hs(e,t);break;case 5:n===zt.ASIDE?Ts(e,t):n===zt.SMALL?Un(e,t):hs(e,t);break;case 6:n===zt.CENTER||n===zt.FIGURE||n===zt.FOOTER||n===zt.HEADER||n===zt.HGROUP||n===zt.DIALOG?Ts(e,t):n===zt.APPLET||n===zt.OBJECT?Es(e,t):n===zt.STRIKE||n===zt.STRONG?Un(e,t):hs(e,t);break;case 7:n===zt.ADDRESS||n===zt.ARTICLE||n===zt.DETAILS||n===zt.SECTION||n===zt.SUMMARY||n===zt.LISTING?Ts(e,t):n===zt.MARQUEE?Es(e,t):hs(e,t);break;case 8:n===zt.FIELDSET?Ts(e,t):n===zt.TEMPLATE?Xn(e,t):hs(e,t);break;case 10:n===zt.BLOCKQUOTE||n===zt.FIGCAPTION?Ts(e,t):hs(e,t);break;default:hs(e,t);}}function _s(e,t){e.tmplInsertionModeStackTop>-1?Os(e,t):e.stopped=!0;}function ls(e,t){const n=e.openElements.currentTagName;n===zt.TABLE||n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD||n===zt.TR?(e.pendingCharacterTokens=[],e.hasNonWhitespacePendingCharacterToken=!1,e.originalInsertionMode=e.insertionMode,e.insertionMode=hn,e._processToken(t)):As(e,t);}function ms(e,t){const n=t.tagName;switch(n.length){case 2:n===zt.TD||n===zt.TH||n===zt.TR?function(e,t){e.openElements.clearBackToTableContext(),e._insertFakeElement(zt.TBODY),e.insertionMode=ln,e._processToken(t);}(e,t):As(e,t);break;case 3:n===zt.COL?function(e,t){e.openElements.clearBackToTableContext(),e._insertFakeElement(zt.COLGROUP),e.insertionMode=_n,e._processToken(t);}(e,t):As(e,t);break;case 4:n===zt.FORM?function(e,t){e.formElement||0!==e.openElements.tmplCount||(e._insertElement(t,qt.HTML),e.formElement=e.openElements.current,e.openElements.pop());}(e,t):As(e,t);break;case 5:n===zt.TABLE?function(e,t){e.openElements.hasInTableScope(zt.TABLE)&&(e.openElements.popUntilTagNamePopped(zt.TABLE),e._resetInsertionMode(),e._processToken(t));}(e,t):n===zt.STYLE?Qn(e,t):n===zt.TBODY||n===zt.TFOOT||n===zt.THEAD?function(e,t){e.openElements.clearBackToTableContext(),e._insertElement(t,qt.HTML),e.insertionMode=ln;}(e,t):n===zt.INPUT?function(e,t){const n=Nt.getTokenAttr(t,Jt.TYPE);n&&n.toLowerCase()===$t?e._appendElement(t,qt.HTML):As(e,t),t.ackSelfClosing=!0;}(e,t):As(e,t);break;case 6:n===zt.SCRIPT?Qn(e,t):As(e,t);break;case 7:n===zt.CAPTION?function(e,t){e.openElements.clearBackToTableContext(),e.activeFormattingElements.insertMarker(),e._insertElement(t,qt.HTML),e.insertionMode=cn;}(e,t):As(e,t);break;case 8:n===zt.COLGROUP?function(e,t){e.openElements.clearBackToTableContext(),e._insertElement(t,qt.HTML),e.insertionMode=_n;}(e,t):n===zt.TEMPLATE?Qn(e,t):As(e,t);break;default:As(e,t);}}function ps(e,t){const n=t.tagName;n===zt.TABLE?e.openElements.hasInTableScope(zt.TABLE)&&(e.openElements.popUntilTagNamePopped(zt.TABLE),e._resetInsertionMode()):n===zt.TEMPLATE?Xn(e,t):n!==zt.BODY&&n!==zt.CAPTION&&n!==zt.COL&&n!==zt.COLGROUP&&n!==zt.HTML&&n!==zt.TBODY&&n!==zt.TD&&n!==zt.TFOOT&&n!==zt.TH&&n!==zt.THEAD&&n!==zt.TR&&As(e,t);}function As(e,t){const n=e.fosterParentingEnabled;e.fosterParentingEnabled=!0,e._processTokenInBodyMode(t),e.fosterParentingEnabled=n;}function us(e,t){let n=0;if(e.hasNonWhitespacePendingCharacterToken)for(;n<e.pendingCharacterTokens.length;n++)As(e,e.pendingCharacterTokens[n]);else for(;n<e.pendingCharacterTokens.length;n++)e._insertCharacters(e.pendingCharacterTokens[n]);e.insertionMode=e.originalInsertionMode,e._processToken(t);}function Ns(e,t){e.openElements.currentTagName===zt.COLGROUP&&(e.openElements.pop(),e.insertionMode=En,e._processToken(t));}function ds(e,t){const n=t.tagName;n===zt.HTML?as(e,t):n===zt.OPTION?(e.openElements.currentTagName===zt.OPTION&&e.openElements.pop(),e._insertElement(t,qt.HTML)):n===zt.OPTGROUP?(e.openElements.currentTagName===zt.OPTION&&e.openElements.pop(),e.openElements.currentTagName===zt.OPTGROUP&&e.openElements.pop(),e._insertElement(t,qt.HTML)):n===zt.INPUT||n===zt.KEYGEN||n===zt.TEXTAREA||n===zt.SELECT?e.openElements.hasInSelectScope(zt.SELECT)&&(e.openElements.popUntilTagNamePopped(zt.SELECT),e._resetInsertionMode(),n!==zt.SELECT&&e._processToken(t)):n!==zt.SCRIPT&&n!==zt.TEMPLATE||Qn(e,t);}function Cs(e,t){const n=t.tagName;if(n===zt.OPTGROUP){const t=e.openElements.items[e.openElements.stackTop-1],n=t&&e.treeAdapter.getTagName(t);e.openElements.currentTagName===zt.OPTION&&n===zt.OPTGROUP&&e.openElements.pop(),e.openElements.currentTagName===zt.OPTGROUP&&e.openElements.pop();}else n===zt.OPTION?e.openElements.currentTagName===zt.OPTION&&e.openElements.pop():n===zt.SELECT&&e.openElements.hasInSelectScope(zt.SELECT)?(e.openElements.popUntilTagNamePopped(zt.SELECT),e._resetInsertionMode()):n===zt.TEMPLATE&&Xn(e,t);}function Os(e,t){e.openElements.tmplCount>0?(e.openElements.popUntilTagNamePopped(zt.TEMPLATE),e.activeFormattingElements.clearToLastMarker(),e._popTmplInsertionMode(),e._resetInsertionMode(),e._processToken(t)):e.stopped=!0;}function fs(e,t){e.insertionMode=an,e._processToken(t);}function Ss(e,t){e.insertionMode=an,e._processToken(t);}return Ct.TAG_NAMES,Ct.NAMESPACES,e.parse=function(e,t){return new kn(t).parse(e)},e.parseFragment=function(e,t,n){return "string"==typeof e&&(n=t,t=e,e=null),new kn(n).parseFragment(t,e)},Object.defineProperty(e,"__esModule",{value:!0}),e}({});const parse=e.parse;const parseFragment=e.parseFragment;
- const docParser = new WeakMap();
- function parseDocumentUtil(ownerDocument, html) {
- const doc = parse(html.trim(), getParser(ownerDocument));
- doc.documentElement = doc.firstElementChild;
- doc.head = doc.documentElement.firstElementChild;
- doc.body = doc.head.nextElementSibling;
- return doc;
- }
- function parseFragmentUtil(ownerDocument, html) {
- if (typeof html === 'string') {
- html = html.trim();
- }
- else {
- html = '';
- }
- const frag = parseFragment(html, getParser(ownerDocument));
- return frag;
- }
- function getParser(ownerDocument) {
- let parseOptions = docParser.get(ownerDocument);
- if (parseOptions != null) {
- return parseOptions;
- }
- const treeAdapter = {
- createDocument() {
- const doc = ownerDocument.createElement("#document" /* DOCUMENT_NODE */);
- doc['x-mode'] = 'no-quirks';
- return doc;
- },
- setNodeSourceCodeLocation(node, location) {
- node.sourceCodeLocation = location;
- },
- getNodeSourceCodeLocation(node) {
- return node.sourceCodeLocation;
- },
- createDocumentFragment() {
- return ownerDocument.createDocumentFragment();
- },
- createElement(tagName, namespaceURI, attrs) {
- const elm = ownerDocument.createElementNS(namespaceURI, tagName);
- for (let i = 0; i < attrs.length; i++) {
- const attr = attrs[i];
- if (attr.namespace == null || attr.namespace === 'http://www.w3.org/1999/xhtml') {
- elm.setAttribute(attr.name, attr.value);
- }
- else {
- elm.setAttributeNS(attr.namespace, attr.name, attr.value);
- }
- }
- return elm;
- },
- createCommentNode(data) {
- return ownerDocument.createComment(data);
- },
- appendChild(parentNode, newNode) {
- parentNode.appendChild(newNode);
- },
- insertBefore(parentNode, newNode, referenceNode) {
- parentNode.insertBefore(newNode, referenceNode);
- },
- setTemplateContent(templateElement, contentElement) {
- templateElement.content = contentElement;
- },
- getTemplateContent(templateElement) {
- return templateElement.content;
- },
- setDocumentType(doc, name, publicId, systemId) {
- let doctypeNode = doc.childNodes.find((n) => n.nodeType === 10 /* DOCUMENT_TYPE_NODE */);
- if (doctypeNode == null) {
- doctypeNode = ownerDocument.createDocumentTypeNode();
- doc.insertBefore(doctypeNode, doc.firstChild);
- }
- doctypeNode.nodeValue = '!DOCTYPE';
- doctypeNode['x-name'] = name;
- doctypeNode['x-publicId'] = publicId;
- doctypeNode['x-systemId'] = systemId;
- },
- setDocumentMode(doc, mode) {
- doc['x-mode'] = mode;
- },
- getDocumentMode(doc) {
- return doc['x-mode'];
- },
- detachNode(node) {
- node.remove();
- },
- insertText(parentNode, text) {
- const lastChild = parentNode.lastChild;
- if (lastChild != null && lastChild.nodeType === 3 /* TEXT_NODE */) {
- lastChild.nodeValue += text;
- }
- else {
- parentNode.appendChild(ownerDocument.createTextNode(text));
- }
- },
- insertTextBefore(parentNode, text, referenceNode) {
- const prevNode = parentNode.childNodes[parentNode.childNodes.indexOf(referenceNode) - 1];
- if (prevNode != null && prevNode.nodeType === 3 /* TEXT_NODE */) {
- prevNode.nodeValue += text;
- }
- else {
- parentNode.insertBefore(ownerDocument.createTextNode(text), referenceNode);
- }
- },
- adoptAttributes(recipient, attrs) {
- for (let i = 0; i < attrs.length; i++) {
- const attr = attrs[i];
- if (recipient.hasAttributeNS(attr.namespace, attr.name) === false) {
- recipient.setAttributeNS(attr.namespace, attr.name, attr.value);
- }
- }
- },
- getFirstChild(node) {
- return node.childNodes[0];
- },
- getChildNodes(node) {
- return node.childNodes;
- },
- getParentNode(node) {
- return node.parentNode;
- },
- getAttrList(element) {
- const attrs = element.attributes.__items.map((attr) => {
- return {
- name: attr.name,
- value: attr.value,
- namespace: attr.namespaceURI,
- prefix: null,
- };
- });
- return attrs;
- },
- getTagName(element) {
- if (element.namespaceURI === 'http://www.w3.org/1999/xhtml') {
- return element.nodeName.toLowerCase();
- }
- else {
- return element.nodeName;
- }
- },
- getNamespaceURI(element) {
- return element.namespaceURI;
- },
- getTextNodeContent(textNode) {
- return textNode.nodeValue;
- },
- getCommentNodeContent(commentNode) {
- return commentNode.nodeValue;
- },
- getDocumentTypeNodeName(doctypeNode) {
- return doctypeNode['x-name'];
- },
- getDocumentTypeNodePublicId(doctypeNode) {
- return doctypeNode['x-publicId'];
- },
- getDocumentTypeNodeSystemId(doctypeNode) {
- return doctypeNode['x-systemId'];
- },
- isTextNode(node) {
- return node.nodeType === 3 /* TEXT_NODE */;
- },
- isCommentNode(node) {
- return node.nodeType === 8 /* COMMENT_NODE */;
- },
- isDocumentTypeNode(node) {
- return node.nodeType === 10 /* DOCUMENT_TYPE_NODE */;
- },
- isElementNode(node) {
- return node.nodeType === 1 /* ELEMENT_NODE */;
- },
- };
- parseOptions = {
- treeAdapter: treeAdapter,
- };
- docParser.set(ownerDocument, parseOptions);
- return parseOptions;
- }
- class MockNode {
- constructor(ownerDocument, nodeType, nodeName, nodeValue) {
- this.ownerDocument = ownerDocument;
- this.nodeType = nodeType;
- this.nodeName = nodeName;
- this._nodeValue = nodeValue;
- this.parentNode = null;
- this.childNodes = [];
- }
- appendChild(newNode) {
- if (newNode.nodeType === 11 /* DOCUMENT_FRAGMENT_NODE */) {
- const nodes = newNode.childNodes.slice();
- for (const child of nodes) {
- this.appendChild(child);
- }
- }
- else {
- newNode.remove();
- newNode.parentNode = this;
- this.childNodes.push(newNode);
- connectNode(this.ownerDocument, newNode);
- }
- return newNode;
- }
- append(...items) {
- items.forEach((item) => {
- const isNode = typeof item === 'object' && item !== null && 'nodeType' in item;
- this.appendChild(isNode ? item : this.ownerDocument.createTextNode(String(item)));
- });
- }
- prepend(...items) {
- const firstChild = this.firstChild;
- items.forEach((item) => {
- const isNode = typeof item === 'object' && item !== null && 'nodeType' in item;
- this.insertBefore(isNode ? item : this.ownerDocument.createTextNode(String(item)), firstChild);
- });
- }
- cloneNode(deep) {
- throw new Error(`invalid node type to clone: ${this.nodeType}, deep: ${deep}`);
- }
- compareDocumentPosition(_other) {
- // unimplemented
- // https://developer.mozilla.org/en-US/docs/Web/API/Node/compareDocumentPosition
- return -1;
- }
- get firstChild() {
- return this.childNodes[0] || null;
- }
- insertBefore(newNode, referenceNode) {
- if (newNode.nodeType === 11 /* DOCUMENT_FRAGMENT_NODE */) {
- for (let i = 0, ii = newNode.childNodes.length; i < ii; i++) {
- insertBefore(this, newNode.childNodes[i], referenceNode);
- }
- }
- else {
- insertBefore(this, newNode, referenceNode);
- }
- return newNode;
- }
- get isConnected() {
- let node = this;
- while (node != null) {
- if (node.nodeType === 9 /* DOCUMENT_NODE */) {
- return true;
- }
- node = node.parentNode;
- if (node != null && node.nodeType === 11 /* DOCUMENT_FRAGMENT_NODE */) {
- node = node.host;
- }
- }
- return false;
- }
- isSameNode(node) {
- return this === node;
- }
- get lastChild() {
- return this.childNodes[this.childNodes.length - 1] || null;
- }
- get nextSibling() {
- if (this.parentNode != null) {
- const index = this.parentNode.childNodes.indexOf(this) + 1;
- return this.parentNode.childNodes[index] || null;
- }
- return null;
- }
- get nodeValue() {
- return this._nodeValue;
- }
- set nodeValue(value) {
- this._nodeValue = value;
- }
- get parentElement() {
- return this.parentNode || null;
- }
- set parentElement(value) {
- this.parentNode = value;
- }
- get previousSibling() {
- if (this.parentNode != null) {
- const index = this.parentNode.childNodes.indexOf(this) - 1;
- return this.parentNode.childNodes[index] || null;
- }
- return null;
- }
- contains(otherNode) {
- if (otherNode === this) {
- return true;
- }
- return this.childNodes.includes(otherNode);
- }
- removeChild(childNode) {
- const index = this.childNodes.indexOf(childNode);
- if (index > -1) {
- this.childNodes.splice(index, 1);
- if (this.nodeType === 1 /* ELEMENT_NODE */) {
- const wasConnected = this.isConnected;
- childNode.parentNode = null;
- if (wasConnected === true) {
- disconnectNode(childNode);
- }
- }
- else {
- childNode.parentNode = null;
- }
- }
- else {
- throw new Error(`node not found within childNodes during removeChild`);
- }
- return childNode;
- }
- remove() {
- if (this.parentNode != null) {
- this.parentNode.removeChild(this);
- }
- }
- replaceChild(newChild, oldChild) {
- if (oldChild.parentNode === this) {
- this.insertBefore(newChild, oldChild);
- oldChild.remove();
- return newChild;
- }
- return null;
- }
- get textContent() {
- return this._nodeValue;
- }
- set textContent(value) {
- this._nodeValue = String(value);
- }
- }
- MockNode.ELEMENT_NODE = 1;
- MockNode.TEXT_NODE = 3;
- MockNode.PROCESSING_INSTRUCTION_NODE = 7;
- MockNode.COMMENT_NODE = 8;
- MockNode.DOCUMENT_NODE = 9;
- MockNode.DOCUMENT_TYPE_NODE = 10;
- MockNode.DOCUMENT_FRAGMENT_NODE = 11;
- class MockNodeList {
- constructor(ownerDocument, childNodes, length) {
- this.ownerDocument = ownerDocument;
- this.childNodes = childNodes;
- this.length = length;
- }
- }
- class MockElement extends MockNode {
- constructor(ownerDocument, nodeName) {
- super(ownerDocument, 1 /* ELEMENT_NODE */, typeof nodeName === 'string' ? nodeName : null, null);
- this.namespaceURI = null;
- }
- addEventListener(type, handler) {
- addEventListener(this, type, handler);
- }
- attachShadow(_opts) {
- const shadowRoot = this.ownerDocument.createDocumentFragment();
- this.shadowRoot = shadowRoot;
- return shadowRoot;
- }
- get shadowRoot() {
- return this.__shadowRoot || null;
- }
- set shadowRoot(shadowRoot) {
- if (shadowRoot != null) {
- shadowRoot.host = this;
- this.__shadowRoot = shadowRoot;
- }
- else {
- delete this.__shadowRoot;
- }
- }
- get attributes() {
- if (this.__attributeMap == null) {
- this.__attributeMap = createAttributeProxy(false);
- }
- return this.__attributeMap;
- }
- set attributes(attrs) {
- this.__attributeMap = attrs;
- }
- get children() {
- return this.childNodes.filter((n) => n.nodeType === 1 /* ELEMENT_NODE */);
- }
- get childElementCount() {
- return this.childNodes.filter((n) => n.nodeType === 1 /* ELEMENT_NODE */).length;
- }
- get className() {
- return this.getAttributeNS(null, 'class') || '';
- }
- set className(value) {
- this.setAttributeNS(null, 'class', value);
- }
- get classList() {
- return new MockClassList(this);
- }
- click() {
- dispatchEvent(this, new MockEvent('click', { bubbles: true, cancelable: true, composed: true }));
- }
- cloneNode(_deep) {
- // implemented on MockElement.prototype from within element.ts
- return null;
- }
- closest(selector) {
- let elm = this;
- while (elm != null) {
- if (elm.matches(selector)) {
- return elm;
- }
- elm = elm.parentNode;
- }
- return null;
- }
- get dataset() {
- return dataset(this);
- }
- get dir() {
- return this.getAttributeNS(null, 'dir') || '';
- }
- set dir(value) {
- this.setAttributeNS(null, 'dir', value);
- }
- dispatchEvent(ev) {
- return dispatchEvent(this, ev);
- }
- get firstElementChild() {
- return this.children[0] || null;
- }
- getAttribute(attrName) {
- if (attrName === 'style') {
- if (this.__style != null && this.__style.length > 0) {
- return this.style.cssText;
- }
- return null;
- }
- const attr = this.attributes.getNamedItem(attrName);
- if (attr != null) {
- return attr.value;
- }
- return null;
- }
- getAttributeNS(namespaceURI, attrName) {
- const attr = this.attributes.getNamedItemNS(namespaceURI, attrName);
- if (attr != null) {
- return attr.value;
- }
- return null;
- }
- getBoundingClientRect() {
- return { bottom: 0, height: 0, left: 0, right: 0, top: 0, width: 0, x: 0, y: 0 };
- }
- getRootNode(opts) {
- const isComposed = opts != null && opts.composed === true;
- let node = this;
- while (node.parentNode != null) {
- node = node.parentNode;
- if (isComposed === true && node.parentNode == null && node.host != null) {
- node = node.host;
- }
- }
- return node;
- }
- get draggable() {
- return this.getAttributeNS(null, 'draggable') === 'true';
- }
- set draggable(value) {
- this.setAttributeNS(null, 'draggable', value);
- }
- hasChildNodes() {
- return this.childNodes.length > 0;
- }
- get id() {
- return this.getAttributeNS(null, 'id') || '';
- }
- set id(value) {
- this.setAttributeNS(null, 'id', value);
- }
- get innerHTML() {
- if (this.childNodes.length === 0) {
- return '';
- }
- return serializeNodeToHtml(this, {
- newLines: false,
- indentSpaces: 0,
- });
- }
- set innerHTML(html) {
- if (NON_ESCAPABLE_CONTENT.has(this.nodeName) === true) {
- setTextContent(this, html);
- }
- else {
- for (let i = this.childNodes.length - 1; i >= 0; i--) {
- this.removeChild(this.childNodes[i]);
- }
- if (typeof html === 'string') {
- const frag = parseFragmentUtil(this.ownerDocument, html);
- while (frag.childNodes.length > 0) {
- this.appendChild(frag.childNodes[0]);
- }
- }
- }
- }
- get innerText() {
- const text = [];
- getTextContent(this.childNodes, text);
- return text.join('');
- }
- set innerText(value) {
- setTextContent(this, value);
- }
- insertAdjacentElement(position, elm) {
- if (position === 'beforebegin') {
- insertBefore(this.parentNode, elm, this);
- }
- else if (position === 'afterbegin') {
- this.prepend(elm);
- }
- else if (position === 'beforeend') {
- this.appendChild(elm);
- }
- else if (position === 'afterend') {
- insertBefore(this.parentNode, elm, this.nextSibling);
- }
- return elm;
- }
- insertAdjacentHTML(position, html) {
- const frag = parseFragmentUtil(this.ownerDocument, html);
- if (position === 'beforebegin') {
- while (frag.childNodes.length > 0) {
- insertBefore(this.parentNode, frag.childNodes[0], this);
- }
- }
- else if (position === 'afterbegin') {
- while (frag.childNodes.length > 0) {
- this.prepend(frag.childNodes[frag.childNodes.length - 1]);
- }
- }
- else if (position === 'beforeend') {
- while (frag.childNodes.length > 0) {
- this.appendChild(frag.childNodes[0]);
- }
- }
- else if (position === 'afterend') {
- while (frag.childNodes.length > 0) {
- insertBefore(this.parentNode, frag.childNodes[frag.childNodes.length - 1], this.nextSibling);
- }
- }
- }
- insertAdjacentText(position, text) {
- const elm = this.ownerDocument.createTextNode(text);
- if (position === 'beforebegin') {
- insertBefore(this.parentNode, elm, this);
- }
- else if (position === 'afterbegin') {
- this.prepend(elm);
- }
- else if (position === 'beforeend') {
- this.appendChild(elm);
- }
- else if (position === 'afterend') {
- insertBefore(this.parentNode, elm, this.nextSibling);
- }
- }
- hasAttribute(attrName) {
- if (attrName === 'style') {
- return this.__style != null && this.__style.length > 0;
- }
- return this.getAttribute(attrName) !== null;
- }
- hasAttributeNS(namespaceURI, name) {
- return this.getAttributeNS(namespaceURI, name) !== null;
- }
- get hidden() {
- return this.hasAttributeNS(null, 'hidden');
- }
- set hidden(isHidden) {
- if (isHidden === true) {
- this.setAttributeNS(null, 'hidden', '');
- }
- else {
- this.removeAttributeNS(null, 'hidden');
- }
- }
- get lang() {
- return this.getAttributeNS(null, 'lang') || '';
- }
- set lang(value) {
- this.setAttributeNS(null, 'lang', value);
- }
- get lastElementChild() {
- const children = this.children;
- return children[children.length - 1] || null;
- }
- matches(selector) {
- return matches(selector, this);
- }
- get nextElementSibling() {
- const parentElement = this.parentElement;
- if (parentElement != null &&
- (parentElement.nodeType === 1 /* ELEMENT_NODE */ ||
- parentElement.nodeType === 11 /* DOCUMENT_FRAGMENT_NODE */ ||
- parentElement.nodeType === 9 /* DOCUMENT_NODE */)) {
- const children = parentElement.children;
- const index = children.indexOf(this) + 1;
- return parentElement.children[index] || null;
- }
- return null;
- }
- get outerHTML() {
- return serializeNodeToHtml(this, {
- newLines: false,
- outerHtml: true,
- indentSpaces: 0,
- });
- }
- get previousElementSibling() {
- const parentElement = this.parentElement;
- if (parentElement != null &&
- (parentElement.nodeType === 1 /* ELEMENT_NODE */ ||
- parentElement.nodeType === 11 /* DOCUMENT_FRAGMENT_NODE */ ||
- parentElement.nodeType === 9 /* DOCUMENT_NODE */)) {
- const children = parentElement.children;
- const index = children.indexOf(this) - 1;
- return parentElement.children[index] || null;
- }
- return null;
- }
- getElementsByClassName(classNames) {
- const classes = classNames
- .trim()
- .split(' ')
- .filter((c) => c.length > 0);
- const results = [];
- getElementsByClassName(this, classes, results);
- return results;
- }
- getElementsByTagName(tagName) {
- const results = [];
- getElementsByTagName(this, tagName.toLowerCase(), results);
- return results;
- }
- querySelector(selector) {
- return selectOne(selector, this);
- }
- querySelectorAll(selector) {
- return selectAll(selector, this);
- }
- removeAttribute(attrName) {
- if (attrName === 'style') {
- delete this.__style;
- }
- else {
- const attr = this.attributes.getNamedItem(attrName);
- if (attr != null) {
- this.attributes.removeNamedItemNS(attr);
- if (checkAttributeChanged(this) === true) {
- attributeChanged(this, attrName, attr.value, null);
- }
- }
- }
- }
- removeAttributeNS(namespaceURI, attrName) {
- const attr = this.attributes.getNamedItemNS(namespaceURI, attrName);
- if (attr != null) {
- this.attributes.removeNamedItemNS(attr);
- if (checkAttributeChanged(this) === true) {
- attributeChanged(this, attrName, attr.value, null);
- }
- }
- }
- removeEventListener(type, handler) {
- removeEventListener(this, type, handler);
- }
- setAttribute(attrName, value) {
- if (attrName === 'style') {
- this.style = value;
- }
- else {
- const attributes = this.attributes;
- let attr = attributes.getNamedItem(attrName);
- const checkAttrChanged = checkAttributeChanged(this);
- if (attr != null) {
- if (checkAttrChanged === true) {
- const oldValue = attr.value;
- attr.value = value;
- if (oldValue !== attr.value) {
- attributeChanged(this, attr.name, oldValue, attr.value);
- }
- }
- else {
- attr.value = value;
- }
- }
- else {
- if (attributes.caseInsensitive) {
- attrName = attrName.toLowerCase();
- }
- attr = new MockAttr(attrName, value);
- attributes.__items.push(attr);
- if (checkAttrChanged === true) {
- attributeChanged(this, attrName, null, attr.value);
- }
- }
- }
- }
- setAttributeNS(namespaceURI, attrName, value) {
- const attributes = this.attributes;
- let attr = attributes.getNamedItemNS(namespaceURI, attrName);
- const checkAttrChanged = checkAttributeChanged(this);
- if (attr != null) {
- if (checkAttrChanged === true) {
- const oldValue = attr.value;
- attr.value = value;
- if (oldValue !== attr.value) {
- attributeChanged(this, attr.name, oldValue, attr.value);
- }
- }
- else {
- attr.value = value;
- }
- }
- else {
- attr = new MockAttr(attrName, value, namespaceURI);
- attributes.__items.push(attr);
- if (checkAttrChanged === true) {
- attributeChanged(this, attrName, null, attr.value);
- }
- }
- }
- get style() {
- if (this.__style == null) {
- this.__style = createCSSStyleDeclaration();
- }
- return this.__style;
- }
- set style(val) {
- if (typeof val === 'string') {
- if (this.__style == null) {
- this.__style = createCSSStyleDeclaration();
- }
- this.__style.cssText = val;
- }
- else {
- this.__style = val;
- }
- }
- get tabIndex() {
- return parseInt(this.getAttributeNS(null, 'tabindex') || '-1', 10);
- }
- set tabIndex(value) {
- this.setAttributeNS(null, 'tabindex', value);
- }
- get tagName() {
- return this.nodeName;
- }
- set tagName(value) {
- this.nodeName = value;
- }
- get textContent() {
- const text = [];
- getTextContent(this.childNodes, text);
- return text.join('');
- }
- set textContent(value) {
- setTextContent(this, value);
- }
- get title() {
- return this.getAttributeNS(null, 'title') || '';
- }
- set title(value) {
- this.setAttributeNS(null, 'title', value);
- }
- onanimationstart() {
- /**/
- }
- onanimationend() {
- /**/
- }
- onanimationiteration() {
- /**/
- }
- onabort() {
- /**/
- }
- onauxclick() {
- /**/
- }
- onbeforecopy() {
- /**/
- }
- onbeforecut() {
- /**/
- }
- onbeforepaste() {
- /**/
- }
- onblur() {
- /**/
- }
- oncancel() {
- /**/
- }
- oncanplay() {
- /**/
- }
- oncanplaythrough() {
- /**/
- }
- onchange() {
- /**/
- }
- onclick() {
- /**/
- }
- onclose() {
- /**/
- }
- oncontextmenu() {
- /**/
- }
- oncopy() {
- /**/
- }
- oncuechange() {
- /**/
- }
- oncut() {
- /**/
- }
- ondblclick() {
- /**/
- }
- ondrag() {
- /**/
- }
- ondragend() {
- /**/
- }
- ondragenter() {
- /**/
- }
- ondragleave() {
- /**/
- }
- ondragover() {
- /**/
- }
- ondragstart() {
- /**/
- }
- ondrop() {
- /**/
- }
- ondurationchange() {
- /**/
- }
- onemptied() {
- /**/
- }
- onended() {
- /**/
- }
- onerror() {
- /**/
- }
- onfocus() {
- /**/
- }
- onfocusin() {
- /**/
- }
- onfocusout() {
- /**/
- }
- onformdata() {
- /**/
- }
- onfullscreenchange() {
- /**/
- }
- onfullscreenerror() {
- /**/
- }
- ongotpointercapture() {
- /**/
- }
- oninput() {
- /**/
- }
- oninvalid() {
- /**/
- }
- onkeydown() {
- /**/
- }
- onkeypress() {
- /**/
- }
- onkeyup() {
- /**/
- }
- onload() {
- /**/
- }
- onloadeddata() {
- /**/
- }
- onloadedmetadata() {
- /**/
- }
- onloadstart() {
- /**/
- }
- onlostpointercapture() {
- /**/
- }
- onmousedown() {
- /**/
- }
- onmouseenter() {
- /**/
- }
- onmouseleave() {
- /**/
- }
- onmousemove() {
- /**/
- }
- onmouseout() {
- /**/
- }
- onmouseover() {
- /**/
- }
- onmouseup() {
- /**/
- }
- onmousewheel() {
- /**/
- }
- onpaste() {
- /**/
- }
- onpause() {
- /**/
- }
- onplay() {
- /**/
- }
- onplaying() {
- /**/
- }
- onpointercancel() {
- /**/
- }
- onpointerdown() {
- /**/
- }
- onpointerenter() {
- /**/
- }
- onpointerleave() {
- /**/
- }
- onpointermove() {
- /**/
- }
- onpointerout() {
- /**/
- }
- onpointerover() {
- /**/
- }
- onpointerup() {
- /**/
- }
- onprogress() {
- /**/
- }
- onratechange() {
- /**/
- }
- onreset() {
- /**/
- }
- onresize() {
- /**/
- }
- onscroll() {
- /**/
- }
- onsearch() {
- /**/
- }
- onseeked() {
- /**/
- }
- onseeking() {
- /**/
- }
- onselect() {
- /**/
- }
- onselectstart() {
- /**/
- }
- onstalled() {
- /**/
- }
- onsubmit() {
- /**/
- }
- onsuspend() {
- /**/
- }
- ontimeupdate() {
- /**/
- }
- ontoggle() {
- /**/
- }
- onvolumechange() {
- /**/
- }
- onwaiting() {
- /**/
- }
- onwebkitfullscreenchange() {
- /**/
- }
- onwebkitfullscreenerror() {
- /**/
- }
- onwheel() {
- /**/
- }
- toString(opts) {
- return serializeNodeToHtml(this, opts);
- }
- }
- function getElementsByClassName(elm, classNames, foundElms) {
- const children = elm.children;
- for (let i = 0, ii = children.length; i < ii; i++) {
- const childElm = children[i];
- for (let j = 0, jj = classNames.length; j < jj; j++) {
- if (childElm.classList.contains(classNames[j])) {
- foundElms.push(childElm);
- }
- }
- getElementsByClassName(childElm, classNames, foundElms);
- }
- }
- function getElementsByTagName(elm, tagName, foundElms) {
- const children = elm.children;
- for (let i = 0, ii = children.length; i < ii; i++) {
- const childElm = children[i];
- if (tagName === '*' || childElm.nodeName.toLowerCase() === tagName) {
- foundElms.push(childElm);
- }
- getElementsByTagName(childElm, tagName, foundElms);
- }
- }
- function resetElement(elm) {
- resetEventListeners(elm);
- delete elm.__attributeMap;
- delete elm.__shadowRoot;
- delete elm.__style;
- }
- function insertBefore(parentNode, newNode, referenceNode) {
- if (newNode !== referenceNode) {
- newNode.remove();
- newNode.parentNode = parentNode;
- newNode.ownerDocument = parentNode.ownerDocument;
- if (referenceNode != null) {
- const index = parentNode.childNodes.indexOf(referenceNode);
- if (index > -1) {
- parentNode.childNodes.splice(index, 0, newNode);
- }
- else {
- throw new Error(`referenceNode not found in parentNode.childNodes`);
- }
- }
- else {
- parentNode.childNodes.push(newNode);
- }
- connectNode(parentNode.ownerDocument, newNode);
- }
- return newNode;
- }
- class MockHTMLElement extends MockElement {
- constructor(ownerDocument, nodeName) {
- super(ownerDocument, typeof nodeName === 'string' ? nodeName.toUpperCase() : null);
- this.namespaceURI = 'http://www.w3.org/1999/xhtml';
- }
- get tagName() {
- return this.nodeName;
- }
- set tagName(value) {
- this.nodeName = value;
- }
- get attributes() {
- if (this.__attributeMap == null) {
- this.__attributeMap = createAttributeProxy(true);
- }
- return this.__attributeMap;
- }
- set attributes(attrs) {
- this.__attributeMap = attrs;
- }
- }
- class MockTextNode extends MockNode {
- constructor(ownerDocument, text) {
- super(ownerDocument, 3 /* TEXT_NODE */, "#text" /* TEXT_NODE */, text);
- }
- cloneNode(_deep) {
- return new MockTextNode(null, this.nodeValue);
- }
- get textContent() {
- return this.nodeValue;
- }
- set textContent(text) {
- this.nodeValue = text;
- }
- get data() {
- return this.nodeValue;
- }
- set data(text) {
- this.nodeValue = text;
- }
- get wholeText() {
- if (this.parentNode != null) {
- const text = [];
- for (let i = 0, ii = this.parentNode.childNodes.length; i < ii; i++) {
- const childNode = this.parentNode.childNodes[i];
- if (childNode.nodeType === 3 /* TEXT_NODE */) {
- text.push(childNode.nodeValue);
- }
- }
- return text.join('');
- }
- return this.nodeValue;
- }
- }
- function getTextContent(childNodes, text) {
- for (let i = 0, ii = childNodes.length; i < ii; i++) {
- const childNode = childNodes[i];
- if (childNode.nodeType === 3 /* TEXT_NODE */) {
- text.push(childNode.nodeValue);
- }
- else if (childNode.nodeType === 1 /* ELEMENT_NODE */) {
- getTextContent(childNode.childNodes, text);
- }
- }
- }
- function setTextContent(elm, text) {
- for (let i = elm.childNodes.length - 1; i >= 0; i--) {
- elm.removeChild(elm.childNodes[i]);
- }
- const textNode = new MockTextNode(elm.ownerDocument, text);
- elm.appendChild(textNode);
- }
- class MockComment extends MockNode {
- constructor(ownerDocument, data) {
- super(ownerDocument, 8 /* COMMENT_NODE */, "#comment" /* COMMENT_NODE */, data);
- }
- cloneNode(_deep) {
- return new MockComment(null, this.nodeValue);
- }
- get textContent() {
- return this.nodeValue;
- }
- set textContent(text) {
- this.nodeValue = text;
- }
- }
- class MockDocumentFragment extends MockHTMLElement {
- constructor(ownerDocument) {
- super(ownerDocument, null);
- this.nodeName = "#document-fragment" /* DOCUMENT_FRAGMENT_NODE */;
- this.nodeType = 11 /* DOCUMENT_FRAGMENT_NODE */;
- }
- getElementById(id) {
- return getElementById(this, id);
- }
- cloneNode(deep) {
- const cloned = new MockDocumentFragment(null);
- if (deep) {
- for (let i = 0, ii = this.childNodes.length; i < ii; i++) {
- const childNode = this.childNodes[i];
- if (childNode.nodeType === 1 /* ELEMENT_NODE */ ||
- childNode.nodeType === 3 /* TEXT_NODE */ ||
- childNode.nodeType === 8 /* COMMENT_NODE */) {
- const clonedChildNode = this.childNodes[i].cloneNode(true);
- cloned.appendChild(clonedChildNode);
- }
- }
- }
- return cloned;
- }
- }
- class MockDocumentTypeNode extends MockHTMLElement {
- constructor(ownerDocument) {
- super(ownerDocument, '!DOCTYPE');
- this.nodeType = 10 /* DOCUMENT_TYPE_NODE */;
- this.setAttribute('html', '');
- }
- }
- class MockCSSRule {
- constructor(parentStyleSheet) {
- this.parentStyleSheet = parentStyleSheet;
- this.cssText = '';
- this.type = 0;
- }
- }
- class MockCSSStyleSheet {
- constructor(ownerNode) {
- this.type = 'text/css';
- this.parentStyleSheet = null;
- this.cssRules = [];
- this.ownerNode = ownerNode;
- }
- get rules() {
- return this.cssRules;
- }
- set rules(rules) {
- this.cssRules = rules;
- }
- deleteRule(index) {
- if (index >= 0 && index < this.cssRules.length) {
- this.cssRules.splice(index, 1);
- updateStyleTextNode(this.ownerNode);
- }
- }
- insertRule(rule, index = 0) {
- if (typeof index !== 'number') {
- index = 0;
- }
- if (index < 0) {
- index = 0;
- }
- if (index > this.cssRules.length) {
- index = this.cssRules.length;
- }
- const cssRule = new MockCSSRule(this);
- cssRule.cssText = rule;
- this.cssRules.splice(index, 0, cssRule);
- updateStyleTextNode(this.ownerNode);
- return index;
- }
- }
- function getStyleElementText(styleElm) {
- const output = [];
- for (let i = 0; i < styleElm.childNodes.length; i++) {
- output.push(styleElm.childNodes[i].nodeValue);
- }
- return output.join('');
- }
- function setStyleElementText(styleElm, text) {
- // keeping the innerHTML and the sheet.cssRules connected
- // is not technically correct, but since we're doing
- // SSR we'll need to turn any assigned cssRules into
- // real text, not just properties that aren't rendered
- const sheet = styleElm.sheet;
- sheet.cssRules.length = 0;
- sheet.insertRule(text);
- updateStyleTextNode(styleElm);
- }
- function updateStyleTextNode(styleElm) {
- const childNodeLen = styleElm.childNodes.length;
- if (childNodeLen > 1) {
- for (let i = childNodeLen - 1; i >= 1; i--) {
- styleElm.removeChild(styleElm.childNodes[i]);
- }
- }
- else if (childNodeLen < 1) {
- styleElm.appendChild(styleElm.ownerDocument.createTextNode(''));
- }
- const textNode = styleElm.childNodes[0];
- textNode.nodeValue = styleElm.sheet.cssRules.map((r) => r.cssText).join('\n');
- }
- function createElement(ownerDocument, tagName) {
- if (typeof tagName !== 'string' || tagName === '' || !/^[a-z0-9-_:]+$/i.test(tagName)) {
- throw new Error(`The tag name provided (${tagName}) is not a valid name.`);
- }
- tagName = tagName.toLowerCase();
- switch (tagName) {
- case 'a':
- return new MockAnchorElement(ownerDocument);
- case 'base':
- return new MockBaseElement(ownerDocument);
- case 'button':
- return new MockButtonElement(ownerDocument);
- case 'canvas':
- return new MockCanvasElement(ownerDocument);
- case 'form':
- return new MockFormElement(ownerDocument);
- case 'img':
- return new MockImageElement(ownerDocument);
- case 'input':
- return new MockInputElement(ownerDocument);
- case 'link':
- return new MockLinkElement(ownerDocument);
- case 'meta':
- return new MockMetaElement(ownerDocument);
- case 'script':
- return new MockScriptElement(ownerDocument);
- case 'style':
- return new MockStyleElement(ownerDocument);
- case 'template':
- return new MockTemplateElement(ownerDocument);
- case 'title':
- return new MockTitleElement(ownerDocument);
- }
- if (ownerDocument != null && tagName.includes('-')) {
- const win = ownerDocument.defaultView;
- if (win != null && win.customElements != null) {
- return createCustomElement(win.customElements, ownerDocument, tagName);
- }
- }
- return new MockHTMLElement(ownerDocument, tagName);
- }
- function createElementNS(ownerDocument, namespaceURI, tagName) {
- if (namespaceURI === 'http://www.w3.org/1999/xhtml') {
- return createElement(ownerDocument, tagName);
- }
- else if (namespaceURI === 'http://www.w3.org/2000/svg') {
- return new MockSVGElement(ownerDocument, tagName);
- }
- else {
- return new MockElement(ownerDocument, tagName);
- }
- }
- class MockAnchorElement extends MockHTMLElement {
- constructor(ownerDocument) {
- super(ownerDocument, 'a');
- }
- get href() {
- return fullUrl(this, 'href');
- }
- set href(value) {
- this.setAttribute('href', value);
- }
- get pathname() {
- return new URL(this.href).pathname;
- }
- }
- class MockButtonElement extends MockHTMLElement {
- constructor(ownerDocument) {
- super(ownerDocument, 'button');
- }
- }
- patchPropAttributes(MockButtonElement.prototype, {
- type: String,
- }, {
- type: 'submit',
- });
- class MockImageElement extends MockHTMLElement {
- constructor(ownerDocument) {
- super(ownerDocument, 'img');
- }
- get draggable() {
- return this.getAttributeNS(null, 'draggable') !== 'false';
- }
- set draggable(value) {
- this.setAttributeNS(null, 'draggable', value);
- }
- get src() {
- return fullUrl(this, 'src');
- }
- set src(value) {
- this.setAttribute('src', value);
- }
- }
- patchPropAttributes(MockImageElement.prototype, {
- height: Number,
- width: Number,
- });
- class MockInputElement extends MockHTMLElement {
- constructor(ownerDocument) {
- super(ownerDocument, 'input');
- }
- get list() {
- const listId = this.getAttribute('list');
- if (listId) {
- return this.ownerDocument.getElementById(listId);
- }
- return null;
- }
- }
- patchPropAttributes(MockInputElement.prototype, {
- accept: String,
- autocomplete: String,
- autofocus: Boolean,
- capture: String,
- checked: Boolean,
- disabled: Boolean,
- form: String,
- formaction: String,
- formenctype: String,
- formmethod: String,
- formnovalidate: String,
- formtarget: String,
- height: Number,
- inputmode: String,
- max: String,
- maxLength: Number,
- min: String,
- minLength: Number,
- multiple: Boolean,
- name: String,
- pattern: String,
- placeholder: String,
- required: Boolean,
- readOnly: Boolean,
- size: Number,
- spellCheck: Boolean,
- src: String,
- step: String,
- type: String,
- value: String,
- width: Number,
- }, {
- type: 'text',
- });
- class MockFormElement extends MockHTMLElement {
- constructor(ownerDocument) {
- super(ownerDocument, 'form');
- }
- }
- patchPropAttributes(MockFormElement.prototype, {
- name: String,
- });
- class MockLinkElement extends MockHTMLElement {
- constructor(ownerDocument) {
- super(ownerDocument, 'link');
- }
- get href() {
- return fullUrl(this, 'href');
- }
- set href(value) {
- this.setAttribute('href', value);
- }
- }
- patchPropAttributes(MockLinkElement.prototype, {
- crossorigin: String,
- media: String,
- rel: String,
- type: String,
- });
- class MockMetaElement extends MockHTMLElement {
- constructor(ownerDocument) {
- super(ownerDocument, 'meta');
- }
- }
- patchPropAttributes(MockMetaElement.prototype, {
- charset: String,
- content: String,
- name: String,
- });
- class MockScriptElement extends MockHTMLElement {
- constructor(ownerDocument) {
- super(ownerDocument, 'script');
- }
- get src() {
- return fullUrl(this, 'src');
- }
- set src(value) {
- this.setAttribute('src', value);
- }
- }
- patchPropAttributes(MockScriptElement.prototype, {
- type: String,
- });
- class MockStyleElement extends MockHTMLElement {
- constructor(ownerDocument) {
- super(ownerDocument, 'style');
- this.sheet = new MockCSSStyleSheet(this);
- }
- get innerHTML() {
- return getStyleElementText(this);
- }
- set innerHTML(value) {
- setStyleElementText(this, value);
- }
- get innerText() {
- return getStyleElementText(this);
- }
- set innerText(value) {
- setStyleElementText(this, value);
- }
- get textContent() {
- return getStyleElementText(this);
- }
- set textContent(value) {
- setStyleElementText(this, value);
- }
- }
- class MockSVGElement extends MockElement {
- // SVGElement properties and methods
- get ownerSVGElement() {
- return null;
- }
- get viewportElement() {
- return null;
- }
- focus() {
- /**/
- }
- onunload() {
- /**/
- }
- // SVGGeometryElement properties and methods
- get pathLength() {
- return 0;
- }
- isPointInFill(_pt) {
- return false;
- }
- isPointInStroke(_pt) {
- return false;
- }
- getTotalLength() {
- return 0;
- }
- }
- class MockBaseElement extends MockHTMLElement {
- constructor(ownerDocument) {
- super(ownerDocument, 'base');
- }
- get href() {
- return fullUrl(this, 'href');
- }
- set href(value) {
- this.setAttribute('href', value);
- }
- }
- class MockTemplateElement extends MockHTMLElement {
- constructor(ownerDocument) {
- super(ownerDocument, 'template');
- this.content = new MockDocumentFragment(ownerDocument);
- }
- get innerHTML() {
- return this.content.innerHTML;
- }
- set innerHTML(html) {
- this.content.innerHTML = html;
- }
- cloneNode(deep) {
- const cloned = new MockTemplateElement(null);
- cloned.attributes = cloneAttributes(this.attributes);
- const styleCssText = this.getAttribute('style');
- if (styleCssText != null && styleCssText.length > 0) {
- cloned.setAttribute('style', styleCssText);
- }
- cloned.content = this.content.cloneNode(deep);
- if (deep) {
- for (let i = 0, ii = this.childNodes.length; i < ii; i++) {
- const clonedChildNode = this.childNodes[i].cloneNode(true);
- cloned.appendChild(clonedChildNode);
- }
- }
- return cloned;
- }
- }
- class MockTitleElement extends MockHTMLElement {
- constructor(ownerDocument) {
- super(ownerDocument, 'title');
- }
- get text() {
- return this.textContent;
- }
- set text(value) {
- this.textContent = value;
- }
- }
- class MockCanvasElement extends MockHTMLElement {
- constructor(ownerDocument) {
- super(ownerDocument, 'canvas');
- }
- getContext() {
- return {
- fillRect() {
- return;
- },
- clearRect() { },
- getImageData: function (_, __, w, h) {
- return {
- data: new Array(w * h * 4),
- };
- },
- putImageData() { },
- createImageData: function () {
- return [];
- },
- setTransform() { },
- drawImage() { },
- save() { },
- fillText() { },
- restore() { },
- beginPath() { },
- moveTo() { },
- lineTo() { },
- closePath() { },
- stroke() { },
- translate() { },
- scale() { },
- rotate() { },
- arc() { },
- fill() { },
- measureText() {
- return { width: 0 };
- },
- transform() { },
- rect() { },
- clip() { },
- };
- }
- }
- function fullUrl(elm, attrName) {
- const val = elm.getAttribute(attrName) || '';
- if (elm.ownerDocument != null) {
- const win = elm.ownerDocument.defaultView;
- if (win != null) {
- const loc = win.location;
- if (loc != null) {
- try {
- const url = new URL(val, loc.href);
- return url.href;
- }
- catch (e) { }
- }
- }
- }
- return val.replace(/\'|\"/g, '').trim();
- }
- function patchPropAttributes(prototype, attrs, defaults = {}) {
- Object.keys(attrs).forEach((propName) => {
- const attr = attrs[propName];
- const defaultValue = defaults[propName];
- if (attr === Boolean) {
- Object.defineProperty(prototype, propName, {
- get() {
- return this.hasAttribute(propName);
- },
- set(value) {
- if (value) {
- this.setAttribute(propName, '');
- }
- else {
- this.removeAttribute(propName);
- }
- },
- });
- }
- else if (attr === Number) {
- Object.defineProperty(prototype, propName, {
- get() {
- const value = this.getAttribute(propName);
- return value ? parseInt(value, 10) : defaultValue === undefined ? 0 : defaultValue;
- },
- set(value) {
- this.setAttribute(propName, value);
- },
- });
- }
- else {
- Object.defineProperty(prototype, propName, {
- get() {
- return this.hasAttribute(propName) ? this.getAttribute(propName) : defaultValue || '';
- },
- set(value) {
- this.setAttribute(propName, value);
- },
- });
- }
- });
- }
- MockElement.prototype.cloneNode = function (deep) {
- // because we're creating elements, which extending specific HTML base classes there
- // is a MockElement circular reference that bundling has trouble dealing with so
- // the fix is to add cloneNode() to MockElement's prototype after the HTML classes
- const cloned = createElement(this.ownerDocument, this.nodeName);
- cloned.attributes = cloneAttributes(this.attributes);
- const styleCssText = this.getAttribute('style');
- if (styleCssText != null && styleCssText.length > 0) {
- cloned.setAttribute('style', styleCssText);
- }
- if (deep) {
- for (let i = 0, ii = this.childNodes.length; i < ii; i++) {
- const clonedChildNode = this.childNodes[i].cloneNode(true);
- cloned.appendChild(clonedChildNode);
- }
- }
- return cloned;
- };
- let sharedDocument;
- function parseHtmlToDocument(html, ownerDocument = null) {
- if (ownerDocument == null) {
- if (sharedDocument == null) {
- sharedDocument = new MockDocument();
- }
- ownerDocument = sharedDocument;
- }
- return parseDocumentUtil(ownerDocument, html);
- }
- function parseHtmlToFragment(html, ownerDocument = null) {
- if (ownerDocument == null) {
- if (sharedDocument == null) {
- sharedDocument = new MockDocument();
- }
- ownerDocument = sharedDocument;
- }
- return parseFragmentUtil(ownerDocument, html);
- }
- class MockHeaders {
- constructor(init) {
- this._values = [];
- if (typeof init === 'object') {
- if (typeof init[Symbol.iterator] === 'function') {
- const kvs = [];
- for (const kv of init) {
- if (typeof kv[Symbol.iterator] === 'function') {
- kvs.push([...kv]);
- }
- }
- for (const kv of kvs) {
- this.append(kv[0], kv[1]);
- }
- }
- else {
- for (const key in init) {
- this.append(key, init[key]);
- }
- }
- }
- }
- append(key, value) {
- this._values.push([key, value + '']);
- }
- delete(key) {
- key = key.toLowerCase();
- for (let i = this._values.length - 1; i >= 0; i--) {
- if (this._values[i][0].toLowerCase() === key) {
- this._values.splice(i, 1);
- }
- }
- }
- entries() {
- const entries = [];
- for (const kv of this.keys()) {
- entries.push([kv, this.get(kv)]);
- }
- let index = -1;
- return {
- next() {
- index++;
- return {
- value: entries[index],
- done: !entries[index],
- };
- },
- [Symbol.iterator]() {
- return this;
- },
- };
- }
- forEach(cb) {
- for (const kv of this.entries()) {
- cb(kv[1], kv[0]);
- }
- }
- get(key) {
- const rtn = [];
- key = key.toLowerCase();
- for (const kv of this._values) {
- if (kv[0].toLowerCase() === key) {
- rtn.push(kv[1]);
- }
- }
- return rtn.length > 0 ? rtn.join(', ') : null;
- }
- has(key) {
- key = key.toLowerCase();
- for (const kv of this._values) {
- if (kv[0].toLowerCase() === key) {
- return true;
- }
- }
- return false;
- }
- keys() {
- const keys = [];
- for (const kv of this._values) {
- const key = kv[0].toLowerCase();
- if (!keys.includes(key)) {
- keys.push(key);
- }
- }
- let index = -1;
- return {
- next() {
- index++;
- return {
- value: keys[index],
- done: !keys[index],
- };
- },
- [Symbol.iterator]() {
- return this;
- },
- };
- }
- set(key, value) {
- for (const kv of this._values) {
- if (kv[0].toLowerCase() === key.toLowerCase()) {
- kv[1] = value + '';
- return;
- }
- }
- this.append(key, value);
- }
- values() {
- const values = this._values;
- let index = -1;
- return {
- next() {
- index++;
- const done = !values[index];
- return {
- value: done ? undefined : values[index][1],
- done,
- };
- },
- [Symbol.iterator]() {
- return this;
- },
- };
- }
- [Symbol.iterator]() {
- return this.entries();
- }
- }
- class MockRequest {
- constructor(input, init = {}) {
- this._method = 'GET';
- this._url = '/';
- this.bodyUsed = false;
- this.cache = 'default';
- this.credentials = 'same-origin';
- this.integrity = '';
- this.keepalive = false;
- this.mode = 'cors';
- this.redirect = 'follow';
- this.referrer = 'about:client';
- this.referrerPolicy = '';
- if (typeof input === 'string') {
- this.url = input;
- }
- else if (input) {
- Object.assign(this, input);
- this.headers = new MockHeaders(input.headers);
- }
- Object.assign(this, init);
- if (init.headers) {
- this.headers = new MockHeaders(init.headers);
- }
- if (!this.headers) {
- this.headers = new MockHeaders();
- }
- }
- get url() {
- if (typeof this._url === 'string') {
- return new URL(this._url, location.href).href;
- }
- return new URL('/', location.href).href;
- }
- set url(value) {
- this._url = value;
- }
- get method() {
- if (typeof this._method === 'string') {
- return this._method.toUpperCase();
- }
- return 'GET';
- }
- set method(value) {
- this._method = value;
- }
- clone() {
- const clone = { ...this };
- clone.headers = new MockHeaders(this.headers);
- return new MockRequest(clone);
- }
- }
- class MockResponse {
- constructor(body, init = {}) {
- this.ok = true;
- this.status = 200;
- this.statusText = '';
- this.type = 'default';
- this.url = '';
- this._body = body;
- if (init) {
- Object.assign(this, init);
- }
- this.headers = new MockHeaders(init.headers);
- }
- async json() {
- return JSON.parse(this._body);
- }
- async text() {
- return this._body;
- }
- clone() {
- const initClone = { ...this };
- initClone.headers = new MockHeaders(this.headers);
- return new MockResponse(this._body, initClone);
- }
- }
- class MockDOMParser {
- parseFromString(htmlToParse, mimeType) {
- if (mimeType !== 'text/html') {
- console.error('XML parsing not implemented yet, continuing as html');
- }
- return parseHtmlToDocument(htmlToParse);
- }
- }
- function setupGlobal(gbl) {
- if (gbl.window == null) {
- const win = (gbl.window = new MockWindow());
- WINDOW_FUNCTIONS.forEach((fnName) => {
- if (!(fnName in gbl)) {
- gbl[fnName] = win[fnName].bind(win);
- }
- });
- WINDOW_PROPS.forEach((propName) => {
- if (!(propName in gbl)) {
- Object.defineProperty(gbl, propName, {
- get() {
- return win[propName];
- },
- set(val) {
- win[propName] = val;
- },
- configurable: true,
- enumerable: true,
- });
- }
- });
- GLOBAL_CONSTRUCTORS.forEach(([cstrName]) => {
- gbl[cstrName] = win[cstrName];
- });
- }
- return gbl.window;
- }
- function teardownGlobal(gbl) {
- const win = gbl.window;
- if (win && typeof win.close === 'function') {
- win.close();
- }
- }
- function patchWindow(winToBePatched) {
- const mockWin = new MockWindow(false);
- WINDOW_FUNCTIONS.forEach((fnName) => {
- if (typeof winToBePatched[fnName] !== 'function') {
- winToBePatched[fnName] = mockWin[fnName].bind(mockWin);
- }
- });
- WINDOW_PROPS.forEach((propName) => {
- if (winToBePatched === undefined) {
- Object.defineProperty(winToBePatched, propName, {
- get() {
- return mockWin[propName];
- },
- set(val) {
- mockWin[propName] = val;
- },
- configurable: true,
- enumerable: true,
- });
- }
- });
- }
- function addGlobalsToWindowPrototype(mockWinPrototype) {
- GLOBAL_CONSTRUCTORS.forEach(([cstrName, Cstr]) => {
- Object.defineProperty(mockWinPrototype, cstrName, {
- get() {
- return this['__' + cstrName] || Cstr;
- },
- set(cstr) {
- this['__' + cstrName] = cstr;
- },
- configurable: true,
- enumerable: true,
- });
- });
- }
- const WINDOW_FUNCTIONS = [
- 'addEventListener',
- 'alert',
- 'blur',
- 'cancelAnimationFrame',
- 'cancelIdleCallback',
- 'clearInterval',
- 'clearTimeout',
- 'close',
- 'confirm',
- 'dispatchEvent',
- 'focus',
- 'getComputedStyle',
- 'matchMedia',
- 'open',
- 'prompt',
- 'removeEventListener',
- 'requestAnimationFrame',
- 'requestIdleCallback',
- 'URL',
- ];
- const WINDOW_PROPS = [
- 'customElements',
- 'devicePixelRatio',
- 'document',
- 'history',
- 'innerHeight',
- 'innerWidth',
- 'localStorage',
- 'location',
- 'navigator',
- 'pageXOffset',
- 'pageYOffset',
- 'performance',
- 'screenLeft',
- 'screenTop',
- 'screenX',
- 'screenY',
- 'scrollX',
- 'scrollY',
- 'sessionStorage',
- 'CSS',
- 'CustomEvent',
- 'Event',
- 'Element',
- 'HTMLElement',
- 'Node',
- 'NodeList',
- 'KeyboardEvent',
- 'MouseEvent',
- ];
- const GLOBAL_CONSTRUCTORS = [
- ['CustomEvent', MockCustomEvent],
- ['Event', MockEvent],
- ['Headers', MockHeaders],
- ['KeyboardEvent', MockKeyboardEvent],
- ['MouseEvent', MockMouseEvent],
- ['Request', MockRequest],
- ['Response', MockResponse],
- ['DOMParser', MockDOMParser],
- ['HTMLAnchorElement', MockAnchorElement],
- ['HTMLBaseElement', MockBaseElement],
- ['HTMLButtonElement', MockButtonElement],
- ['HTMLCanvasElement', MockCanvasElement],
- ['HTMLFormElement', MockFormElement],
- ['HTMLImageElement', MockImageElement],
- ['HTMLInputElement', MockInputElement],
- ['HTMLLinkElement', MockLinkElement],
- ['HTMLMetaElement', MockMetaElement],
- ['HTMLScriptElement', MockScriptElement],
- ['HTMLStyleElement', MockStyleElement],
- ['HTMLTemplateElement', MockTemplateElement],
- ['HTMLTitleElement', MockTitleElement],
- ];
- const consoleNoop = () => {
- /**/
- };
- function createConsole() {
- return {
- debug: consoleNoop,
- error: consoleNoop,
- info: consoleNoop,
- log: consoleNoop,
- warn: consoleNoop,
- dir: consoleNoop,
- dirxml: consoleNoop,
- table: consoleNoop,
- trace: consoleNoop,
- group: consoleNoop,
- groupCollapsed: consoleNoop,
- groupEnd: consoleNoop,
- clear: consoleNoop,
- count: consoleNoop,
- countReset: consoleNoop,
- assert: consoleNoop,
- profile: consoleNoop,
- profileEnd: consoleNoop,
- time: consoleNoop,
- timeLog: consoleNoop,
- timeEnd: consoleNoop,
- timeStamp: consoleNoop,
- context: consoleNoop,
- memory: consoleNoop,
- };
- }
- class MockHistory {
- constructor() {
- this.items = [];
- }
- get length() {
- return this.items.length;
- }
- back() {
- this.go(-1);
- }
- forward() {
- this.go(1);
- }
- go(_value) {
- //
- }
- pushState(_state, _title, _url) {
- //
- }
- replaceState(_state, _title, _url) {
- //
- }
- }
- class MockIntersectionObserver {
- constructor() {
- /**/
- }
- disconnect() {
- /**/
- }
- observe() {
- /**/
- }
- takeRecords() {
- return [];
- }
- unobserve() {
- /**/
- }
- }
- class MockLocation {
- constructor() {
- this.ancestorOrigins = null;
- this.protocol = '';
- this.host = '';
- this.hostname = '';
- this.port = '';
- this.pathname = '';
- this.search = '';
- this.hash = '';
- this.username = '';
- this.password = '';
- this.origin = '';
- this._href = '';
- }
- get href() {
- return this._href;
- }
- set href(value) {
- const url = new URL(value, 'http://mockdoc.stenciljs.com');
- this._href = url.href;
- this.protocol = url.protocol;
- this.host = url.host;
- this.hostname = url.hostname;
- this.port = url.port;
- this.pathname = url.pathname;
- this.search = url.search;
- this.hash = url.hash;
- this.username = url.username;
- this.password = url.password;
- this.origin = url.origin;
- }
- assign(_url) {
- //
- }
- reload(_forcedReload) {
- //
- }
- replace(_url) {
- //
- }
- toString() {
- return this.href;
- }
- }
- class MockNavigator {
- constructor() {
- this.appCodeName = 'MockNavigator';
- this.appName = 'MockNavigator';
- this.appVersion = 'MockNavigator';
- this.platform = 'MockNavigator';
- this.userAgent = 'MockNavigator';
- }
- }
- /**
- * https://developer.mozilla.org/en-US/docs/Web/API/Performance
- */
- class MockPerformance {
- constructor() {
- this.timeOrigin = Date.now();
- }
- addEventListener() {
- //
- }
- clearMarks() {
- //
- }
- clearMeasures() {
- //
- }
- clearResourceTimings() {
- //
- }
- dispatchEvent() {
- return true;
- }
- getEntries() {
- return [];
- }
- getEntriesByName() {
- return [];
- }
- getEntriesByType() {
- return [];
- }
- // Stencil's implementation of `mark` is non-compliant with the `Performance` interface. Because Stencil will
- // instantiate an instance of this class and may attempt to assign it to a variable of type `Performance`, the return
- // type must match the `Performance` interface (rather than typing this function as returning `void` and ignoring the
- // associated errors returned by the type checker)
- // @ts-ignore
- mark() {
- //
- }
- // Stencil's implementation of `measure` is non-compliant with the `Performance` interface. Because Stencil will
- // instantiate an instance of this class and may attempt to assign it to a variable of type `Performance`, the return
- // type must match the `Performance` interface (rather than typing this function as returning `void` and ignoring the
- // associated errors returned by the type checker)
- // @ts-ignore
- measure() {
- //
- }
- get navigation() {
- return {};
- }
- now() {
- return Date.now() - this.timeOrigin;
- }
- get onresourcetimingbufferfull() {
- return null;
- }
- removeEventListener() {
- //
- }
- setResourceTimingBufferSize() {
- //
- }
- get timing() {
- return {};
- }
- toJSON() {
- //
- }
- }
- function resetPerformance(perf) {
- if (perf != null) {
- try {
- perf.timeOrigin = Date.now();
- }
- catch (e) { }
- }
- }
- class MockStorage {
- constructor() {
- this.items = new Map();
- }
- key(_value) {
- //
- }
- getItem(key) {
- key = String(key);
- if (this.items.has(key)) {
- return this.items.get(key);
- }
- return null;
- }
- setItem(key, value) {
- if (value == null) {
- value = 'null';
- }
- this.items.set(String(key), String(value));
- }
- removeItem(key) {
- this.items.delete(String(key));
- }
- clear() {
- this.items.clear();
- }
- }
- const nativeClearInterval = clearInterval;
- const nativeClearTimeout = clearTimeout;
- const nativeSetInterval = setInterval;
- const nativeSetTimeout = setTimeout;
- const nativeURL = URL;
- class MockWindow {
- constructor(html = null) {
- if (html !== false) {
- this.document = new MockDocument(html, this);
- }
- else {
- this.document = null;
- }
- this.performance = new MockPerformance();
- this.customElements = new MockCustomElementRegistry(this);
- this.console = createConsole();
- resetWindowDefaults(this);
- resetWindowDimensions(this);
- }
- addEventListener(type, handler) {
- addEventListener(this, type, handler);
- }
- alert(msg) {
- if (this.console) {
- this.console.debug(msg);
- }
- else {
- console.debug(msg);
- }
- }
- blur() {
- /**/
- }
- cancelAnimationFrame(id) {
- this.__clearTimeout(id);
- }
- cancelIdleCallback(id) {
- this.__clearTimeout(id);
- }
- get CharacterData() {
- if (this.__charDataCstr == null) {
- const ownerDocument = this.document;
- this.__charDataCstr = class extends MockNode {
- constructor() {
- super(ownerDocument, 0, 'test', '');
- throw new Error('Illegal constructor: cannot construct CharacterData');
- }
- };
- }
- return this.__charDataCstr;
- }
- set CharacterData(charDataCstr) {
- this.__charDataCstr = charDataCstr;
- }
- clearInterval(id) {
- this.__clearInterval(id);
- }
- clearTimeout(id) {
- this.__clearTimeout(id);
- }
- close() {
- resetWindow(this);
- }
- confirm() {
- return false;
- }
- get CSS() {
- return {
- supports: () => true,
- };
- }
- get Document() {
- if (this.__docCstr == null) {
- const win = this;
- this.__docCstr = class extends MockDocument {
- constructor() {
- super(false, win);
- throw new Error('Illegal constructor: cannot construct Document');
- }
- };
- }
- return this.__docCstr;
- }
- set Document(docCstr) {
- this.__docCstr = docCstr;
- }
- get DocumentFragment() {
- if (this.__docFragCstr == null) {
- const ownerDocument = this.document;
- this.__docFragCstr = class extends MockDocumentFragment {
- constructor() {
- super(ownerDocument);
- throw new Error('Illegal constructor: cannot construct DocumentFragment');
- }
- };
- }
- return this.__docFragCstr;
- }
- set DocumentFragment(docFragCstr) {
- this.__docFragCstr = docFragCstr;
- }
- get DocumentType() {
- if (this.__docTypeCstr == null) {
- const ownerDocument = this.document;
- this.__docTypeCstr = class extends MockNode {
- constructor() {
- super(ownerDocument, 0, 'test', '');
- throw new Error('Illegal constructor: cannot construct DocumentType');
- }
- };
- }
- return this.__docTypeCstr;
- }
- set DocumentType(docTypeCstr) {
- this.__docTypeCstr = docTypeCstr;
- }
- get DOMTokenList() {
- if (this.__domTokenListCstr == null) {
- this.__domTokenListCstr = class MockDOMTokenList {
- };
- }
- return this.__domTokenListCstr;
- }
- set DOMTokenList(domTokenListCstr) {
- this.__domTokenListCstr = domTokenListCstr;
- }
- dispatchEvent(ev) {
- return dispatchEvent(this, ev);
- }
- get Element() {
- if (this.__elementCstr == null) {
- const ownerDocument = this.document;
- this.__elementCstr = class extends MockElement {
- constructor() {
- super(ownerDocument, '');
- throw new Error('Illegal constructor: cannot construct Element');
- }
- };
- }
- return this.__elementCstr;
- }
- fetch(input, init) {
- if (typeof fetch === 'function') {
- return fetch(input, init);
- }
- throw new Error(`fetch() not implemented`);
- }
- focus() {
- /**/
- }
- getComputedStyle(_) {
- return {
- cssText: '',
- length: 0,
- parentRule: null,
- getPropertyPriority() {
- return null;
- },
- getPropertyValue() {
- return '';
- },
- item() {
- return null;
- },
- removeProperty() {
- return null;
- },
- setProperty() {
- return null;
- },
- };
- }
- get globalThis() {
- return this;
- }
- get history() {
- if (this.__history == null) {
- this.__history = new MockHistory();
- }
- return this.__history;
- }
- set history(hsty) {
- this.__history = hsty;
- }
- get JSON() {
- return JSON;
- }
- get HTMLElement() {
- if (this.__htmlElementCstr == null) {
- const ownerDocument = this.document;
- this.__htmlElementCstr = class extends MockHTMLElement {
- constructor() {
- super(ownerDocument, '');
- const observedAttributes = this.constructor.observedAttributes;
- if (Array.isArray(observedAttributes) && typeof this.attributeChangedCallback === 'function') {
- observedAttributes.forEach((attrName) => {
- const attrValue = this.getAttribute(attrName);
- if (attrValue != null) {
- this.attributeChangedCallback(attrName, null, attrValue);
- }
- });
- }
- }
- };
- }
- return this.__htmlElementCstr;
- }
- set HTMLElement(htmlElementCstr) {
- this.__htmlElementCstr = htmlElementCstr;
- }
- get IntersectionObserver() {
- return MockIntersectionObserver;
- }
- get localStorage() {
- if (this.__localStorage == null) {
- this.__localStorage = new MockStorage();
- }
- return this.__localStorage;
- }
- set localStorage(locStorage) {
- this.__localStorage = locStorage;
- }
- get location() {
- if (this.__location == null) {
- this.__location = new MockLocation();
- }
- return this.__location;
- }
- set location(val) {
- if (typeof val === 'string') {
- if (this.__location == null) {
- this.__location = new MockLocation();
- }
- this.__location.href = val;
- }
- else {
- this.__location = val;
- }
- }
- matchMedia() {
- return {
- matches: false,
- };
- }
- get Node() {
- if (this.__nodeCstr == null) {
- const ownerDocument = this.document;
- this.__nodeCstr = class extends MockNode {
- constructor() {
- super(ownerDocument, 0, 'test', '');
- throw new Error('Illegal constructor: cannot construct Node');
- }
- };
- }
- return this.__nodeCstr;
- }
- get NodeList() {
- if (this.__nodeListCstr == null) {
- const ownerDocument = this.document;
- this.__nodeListCstr = class extends MockNodeList {
- constructor() {
- super(ownerDocument, [], 0);
- throw new Error('Illegal constructor: cannot construct NodeList');
- }
- };
- }
- return this.__nodeListCstr;
- }
- get navigator() {
- if (this.__navigator == null) {
- this.__navigator = new MockNavigator();
- }
- return this.__navigator;
- }
- set navigator(nav) {
- this.__navigator = nav;
- }
- get parent() {
- return null;
- }
- prompt() {
- return '';
- }
- open() {
- return null;
- }
- get origin() {
- return this.location.origin;
- }
- removeEventListener(type, handler) {
- removeEventListener(this, type, handler);
- }
- requestAnimationFrame(callback) {
- return this.setTimeout(() => {
- callback(Date.now());
- }, 0);
- }
- requestIdleCallback(callback) {
- return this.setTimeout(() => {
- callback({
- didTimeout: false,
- timeRemaining: () => 0,
- });
- }, 0);
- }
- scroll(_x, _y) {
- /**/
- }
- scrollBy(_x, _y) {
- /**/
- }
- scrollTo(_x, _y) {
- /**/
- }
- get self() {
- return this;
- }
- get sessionStorage() {
- if (this.__sessionStorage == null) {
- this.__sessionStorage = new MockStorage();
- }
- return this.__sessionStorage;
- }
- set sessionStorage(locStorage) {
- this.__sessionStorage = locStorage;
- }
- setInterval(callback, ms, ...args) {
- if (this.__timeouts == null) {
- this.__timeouts = new Set();
- }
- ms = Math.min(ms, this.__maxTimeout);
- if (this.__allowInterval) {
- const intervalId = this.__setInterval(() => {
- if (this.__timeouts) {
- this.__timeouts.delete(intervalId);
- try {
- callback(...args);
- }
- catch (e) {
- if (this.console) {
- this.console.error(e);
- }
- else {
- console.error(e);
- }
- }
- }
- }, ms);
- if (this.__timeouts) {
- this.__timeouts.add(intervalId);
- }
- return intervalId;
- }
- const timeoutId = this.__setTimeout(() => {
- if (this.__timeouts) {
- this.__timeouts.delete(timeoutId);
- try {
- callback(...args);
- }
- catch (e) {
- if (this.console) {
- this.console.error(e);
- }
- else {
- console.error(e);
- }
- }
- }
- }, ms);
- if (this.__timeouts) {
- this.__timeouts.add(timeoutId);
- }
- return timeoutId;
- }
- setTimeout(callback, ms, ...args) {
- if (this.__timeouts == null) {
- this.__timeouts = new Set();
- }
- ms = Math.min(ms, this.__maxTimeout);
- const timeoutId = this.__setTimeout(() => {
- if (this.__timeouts) {
- this.__timeouts.delete(timeoutId);
- try {
- callback(...args);
- }
- catch (e) {
- if (this.console) {
- this.console.error(e);
- }
- else {
- console.error(e);
- }
- }
- }
- }, ms);
- if (this.__timeouts) {
- this.__timeouts.add(timeoutId);
- }
- return timeoutId;
- }
- get top() {
- return this;
- }
- get window() {
- return this;
- }
- onanimationstart() {
- /**/
- }
- onanimationend() {
- /**/
- }
- onanimationiteration() {
- /**/
- }
- onabort() {
- /**/
- }
- onauxclick() {
- /**/
- }
- onbeforecopy() {
- /**/
- }
- onbeforecut() {
- /**/
- }
- onbeforepaste() {
- /**/
- }
- onblur() {
- /**/
- }
- oncancel() {
- /**/
- }
- oncanplay() {
- /**/
- }
- oncanplaythrough() {
- /**/
- }
- onchange() {
- /**/
- }
- onclick() {
- /**/
- }
- onclose() {
- /**/
- }
- oncontextmenu() {
- /**/
- }
- oncopy() {
- /**/
- }
- oncuechange() {
- /**/
- }
- oncut() {
- /**/
- }
- ondblclick() {
- /**/
- }
- ondrag() {
- /**/
- }
- ondragend() {
- /**/
- }
- ondragenter() {
- /**/
- }
- ondragleave() {
- /**/
- }
- ondragover() {
- /**/
- }
- ondragstart() {
- /**/
- }
- ondrop() {
- /**/
- }
- ondurationchange() {
- /**/
- }
- onemptied() {
- /**/
- }
- onended() {
- /**/
- }
- onerror() {
- /**/
- }
- onfocus() {
- /**/
- }
- onfocusin() {
- /**/
- }
- onfocusout() {
- /**/
- }
- onformdata() {
- /**/
- }
- onfullscreenchange() {
- /**/
- }
- onfullscreenerror() {
- /**/
- }
- ongotpointercapture() {
- /**/
- }
- oninput() {
- /**/
- }
- oninvalid() {
- /**/
- }
- onkeydown() {
- /**/
- }
- onkeypress() {
- /**/
- }
- onkeyup() {
- /**/
- }
- onload() {
- /**/
- }
- onloadeddata() {
- /**/
- }
- onloadedmetadata() {
- /**/
- }
- onloadstart() {
- /**/
- }
- onlostpointercapture() {
- /**/
- }
- onmousedown() {
- /**/
- }
- onmouseenter() {
- /**/
- }
- onmouseleave() {
- /**/
- }
- onmousemove() {
- /**/
- }
- onmouseout() {
- /**/
- }
- onmouseover() {
- /**/
- }
- onmouseup() {
- /**/
- }
- onmousewheel() {
- /**/
- }
- onpaste() {
- /**/
- }
- onpause() {
- /**/
- }
- onplay() {
- /**/
- }
- onplaying() {
- /**/
- }
- onpointercancel() {
- /**/
- }
- onpointerdown() {
- /**/
- }
- onpointerenter() {
- /**/
- }
- onpointerleave() {
- /**/
- }
- onpointermove() {
- /**/
- }
- onpointerout() {
- /**/
- }
- onpointerover() {
- /**/
- }
- onpointerup() {
- /**/
- }
- onprogress() {
- /**/
- }
- onratechange() {
- /**/
- }
- onreset() {
- /**/
- }
- onresize() {
- /**/
- }
- onscroll() {
- /**/
- }
- onsearch() {
- /**/
- }
- onseeked() {
- /**/
- }
- onseeking() {
- /**/
- }
- onselect() {
- /**/
- }
- onselectstart() {
- /**/
- }
- onstalled() {
- /**/
- }
- onsubmit() {
- /**/
- }
- onsuspend() {
- /**/
- }
- ontimeupdate() {
- /**/
- }
- ontoggle() {
- /**/
- }
- onvolumechange() {
- /**/
- }
- onwaiting() {
- /**/
- }
- onwebkitfullscreenchange() {
- /**/
- }
- onwebkitfullscreenerror() {
- /**/
- }
- onwheel() {
- /**/
- }
- }
- addGlobalsToWindowPrototype(MockWindow.prototype);
- function resetWindowDefaults(win) {
- win.__clearInterval = nativeClearInterval;
- win.__clearTimeout = nativeClearTimeout;
- win.__setInterval = nativeSetInterval;
- win.__setTimeout = nativeSetTimeout;
- win.__maxTimeout = 30000;
- win.__allowInterval = true;
- win.URL = nativeURL;
- }
- function cloneWindow(srcWin, opts = {}) {
- if (srcWin == null) {
- return null;
- }
- const clonedWin = new MockWindow(false);
- if (!opts.customElementProxy) {
- // TODO(STENCIL-345) - Evaluate reconciling MockWindow, Window differences
- // @ts-ignore
- srcWin.customElements = null;
- }
- if (srcWin.document != null) {
- const clonedDoc = new MockDocument(false, clonedWin);
- clonedWin.document = clonedDoc;
- clonedDoc.documentElement = srcWin.document.documentElement.cloneNode(true);
- }
- else {
- clonedWin.document = new MockDocument(null, clonedWin);
- }
- return clonedWin;
- }
- function cloneDocument(srcDoc) {
- if (srcDoc == null) {
- return null;
- }
- const dstWin = cloneWindow(srcDoc.defaultView);
- return dstWin.document;
- }
- /**
- * Constrain setTimeout() to 1ms, but still async. Also
- * only allow setInterval() to fire once, also constrained to 1ms.
- */
- function constrainTimeouts(win) {
- win.__allowInterval = false;
- win.__maxTimeout = 0;
- }
- function resetWindow(win) {
- if (win != null) {
- if (win.__timeouts) {
- win.__timeouts.forEach((timeoutId) => {
- nativeClearInterval(timeoutId);
- nativeClearTimeout(timeoutId);
- });
- win.__timeouts.clear();
- }
- if (win.customElements && win.customElements.clear) {
- win.customElements.clear();
- }
- resetDocument(win.document);
- resetPerformance(win.performance);
- for (const key in win) {
- if (win.hasOwnProperty(key) && key !== 'document' && key !== 'performance' && key !== 'customElements') {
- delete win[key];
- }
- }
- resetWindowDefaults(win);
- resetWindowDimensions(win);
- resetEventListeners(win);
- if (win.document != null) {
- try {
- win.document.defaultView = win;
- }
- catch (e) { }
- }
- // ensure we don't hold onto nodeFetch values
- win.fetch = null;
- win.Headers = null;
- win.Request = null;
- win.Response = null;
- win.FetchError = null;
- }
- }
- function resetWindowDimensions(win) {
- try {
- win.devicePixelRatio = 1;
- win.innerHeight = 768;
- win.innerWidth = 1366;
- win.pageXOffset = 0;
- win.pageYOffset = 0;
- win.screenLeft = 0;
- win.screenTop = 0;
- win.screenX = 0;
- win.screenY = 0;
- win.scrollX = 0;
- win.scrollY = 0;
- win.screen = {
- availHeight: win.innerHeight,
- availLeft: 0,
- availTop: 0,
- availWidth: win.innerWidth,
- colorDepth: 24,
- height: win.innerHeight,
- keepAwake: false,
- orientation: {
- angle: 0,
- type: 'portrait-primary',
- },
- pixelDepth: 24,
- width: win.innerWidth,
- };
- }
- catch (e) { }
- }
- class MockDocument extends MockHTMLElement {
- constructor(html = null, win = null) {
- super(null, null);
- this.nodeName = "#document" /* DOCUMENT_NODE */;
- this.nodeType = 9 /* DOCUMENT_NODE */;
- this.defaultView = win;
- this.cookie = '';
- this.referrer = '';
- this.appendChild(this.createDocumentTypeNode());
- if (typeof html === 'string') {
- const parsedDoc = parseDocumentUtil(this, html);
- const documentElement = parsedDoc.children.find((elm) => elm.nodeName === 'HTML');
- if (documentElement != null) {
- this.appendChild(documentElement);
- setOwnerDocument(documentElement, this);
- }
- }
- else if (html !== false) {
- const documentElement = new MockHTMLElement(this, 'html');
- this.appendChild(documentElement);
- documentElement.appendChild(new MockHTMLElement(this, 'head'));
- documentElement.appendChild(new MockHTMLElement(this, 'body'));
- }
- }
- get dir() {
- return this.documentElement.dir;
- }
- set dir(value) {
- this.documentElement.dir = value;
- }
- get location() {
- if (this.defaultView != null) {
- return this.defaultView.location;
- }
- return null;
- }
- set location(val) {
- if (this.defaultView != null) {
- this.defaultView.location = val;
- }
- }
- get baseURI() {
- const baseNode = this.head.childNodes.find((node) => node.nodeName === 'BASE');
- if (baseNode) {
- return baseNode.href;
- }
- return this.URL;
- }
- get URL() {
- return this.location.href;
- }
- get styleSheets() {
- return this.querySelectorAll('style');
- }
- get scripts() {
- return this.querySelectorAll('script');
- }
- get forms() {
- return this.querySelectorAll('form');
- }
- get images() {
- return this.querySelectorAll('img');
- }
- get scrollingElement() {
- return this.documentElement;
- }
- get documentElement() {
- for (let i = this.childNodes.length - 1; i >= 0; i--) {
- if (this.childNodes[i].nodeName === 'HTML') {
- return this.childNodes[i];
- }
- }
- const documentElement = new MockHTMLElement(this, 'html');
- this.appendChild(documentElement);
- return documentElement;
- }
- set documentElement(documentElement) {
- for (let i = this.childNodes.length - 1; i >= 0; i--) {
- if (this.childNodes[i].nodeType !== 10 /* DOCUMENT_TYPE_NODE */) {
- this.childNodes[i].remove();
- }
- }
- if (documentElement != null) {
- this.appendChild(documentElement);
- setOwnerDocument(documentElement, this);
- }
- }
- get head() {
- const documentElement = this.documentElement;
- for (let i = 0; i < documentElement.childNodes.length; i++) {
- if (documentElement.childNodes[i].nodeName === 'HEAD') {
- return documentElement.childNodes[i];
- }
- }
- const head = new MockHTMLElement(this, 'head');
- documentElement.insertBefore(head, documentElement.firstChild);
- return head;
- }
- set head(head) {
- const documentElement = this.documentElement;
- for (let i = documentElement.childNodes.length - 1; i >= 0; i--) {
- if (documentElement.childNodes[i].nodeName === 'HEAD') {
- documentElement.childNodes[i].remove();
- }
- }
- if (head != null) {
- documentElement.insertBefore(head, documentElement.firstChild);
- setOwnerDocument(head, this);
- }
- }
- get body() {
- const documentElement = this.documentElement;
- for (let i = documentElement.childNodes.length - 1; i >= 0; i--) {
- if (documentElement.childNodes[i].nodeName === 'BODY') {
- return documentElement.childNodes[i];
- }
- }
- const body = new MockHTMLElement(this, 'body');
- documentElement.appendChild(body);
- return body;
- }
- set body(body) {
- const documentElement = this.documentElement;
- for (let i = documentElement.childNodes.length - 1; i >= 0; i--) {
- if (documentElement.childNodes[i].nodeName === 'BODY') {
- documentElement.childNodes[i].remove();
- }
- }
- if (body != null) {
- documentElement.appendChild(body);
- setOwnerDocument(body, this);
- }
- }
- appendChild(newNode) {
- newNode.remove();
- newNode.parentNode = this;
- this.childNodes.push(newNode);
- return newNode;
- }
- createComment(data) {
- return new MockComment(this, data);
- }
- createAttribute(attrName) {
- return new MockAttr(attrName.toLowerCase(), '');
- }
- createAttributeNS(namespaceURI, attrName) {
- return new MockAttr(attrName, '', namespaceURI);
- }
- createElement(tagName) {
- if (tagName === "#document" /* DOCUMENT_NODE */) {
- const doc = new MockDocument(false);
- doc.nodeName = tagName;
- doc.parentNode = null;
- return doc;
- }
- return createElement(this, tagName);
- }
- createElementNS(namespaceURI, tagName) {
- const elmNs = createElementNS(this, namespaceURI, tagName);
- elmNs.namespaceURI = namespaceURI;
- return elmNs;
- }
- createTextNode(text) {
- return new MockTextNode(this, text);
- }
- createDocumentFragment() {
- return new MockDocumentFragment(this);
- }
- createDocumentTypeNode() {
- return new MockDocumentTypeNode(this);
- }
- getElementById(id) {
- return getElementById(this, id);
- }
- getElementsByName(elmName) {
- return getElementsByName(this, elmName.toLowerCase());
- }
- get title() {
- const title = this.head.childNodes.find((elm) => elm.nodeName === 'TITLE');
- if (title != null && typeof title.textContent === 'string') {
- return title.textContent.trim();
- }
- return '';
- }
- set title(value) {
- const head = this.head;
- let title = head.childNodes.find((elm) => elm.nodeName === 'TITLE');
- if (title == null) {
- title = this.createElement('title');
- head.appendChild(title);
- }
- title.textContent = value;
- }
- }
- function createDocument(html = null) {
- return new MockWindow(html).document;
- }
- function createFragment(html) {
- return parseHtmlToFragment(html, null);
- }
- function resetDocument(doc) {
- if (doc != null) {
- resetEventListeners(doc);
- const documentElement = doc.documentElement;
- if (documentElement != null) {
- resetElement(documentElement);
- for (let i = 0, ii = documentElement.childNodes.length; i < ii; i++) {
- const childNode = documentElement.childNodes[i];
- resetElement(childNode);
- childNode.childNodes.length = 0;
- }
- }
- for (const key in doc) {
- if (doc.hasOwnProperty(key) && !DOC_KEY_KEEPERS.has(key)) {
- delete doc[key];
- }
- }
- try {
- doc.nodeName = "#document" /* DOCUMENT_NODE */;
- }
- catch (e) { }
- try {
- doc.nodeType = 9 /* DOCUMENT_NODE */;
- }
- catch (e) { }
- try {
- doc.cookie = '';
- }
- catch (e) { }
- try {
- doc.referrer = '';
- }
- catch (e) { }
- }
- }
- const DOC_KEY_KEEPERS = new Set([
- 'nodeName',
- 'nodeType',
- 'nodeValue',
- 'ownerDocument',
- 'parentNode',
- 'childNodes',
- '_shadowRoot',
- ]);
- function getElementById(elm, id) {
- const children = elm.children;
- for (let i = 0, ii = children.length; i < ii; i++) {
- const childElm = children[i];
- if (childElm.id === id) {
- return childElm;
- }
- const childElmFound = getElementById(childElm, id);
- if (childElmFound != null) {
- return childElmFound;
- }
- }
- return null;
- }
- function getElementsByName(elm, elmName, foundElms = []) {
- const children = elm.children;
- for (let i = 0, ii = children.length; i < ii; i++) {
- const childElm = children[i];
- if (childElm.name && childElm.name.toLowerCase() === elmName) {
- foundElms.push(childElm);
- }
- getElementsByName(childElm, elmName, foundElms);
- }
- return foundElms;
- }
- function setOwnerDocument(elm, ownerDocument) {
- for (let i = 0, ii = elm.childNodes.length; i < ii; i++) {
- elm.childNodes[i].ownerDocument = ownerDocument;
- if (elm.childNodes[i].nodeType === 1 /* ELEMENT_NODE */) {
- setOwnerDocument(elm.childNodes[i], ownerDocument);
- }
- }
- }
- function hydrateFactory($stencilWindow, $stencilHydrateOpts, $stencilHydrateResults, $stencilAfterHydrate, $stencilHydrateResolve) {
- var globalThis = $stencilWindow;
- var self = $stencilWindow;
- var top = $stencilWindow;
- var parent = $stencilWindow;
- var addEventListener = $stencilWindow.addEventListener.bind($stencilWindow);
- var alert = $stencilWindow.alert.bind($stencilWindow);
- var blur = $stencilWindow.blur.bind($stencilWindow);
- var cancelAnimationFrame = $stencilWindow.cancelAnimationFrame.bind($stencilWindow);
- var cancelIdleCallback = $stencilWindow.cancelIdleCallback.bind($stencilWindow);
- var clearInterval = $stencilWindow.clearInterval.bind($stencilWindow);
- var clearTimeout = $stencilWindow.clearTimeout.bind($stencilWindow);
- var close = () => {};
- var confirm = $stencilWindow.confirm.bind($stencilWindow);
- var dispatchEvent = $stencilWindow.dispatchEvent.bind($stencilWindow);
- var focus = $stencilWindow.focus.bind($stencilWindow);
- var getComputedStyle = $stencilWindow.getComputedStyle.bind($stencilWindow);
- var matchMedia = $stencilWindow.matchMedia.bind($stencilWindow);
- var open = $stencilWindow.open.bind($stencilWindow);
- var prompt = $stencilWindow.prompt.bind($stencilWindow);
- var removeEventListener = $stencilWindow.removeEventListener.bind($stencilWindow);
- var requestAnimationFrame = $stencilWindow.requestAnimationFrame.bind($stencilWindow);
- var requestIdleCallback = $stencilWindow.requestIdleCallback.bind($stencilWindow);
- var setInterval = $stencilWindow.setInterval.bind($stencilWindow);
- var setTimeout = $stencilWindow.setTimeout.bind($stencilWindow);
- var CharacterData = $stencilWindow.CharacterData;
- var CSS = $stencilWindow.CSS;
- var CustomEvent = $stencilWindow.CustomEvent;
- var Document = $stencilWindow.Document;
- var DocumentFragment = $stencilWindow.DocumentFragment;
- var DocumentType = $stencilWindow.DocumentType;
- var DOMTokenList = $stencilWindow.DOMTokenList;
- var Element = $stencilWindow.Element;
- var Event = $stencilWindow.Event;
- var HTMLAnchorElement = $stencilWindow.HTMLAnchorElement;
- var HTMLBaseElement = $stencilWindow.HTMLBaseElement;
- var HTMLButtonElement = $stencilWindow.HTMLButtonElement;
- var HTMLCanvasElement = $stencilWindow.HTMLCanvasElement;
- var HTMLElement = $stencilWindow.HTMLElement;
- var HTMLFormElement = $stencilWindow.HTMLFormElement;
- var HTMLImageElement = $stencilWindow.HTMLImageElement;
- var HTMLInputElement = $stencilWindow.HTMLInputElement;
- var HTMLLinkElement = $stencilWindow.HTMLLinkElement;
- var HTMLMetaElement = $stencilWindow.HTMLMetaElement;
- var HTMLScriptElement = $stencilWindow.HTMLScriptElement;
- var HTMLStyleElement = $stencilWindow.HTMLStyleElement;
- var HTMLTemplateElement = $stencilWindow.HTMLTemplateElement;
- var HTMLTitleElement = $stencilWindow.HTMLTitleElement;
- var IntersectionObserver = $stencilWindow.IntersectionObserver;
- var KeyboardEvent = $stencilWindow.KeyboardEvent;
- var MouseEvent = $stencilWindow.MouseEvent;
- var Node = $stencilWindow.Node;
- var NodeList = $stencilWindow.NodeList;
- var URL = $stencilWindow.URL;
- var console = $stencilWindow.console;
- var customElements = $stencilWindow.customElements;
- var history = $stencilWindow.history;
- var localStorage = $stencilWindow.localStorage;
- var location = $stencilWindow.location;
- var navigator = $stencilWindow.navigator;
- var performance = $stencilWindow.performance;
- var sessionStorage = $stencilWindow.sessionStorage;
- var devicePixelRatio = $stencilWindow.devicePixelRatio;
- var innerHeight = $stencilWindow.innerHeight;
- var innerWidth = $stencilWindow.innerWidth;
- var origin = $stencilWindow.origin;
- var pageXOffset = $stencilWindow.pageXOffset;
- var pageYOffset = $stencilWindow.pageYOffset;
- var screen = $stencilWindow.screen;
- var screenLeft = $stencilWindow.screenLeft;
- var screenTop = $stencilWindow.screenTop;
- var screenX = $stencilWindow.screenX;
- var screenY = $stencilWindow.screenY;
- var scrollX = $stencilWindow.scrollX;
- var scrollY = $stencilWindow.scrollY;
- var exports = {};
- var fetch, FetchError, Headers, Request, Response;
- if (typeof $stencilWindow.fetch === 'function') {
- fetch = $stencilWindow.fetch;
- } else {
- fetch = $stencilWindow.fetch = function() { throw new Error('fetch() is not implemented'); };
- }
- if (typeof $stencilWindow.FetchError === 'function') {
- FetchError = $stencilWindow.FetchError;
- } else {
- FetchError = $stencilWindow.FetchError = class FetchError { constructor() { throw new Error('FetchError is not implemented'); } };
- }
- if (typeof $stencilWindow.Headers === 'function') {
- Headers = $stencilWindow.Headers;
- } else {
- Headers = $stencilWindow.Headers = class Headers { constructor() { throw new Error('Headers is not implemented'); } };
- }
- if (typeof $stencilWindow.Request === 'function') {
- Request = $stencilWindow.Request;
- } else {
- Request = $stencilWindow.Request = class Request { constructor() { throw new Error('Request is not implemented'); } };
- }
- if (typeof $stencilWindow.Response === 'function') {
- Response = $stencilWindow.Response;
- } else {
- Response = $stencilWindow.Response = class Response { constructor() { throw new Error('Response is not implemented'); } };
- }
- function hydrateAppClosure($stencilWindow) {
- const window = $stencilWindow;
- const document = $stencilWindow.document;
- /*hydrateAppClosure start*/
- const NAMESPACE = 'calcite';
- const BUILD = /* calcite */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: true, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: true, cmpWillLoad: true, cmpWillRender: true, cmpWillUpdate: false, connectedCallback: true, constructableCSS: false, cssAnnotations: true, cssVarShim: false, devTools: false, disconnectedCallback: true, dynamicImportShim: false, element: false, event: true, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: true, hostListenerTargetDocument: true, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: true, hydratedAttribute: false, hydratedClass: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, safari10: false, scoped: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, shadowDomShim: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: true, taskQueue: true, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
- function componentOnReady() {
- return getHostRef(this).$onReadyPromise$;
- }
- function forceUpdate() {}
- function hydrateApp(e, t, o, n, s) {
- function l() {
- if (global.clearTimeout(p), i.clear(), r.clear(), !h) {
- h = !0;
- try {
- t.clientHydrateAnnotations && insertVdomAnnotations(e.document, t.staticComponents),
- e.dispatchEvent(new e.Event("DOMContentLoaded")), e.document.createElement = c,
- e.document.createElementNS = $;
- } catch (e) {
- renderCatchError(t, o, e);
- }
- }
- n(e, t, o, s);
- }
- function a(e) {
- renderCatchError(t, o, e), l();
- }
- const r = new Set, i = new Set, d = new Set, c = e.document.createElement, $ = e.document.createElementNS, m = Promise.resolve();
- let p, h = !1;
- try {
- function u() {
- return g(this);
- }
- function f(e) {
- if (isValidComponent(e, t) && !getHostRef(e)) {
- const t = loadModule({
- $tagName$: e.nodeName.toLowerCase(),
- $flags$: null
- });
- null != t && null != t.cmpMeta && (i.add(e), e.connectedCallback = u, registerHost(e, t.cmpMeta),
- function o(e, t) {
- if ("function" != typeof e.componentOnReady && (e.componentOnReady = componentOnReady),
- "function" != typeof e.forceUpdate && (e.forceUpdate = forceUpdate), 1 & t.$flags$ && (e.shadowRoot = e),
- null != t.$members$) {
- const o = getHostRef(e);
- Object.entries(t.$members$).forEach((([n, s]) => {
- const l = s[0];
- if (31 & l) {
- const a = s[1] || n, r = e.getAttribute(a);
- if (null != r) {
- const e = parsePropertyValue(r, l);
- o.$instanceValues$.set(n, e);
- }
- const i = e[n];
- void 0 !== i && (o.$instanceValues$.set(n, i), delete e[n]), Object.defineProperty(e, n, {
- get() {
- return getValue(this, n);
- },
- set(e) {
- setValue(this, n, e, t);
- },
- configurable: !0,
- enumerable: !0
- });
- } else 64 & l && Object.defineProperty(e, n, {
- value() {
- const e = getHostRef(this), t = arguments;
- return e.$onInstancePromise$.then((() => e.$lazyInstance$[n].apply(e.$lazyInstance$, t))).catch(consoleError);
- }
- });
- }));
- }
- }(e, t.cmpMeta));
- }
- }
- function g(n) {
- return i.delete(n), isValidComponent(n, t) && o.hydratedCount < t.maxHydrateCount && !r.has(n) && shouldHydrate(n) ? (r.add(n),
- async function s(e, t, o, n, l) {
- o = o.toLowerCase();
- const a = loadModule({
- $tagName$: o,
- $flags$: null
- });
- if (null != a && null != a.cmpMeta) {
- l.add(n);
- try {
- connectedCallback(n), await n.componentOnReady(), t.hydratedCount++;
- const e = getHostRef(n), s = e.$modeName$ ? e.$modeName$ : "$";
- t.components.some((e => e.tag === o && e.mode === s)) || t.components.push({
- tag: o,
- mode: s,
- count: 0,
- depth: -1
- });
- } catch (t) {
- e.console.error(t);
- }
- l.delete(n);
- }
- }(e, o, n.nodeName, n, d)) : m;
- }
- e.document.createElement = function t(o) {
- const n = c.call(e.document, o);
- return f(n), n;
- }, e.document.createElementNS = function t(o, n) {
- const s = $.call(e.document, o, n);
- return f(s), s;
- }, p = global.setTimeout((function L() {
- a(`Hydrate exceeded timeout${function e(t) {
- return Array.from(t).map(waitingOnElementMsg);
- }(d)}`);
- }), t.timeout), plt.$resourcesUrl$ = new URL(t.resourcesUrl || "./", doc.baseURI).href,
- function e(t) {
- if (null != t && 1 === t.nodeType) {
- f(t);
- const o = t.children;
- for (let t = 0, n = o.length; t < n; t++) e(o[t]);
- }
- }(e.document.body), function e() {
- const t = Array.from(i).filter((e => e.parentElement));
- return t.length > 0 ? Promise.all(t.map(g)).then(e) : m;
- }().then(l).catch(a);
- } catch (e) {
- a(e);
- }
- }
- function isValidComponent(e, t) {
- if (null != e && 1 === e.nodeType) {
- const o = e.nodeName;
- if ("string" == typeof o && o.includes("-")) return !t.excludeComponents.includes(o.toLowerCase());
- }
- return !1;
- }
- function shouldHydrate(e) {
- if (9 === e.nodeType) return !0;
- if (NO_HYDRATE_TAGS.has(e.nodeName)) return !1;
- if (e.hasAttribute("no-prerender")) return !1;
- const t = e.parentNode;
- return null == t || shouldHydrate(t);
- }
- function renderCatchError(e, t, o) {
- const n = {
- level: "error",
- type: "build",
- header: "Hydrate Error",
- messageText: "",
- relFilePath: null,
- absFilePath: null,
- lines: []
- };
- if (e.url) try {
- const t = new URL(e.url);
- "/" !== t.pathname && (n.header += ": " + t.pathname);
- } catch (e) {}
- null != o && (null != o.stack ? n.messageText = o.stack.toString() : null != o.message ? n.messageText = o.message.toString() : n.messageText = o.toString()),
- t.diagnostics.push(n);
- }
- function printTag(e) {
- let t = `<${e.nodeName.toLowerCase()}`;
- if (Array.isArray(e.attributes)) for (let o = 0; o < e.attributes.length; o++) {
- const n = e.attributes[o];
- t += ` ${n.name}`, "" !== n.value && (t += `="${n.value}"`);
- }
- return t += ">", t;
- }
- function waitingOnElementMsg(e) {
- let t = "";
- if (e) {
- const o = [];
- t = " - waiting on:";
- let n = e;
- for (;n && 9 !== n.nodeType && "BODY" !== n.nodeName; ) o.unshift(printTag(n)),
- n = n.parentElement;
- let s = "";
- for (const e of o) s += " ", t += `\n${s}${e}`;
- }
- return t;
- }
- const addHostEventListeners = (e, t, o, n) => {
- o && (o.map((([o, n, s]) => {
- const l = getHostListenerTarget(e, o) , a = hostListenerProxy(t, s), r = hostListenerOpts(o);
- plt.ael(l, n, a, r), (t.$rmListeners$ = t.$rmListeners$ || []).push((() => plt.rel(l, n, a, r)));
- })));
- }, hostListenerProxy = (e, t) => o => {
- try {
- 256 & e.$flags$ ? e.$lazyInstance$[t](o) : (e.$queuedListeners$ = e.$queuedListeners$ || []).push([ t, o ]) ;
- } catch (e) {
- consoleError(e);
- }
- }, getHostListenerTarget = (e, t) => 4 & t ? doc : 8 & t ? win : 16 & t ? doc.body : e, hostListenerOpts = e => 0 != (2 & e), XLINK_NS = "http://www.w3.org/1999/xlink";
- const createTime = (e, t = "") => {
- return () => {};
- }, rootAppliedStyles = new WeakMap, registerStyle = (e, t, o) => {
- let n = styles.get(e);
- n = t, styles.set(e, n);
- }, addStyle = (e, t, o, n) => {
- let s = getScopeId(t), l = styles.get(s);
- if (e = 11 === e.nodeType ? e : doc, l) if ("string" == typeof l) {
- e = e.head || e;
- let o, a = rootAppliedStyles.get(e);
- if (a || rootAppliedStyles.set(e, a = new Set), !a.has(s)) {
- if (e.host && (o = e.querySelector(`[sty-id="${s}"]`))) o.innerHTML = l; else {
- o = doc.createElement("style"), o.innerHTML = l;
- o.setAttribute("sty-id", s),
- e.insertBefore(o, e.querySelector("link"));
- }
- a && a.add(s);
- }
- }
- return s;
- }, attachStyles = e => {
- const t = e.$cmpMeta$, o = e.$hostElement$, n = t.$flags$, s = createTime("attachStyles", t.$tagName$), l = addStyle(o.getRootNode(), t);
- 10 & n && (o["s-sc"] = l,
- o.classList.add(l + "-h"), BUILD.scoped ),
- s();
- }, getScopeId = (e, t) => "sc-" + (e.$tagName$), EMPTY_OBJ = {}, isComplexType = e => "object" == (e = typeof e) || "function" === e, isPromise = e => !!e && ("object" == typeof e || "function" == typeof e) && "function" == typeof e.then, h = (e, t, ...o) => {
- let n = null, s = null, l = null, a = !1, r = !1, i = [];
- const d = t => {
- for (let o = 0; o < t.length; o++) n = t[o], Array.isArray(n) ? d(n) : null != n && "boolean" != typeof n && ((a = "function" != typeof e && !isComplexType(n)) ? n = String(n) : BUILD.isDev ,
- a && r ? i[i.length - 1].$text$ += n : i.push(a ? newVNode(null, n) : n), r = a);
- };
- if (d(o), t && (t.key && (s = t.key),
- t.name && (l = t.name), BUILD.vdomClass)) {
- const e = t.className || t.class;
- e && (t.class = "object" != typeof e ? e : Object.keys(e).filter((t => e[t])).join(" "));
- }
- if ("function" == typeof e) return e(null === t ? {} : t, i, vdomFnUtils);
- const c = newVNode(e, null);
- return c.$attrs$ = t, i.length > 0 && (c.$children$ = i), (c.$key$ = s),
- (c.$name$ = l), c;
- }, newVNode = (e, t) => {
- const o = {
- $flags$: 0,
- $tag$: e,
- $text$: t,
- $elm$: null,
- $children$: null
- };
- return (o.$attrs$ = null), (o.$key$ = null),
- (o.$name$ = null), o;
- }, Host = {}, isHost = e => e && e.$tag$ === Host, vdomFnUtils = {
- forEach: (e, t) => e.map(convertToPublic).forEach(t),
- map: (e, t) => e.map(convertToPublic).map(t).map(convertToPrivate)
- }, convertToPublic = e => ({
- vattrs: e.$attrs$,
- vchildren: e.$children$,
- vkey: e.$key$,
- vname: e.$name$,
- vtag: e.$tag$,
- vtext: e.$text$
- }), convertToPrivate = e => {
- if ("function" == typeof e.vtag) {
- const t = {
- ...e.vattrs
- };
- return e.vkey && (t.key = e.vkey), e.vname && (t.name = e.vname), h(e.vtag, t, ...e.vchildren || []);
- }
- const t = newVNode(e.vtag, e.vtext);
- return t.$attrs$ = e.vattrs, t.$children$ = e.vchildren, t.$key$ = e.vkey, t.$name$ = e.vname,
- t;
- }, setAccessor = (e, t, o, n, s, l) => {
- if (o !== n) {
- let a = isMemberInElement(e, t), r = t.toLowerCase();
- if ("class" === t) {
- const t = e.classList, s = parseClassList(o), l = parseClassList(n);
- t.remove(...s.filter((e => e && !l.includes(e)))), t.add(...l.filter((e => e && !s.includes(e))));
- } else if ("style" === t) {
- for (const t in o) n && null != n[t] || (e.style[t] = "");
- for (const t in n) o && n[t] === o[t] || (e.style[t] = n[t]);
- } else if ("key" === t) ; else if ("ref" === t) n && n(e); else if ((a ) || "o" !== t[0] || "n" !== t[1]) {
- {
- const i = isComplexType(n);
- if ((a || i && null !== n) && !s) try {
- if (e.tagName.includes("-")) e[t] = n; else {
- let s = null == n ? "" : n;
- "list" === t ? a = !1 : null != o && e[t] == s || (e[t] = s);
- }
- } catch (e) {}
- let d = !1;
- r !== (r = r.replace(/^xlink\:?/, "")) && (t = r, d = !0), null == n || !1 === n ? !1 === n && "" !== e.getAttribute(t) || (d ? e.removeAttributeNS(XLINK_NS, t) : e.removeAttribute(t)) : (!a || 4 & l || s) && !i && (n = !0 === n ? "" : n,
- d ? e.setAttributeNS(XLINK_NS, t, n) : e.setAttribute(t, n));
- }
- } else t = "-" === t[2] ? t.slice(3) : isMemberInElement(win, r) ? r.slice(2) : r[2] + t.slice(3),
- o && plt.rel(e, t, o, !1), n && plt.ael(e, t, n, !1);
- }
- }, parseClassListRegex = /\s/, parseClassList = e => e ? e.split(parseClassListRegex) : [], updateElement = (e, t, o, n) => {
- const s = 11 === t.$elm$.nodeType && t.$elm$.host ? t.$elm$.host : t.$elm$, l = e && e.$attrs$ || EMPTY_OBJ, a = t.$attrs$ || EMPTY_OBJ;
- for (n in l) n in a || setAccessor(s, n, l[n], void 0, o, t.$flags$);
- for (n in a) setAccessor(s, n, l[n], a[n], o, t.$flags$);
- };
- let scopeId, contentRef, hostTagName, useNativeShadowDom = !1, checkSlotFallbackVisibility = !1, checkSlotRelocate = !1, isSvgMode = !1;
- const createElm = (e, t, o, n) => {
- let s, l, a, r = t.$children$[o], i = 0;
- if (!useNativeShadowDom && (checkSlotRelocate = !0, "slot" === r.$tag$ && (scopeId && n.classList.add(scopeId + "-s"),
- r.$flags$ |= r.$children$ ? 2 : 1)), null !== r.$text$) s = r.$elm$ = doc.createTextNode(r.$text$); else if (1 & r.$flags$) s = r.$elm$ = slotReferenceDebugNode(r) ; else {
- if (!isSvgMode && (isSvgMode = "svg" === r.$tag$), s = r.$elm$ = doc.createElementNS(isSvgMode ? "http://www.w3.org/2000/svg" : "http://www.w3.org/1999/xhtml", 2 & r.$flags$ ? "slot-fb" : r.$tag$) ,
- isSvgMode && "foreignObject" === r.$tag$ && (isSvgMode = !1), updateElement(null, r, isSvgMode),
- null != scopeId && s["s-si"] !== scopeId && s.classList.add(s["s-si"] = scopeId),
- r.$children$) for (i = 0; i < r.$children$.length; ++i) l = createElm(e, r, i, s),
- l && s.appendChild(l);
- ("svg" === r.$tag$ ? isSvgMode = !1 : "foreignObject" === s.tagName && (isSvgMode = !0));
- }
- return (s["s-hn"] = hostTagName, 3 & r.$flags$ && (s["s-sr"] = !0,
- s["s-cr"] = contentRef, s["s-sn"] = r.$name$ || "", a = e && e.$children$ && e.$children$[o],
- a && a.$tag$ === r.$tag$ && e.$elm$ && putBackInOriginalLocation(e.$elm$, !1))),
- s;
- }, putBackInOriginalLocation = (e, t) => {
- plt.$flags$ |= 1;
- const o = e.childNodes;
- for (let e = o.length - 1; e >= 0; e--) {
- const n = o[e];
- n["s-hn"] !== hostTagName && n["s-ol"] && (parentReferenceNode(n).insertBefore(n, referenceNode(n)),
- n["s-ol"].remove(), n["s-ol"] = void 0, checkSlotRelocate = !0), t && putBackInOriginalLocation(n, t);
- }
- plt.$flags$ &= -2;
- }, addVnodes = (e, t, o, n, s, l) => {
- let a, r = e["s-cr"] && e["s-cr"].parentNode || e;
- for (r.shadowRoot && r.tagName === hostTagName && (r = r.shadowRoot); s <= l; ++s) n[s] && (a = createElm(null, o, s, e),
- a && (n[s].$elm$ = a, r.insertBefore(a, referenceNode(t) )));
- }, removeVnodes = (e, t, o, n, s) => {
- for (;t <= o; ++t) (n = e[t]) && (s = n.$elm$, callNodeRefs(n), (checkSlotFallbackVisibility = !0,
- s["s-ol"] ? s["s-ol"].remove() : putBackInOriginalLocation(s, !0)), s.remove());
- }, isSameVnode = (e, t) => e.$tag$ === t.$tag$ && ("slot" === e.$tag$ ? e.$name$ === t.$name$ : e.$key$ === t.$key$), referenceNode = e => e && e["s-ol"] || e, parentReferenceNode = e => (e["s-ol"] ? e["s-ol"] : e).parentNode, patch = (e, t) => {
- const o = t.$elm$ = e.$elm$, n = e.$children$, s = t.$children$, l = t.$tag$, a = t.$text$;
- let r;
- null !== a ? (r = o["s-cr"]) ? r.parentNode.textContent = a : e.$text$ !== a && (o.data = a) : ((isSvgMode = "svg" === l || "foreignObject" !== l && isSvgMode),
- ("slot" === l || updateElement(e, t, isSvgMode)),
- null !== n && null !== s ? ((e, t, o, n) => {
- let s, l, a = 0, r = 0, i = 0, d = 0, c = t.length - 1, $ = t[0], m = t[c], p = n.length - 1, h = n[0], u = n[p];
- for (;a <= c && r <= p; ) if (null == $) $ = t[++a]; else if (null == m) m = t[--c]; else if (null == h) h = n[++r]; else if (null == u) u = n[--p]; else if (isSameVnode($, h)) patch($, h),
- $ = t[++a], h = n[++r]; else if (isSameVnode(m, u)) patch(m, u), m = t[--c], u = n[--p]; else if (isSameVnode($, u)) "slot" !== $.$tag$ && "slot" !== u.$tag$ || putBackInOriginalLocation($.$elm$.parentNode, !1),
- patch($, u), e.insertBefore($.$elm$, m.$elm$.nextSibling), $ = t[++a], u = n[--p]; else if (isSameVnode(m, h)) "slot" !== $.$tag$ && "slot" !== u.$tag$ || putBackInOriginalLocation(m.$elm$.parentNode, !1),
- patch(m, h), e.insertBefore(m.$elm$, $.$elm$), m = t[--c], h = n[++r]; else {
- if (i = -1, BUILD.vdomKey) for (d = a; d <= c; ++d) if (t[d] && null !== t[d].$key$ && t[d].$key$ === h.$key$) {
- i = d;
- break;
- }
- i >= 0 ? (l = t[i], l.$tag$ !== h.$tag$ ? s = createElm(t && t[r], o, i, e) : (patch(l, h),
- t[i] = void 0, s = l.$elm$), h = n[++r]) : (s = createElm(t && t[r], o, r, e), h = n[++r]),
- s && (parentReferenceNode($.$elm$).insertBefore(s, referenceNode($.$elm$)) );
- }
- a > c ? addVnodes(e, null == n[p + 1] ? null : n[p + 1].$elm$, o, n, r, p) : r > p && removeVnodes(t, a, c);
- })(o, n, t, s) : null !== s ? (null !== e.$text$ && (o.textContent = ""),
- addVnodes(o, null, t, s, 0, s.length - 1)) : null !== n && removeVnodes(n, 0, n.length - 1),
- isSvgMode && "svg" === l && (isSvgMode = !1));
- }, updateFallbackSlotVisibility = e => {
- let t, o, n, s, l, a, r = e.childNodes;
- for (o = 0, n = r.length; o < n; o++) if (t = r[o], 1 === t.nodeType) {
- if (t["s-sr"]) for (l = t["s-sn"], t.hidden = !1, s = 0; s < n; s++) if (a = r[s].nodeType,
- r[s]["s-hn"] !== t["s-hn"] || "" !== l) {
- if (1 === a && l === r[s].getAttribute("slot")) {
- t.hidden = !0;
- break;
- }
- } else if (1 === a || 3 === a && "" !== r[s].textContent.trim()) {
- t.hidden = !0;
- break;
- }
- updateFallbackSlotVisibility(t);
- }
- }, relocateNodes = [], relocateSlotContent = e => {
- let t, o, n, s, l, a, r = 0, i = e.childNodes, d = i.length;
- for (;r < d; r++) {
- if (t = i[r], t["s-sr"] && (o = t["s-cr"]) && o.parentNode) for (n = o.parentNode.childNodes,
- s = t["s-sn"], a = n.length - 1; a >= 0; a--) o = n[a], o["s-cn"] || o["s-nr"] || o["s-hn"] === t["s-hn"] || (isNodeLocatedInSlot(o, s) ? (l = relocateNodes.find((e => e.$nodeToRelocate$ === o)),
- checkSlotFallbackVisibility = !0, o["s-sn"] = o["s-sn"] || s, l ? l.$slotRefNode$ = t : relocateNodes.push({
- $slotRefNode$: t,
- $nodeToRelocate$: o
- }), o["s-sr"] && relocateNodes.map((e => {
- isNodeLocatedInSlot(e.$nodeToRelocate$, o["s-sn"]) && (l = relocateNodes.find((e => e.$nodeToRelocate$ === o)),
- l && !e.$slotRefNode$ && (e.$slotRefNode$ = l.$slotRefNode$));
- }))) : relocateNodes.some((e => e.$nodeToRelocate$ === o)) || relocateNodes.push({
- $nodeToRelocate$: o
- }));
- 1 === t.nodeType && relocateSlotContent(t);
- }
- }, isNodeLocatedInSlot = (e, t) => 1 === e.nodeType ? null === e.getAttribute("slot") && "" === t || e.getAttribute("slot") === t : e["s-sn"] === t || "" === t, callNodeRefs = e => {
- (e.$attrs$ && e.$attrs$.ref && e.$attrs$.ref(null), e.$children$ && e.$children$.map(callNodeRefs));
- }, renderVdom = (e, t) => {
- const o = e.$hostElement$, n = e.$cmpMeta$, s = e.$vnode$ || newVNode(null, null), l = isHost(t) ? t : h(null, null, t);
- if (hostTagName = o.tagName, BUILD.isDev ) ;
- if (n.$attrsToReflect$ && (l.$attrs$ = l.$attrs$ || {}, n.$attrsToReflect$.map((([e, t]) => l.$attrs$[t] = o[e]))),
- l.$tag$ = null, l.$flags$ |= 4, e.$vnode$ = l, l.$elm$ = s.$elm$ = o.shadowRoot || o,
- (scopeId = o["s-sc"]), (contentRef = o["s-cr"],
- useNativeShadowDom = supportsShadow, checkSlotFallbackVisibility = !1), patch(s, l),
- BUILD.slotRelocation) {
- if (plt.$flags$ |= 1, checkSlotRelocate) {
- let e, t, o, n, s, a;
- relocateSlotContent(l.$elm$);
- let r = 0;
- for (;r < relocateNodes.length; r++) e = relocateNodes[r], t = e.$nodeToRelocate$,
- t["s-ol"] || (o = originalLocationDebugNode(t) ,
- o["s-nr"] = t, t.parentNode.insertBefore(t["s-ol"] = o, t));
- for (r = 0; r < relocateNodes.length; r++) if (e = relocateNodes[r], t = e.$nodeToRelocate$,
- e.$slotRefNode$) {
- for (n = e.$slotRefNode$.parentNode, s = e.$slotRefNode$.nextSibling, o = t["s-ol"]; o = o.previousSibling; ) if (a = o["s-nr"],
- a && a["s-sn"] === t["s-sn"] && n === a.parentNode && (a = a.nextSibling, !a || !a["s-nr"])) {
- s = a;
- break;
- }
- (!s && n !== t.parentNode || t.nextSibling !== s) && t !== s && (!t["s-hn"] && t["s-ol"] && (t["s-hn"] = t["s-ol"].parentNode.nodeName),
- n.insertBefore(t, s));
- } else 1 === t.nodeType && (t.hidden = !0);
- }
- checkSlotFallbackVisibility && updateFallbackSlotVisibility(l.$elm$), plt.$flags$ &= -2,
- relocateNodes.length = 0;
- }
- }, slotReferenceDebugNode = e => doc.createComment(`<slot${e.$name$ ? ' name="' + e.$name$ + '"' : ""}> (host=${hostTagName.toLowerCase()})`), originalLocationDebugNode = e => doc.createComment("org-location for " + (e.localName ? `<${e.localName}> (host=${e["s-hn"]})` : `[${e.textContent}]`)), getElement = e => getHostRef(e).$hostElement$ , createEvent = (e, t, o) => {
- const n = getElement(e);
- return {
- emit: e => (emitEvent(n, t, {
- bubbles: !!(4 & o),
- composed: !!(2 & o),
- cancelable: !!(1 & o),
- detail: e
- }))
- };
- }, emitEvent = (e, t, o) => {
- const n = plt.ce(t, o);
- return e.dispatchEvent(n), n;
- }, attachToAncestor = (e, t) => {
- t && !e.$onRenderResolve$ && t["s-p"] && t["s-p"].push(new Promise((t => e.$onRenderResolve$ = t)));
- }, scheduleUpdate = (e, t) => {
- if ((e.$flags$ |= 16), 4 & e.$flags$) return void (e.$flags$ |= 512);
- attachToAncestor(e, e.$ancestorComponent$);
- const o = () => dispatchHooks(e, t);
- return writeTask(o) ;
- }, dispatchHooks = (e, t) => {
- const n = createTime("scheduleUpdate", e.$cmpMeta$.$tagName$), s = e.$lazyInstance$ ;
- let l;
- return t ? ((e.$flags$ |= 256, e.$queuedListeners$ && (e.$queuedListeners$.map((([e, t]) => safeCall(s, e, t))),
- e.$queuedListeners$ = null)), (l = safeCall(s, "componentWillLoad"))) : (BUILD.cmpWillUpdate ), (l = then(l, (() => safeCall(s, "componentWillRender")))),
- n(), then(l, (() => updateComponent(e, s, t)));
- }, updateComponent = async (e, t, o) => {
- const n = e.$hostElement$, s = createTime("update", e.$cmpMeta$.$tagName$), l = n["s-rc"];
- o && attachStyles(e);
- const a = createTime("render", e.$cmpMeta$.$tagName$);
- if (await callRender(e, t) ,
- BUILD.hydrateServerSide) try {
- serverSideConnected(n), o && (1 & e.$cmpMeta$.$flags$ ? n["s-en"] = "" : 2 & e.$cmpMeta$.$flags$ && (n["s-en"] = "c"));
- } catch (e) {
- consoleError(e, n);
- }
- if (l && (l.map((e => e())), n["s-rc"] = void 0), a(), s(),
- BUILD.asyncLoading) {
- const t = n["s-p"], o = () => postUpdateComponent(e);
- 0 === t.length ? o() : (Promise.all(t).then(o), e.$flags$ |= 4, t.length = 0);
- }
- };
- const callRender = (e, t, o) => {
- try {
- if (t = t.render(), (e.$flags$ &= -17),
- (e.$flags$ |= 2), BUILD.hasRenderFn ) {
- return Promise.resolve(t).then((t => renderVdom(e, t)));
- }
- } catch (t) {
- consoleError(t, e.$hostElement$);
- }
- return null;
- }, postUpdateComponent = e => {
- const t = e.$cmpMeta$.$tagName$, o = e.$hostElement$, n = createTime("postUpdate", t), s = e.$lazyInstance$ , l = e.$ancestorComponent$;
- (safeCall(s, "componentDidRender"),
- BUILD.isDev ), 64 & e.$flags$ ? (n()) : (e.$flags$ |= 64, addHydratedFlag(o),
- (safeCall(s, "componentDidLoad"),
- BUILD.isDev ), n(), (e.$onReadyResolve$(o), l || appDidLoad())), e.$onInstanceResolve$(o), (e.$onRenderResolve$ && (e.$onRenderResolve$(),
- e.$onRenderResolve$ = void 0), 512 & e.$flags$ && nextTick((() => scheduleUpdate(e, !1))),
- e.$flags$ &= -517);
- }, forceUpdate$1 = e => {
- {
- const t = getHostRef(e), o = t.$hostElement$.isConnected;
- return o && 2 == (18 & t.$flags$) && scheduleUpdate(t, !1), o;
- }
- }, appDidLoad = e => {
- addHydratedFlag(doc.documentElement), nextTick((() => emitEvent(win, "appload", {
- detail: {
- namespace: NAMESPACE
- }
- }))), BUILD.profile ;
- }, safeCall = (e, t, o) => {
- if (e && e[t]) try {
- return e[t](o);
- } catch (e) {
- consoleError(e);
- }
- }, then = (e, t) => e && e.then ? e.then(t) : t(), addHydratedFlag = e => e.classList.add("calcite-hydrated") , serverSideConnected = e => {
- const t = e.children;
- if (null != t) for (let e = 0, o = t.length; e < o; e++) {
- const o = t[e];
- "function" == typeof o.connectedCallback && o.connectedCallback(), serverSideConnected(o);
- }
- }, clientHydrate = (e, t, o, n, s, l, a) => {
- let r, i, d, c;
- if (1 === l.nodeType) {
- for (r = l.getAttribute("c-id"), r && (i = r.split("."), i[0] !== a && "0" !== i[0] || (d = {
- $flags$: 0,
- $hostId$: i[0],
- $nodeId$: i[1],
- $depth$: i[2],
- $index$: i[3],
- $tag$: l.tagName.toLowerCase(),
- $elm$: l,
- $attrs$: null,
- $children$: null,
- $key$: null,
- $name$: null,
- $text$: null
- }, t.push(d), l.removeAttribute("c-id"), e.$children$ || (e.$children$ = []), e.$children$[d.$index$] = d,
- e = d, n && "0" === d.$depth$ && (n[d.$index$] = d.$elm$))), c = l.childNodes.length - 1; c >= 0; c--) clientHydrate(e, t, o, n, s, l.childNodes[c], a);
- if (l.shadowRoot) for (c = l.shadowRoot.childNodes.length - 1; c >= 0; c--) clientHydrate(e, t, o, n, s, l.shadowRoot.childNodes[c], a);
- } else if (8 === l.nodeType) i = l.nodeValue.split("."), i[1] !== a && "0" !== i[1] || (r = i[0],
- d = {
- $flags$: 0,
- $hostId$: i[1],
- $nodeId$: i[2],
- $depth$: i[3],
- $index$: i[4],
- $elm$: l,
- $attrs$: null,
- $children$: null,
- $key$: null,
- $name$: null,
- $tag$: null,
- $text$: null
- }, "t" === r ? (d.$elm$ = l.nextSibling, d.$elm$ && 3 === d.$elm$.nodeType && (d.$text$ = d.$elm$.textContent,
- t.push(d), l.remove(), e.$children$ || (e.$children$ = []), e.$children$[d.$index$] = d,
- n && "0" === d.$depth$ && (n[d.$index$] = d.$elm$))) : d.$hostId$ === a && ("s" === r ? (d.$tag$ = "slot",
- i[5] ? l["s-sn"] = d.$name$ = i[5] : l["s-sn"] = "", l["s-sr"] = !0, n && (d.$elm$ = doc.createElement(d.$tag$),
- d.$name$ && d.$elm$.setAttribute("name", d.$name$), l.parentNode.insertBefore(d.$elm$, l),
- l.remove(), "0" === d.$depth$ && (n[d.$index$] = d.$elm$)), o.push(d), e.$children$ || (e.$children$ = []),
- e.$children$[d.$index$] = d) : "r" === r && (n ? l.remove() : (s["s-cr"] = l,
- l["s-cn"] = !0)))); else if (e && "style" === e.$tag$) {
- const t = newVNode(null, l.textContent);
- t.$elm$ = l, t.$index$ = "0", e.$children$ = [ t ];
- }
- }, initializeDocumentHydrate = (e, t) => {
- if (1 === e.nodeType) {
- let o = 0;
- for (;o < e.childNodes.length; o++) initializeDocumentHydrate(e.childNodes[o], t);
- if (e.shadowRoot) for (o = 0; o < e.shadowRoot.childNodes.length; o++) initializeDocumentHydrate(e.shadowRoot.childNodes[o], t);
- } else if (8 === e.nodeType) {
- const o = e.nodeValue.split(".");
- "o" === o[0] && (t.set(o[1] + "." + o[2], e), e.nodeValue = "", e["s-en"] = o[3]);
- }
- }, parsePropertyValue = (e, t) => null == e || isComplexType(e) ? e : 4 & t ? "false" !== e && ("" === e || !!e) : 2 & t ? parseFloat(e) : 1 & t ? String(e) : e, getValue = (e, t) => getHostRef(e).$instanceValues$.get(t), setValue = (e, t, o, n) => {
- const s = getHostRef(e), l = s.$hostElement$ , a = s.$instanceValues$.get(t), r = s.$flags$, i = s.$lazyInstance$ ;
- o = parsePropertyValue(o, n.$members$[t][0]);
- const d = Number.isNaN(a) && Number.isNaN(o), c = o !== a && !d;
- if ((!(8 & r) || void 0 === a) && c && (s.$instanceValues$.set(t, o),
- i)) {
- if (n.$watchers$ && 128 & r) {
- const e = n.$watchers$[t];
- e && e.map((e => {
- try {
- i[e](o, a, t);
- } catch (e) {
- consoleError(e, l);
- }
- }));
- }
- if (2 == (18 & r)) {
- if (i.componentShouldUpdate && !1 === i.componentShouldUpdate(o, a, t)) return;
- scheduleUpdate(s, !1);
- }
- }
- }, proxyComponent = (e, t, o) => {
- if (t.$members$) {
- e.watchers && (t.$watchers$ = e.watchers);
- const n = Object.entries(t.$members$), s = e.prototype;
- if (n.map((([e, [n]]) => {
- (31 & n || (2 & o) && 32 & n) ? Object.defineProperty(s, e, {
- get() {
- return getValue(this, e);
- },
- set(s) {
- setValue(this, e, s, t);
- },
- configurable: !0,
- enumerable: !0
- }) : 1 & o && 64 & n && Object.defineProperty(s, e, {
- value(...t) {
- const o = getHostRef(this);
- return o.$onInstancePromise$.then((() => o.$lazyInstance$[e](...t)));
- }
- });
- })), (1 & o)) {
- const o = new Map;
- s.attributeChangedCallback = function(e, t, n) {
- plt.jmp((() => {
- const t = o.get(e);
- if (this.hasOwnProperty(t)) n = this[t], delete this[t]; else if (s.hasOwnProperty(t) && "number" == typeof this[t] && this[t] == n) return;
- this[t] = (null !== n || "boolean" != typeof this[t]) && n;
- }));
- }, e.observedAttributes = n.filter((([e, t]) => 15 & t[0])).map((([e, n]) => {
- const s = n[1] || e;
- return o.set(s, e), 512 & n[0] && t.$attrsToReflect$.push([ e, s ]),
- s;
- }));
- }
- }
- return e;
- }, initializeComponent = async (e, t, o, n, s) => {
- if (0 == (32 & t.$flags$)) {
- {
- if (t.$flags$ |= 32, (s = loadModule(o)).then) {
- const e = (() => {});
- s = await s, e();
- }
- !s.isProxied && ((o.$watchers$ = s.watchers),
- proxyComponent(s, o, 2), s.isProxied = !0);
- const e = createTime("createInstance", o.$tagName$);
- (t.$flags$ |= 8);
- try {
- new s(t);
- } catch (e) {
- consoleError(e);
- }
- (t.$flags$ &= -9), (t.$flags$ |= 128), e(),
- fireConnectedCallback(t.$lazyInstance$);
- }
- if (s.style) {
- let n = s.style;
- const l = getScopeId(o);
- if (!styles.has(l)) {
- const e = createTime("registerStyles", o.$tagName$);
- registerStyle(l, n), e();
- }
- }
- }
- const r = t.$ancestorComponent$, i = () => scheduleUpdate(t, !0);
- r && r["s-rc"] ? r["s-rc"].push(i) : i();
- }, fireConnectedCallback = e => {
- safeCall(e, "connectedCallback");
- }, connectedCallback = e => {
- if (0 == (1 & plt.$flags$)) {
- const t = getHostRef(e), o = t.$cmpMeta$, n = createTime("connectedCallback", o.$tagName$);
- if (1 & t.$flags$) addHostEventListeners(e, t, o.$listeners$), fireConnectedCallback(t.$lazyInstance$); else {
- let n;
- if (t.$flags$ |= 1, (n = e.getAttribute("s-id"), n)) {
- ((e, t, o, n) => {
- const s = createTime("hydrateClient", t), l = e.shadowRoot, a = [], r = l ? [] : null, i = n.$vnode$ = newVNode(t, null);
- plt.$orgLocNodes$ || initializeDocumentHydrate(doc.body, plt.$orgLocNodes$ = new Map),
- e["s-id"] = o, e.removeAttribute("s-id"), clientHydrate(i, a, [], r, e, e, o), a.map((e => {
- const o = e.$hostId$ + "." + e.$nodeId$, n = plt.$orgLocNodes$.get(o), s = e.$elm$;
- n && supportsShadow && "" === n["s-en"] && n.parentNode.insertBefore(s, n.nextSibling),
- l || (s["s-hn"] = t, n && (s["s-ol"] = n, s["s-ol"]["s-nr"] = s)), plt.$orgLocNodes$.delete(o);
- })), l && r.map((e => {
- e && l.appendChild(e);
- })), s();
- })(e, o.$tagName$, n, t);
- }
- if (!n && (BUILD.hydrateServerSide ) && setContentReference(e),
- BUILD.asyncLoading) {
- let o = e;
- for (;o = o.parentNode || o.host; ) if (1 === o.nodeType && o.hasAttribute("s-id") && o["s-p"] || o["s-p"]) {
- attachToAncestor(t, t.$ancestorComponent$ = o);
- break;
- }
- }
- initializeComponent(e, t, o);
- }
- n();
- }
- }, setContentReference = e => {
- const t = e["s-cr"] = doc.createComment("");
- t["s-cn"] = !0, e.insertBefore(t, e.firstChild);
- }, insertVdomAnnotations = (e, t) => {
- if (null != e) {
- const o = {
- hostIds: 0,
- rootLevelIds: 0,
- staticComponents: new Set(t)
- }, n = [];
- parseVNodeAnnotations(e, e.body, o, n), n.forEach((t => {
- if (null != t) {
- const n = t["s-nr"];
- let s = n["s-host-id"], l = n["s-node-id"], a = `${s}.${l}`;
- if (null == s) if (s = 0, o.rootLevelIds++, l = o.rootLevelIds, a = `${s}.${l}`,
- 1 === n.nodeType) n.setAttribute("c-id", a); else if (3 === n.nodeType) {
- if (0 === s && "" === n.nodeValue.trim()) return void t.remove();
- const o = e.createComment(a);
- o.nodeValue = `t.${a}`, n.parentNode.insertBefore(o, n);
- }
- let r = `o.${a}`;
- const i = t.parentElement;
- i && ("" === i["s-en"] ? r += "." : "c" === i["s-en"] && (r += ".c")), t.nodeValue = r;
- }
- }));
- }
- }, parseVNodeAnnotations = (e, t, o, n) => {
- null != t && (null != t["s-nr"] && n.push(t), 1 === t.nodeType && t.childNodes.forEach((t => {
- const s = getHostRef(t);
- if (null != s && !o.staticComponents.has(t.nodeName.toLowerCase())) {
- const n = {
- nodeIds: 0
- };
- insertVNodeAnnotations(e, t, s.$vnode$, o, n);
- }
- parseVNodeAnnotations(e, t, o, n);
- })));
- }, insertVNodeAnnotations = (e, t, o, n, s) => {
- if (null != o) {
- const l = ++n.hostIds;
- if (t.setAttribute("s-id", l), null != t["s-cr"] && (t["s-cr"].nodeValue = `r.${l}`),
- null != o.$children$) {
- const t = 0;
- o.$children$.forEach(((o, n) => {
- insertChildVNodeAnnotations(e, o, s, l, t, n);
- }));
- }
- if (t && o && o.$elm$ && !t.hasAttribute("c-id")) {
- const e = t.parentElement;
- if (e && e.childNodes) {
- const n = Array.from(e.childNodes), s = n.find((e => 8 === e.nodeType && e["s-sr"]));
- if (s) {
- const e = n.indexOf(t) - 1;
- o.$elm$.setAttribute("c-id", `${s["s-host-id"]}.${s["s-node-id"]}.0.${e}`);
- }
- }
- }
- }
- }, insertChildVNodeAnnotations = (e, t, o, n, s, l) => {
- const a = t.$elm$;
- if (null == a) return;
- const r = o.nodeIds++, i = `${n}.${r}.${s}.${l}`;
- if (a["s-host-id"] = n, a["s-node-id"] = r, 1 === a.nodeType) a.setAttribute("c-id", i); else if (3 === a.nodeType) {
- const t = a.parentNode, o = t.nodeName;
- if ("STYLE" !== o && "SCRIPT" !== o) {
- const o = `t.${i}`, n = e.createComment(o);
- t.insertBefore(n, a);
- }
- } else if (8 === a.nodeType && a["s-sr"]) {
- const e = `s.${i}.${a["s-sn"] || ""}`;
- a.nodeValue = e;
- }
- if (null != t.$children$) {
- const l = s + 1;
- t.$children$.forEach(((t, s) => {
- insertChildVNodeAnnotations(e, t, o, n, l, s);
- }));
- }
- }, Fragment = (e, t) => t, NO_HYDRATE_TAGS = new Set([ "CODE", "HEAD", "IFRAME", "INPUT", "OBJECT", "OUTPUT", "NOSCRIPT", "PRE", "SCRIPT", "SELECT", "STYLE", "TEMPLATE", "TEXTAREA" ]), hAsync = (e, t, ...o) => {
- if (Array.isArray(o) && o.length > 0) {
- const n = o.flat(1 / 0);
- return n.some(isPromise) ? Promise.all(n).then((o => h(e, t, ...o))).catch((o => h(e, t))) : h(e, t, ...o);
- }
- return h(e, t);
- };
- const cmpModules = new Map, getModule = e => {
- if ("string" == typeof e) {
- e = e.toLowerCase();
- const t = cmpModules.get(e);
- if (null != t) return t[e];
- }
- return null;
- }, loadModule = (e, t, o) => getModule(e.$tagName$), isMemberInElement = (e, t) => {
- if (null != e) {
- if (t in e) return !0;
- const o = getModule(e.nodeName);
- if (null != o) {
- const e = o;
- if (null != e && null != e.cmpMeta && null != e.cmpMeta.$members$) return t in e.cmpMeta.$members$;
- }
- }
- return !1;
- }, registerComponents = e => {
- for (const t of e) {
- const e = t.cmpMeta.$tagName$;
- cmpModules.set(e, {
- [e]: t
- });
- }
- }, win = window, doc = win.document, writeTask = e => {
- process.nextTick((() => {
- try {
- e();
- } catch (e) {
- consoleError(e);
- }
- }));
- }, resolved = Promise.resolve(), nextTick = e => resolved.then(e), defaultConsoleError = e => {
- null != e && console.error(e.stack || e.message || e);
- }, consoleError = (e, t) => (defaultConsoleError)(e, t), plt = {
- $flags$: 0,
- $resourcesUrl$: "",
- jmp: e => e(),
- raf: e => requestAnimationFrame(e),
- ael: (e, t, o, n) => e.addEventListener(t, o, n),
- rel: (e, t, o, n) => e.removeEventListener(t, o, n),
- ce: (e, t) => new win.CustomEvent(e, t)
- }, supportsShadow = !1, hostRefs = new WeakMap, getHostRef = e => hostRefs.get(e), registerInstance = (e, t) => hostRefs.set(t.$lazyInstance$ = e, t), registerHost = (e, t) => {
- const o = {
- $flags$: 0,
- $cmpMeta$: t,
- $hostElement$: e,
- $instanceValues$: new Map,
- $renderCount$: 0
- };
- return o.$onInstancePromise$ = new Promise((e => o.$onInstanceResolve$ = e)), o.$onReadyPromise$ = new Promise((e => o.$onReadyResolve$ = e)),
- e["s-p"] = [], e["s-rc"] = [], addHostEventListeners(e, o, t.$listeners$), hostRefs.set(e, o);
- }, styles = new Map;
- const accordionCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-accordion:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-accordion{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-accordion{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-accordion{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-accordion{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-accordion{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-accordion:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-accordion-h{display:none}/*!@:host([scale=s])*/[scale=s].sc-calcite-accordion-h{--calcite-accordion-item-spacing-unit:0.25rem;--calcite-accordion-icon-margin:0.5rem;--calcite-accordion-item-padding:var(--calcite-accordion-item-spacing-unit) 0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-accordion-h{--calcite-accordion-item-spacing-unit:0.5rem;--calcite-accordion-icon-margin:0.75rem;--calcite-accordion-item-padding:var(--calcite-accordion-item-spacing-unit) 0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-accordion-h{--calcite-accordion-item-spacing-unit:0.75rem;--calcite-accordion-icon-margin:1rem;--calcite-accordion-item-padding:var(--calcite-accordion-item-spacing-unit) 1rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host*/.sc-calcite-accordion-h{position:relative;display:block;max-width:100%;line-height:1.5rem;--calcite-accordion-item-border:var(--calcite-ui-border-2);--calcite-accordion-item-background:var(--calcite-ui-foreground-1)}/*!@.accordion--transparent*/.accordion--transparent.sc-calcite-accordion{--calcite-accordion-item-border:transparent;--calcite-accordion-item-background:transparent}/*!@.accordion--minimal*/.accordion--minimal.sc-calcite-accordion{--calcite-accordion-item-padding:var(--calcite-accordion-item-spacing-unit) 0}/*!@.accordion*/.accordion.sc-calcite-accordion{border-width:1px;border-bottom-width:0px;border-style:solid;border-color:var(--calcite-ui-border-2)}";
- /**
- * @slot - A slot for adding `calcite-accordion-item`s. `calcite-accordion` cannot be nested, however calcite-accordion-item`s can.
- */
- class Accordion {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteAccordionChange = createEvent(this, "calciteAccordionChange", 7);
- //--------------------------------------------------------------------------
- //
- // Public Properties
- //
- //--------------------------------------------------------------------------
- /** specify the appearance - default (containing border), or minimal (no containing border), defaults to default */
- this.appearance = "default";
- /** specify the placement of the icon in the header, defaults to end */
- this.iconPosition = "end";
- /** specify the type of the icon in the header, defaults to chevron */
- this.iconType = "chevron";
- /** specify the scale of accordion, defaults to m */
- this.scale = "m";
- /** specify the selection mode - multi (allow any number of open items), single (allow one open item),
- * or single-persist (allow and require one open item), defaults to multi */
- this.selectionMode = "multi";
- //--------------------------------------------------------------------------
- //
- // Private State/Props
- //
- //--------------------------------------------------------------------------
- /** created list of Accordion items */
- this.items = [];
- /** keep track of whether the items have been sorted so we don't re-sort */
- this.sorted = false;
- this.sortItems = (items) => items.sort((a, b) => a.position - b.position).map((a) => a.item);
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentDidLoad() {
- if (!this.sorted) {
- this.items = this.sortItems(this.items);
- this.sorted = true;
- }
- }
- render() {
- return (hAsync("div", { class: {
- "accordion--transparent": this.appearance === "transparent",
- "accordion--minimal": this.appearance === "minimal",
- accordion: this.appearance === "default"
- } }, hAsync("slot", null)));
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- calciteAccordionItemKeyEvent(e) {
- const item = e.detail.item;
- const parent = e.detail.parent;
- if (this.el === parent) {
- const key = item.key;
- const itemToFocus = e.target;
- const isFirstItem = this.itemIndex(itemToFocus) === 0;
- const isLastItem = this.itemIndex(itemToFocus) === this.items.length - 1;
- switch (key) {
- case "ArrowDown":
- if (isLastItem) {
- this.focusFirstItem();
- }
- else {
- this.focusNextItem(itemToFocus);
- }
- break;
- case "ArrowUp":
- if (isFirstItem) {
- this.focusLastItem();
- }
- else {
- this.focusPrevItem(itemToFocus);
- }
- break;
- case "Home":
- this.focusFirstItem();
- break;
- case "End":
- this.focusLastItem();
- break;
- }
- }
- }
- registerCalciteAccordionItem(e) {
- const item = {
- item: e.target,
- parent: e.detail.parent,
- position: e.detail.position
- };
- if (this.el === item.parent) {
- this.items.push(item);
- }
- }
- updateActiveItemOnChange(event) {
- this.requestedAccordionItem = event.detail.requestedAccordionItem;
- this.calciteAccordionChange.emit({
- requestedAccordionItem: this.requestedAccordionItem
- });
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- focusFirstItem() {
- const firstItem = this.items[0];
- this.focusElement(firstItem);
- }
- focusLastItem() {
- const lastItem = this.items[this.items.length - 1];
- this.focusElement(lastItem);
- }
- focusNextItem(e) {
- const index = this.itemIndex(e);
- const nextItem = this.items[index + 1] || this.items[0];
- this.focusElement(nextItem);
- }
- focusPrevItem(e) {
- const index = this.itemIndex(e);
- const prevItem = this.items[index - 1] || this.items[this.items.length - 1];
- this.focusElement(prevItem);
- }
- itemIndex(e) {
- return this.items.indexOf(e);
- }
- focusElement(item) {
- const target = item;
- target.focus();
- }
- get el() { return getElement(this); }
- static get style() { return accordionCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-accordion",
- "$members$": {
- "appearance": [513],
- "iconPosition": [513, "icon-position"],
- "iconType": [513, "icon-type"],
- "scale": [513],
- "selectionMode": [513, "selection-mode"]
- },
- "$listeners$": [[0, "calciteAccordionItemKeyEvent", "calciteAccordionItemKeyEvent"], [0, "calciteAccordionItemRegister", "registerCalciteAccordionItem"], [0, "calciteAccordionItemSelect", "updateActiveItemOnChange"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["appearance", "appearance"], ["iconPosition", "icon-position"], ["iconType", "icon-type"], ["scale", "scale"], ["selectionMode", "selection-mode"]]
- }; }
- }
- const autoTheme = "calcite-theme-auto";
- const darkTheme = "calcite-theme-dark";
- const lightTheme = "calcite-theme-light";
- const CSS_UTILITY = {
- autoTheme,
- darkTheme,
- lightTheme,
- rtl: "calcite--rtl"
- };
- const TEXT$s = {
- loading: "Loading"
- };
- function gen(counts) {
- return counts
- .map((count) => {
- let out = "";
- for (let i = 0; i < count; i++) {
- out += (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
- }
- return out;
- })
- .join("-");
- }
- const guid = () => gen([2, 1, 1, 1, 3]);
- /**
- * This helper will guarantee an ID on the provided element.
- *
- * If it already has an ID, it will be preserved, otherwise a unique one will be generated and assigned.
- *
- * @returns {string} The element's ID.
- */
- function ensureId(el) {
- if (!el) {
- return "";
- }
- return (el.id = el.id || `${el.tagName.toLowerCase()}-${guid()}`);
- }
- function nodeListToArray(nodeList) {
- return Array.isArray(nodeList) ? nodeList : Array.from(nodeList);
- }
- function getThemeName(el) {
- const closestElWithTheme = closestElementCrossShadowBoundary(el, `.${CSS_UTILITY.darkTheme}, .${CSS_UTILITY.lightTheme}`);
- return (closestElWithTheme === null || closestElWithTheme === void 0 ? void 0 : closestElWithTheme.classList.contains("calcite-theme-dark")) ? "dark" : "light";
- }
- function getElementDir(el) {
- const prop = "dir";
- const selector = `[${prop}]`;
- const closest = closestElementCrossShadowBoundary(el, selector);
- return closest ? closest.getAttribute(prop) : "ltr";
- }
- function getElementProp(el, prop, fallbackValue) {
- const selector = `[${prop}]`;
- const closest = el.closest(selector);
- return closest ? closest.getAttribute(prop) : fallbackValue;
- }
- function getRootNode(el) {
- return el.getRootNode();
- }
- function getHost(root) {
- return root.host || null;
- }
- /**
- * This helper queries an element's rootNodes and any ancestor rootNodes.
- *
- * @returns {Element[]} The elements.
- */
- function queryElementsRoots(element, selector) {
- // Gets the rootNode and any ancestor rootNodes (shadowRoot or document) of an element and queries them for a selector.
- // Based on: https://stackoverflow.com/q/54520554/194216
- function queryFromAll(el, allResults) {
- if (!el) {
- return allResults;
- }
- if (el.assignedSlot) {
- el = el.assignedSlot;
- }
- const rootNode = getRootNode(el);
- const results = Array.from(rootNode.querySelectorAll(selector));
- const uniqueResults = results.filter((result) => !allResults.includes(result));
- allResults = [...allResults, ...uniqueResults];
- const host = getHost(rootNode);
- return host ? queryFromAll(host, allResults) : allResults;
- }
- return queryFromAll(element, []);
- }
- /**
- * This helper queries an element's rootNode and any ancestor rootNodes.
- *
- * If both an 'id' and 'selector' are supplied, 'id' will take precedence over 'selector'.
- *
- * @returns {Element} The element.
- */
- function queryElementRoots(element, { selector, id }) {
- // Gets the rootNode and any ancestor rootNodes (shadowRoot or document) of an element and queries them for a selector.
- // Based on: https://stackoverflow.com/q/54520554/194216
- function queryFrom(el) {
- if (!el) {
- return null;
- }
- if (el.assignedSlot) {
- el = el.assignedSlot;
- }
- const rootNode = getRootNode(el);
- const found = id
- ? "getElementById" in rootNode
- ? /*
- Check to make sure 'getElementById' exists in cases where element is no longer connected to the DOM and getRootNode() returns the element.
- https://github.com/Esri/calcite-components/pull/4280
- */
- rootNode.getElementById(id)
- : null
- : selector
- ? rootNode.querySelector(selector)
- : null;
- const host = getHost(rootNode);
- return found ? found : host ? queryFrom(host) : null;
- }
- return queryFrom(element);
- }
- function closestElementCrossShadowBoundary(element, selector) {
- // based on https://stackoverflow.com/q/54520554/194216
- function closestFrom(el) {
- return el ? el.closest(selector) || closestFrom(getHost(getRootNode(el))) : null;
- }
- return closestFrom(element);
- }
- function isCalciteFocusable(el) {
- return typeof (el === null || el === void 0 ? void 0 : el.setFocus) === "function";
- }
- async function focusElement(el) {
- if (!el) {
- return;
- }
- return isCalciteFocusable(el) ? el.setFocus() : el.focus();
- }
- const defaultSlotSelector = ":not([slot])";
- function getSlotted(element, slotName, options) {
- if (slotName && !Array.isArray(slotName) && typeof slotName !== "string") {
- options = slotName;
- slotName = null;
- }
- const slotSelector = slotName
- ? Array.isArray(slotName)
- ? slotName.map((name) => `[slot="${name}"]`).join(",")
- : `[slot="${slotName}"]`
- : defaultSlotSelector;
- if (options === null || options === void 0 ? void 0 : options.all) {
- return queryMultiple(element, slotSelector, options);
- }
- return querySingle(element, slotSelector, options);
- }
- function getDirectChildren(el, selector) {
- return el ? Array.from(el.children || []).filter((child) => child === null || child === void 0 ? void 0 : child.matches(selector)) : [];
- }
- function queryMultiple(element, slotSelector, options) {
- let matches = slotSelector === defaultSlotSelector
- ? getDirectChildren(element, defaultSlotSelector)
- : Array.from(element.querySelectorAll(slotSelector));
- matches = options && options.direct === false ? matches : matches.filter((el) => el.parentElement === element);
- matches = (options === null || options === void 0 ? void 0 : options.matches) ? matches.filter((el) => el === null || el === void 0 ? void 0 : el.matches(options.matches)) : matches;
- const selector = options === null || options === void 0 ? void 0 : options.selector;
- return selector
- ? matches
- .map((item) => Array.from(item.querySelectorAll(selector)))
- .reduce((previousValue, currentValue) => [...previousValue, ...currentValue], [])
- .filter((match) => !!match)
- : matches;
- }
- function querySingle(element, slotSelector, options) {
- let match = slotSelector === defaultSlotSelector
- ? getDirectChildren(element, defaultSlotSelector)[0] || null
- : element.querySelector(slotSelector);
- match = options && options.direct === false ? match : (match === null || match === void 0 ? void 0 : match.parentElement) === element ? match : null;
- match = (options === null || options === void 0 ? void 0 : options.matches) ? ((match === null || match === void 0 ? void 0 : match.matches(options.matches)) ? match : null) : match;
- const selector = options === null || options === void 0 ? void 0 : options.selector;
- return selector ? match === null || match === void 0 ? void 0 : match.querySelector(selector) : match;
- }
- function filterDirectChildren(el, selector) {
- return Array.from(el.children).filter((child) => child.matches(selector));
- }
- // set a default icon from a defined set or allow an override with an icon name string
- function setRequestedIcon(iconObject, iconValue, matchedValue) {
- if (typeof iconValue === "string" && iconValue !== "") {
- return iconValue;
- }
- else if (iconValue === "") {
- return iconObject[matchedValue];
- }
- }
- function intersects(rect1, rect2) {
- return !(rect2.left > rect1.right ||
- rect2.right < rect1.left ||
- rect2.top > rect1.bottom ||
- rect2.bottom < rect1.top);
- }
- /**
- * This helper makes sure that boolean aria attributes are properly converted to a string.
- *
- * It should only be used for aria attributes that require a string value of "true" or "false".
- *
- * @returns {string} The string conversion of a boolean value ("true" | "false").
- */
- function toAriaBoolean(value) {
- return (!!value).toString();
- }
- const accordionItemCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-accordion-item:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-accordion-item{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-accordion-item{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-accordion-item{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-accordion-item{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-accordion-item{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-accordion-item:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-accordion-item-h{display:none}/*!@.icon-position--end, .icon-position--start*/.icon-position--end.sc-calcite-accordion-item,.icon-position--start.sc-calcite-accordion-item{--calcite-accordion-item-icon-rotation:calc(90deg * -1);--calcite-accordion-item-active-icon-rotation:0deg;--calcite-accordion-item-icon-rotation-rtl:90deg;--calcite-accordion-item-active-icon-rotation-rtl:0deg}/*!@.icon-position--start*/.icon-position--start.sc-calcite-accordion-item{--calcite-accordion-item-flex-direction:row-reverse;--calcite-accordion-item-icon-spacing-start:0;--calcite-accordion-item-icon-spacing-end:var(--calcite-accordion-icon-margin)}/*!@.icon-position--end*/.icon-position--end.sc-calcite-accordion-item{--calcite-accordion-item-flex-direction:row;--calcite-accordion-item-icon-spacing-start:var(--calcite-accordion-icon-margin);--calcite-accordion-item-icon-spacing-end:0}/*!@.icon-position--end:not(.icon-type--plus-minus)*/.icon-position--end.sc-calcite-accordion-item:not(.icon-type--plus-minus){--calcite-accordion-item-icon-rotation:0deg;--calcite-accordion-item-active-icon-rotation:180deg;--calcite-accordion-item-icon-rotation-rtl:0deg;--calcite-accordion-item-active-icon-rotation-rtl:calc(180deg * -1)}/*!@:host*/.sc-calcite-accordion-item-h{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;color:var(--calcite-ui-text-3);-webkit-text-decoration-line:none;text-decoration-line:none;outline:2px solid transparent;outline-offset:2px;background-color:var(--calcite-accordion-item-background, var(--calcite-ui-foreground-1))}/*!@:host .accordion-item-header*/.sc-calcite-accordion-item-h .accordion-item-header.sc-calcite-accordion-item{outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@:host(:focus) .accordion-item-header*/.sc-calcite-accordion-item-h:focus .accordion-item-header.sc-calcite-accordion-item{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@:host([active])*/[active].sc-calcite-accordion-item-h{color:var(--calcite-ui-text-1)}/*!@:host([active]) .accordion-item-content*/[active].sc-calcite-accordion-item-h .accordion-item-content.sc-calcite-accordion-item{display:block;color:var(--calcite-ui-text-1)}/*!@:host([active]) .accordion-item-header*/[active].sc-calcite-accordion-item-h .accordion-item-header.sc-calcite-accordion-item{border-bottom-color:transparent}/*!@:host .accordion-item-header*/.sc-calcite-accordion-item-h .accordion-item-header.sc-calcite-accordion-item{display:-ms-flexbox;display:flex;cursor:pointer;-ms-flex-align:center;align-items:center;-ms-flex-direction:var(--calcite-accordion-item-flex-direction);flex-direction:var(--calcite-accordion-item-flex-direction)}/*!@:host .accordion-item-icon*/.sc-calcite-accordion-item-h .accordion-item-icon.sc-calcite-accordion-item{position:relative;margin:0px;display:-ms-inline-flexbox;display:inline-flex;color:var(--calcite-ui-text-3);-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-margin-end:var(--calcite-accordion-item-icon-spacing-start);margin-inline-end:var(--calcite-accordion-item-icon-spacing-start);-webkit-margin-start:var(--calcite-accordion-item-icon-spacing-end);margin-inline-start:var(--calcite-accordion-item-icon-spacing-end)}/*!@:host .accordion-item-content,\n:host .accordion-item-header*/.sc-calcite-accordion-item-h .accordion-item-content.sc-calcite-accordion-item,.sc-calcite-accordion-item-h .accordion-item-header.sc-calcite-accordion-item{padding:var(--calcite-accordion-item-padding);border-bottom:1px solid var(--calcite-accordion-item-border, var(--calcite-ui-border-2))}/*!@:host .accordion-item-header **/.sc-calcite-accordion-item-h .accordion-item-header.sc-calcite-accordion-item *.sc-calcite-accordion-item{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}/*!@:host .accordion-item-content*/.sc-calcite-accordion-item-h .accordion-item-content.sc-calcite-accordion-item{display:none;padding-top:0px;color:var(--calcite-ui-text-3);text-align:initial}/*!@:host .accordion-item-expand-icon*/.sc-calcite-accordion-item-h .accordion-item-expand-icon.sc-calcite-accordion-item{color:var(--calcite-ui-text-3);-webkit-margin-start:var(--calcite-accordion-item-icon-spacing-start);margin-inline-start:var(--calcite-accordion-item-icon-spacing-start);-webkit-margin-end:var(--calcite-accordion-item-icon-spacing-end);margin-inline-end:var(--calcite-accordion-item-icon-spacing-end);-webkit-transform:rotate(var(--calcite-accordion-item-icon-rotation));transform:rotate(var(--calcite-accordion-item-icon-rotation))}/*!@.calcite--rtl .accordion-item-expand-icon*/.calcite--rtl.sc-calcite-accordion-item .accordion-item-expand-icon.sc-calcite-accordion-item{-webkit-transform:rotate(var(--calcite-accordion-item-icon-rotation-rtl));transform:rotate(var(--calcite-accordion-item-icon-rotation-rtl))}/*!@:host([active]) .accordion-item-expand-icon*/[active].sc-calcite-accordion-item-h .accordion-item-expand-icon.sc-calcite-accordion-item{color:var(--calcite-ui-text-1);-webkit-transform:rotate(var(--calcite-accordion-item-active-icon-rotation));transform:rotate(var(--calcite-accordion-item-active-icon-rotation))}/*!@:host([active]) .calcite--rtl .accordion-item-expand-icon*/[active].sc-calcite-accordion-item-h .calcite--rtl.sc-calcite-accordion-item .accordion-item-expand-icon.sc-calcite-accordion-item{-webkit-transform:rotate(var(--calcite-accordion-item-active-icon-rotation-rtl));transform:rotate(var(--calcite-accordion-item-active-icon-rotation-rtl))}/*!@:host .accordion-item-header-text*/.sc-calcite-accordion-item-h .accordion-item-header-text.sc-calcite-accordion-item{margin-top:0px;margin-bottom:0px;-ms-flex-positive:1;flex-grow:1;-ms-flex-direction:column;flex-direction:column;padding-top:0px;padding-bottom:0px;text-align:initial;-webkit-margin-end:auto;margin-inline-end:auto}/*!@:host .accordion-item-title, :host .accordion-item-subtitle*/.sc-calcite-accordion-item-h .accordion-item-title.sc-calcite-accordion-item,.sc-calcite-accordion-item-h .accordion-item-subtitle.sc-calcite-accordion-item{display:-ms-flexbox;display:flex;width:100%}/*!@:host .accordion-item-title*/.sc-calcite-accordion-item-h .accordion-item-title.sc-calcite-accordion-item{font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-2)}/*!@:host .accordion-item-subtitle*/.sc-calcite-accordion-item-h .accordion-item-subtitle.sc-calcite-accordion-item{margin-top:0.25rem;color:var(--calcite-ui-text-3)}/*!@:host(:focus) .accordion-item-title, :host(:hover) .accordion-item-title*/.sc-calcite-accordion-item-h:focus .accordion-item-title.sc-calcite-accordion-item,.sc-calcite-accordion-item-h:hover .accordion-item-title.sc-calcite-accordion-item{color:var(--calcite-ui-text-1)}/*!@:host(:focus) .accordion-item-icon, :host(:hover) .accordion-item-icon*/.sc-calcite-accordion-item-h:focus .accordion-item-icon.sc-calcite-accordion-item,.sc-calcite-accordion-item-h:hover .accordion-item-icon.sc-calcite-accordion-item{color:var(--calcite-ui-text-1)}/*!@:host(:focus) .accordion-item-expand-icon, :host(:hover) .accordion-item-expand-icon*/.sc-calcite-accordion-item-h:focus .accordion-item-expand-icon.sc-calcite-accordion-item,.sc-calcite-accordion-item-h:hover .accordion-item-expand-icon.sc-calcite-accordion-item{color:var(--calcite-ui-text-1)}/*!@:host(:focus) .accordion-item-subtitle, :host(:hover) .accordion-item-subtitle*/.sc-calcite-accordion-item-h:focus .accordion-item-subtitle.sc-calcite-accordion-item,.sc-calcite-accordion-item-h:hover .accordion-item-subtitle.sc-calcite-accordion-item{color:var(--calcite-ui-text-2)}/*!@:host(:focus) .accordion-item-title, :host(:active) .accordion-item-title, :host([active]) .accordion-item-title*/.sc-calcite-accordion-item-h:focus .accordion-item-title.sc-calcite-accordion-item,.sc-calcite-accordion-item-h:active .accordion-item-title.sc-calcite-accordion-item,[active].sc-calcite-accordion-item-h .accordion-item-title.sc-calcite-accordion-item{color:var(--calcite-ui-text-1)}/*!@:host(:focus) .accordion-item-icon, :host(:active) .accordion-item-icon, :host([active]) .accordion-item-icon*/.sc-calcite-accordion-item-h:focus .accordion-item-icon.sc-calcite-accordion-item,.sc-calcite-accordion-item-h:active .accordion-item-icon.sc-calcite-accordion-item,[active].sc-calcite-accordion-item-h .accordion-item-icon.sc-calcite-accordion-item{color:var(--calcite-ui-text-1)}/*!@:host(:focus) .accordion-item-expand-icon, :host(:active) .accordion-item-expand-icon, :host([active]) .accordion-item-expand-icon*/.sc-calcite-accordion-item-h:focus .accordion-item-expand-icon.sc-calcite-accordion-item,.sc-calcite-accordion-item-h:active .accordion-item-expand-icon.sc-calcite-accordion-item,[active].sc-calcite-accordion-item-h .accordion-item-expand-icon.sc-calcite-accordion-item{color:var(--calcite-ui-text-1)}/*!@:host(:focus) .accordion-item-subtitle, :host(:active) .accordion-item-subtitle, :host([active]) .accordion-item-subtitle*/.sc-calcite-accordion-item-h:focus .accordion-item-subtitle.sc-calcite-accordion-item,.sc-calcite-accordion-item-h:active .accordion-item-subtitle.sc-calcite-accordion-item,[active].sc-calcite-accordion-item-h .accordion-item-subtitle.sc-calcite-accordion-item{color:var(--calcite-ui-text-2)}";
- /**
- * @slot - A slot for adding custom content, including nested `calcite-accordion-item`s.
- */
- class AccordionItem {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteAccordionItemKeyEvent = createEvent(this, "calciteAccordionItemKeyEvent", 7);
- this.calciteAccordionItemSelect = createEvent(this, "calciteAccordionItemSelect", 7);
- this.calciteAccordionItemClose = createEvent(this, "calciteAccordionItemClose", 7);
- this.calciteAccordionItemRegister = createEvent(this, "calciteAccordionItemRegister", 7);
- //--------------------------------------------------------------------------
- //
- // Public Properties
- //
- //--------------------------------------------------------------------------
- /** Indicates whether the item is active. */
- this.active = false;
- //--------------------------------------------------------------------------
- //
- // Private State/Props
- //
- //--------------------------------------------------------------------------
- this.guid = guid();
- /** what icon position does the parent accordion specify */
- this.iconPosition = "end";
- /** handle clicks on item header */
- this.itemHeaderClickHandler = () => this.emitRequestedItem();
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- this.parent = this.el.parentElement;
- this.selectionMode = getElementProp(this.el, "selection-mode", "multi");
- this.iconType = getElementProp(this.el, "icon-type", "chevron");
- this.iconPosition = getElementProp(this.el, "icon-position", this.iconPosition);
- }
- componentDidLoad() {
- this.itemPosition = this.getItemPosition();
- this.calciteAccordionItemRegister.emit({
- parent: this.parent,
- position: this.itemPosition
- });
- }
- render() {
- const dir = getElementDir(this.el);
- const iconEl = hAsync("calcite-icon", { class: "accordion-item-icon", icon: this.icon, scale: "s" });
- const { guid } = this;
- const regionId = `${guid}-region`;
- const buttonId = `${guid}-button`;
- return (hAsync(Host, { tabindex: "0" }, hAsync("div", { class: {
- [`icon-position--${this.iconPosition}`]: true,
- [`icon-type--${this.iconType}`]: true
- } }, hAsync("div", { "aria-controls": regionId, class: { "accordion-item-header": true, [CSS_UTILITY.rtl]: dir === "rtl" }, id: buttonId, onClick: this.itemHeaderClickHandler, role: "button" }, this.icon ? iconEl : null, hAsync("div", { class: "accordion-item-header-text" }, hAsync("span", { class: "accordion-item-title" }, this.itemTitle), this.itemSubtitle ? (hAsync("span", { class: "accordion-item-subtitle" }, this.itemSubtitle)) : null), hAsync("calcite-icon", { class: "accordion-item-expand-icon", icon: this.iconType === "chevron"
- ? "chevronDown"
- : this.iconType === "caret"
- ? "caretDown"
- : this.active
- ? "minus"
- : "plus", scale: "s" })), hAsync("div", { "aria-expanded": toAriaBoolean(this.active), "aria-labelledby": buttonId, class: "accordion-item-content", id: regionId, role: "region" }, hAsync("slot", null)))));
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- keyDownHandler(e) {
- if (e.target === this.el) {
- switch (e.key) {
- case " ":
- case "Enter":
- this.emitRequestedItem();
- e.preventDefault();
- break;
- case "ArrowUp":
- case "ArrowDown":
- case "Home":
- case "End":
- this.calciteAccordionItemKeyEvent.emit({
- parent: this.parent,
- item: e
- });
- e.preventDefault();
- break;
- }
- }
- }
- updateActiveItemOnChange(event) {
- this.requestedAccordionItem = event.detail
- .requestedAccordionItem;
- if (this.el.parentNode !== this.requestedAccordionItem.parentNode) {
- return;
- }
- this.determineActiveItem();
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- determineActiveItem() {
- switch (this.selectionMode) {
- case "multi":
- if (this.el === this.requestedAccordionItem) {
- this.active = !this.active;
- }
- break;
- case "single":
- this.active = this.el === this.requestedAccordionItem ? !this.active : false;
- break;
- case "single-persist":
- this.active = this.el === this.requestedAccordionItem;
- break;
- }
- }
- emitRequestedItem() {
- this.calciteAccordionItemSelect.emit({
- requestedAccordionItem: this.el
- });
- }
- getItemPosition() {
- return Array.prototype.indexOf.call(this.parent.querySelectorAll("calcite-accordion-item"), this.el);
- }
- get el() { return getElement(this); }
- static get style() { return accordionItemCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-accordion-item",
- "$members$": {
- "active": [1540],
- "itemTitle": [1, "item-title"],
- "itemSubtitle": [1, "item-subtitle"],
- "icon": [513]
- },
- "$listeners$": [[0, "keydown", "keyDownHandler"], [16, "calciteAccordionChange", "updateActiveItemOnChange"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["active", "active"], ["icon", "icon"]]
- }; }
- }
- const CSS$P = {
- button: "button",
- buttonTextVisible: "button--text-visible",
- buttonCompact: "button--compact",
- iconContainer: "icon-container",
- slotContainer: "slot-container",
- slotContainerHidden: "slot-container--hidden",
- textContainer: "text-container",
- textContainerVisible: "text-container--visible"
- };
- const TEXT$r = {
- loading: "Loading"
- };
- /**
- * This utility ensures observers are created only for browser contexts.
- *
- * @param type - the type of observer to create
- * @param callback - the observer callback
- * @param options - the observer options
- */
- function createObserver(type, callback, options) {
- return undefined;
- }
- function noopClick() {
- /** noop **/
- }
- /**
- * This helper updates the host element to prevent keyboard interaction on its subtree and sets the appropriate aria attribute for accessibility.
- *
- * This should be used in the `componentDidRender` lifecycle hook.
- *
- * **Notes**
- *
- * * this util is not needed for simple components whose root element or elements are an interactive component (custom element or native control). For those cases, set the `disabled` props on the root components instead.
- * * technically, users can override `tabindex` and restore keyboard navigation, but this will be considered user error
- */
- function updateHostInteraction(component, hostIsTabbable = false) {
- if (component.disabled) {
- component.el.setAttribute("tabindex", "-1");
- component.el.setAttribute("aria-disabled", "true");
- if (component.el.contains(document.activeElement)) {
- document.activeElement.blur();
- }
- component.el.click = noopClick;
- return;
- }
- component.el.click = HTMLElement.prototype.click;
- if (typeof hostIsTabbable === "function") {
- component.el.setAttribute("tabindex", hostIsTabbable.call(component) ? "0" : "-1");
- }
- else if (hostIsTabbable === true) {
- component.el.setAttribute("tabindex", "0");
- }
- else if (hostIsTabbable === false) {
- component.el.removeAttribute("tabindex");
- }
- else ;
- component.el.removeAttribute("aria-disabled");
- }
- const actionCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-action:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-action{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-action{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-action{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-action{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-action{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:host*/.sc-calcite-action-h{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}/*!@:host **/.sc-calcite-action-h *.sc-calcite-action{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:root*/.sc-calcite-action:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-action-h{display:none}/*!@:host*/.sc-calcite-action-h{display:-ms-flexbox;display:flex;background-color:transparent}/*!@:host([disabled])*/[disabled].sc-calcite-action-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-action-h[disabled] .sc-calcite-action-s>[calcite-hydrated][disabled],[disabled].sc-calcite-action-h [calcite-hydrated][disabled].sc-calcite-action{opacity:1}/*!@.button*/.button.sc-calcite-action{position:relative;margin:0px;display:-ms-flexbox;display:flex;width:auto;cursor:pointer;-ms-flex-align:center;align-items:center;-ms-flex-pack:start;justify-content:flex-start;border-style:none;background-color:var(--calcite-ui-foreground-1);fill:var(--calcite-ui-text-3);font-family:var(--calcite-sans-family);font-size:var(--calcite-font-size--2);line-height:1rem;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-3);outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;text-align:unset;-ms-flex:1 0 auto;flex:1 0 auto}/*!@.button:hover*/.button.sc-calcite-action:hover{background-color:var(--calcite-ui-foreground-2);fill:var(--calcite-ui-text-1);color:var(--calcite-ui-text-1)}/*!@.button:focus*/.button.sc-calcite-action:focus{background-color:var(--calcite-ui-foreground-2);fill:var(--calcite-ui-text-1);color:var(--calcite-ui-text-1);outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@.button:active*/.button.sc-calcite-action:active{background-color:var(--calcite-ui-foreground-3)}/*!@.button .icon-container*/.button.sc-calcite-action .icon-container.sc-calcite-action{pointer-events:none;margin:0px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:1rem;min-height:1rem}/*!@.button .text-container*/.button.sc-calcite-action .text-container.sc-calcite-action{margin:0px;width:0px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1rem;opacity:0;-webkit-transition-property:opacity;transition-property:opacity;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-property:margin;transition-property:margin;-webkit-transition-property:width;transition-property:width}/*!@.button .text-container--visible*/.button.sc-calcite-action .text-container--visible.sc-calcite-action{width:auto;-ms-flex:1 1 auto;flex:1 1 auto;opacity:1}/*!@:host([scale=s]) .button*/[scale=s].sc-calcite-action-h .button.sc-calcite-action{padding:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem;font-weight:var(--calcite-font-weight-normal)}/*!@:host([scale=s]) .button--text-visible .icon-container*/[scale=s].sc-calcite-action-h .button--text-visible.sc-calcite-action .icon-container.sc-calcite-action{-webkit-margin-end:0.5rem;margin-inline-end:0.5rem}/*!@:host([scale=m]) .button*/[scale=m].sc-calcite-action-h .button.sc-calcite-action{padding:1rem;font-size:var(--calcite-font-size--1);line-height:1rem;font-weight:var(--calcite-font-weight-normal)}/*!@:host([scale=m]) .button--text-visible .icon-container*/[scale=m].sc-calcite-action-h .button--text-visible.sc-calcite-action .icon-container.sc-calcite-action{-webkit-margin-end:0.75rem;margin-inline-end:0.75rem}/*!@:host([scale=l]) .button*/[scale=l].sc-calcite-action-h .button.sc-calcite-action{padding:1.25rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;font-weight:var(--calcite-font-weight-normal)}/*!@:host([scale=l]) .button--text-visible .icon-container*/[scale=l].sc-calcite-action-h .button--text-visible.sc-calcite-action .icon-container.sc-calcite-action{-webkit-margin-end:1rem;margin-inline-end:1rem}/*!@:host([alignment=center]) .button*/[alignment=center].sc-calcite-action-h .button.sc-calcite-action{-ms-flex-pack:center;justify-content:center}/*!@:host([alignment=end]) .button*/[alignment=end].sc-calcite-action-h .button.sc-calcite-action{-ms-flex-pack:end;justify-content:flex-end}/*!@:host([alignment=center]) .button .text-container--visible, :host([alignment=end]) .button .text-container--visible*/[alignment=center].sc-calcite-action-h .button.sc-calcite-action .text-container--visible.sc-calcite-action,[alignment=end].sc-calcite-action-h .button.sc-calcite-action .text-container--visible.sc-calcite-action{-ms-flex:0 1 auto;flex:0 1 auto}/*!@:host([scale=s][compact]) .button, :host([scale=m][compact]) .button, :host([scale=l][compact]) .button*/[scale=s][compact].sc-calcite-action-h .button.sc-calcite-action,[scale=m][compact].sc-calcite-action-h .button.sc-calcite-action,[scale=l][compact].sc-calcite-action-h .button.sc-calcite-action{padding-left:0px;padding-right:0px}/*!@.slot-container*/.slot-container.sc-calcite-action{display:-ms-flexbox;display:flex}/*!@.slot-container--hidden*/.slot-container--hidden.sc-calcite-action{display:none}/*!@.button--text-visible*/.button--text-visible.sc-calcite-action{width:100%}/*!@:host([active]) .button, :host([active]) .button:hover, :host([active]) .button:focus, :host([active][loading]) .button*/[active].sc-calcite-action-h .button.sc-calcite-action,[active].sc-calcite-action-h .button.sc-calcite-action:hover,[active].sc-calcite-action-h .button.sc-calcite-action:focus,[active][loading].sc-calcite-action-h .button.sc-calcite-action{background-color:var(--calcite-ui-foreground-3);fill:var(--calcite-ui-text-1);color:var(--calcite-ui-text-1)}/*!@:host([active]) .button:active*/[active].sc-calcite-action-h .button.sc-calcite-action:active{background-color:var(--calcite-ui-foreground-1)}/*!@:host([appearance=clear]) .button*/[appearance=clear].sc-calcite-action-h .button.sc-calcite-action{background-color:transparent;-webkit-transition-property:-webkit-box-shadow;transition-property:-webkit-box-shadow;transition-property:box-shadow;transition-property:box-shadow, -webkit-box-shadow;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}/*!@:host([appearance=clear]) .button:hover, :host([appearance=clear]) .button:focus*/[appearance=clear].sc-calcite-action-h .button.sc-calcite-action:hover,[appearance=clear].sc-calcite-action-h .button.sc-calcite-action:focus{background-color:transparent;-webkit-box-shadow:0 0 0 2px var(--calcite-ui-border-1) inset;box-shadow:0 0 0 2px var(--calcite-ui-border-1) inset}/*!@:host([active][appearance=clear]) .button, :host([active][appearance=clear]) .button:hover, :host([active][appearance=clear]) .button:focus*/[active][appearance=clear].sc-calcite-action-h .button.sc-calcite-action,[active][appearance=clear].sc-calcite-action-h .button.sc-calcite-action:hover,[active][appearance=clear].sc-calcite-action-h .button.sc-calcite-action:focus{background-color:var(--calcite-ui-foreground-3);fill:var(--calcite-ui-text-1);color:var(--calcite-ui-text-1)}/*!@:host([appearance=clear][loading]) .button, :host([appearance=clear][disabled]) .button*/[appearance=clear][loading].sc-calcite-action-h .button.sc-calcite-action,[appearance=clear][disabled].sc-calcite-action-h .button.sc-calcite-action{background-color:transparent}/*!@:host([loading]) .button, :host([loading]) .button:hover, :host([loading]) .button:focus*/[loading].sc-calcite-action-h .button.sc-calcite-action,[loading].sc-calcite-action-h .button.sc-calcite-action:hover,[loading].sc-calcite-action-h .button.sc-calcite-action:focus{background-color:var(--calcite-ui-foreground-1)}/*!@:host([loading]) .button .text-container, :host([loading]) .button:hover .text-container, :host([loading]) .button:focus .text-container*/[loading].sc-calcite-action-h .button.sc-calcite-action .text-container.sc-calcite-action,[loading].sc-calcite-action-h .button.sc-calcite-action:hover .text-container.sc-calcite-action,[loading].sc-calcite-action-h .button.sc-calcite-action:focus .text-container.sc-calcite-action{opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([loading]) calcite-loader[inline]*/[loading].sc-calcite-action-h calcite-loader[inline].sc-calcite-action{margin-right:0px;color:var(--calcite-ui-text-3)}/*!@:host([disabled]) .button, :host([disabled]) .button:hover, :host([disabled]) .button:focus*/[disabled].sc-calcite-action-h .button.sc-calcite-action,[disabled].sc-calcite-action-h .button.sc-calcite-action:hover,[disabled].sc-calcite-action-h .button.sc-calcite-action:focus{cursor:default;background-color:var(--calcite-ui-foreground-1);opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled][active]) .button, :host([disabled][active]) .button:hover, :host([disabled][active]) .button:focus*/[disabled][active].sc-calcite-action-h .button.sc-calcite-action,[disabled][active].sc-calcite-action-h .button.sc-calcite-action:hover,[disabled][active].sc-calcite-action-h .button.sc-calcite-action:focus{background-color:var(--calcite-ui-foreground-3);opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([indicator]) .button::after*/[indicator].sc-calcite-action-h .button.sc-calcite-action::after{content:\"\";position:absolute;z-index:10;height:0.5rem;width:0.5rem;border-radius:9999px;border-width:2px;background-color:var(--calcite-ui-brand);border-color:var(--calcite-ui-foreground-1);inset-block-end:0.75rem;inset-inline-end:0.75rem}/*!@:host([indicator]) .button--text-visible::after*/[indicator].sc-calcite-action-h .button--text-visible.sc-calcite-action::after{inset-block-end:auto}/*!@:host([indicator]) .button--text-visible .text-container--visible*/[indicator].sc-calcite-action-h .button--text-visible.sc-calcite-action .text-container--visible.sc-calcite-action{-webkit-margin-end:1rem;margin-inline-end:1rem}/*!@:host([indicator]) .button:hover::after,\n:host([indicator]) .button:focus::after*/[indicator].sc-calcite-action-h .button.sc-calcite-action:hover::after,[indicator].sc-calcite-action-h .button.sc-calcite-action:focus::after{border-color:var(--calcite-ui-foreground-1)}/*!@:host([indicator][scale=s]) .button::after*/[indicator][scale=s].sc-calcite-action-h .button.sc-calcite-action::after{inset-block-end:0.25rem;inset-inline-end:0.25rem}/*!@:host([indicator][scale=s]) .button--text-visible::after*/[indicator][scale=s].sc-calcite-action-h .button--text-visible.sc-calcite-action::after{inset-block-end:auto;inset-inline-end:0.5rem}/*!@:host([indicator][active]) .button::after*/[indicator][active].sc-calcite-action-h .button.sc-calcite-action::after{border-color:var(--calcite-ui-foreground-3)}";
- /**
- * @slot - A slot for adding a `calcite-icon`.
- */
- class Action {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteActionClick = createEvent(this, "calciteActionClick", 7);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * Indicates whether the action is highlighted.
- */
- this.active = false;
- /** Specify the appearance style of the action, defaults to solid. */
- this.appearance = "solid";
- /**
- * Compact mode is used internally by components to reduce side padding, e.g. calcite-block-section.
- */
- this.compact = false;
- /**
- * When true, disabled prevents interaction. This state shows items with lower opacity/grayed.
- */
- this.disabled = false;
- /**
- * Indicates unread changes.
- */
- this.indicator = false;
- /** string to override English loading text
- * @default "Loading"
- */
- this.intlLoading = TEXT$r.loading;
- /**
- * When true, content is waiting to be loaded. This state shows a busy indicator.
- */
- this.loading = false;
- /**
- * Specifies the size of the action.
- */
- this.scale = "m";
- /**
- * Indicates whether the text is displayed.
- */
- this.textEnabled = false;
- this.mutationObserver = createObserver();
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.calciteActionClickHandler = () => {
- if (!this.disabled) {
- this.calciteActionClick.emit();
- }
- };
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });
- }
- disconnectedCallback() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- // --------------------------------------------------------------------------
- //
- // Methods
- //
- // --------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- this.buttonEl.focus();
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- renderTextContainer() {
- const { text, textEnabled } = this;
- const textContainerClasses = {
- [CSS$P.textContainer]: true,
- [CSS$P.textContainerVisible]: textEnabled
- };
- return text ? (hAsync("div", { class: textContainerClasses, key: "text-container" }, text)) : null;
- }
- renderIconContainer() {
- var _a;
- const { loading, icon, scale, el, intlLoading } = this;
- const iconScale = scale === "l" ? "m" : "s";
- const loaderScale = scale === "l" ? "l" : "m";
- const calciteLoaderNode = loading ? (hAsync("calcite-loader", { active: true, inline: true, label: intlLoading, scale: loaderScale })) : null;
- const calciteIconNode = icon ? hAsync("calcite-icon", { icon: icon, scale: iconScale }) : null;
- const iconNode = calciteLoaderNode || calciteIconNode;
- const hasIconToDisplay = iconNode || ((_a = el.children) === null || _a === void 0 ? void 0 : _a.length);
- const slotContainerNode = (hAsync("div", { class: {
- [CSS$P.slotContainer]: true,
- [CSS$P.slotContainerHidden]: loading
- } }, hAsync("slot", null)));
- return hasIconToDisplay ? (hAsync("div", { "aria-hidden": "true", class: CSS$P.iconContainer, key: "icon-container" }, iconNode, slotContainerNode)) : null;
- }
- render() {
- const { compact, disabled, loading, textEnabled, label, text } = this;
- const ariaLabel = label || text;
- const buttonClasses = {
- [CSS$P.button]: true,
- [CSS$P.buttonTextVisible]: textEnabled,
- [CSS$P.buttonCompact]: compact
- };
- return (hAsync(Host, { onClick: this.calciteActionClickHandler }, hAsync("button", { "aria-busy": toAriaBoolean(loading), "aria-disabled": toAriaBoolean(disabled), "aria-label": ariaLabel, class: buttonClasses, disabled: disabled, ref: (buttonEl) => (this.buttonEl = buttonEl) }, this.renderIconContainer(), this.renderTextContainer())));
- }
- get el() { return getElement(this); }
- static get style() { return actionCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-action",
- "$members$": {
- "active": [516],
- "alignment": [513],
- "appearance": [513],
- "compact": [516],
- "disabled": [516],
- "icon": [1],
- "indicator": [516],
- "intlLoading": [1, "intl-loading"],
- "label": [1],
- "loading": [516],
- "scale": [513],
- "text": [1],
- "textEnabled": [516, "text-enabled"],
- "setFocus": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["active", "active"], ["alignment", "alignment"], ["appearance", "appearance"], ["compact", "compact"], ["disabled", "disabled"], ["indicator", "indicator"], ["loading", "loading"], ["scale", "scale"], ["textEnabled", "text-enabled"]]
- }; }
- }
- const CSS$O = {
- menu: "menu",
- defaultTrigger: "default-trigger"
- };
- const SLOTS$p = {
- tooltip: "tooltip",
- trigger: "trigger"
- };
- const ICONS$f = {
- menu: "ellipsis"
- };
- const SLOTS$o = {
- menuActions: "menu-actions",
- menuTooltip: "menu-tooltip"
- };
- const TEXT$q = {
- more: "More"
- };
- const ICONS$e = {
- menu: "ellipsis"
- };
- const overflowActionsDebounceInMs = 150;
- const groupBufferHeight = 2;
- const getMaxActionCount = ({ height, actionHeight, groupCount }) => {
- return Math.floor((height - groupCount * groupBufferHeight) / actionHeight);
- };
- const getOverflowCount = ({ actionCount, actionHeight, height, groupCount }) => {
- return Math.max(actionCount - getMaxActionCount({ height, actionHeight, groupCount }), 0);
- };
- const queryActions = (el) => {
- return Array.from(el.querySelectorAll("calcite-action")).filter((action) => action.closest("calcite-action-menu") ? action.slot === SLOTS$p.trigger : true);
- };
- const overflowActions = ({ actionGroups, expanded, overflowCount }) => {
- let needToSlotCount = overflowCount;
- actionGroups.reverse().forEach((group) => {
- let slottedWithinGroupCount = 0;
- const groupActions = queryActions(group).reverse();
- groupActions.forEach((groupAction) => {
- if (groupAction.slot === SLOTS$o.menuActions) {
- groupAction.removeAttribute("slot");
- groupAction.textEnabled = expanded;
- }
- });
- if (needToSlotCount > 0) {
- groupActions.some((groupAction) => {
- const unslottedActions = groupActions.filter((action) => !action.slot);
- if (unslottedActions.length > 1 && groupActions.length > 2 && !groupAction.closest("calcite-action-menu")) {
- groupAction.textEnabled = true;
- groupAction.setAttribute("slot", SLOTS$o.menuActions);
- slottedWithinGroupCount++;
- if (slottedWithinGroupCount > 1) {
- needToSlotCount--;
- }
- }
- return needToSlotCount < 1;
- });
- }
- forceUpdate$1(group);
- });
- };
- const ICONS$d = {
- chevronsLeft: "chevrons-left",
- chevronsRight: "chevrons-right"
- };
- function getCalcitePosition(position, el) {
- var _a;
- return position || ((_a = el.closest("calcite-shell-panel")) === null || _a === void 0 ? void 0 : _a.position) || "start";
- }
- function toggleChildActionText({ parent, expanded }) {
- queryActions(parent)
- .filter((el) => el.slot !== SLOTS$o.menuActions)
- .forEach((action) => (action.textEnabled = expanded));
- parent.querySelectorAll("calcite-action-group").forEach((group) => (group.expanded = expanded));
- }
- const setTooltipReference = ({ tooltip, referenceElement, expanded, ref }) => {
- if (tooltip) {
- tooltip.referenceElement = !expanded && referenceElement ? referenceElement : null;
- }
- if (ref) {
- ref(referenceElement);
- }
- return referenceElement;
- };
- const ExpandToggle = ({ expanded, intlExpand, intlCollapse, toggle, el, position, tooltip, ref, scale }) => {
- const rtl = getElementDir(el) === "rtl";
- const expandText = expanded ? intlCollapse : intlExpand;
- const icons = [ICONS$d.chevronsLeft, ICONS$d.chevronsRight];
- if (rtl) {
- icons.reverse();
- }
- const end = getCalcitePosition(position, el) === "end";
- const expandIcon = end ? icons[1] : icons[0];
- const collapseIcon = end ? icons[0] : icons[1];
- const actionNode = (hAsync("calcite-action", { icon: expanded ? expandIcon : collapseIcon, onClick: toggle, ref: (referenceElement) => setTooltipReference({ tooltip, referenceElement, expanded, ref }), scale: scale, text: expandText, textEnabled: expanded }));
- return actionNode;
- };
- const CSS$N = {
- actionGroupBottom: "action-group--bottom"
- };
- const SLOTS$n = {
- bottomActions: "bottom-actions",
- expandTooltip: "expand-tooltip"
- };
- const TEXT$p = {
- expand: "Expand",
- collapse: "Collapse"
- };
- /** Detect free variable `global` from Node.js. */
- var freeGlobal = typeof global == 'object' && global && global.Object === Object && global;
- /** Detect free variable `self`. */
- var freeSelf = typeof self == 'object' && self && self.Object === Object && self;
- /** Used as a reference to the global object. */
- var root = freeGlobal || freeSelf || Function('return this')();
- /** Built-in value references. */
- var Symbol$1 = root.Symbol;
- /** Used for built-in method references. */
- var objectProto$5 = Object.prototype;
- /** Used to check objects for own properties. */
- var hasOwnProperty$3 = objectProto$5.hasOwnProperty;
- /**
- * Used to resolve the
- * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
- * of values.
- */
- var nativeObjectToString$1 = objectProto$5.toString;
- /** Built-in value references. */
- var symToStringTag$1 = Symbol$1 ? Symbol$1.toStringTag : undefined;
- /**
- * A specialized version of `baseGetTag` which ignores `Symbol.toStringTag` values.
- *
- * @private
- * @param {*} value The value to query.
- * @returns {string} Returns the raw `toStringTag`.
- */
- function getRawTag(value) {
- var isOwn = hasOwnProperty$3.call(value, symToStringTag$1),
- tag = value[symToStringTag$1];
- try {
- value[symToStringTag$1] = undefined;
- var unmasked = true;
- } catch (e) {}
- var result = nativeObjectToString$1.call(value);
- if (unmasked) {
- if (isOwn) {
- value[symToStringTag$1] = tag;
- } else {
- delete value[symToStringTag$1];
- }
- }
- return result;
- }
- /** Used for built-in method references. */
- var objectProto$4 = Object.prototype;
- /**
- * Used to resolve the
- * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
- * of values.
- */
- var nativeObjectToString = objectProto$4.toString;
- /**
- * Converts `value` to a string using `Object.prototype.toString`.
- *
- * @private
- * @param {*} value The value to convert.
- * @returns {string} Returns the converted string.
- */
- function objectToString(value) {
- return nativeObjectToString.call(value);
- }
- /** `Object#toString` result references. */
- var nullTag = '[object Null]',
- undefinedTag = '[object Undefined]';
- /** Built-in value references. */
- var symToStringTag = Symbol$1 ? Symbol$1.toStringTag : undefined;
- /**
- * The base implementation of `getTag` without fallbacks for buggy environments.
- *
- * @private
- * @param {*} value The value to query.
- * @returns {string} Returns the `toStringTag`.
- */
- function baseGetTag(value) {
- if (value == null) {
- return value === undefined ? undefinedTag : nullTag;
- }
- return (symToStringTag && symToStringTag in Object(value))
- ? getRawTag(value)
- : objectToString(value);
- }
- /**
- * Checks if `value` is object-like. A value is object-like if it's not `null`
- * and has a `typeof` result of "object".
- *
- * @static
- * @memberOf _
- * @since 4.0.0
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is object-like, else `false`.
- * @example
- *
- * _.isObjectLike({});
- * // => true
- *
- * _.isObjectLike([1, 2, 3]);
- * // => true
- *
- * _.isObjectLike(_.noop);
- * // => false
- *
- * _.isObjectLike(null);
- * // => false
- */
- function isObjectLike(value) {
- return value != null && typeof value == 'object';
- }
- /** `Object#toString` result references. */
- var symbolTag = '[object Symbol]';
- /**
- * Checks if `value` is classified as a `Symbol` primitive or object.
- *
- * @static
- * @memberOf _
- * @since 4.0.0
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is a symbol, else `false`.
- * @example
- *
- * _.isSymbol(Symbol.iterator);
- * // => true
- *
- * _.isSymbol('abc');
- * // => false
- */
- function isSymbol(value) {
- return typeof value == 'symbol' ||
- (isObjectLike(value) && baseGetTag(value) == symbolTag);
- }
- /**
- * A specialized version of `_.map` for arrays without support for iteratee
- * shorthands.
- *
- * @private
- * @param {Array} [array] The array to iterate over.
- * @param {Function} iteratee The function invoked per iteration.
- * @returns {Array} Returns the new mapped array.
- */
- function arrayMap(array, iteratee) {
- var index = -1,
- length = array == null ? 0 : array.length,
- result = Array(length);
- while (++index < length) {
- result[index] = iteratee(array[index], index, array);
- }
- return result;
- }
- /**
- * Checks if `value` is classified as an `Array` object.
- *
- * @static
- * @memberOf _
- * @since 0.1.0
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is an array, else `false`.
- * @example
- *
- * _.isArray([1, 2, 3]);
- * // => true
- *
- * _.isArray(document.body.children);
- * // => false
- *
- * _.isArray('abc');
- * // => false
- *
- * _.isArray(_.noop);
- * // => false
- */
- var isArray = Array.isArray;
- /** Used as references for various `Number` constants. */
- var INFINITY = 1 / 0;
- /** Used to convert symbols to primitives and strings. */
- var symbolProto = Symbol$1 ? Symbol$1.prototype : undefined,
- symbolToString = symbolProto ? symbolProto.toString : undefined;
- /**
- * The base implementation of `_.toString` which doesn't convert nullish
- * values to empty strings.
- *
- * @private
- * @param {*} value The value to process.
- * @returns {string} Returns the string.
- */
- function baseToString(value) {
- // Exit early for strings to avoid a performance hit in some environments.
- if (typeof value == 'string') {
- return value;
- }
- if (isArray(value)) {
- // Recursively convert values (susceptible to call stack limits).
- return arrayMap(value, baseToString) + '';
- }
- if (isSymbol(value)) {
- return symbolToString ? symbolToString.call(value) : '';
- }
- var result = (value + '');
- return (result == '0' && (1 / value) == -INFINITY) ? '-0' : result;
- }
- /** Used to match a single whitespace character. */
- var reWhitespace = /\s/;
- /**
- * Used by `_.trim` and `_.trimEnd` to get the index of the last non-whitespace
- * character of `string`.
- *
- * @private
- * @param {string} string The string to inspect.
- * @returns {number} Returns the index of the last non-whitespace character.
- */
- function trimmedEndIndex(string) {
- var index = string.length;
- while (index-- && reWhitespace.test(string.charAt(index))) {}
- return index;
- }
- /** Used to match leading whitespace. */
- var reTrimStart = /^\s+/;
- /**
- * The base implementation of `_.trim`.
- *
- * @private
- * @param {string} string The string to trim.
- * @returns {string} Returns the trimmed string.
- */
- function baseTrim(string) {
- return string
- ? string.slice(0, trimmedEndIndex(string) + 1).replace(reTrimStart, '')
- : string;
- }
- /**
- * Checks if `value` is the
- * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)
- * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)
- *
- * @static
- * @memberOf _
- * @since 0.1.0
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is an object, else `false`.
- * @example
- *
- * _.isObject({});
- * // => true
- *
- * _.isObject([1, 2, 3]);
- * // => true
- *
- * _.isObject(_.noop);
- * // => true
- *
- * _.isObject(null);
- * // => false
- */
- function isObject(value) {
- var type = typeof value;
- return value != null && (type == 'object' || type == 'function');
- }
- /** Used as references for various `Number` constants. */
- var NAN = 0 / 0;
- /** Used to detect bad signed hexadecimal string values. */
- var reIsBadHex = /^[-+]0x[0-9a-f]+$/i;
- /** Used to detect binary string values. */
- var reIsBinary = /^0b[01]+$/i;
- /** Used to detect octal string values. */
- var reIsOctal = /^0o[0-7]+$/i;
- /** Built-in method references without a dependency on `root`. */
- var freeParseInt = parseInt;
- /**
- * Converts `value` to a number.
- *
- * @static
- * @memberOf _
- * @since 4.0.0
- * @category Lang
- * @param {*} value The value to process.
- * @returns {number} Returns the number.
- * @example
- *
- * _.toNumber(3.2);
- * // => 3.2
- *
- * _.toNumber(Number.MIN_VALUE);
- * // => 5e-324
- *
- * _.toNumber(Infinity);
- * // => Infinity
- *
- * _.toNumber('3.2');
- * // => 3.2
- */
- function toNumber(value) {
- if (typeof value == 'number') {
- return value;
- }
- if (isSymbol(value)) {
- return NAN;
- }
- if (isObject(value)) {
- var other = typeof value.valueOf == 'function' ? value.valueOf() : value;
- value = isObject(other) ? (other + '') : other;
- }
- if (typeof value != 'string') {
- return value === 0 ? value : +value;
- }
- value = baseTrim(value);
- var isBinary = reIsBinary.test(value);
- return (isBinary || reIsOctal.test(value))
- ? freeParseInt(value.slice(2), isBinary ? 2 : 8)
- : (reIsBadHex.test(value) ? NAN : +value);
- }
- /**
- * This method returns the first argument it receives.
- *
- * @static
- * @since 0.1.0
- * @memberOf _
- * @category Util
- * @param {*} value Any value.
- * @returns {*} Returns `value`.
- * @example
- *
- * var object = { 'a': 1 };
- *
- * console.log(_.identity(object) === object);
- * // => true
- */
- function identity(value) {
- return value;
- }
- /** `Object#toString` result references. */
- var asyncTag = '[object AsyncFunction]',
- funcTag$1 = '[object Function]',
- genTag = '[object GeneratorFunction]',
- proxyTag = '[object Proxy]';
- /**
- * Checks if `value` is classified as a `Function` object.
- *
- * @static
- * @memberOf _
- * @since 0.1.0
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is a function, else `false`.
- * @example
- *
- * _.isFunction(_);
- * // => true
- *
- * _.isFunction(/abc/);
- * // => false
- */
- function isFunction(value) {
- if (!isObject(value)) {
- return false;
- }
- // The use of `Object#toString` avoids issues with the `typeof` operator
- // in Safari 9 which returns 'object' for typed arrays and other constructors.
- var tag = baseGetTag(value);
- return tag == funcTag$1 || tag == genTag || tag == asyncTag || tag == proxyTag;
- }
- /** Used as references for various `Number` constants. */
- var MAX_SAFE_INTEGER$1 = 9007199254740991;
- /** Used to detect unsigned integer values. */
- var reIsUint = /^(?:0|[1-9]\d*)$/;
- /**
- * Checks if `value` is a valid array-like index.
- *
- * @private
- * @param {*} value The value to check.
- * @param {number} [length=MAX_SAFE_INTEGER] The upper bounds of a valid index.
- * @returns {boolean} Returns `true` if `value` is a valid index, else `false`.
- */
- function isIndex(value, length) {
- var type = typeof value;
- length = length == null ? MAX_SAFE_INTEGER$1 : length;
- return !!length &&
- (type == 'number' ||
- (type != 'symbol' && reIsUint.test(value))) &&
- (value > -1 && value % 1 == 0 && value < length);
- }
- /** Used as references for various `Number` constants. */
- var MAX_SAFE_INTEGER = 9007199254740991;
- /**
- * Checks if `value` is a valid array-like length.
- *
- * **Note:** This method is loosely based on
- * [`ToLength`](http://ecma-international.org/ecma-262/7.0/#sec-tolength).
- *
- * @static
- * @memberOf _
- * @since 4.0.0
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is a valid length, else `false`.
- * @example
- *
- * _.isLength(3);
- * // => true
- *
- * _.isLength(Number.MIN_VALUE);
- * // => false
- *
- * _.isLength(Infinity);
- * // => false
- *
- * _.isLength('3');
- * // => false
- */
- function isLength(value) {
- return typeof value == 'number' &&
- value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER;
- }
- /**
- * Checks if `value` is array-like. A value is considered array-like if it's
- * not a function and has a `value.length` that's an integer greater than or
- * equal to `0` and less than or equal to `Number.MAX_SAFE_INTEGER`.
- *
- * @static
- * @memberOf _
- * @since 4.0.0
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is array-like, else `false`.
- * @example
- *
- * _.isArrayLike([1, 2, 3]);
- * // => true
- *
- * _.isArrayLike(document.body.children);
- * // => true
- *
- * _.isArrayLike('abc');
- * // => true
- *
- * _.isArrayLike(_.noop);
- * // => false
- */
- function isArrayLike(value) {
- return value != null && isLength(value.length) && !isFunction(value);
- }
- /** Used for built-in method references. */
- var objectProto$3 = Object.prototype;
- /**
- * Checks if `value` is likely a prototype object.
- *
- * @private
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is a prototype, else `false`.
- */
- function isPrototype(value) {
- var Ctor = value && value.constructor,
- proto = (typeof Ctor == 'function' && Ctor.prototype) || objectProto$3;
- return value === proto;
- }
- /**
- * The base implementation of `_.times` without support for iteratee shorthands
- * or max array length checks.
- *
- * @private
- * @param {number} n The number of times to invoke `iteratee`.
- * @param {Function} iteratee The function invoked per iteration.
- * @returns {Array} Returns the array of results.
- */
- function baseTimes(n, iteratee) {
- var index = -1,
- result = Array(n);
- while (++index < n) {
- result[index] = iteratee(index);
- }
- return result;
- }
- /** `Object#toString` result references. */
- var argsTag$1 = '[object Arguments]';
- /**
- * The base implementation of `_.isArguments`.
- *
- * @private
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is an `arguments` object,
- */
- function baseIsArguments(value) {
- return isObjectLike(value) && baseGetTag(value) == argsTag$1;
- }
- /** Used for built-in method references. */
- var objectProto$2 = Object.prototype;
- /** Used to check objects for own properties. */
- var hasOwnProperty$2 = objectProto$2.hasOwnProperty;
- /** Built-in value references. */
- var propertyIsEnumerable = objectProto$2.propertyIsEnumerable;
- /**
- * Checks if `value` is likely an `arguments` object.
- *
- * @static
- * @memberOf _
- * @since 0.1.0
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is an `arguments` object,
- * else `false`.
- * @example
- *
- * _.isArguments(function() { return arguments; }());
- * // => true
- *
- * _.isArguments([1, 2, 3]);
- * // => false
- */
- var isArguments = baseIsArguments(function() { return arguments; }()) ? baseIsArguments : function(value) {
- return isObjectLike(value) && hasOwnProperty$2.call(value, 'callee') &&
- !propertyIsEnumerable.call(value, 'callee');
- };
- /**
- * This method returns `false`.
- *
- * @static
- * @memberOf _
- * @since 4.13.0
- * @category Util
- * @returns {boolean} Returns `false`.
- * @example
- *
- * _.times(2, _.stubFalse);
- * // => [false, false]
- */
- function stubFalse() {
- return false;
- }
- /** Detect free variable `exports`. */
- var freeExports$1 = typeof exports == 'object' && exports && !exports.nodeType && exports;
- /** Detect free variable `module`. */
- var freeModule$1 = freeExports$1 && typeof module == 'object' && module && !module.nodeType && module;
- /** Detect the popular CommonJS extension `module.exports`. */
- var moduleExports$1 = freeModule$1 && freeModule$1.exports === freeExports$1;
- /** Built-in value references. */
- var Buffer = moduleExports$1 ? root.Buffer : undefined;
- /* Built-in method references for those with the same name as other `lodash` methods. */
- var nativeIsBuffer = Buffer ? Buffer.isBuffer : undefined;
- /**
- * Checks if `value` is a buffer.
- *
- * @static
- * @memberOf _
- * @since 4.3.0
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is a buffer, else `false`.
- * @example
- *
- * _.isBuffer(new Buffer(2));
- * // => true
- *
- * _.isBuffer(new Uint8Array(2));
- * // => false
- */
- var isBuffer = nativeIsBuffer || stubFalse;
- /** `Object#toString` result references. */
- var argsTag = '[object Arguments]',
- arrayTag = '[object Array]',
- boolTag = '[object Boolean]',
- dateTag = '[object Date]',
- errorTag = '[object Error]',
- funcTag = '[object Function]',
- mapTag = '[object Map]',
- numberTag = '[object Number]',
- objectTag = '[object Object]',
- regexpTag = '[object RegExp]',
- setTag = '[object Set]',
- stringTag = '[object String]',
- weakMapTag = '[object WeakMap]';
- var arrayBufferTag = '[object ArrayBuffer]',
- dataViewTag = '[object DataView]',
- float32Tag = '[object Float32Array]',
- float64Tag = '[object Float64Array]',
- int8Tag = '[object Int8Array]',
- int16Tag = '[object Int16Array]',
- int32Tag = '[object Int32Array]',
- uint8Tag = '[object Uint8Array]',
- uint8ClampedTag = '[object Uint8ClampedArray]',
- uint16Tag = '[object Uint16Array]',
- uint32Tag = '[object Uint32Array]';
- /** Used to identify `toStringTag` values of typed arrays. */
- var typedArrayTags = {};
- typedArrayTags[float32Tag] = typedArrayTags[float64Tag] =
- typedArrayTags[int8Tag] = typedArrayTags[int16Tag] =
- typedArrayTags[int32Tag] = typedArrayTags[uint8Tag] =
- typedArrayTags[uint8ClampedTag] = typedArrayTags[uint16Tag] =
- typedArrayTags[uint32Tag] = true;
- typedArrayTags[argsTag] = typedArrayTags[arrayTag] =
- typedArrayTags[arrayBufferTag] = typedArrayTags[boolTag] =
- typedArrayTags[dataViewTag] = typedArrayTags[dateTag] =
- typedArrayTags[errorTag] = typedArrayTags[funcTag] =
- typedArrayTags[mapTag] = typedArrayTags[numberTag] =
- typedArrayTags[objectTag] = typedArrayTags[regexpTag] =
- typedArrayTags[setTag] = typedArrayTags[stringTag] =
- typedArrayTags[weakMapTag] = false;
- /**
- * The base implementation of `_.isTypedArray` without Node.js optimizations.
- *
- * @private
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is a typed array, else `false`.
- */
- function baseIsTypedArray(value) {
- return isObjectLike(value) &&
- isLength(value.length) && !!typedArrayTags[baseGetTag(value)];
- }
- /**
- * The base implementation of `_.unary` without support for storing metadata.
- *
- * @private
- * @param {Function} func The function to cap arguments for.
- * @returns {Function} Returns the new capped function.
- */
- function baseUnary(func) {
- return function(value) {
- return func(value);
- };
- }
- /** Detect free variable `exports`. */
- var freeExports = typeof exports == 'object' && exports && !exports.nodeType && exports;
- /** Detect free variable `module`. */
- var freeModule = freeExports && typeof module == 'object' && module && !module.nodeType && module;
- /** Detect the popular CommonJS extension `module.exports`. */
- var moduleExports = freeModule && freeModule.exports === freeExports;
- /** Detect free variable `process` from Node.js. */
- var freeProcess = moduleExports && freeGlobal.process;
- /** Used to access faster Node.js helpers. */
- var nodeUtil = (function() {
- try {
- // Use `util.types` for Node.js 10+.
- var types = freeModule && freeModule.require && freeModule.require('util').types;
- if (types) {
- return types;
- }
- // Legacy `process.binding('util')` for Node.js < 10.
- return freeProcess && freeProcess.binding && freeProcess.binding('util');
- } catch (e) {}
- }());
- /* Node.js helper references. */
- var nodeIsTypedArray = nodeUtil && nodeUtil.isTypedArray;
- /**
- * Checks if `value` is classified as a typed array.
- *
- * @static
- * @memberOf _
- * @since 3.0.0
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is a typed array, else `false`.
- * @example
- *
- * _.isTypedArray(new Uint8Array);
- * // => true
- *
- * _.isTypedArray([]);
- * // => false
- */
- var isTypedArray = nodeIsTypedArray ? baseUnary(nodeIsTypedArray) : baseIsTypedArray;
- /** Used for built-in method references. */
- var objectProto$1 = Object.prototype;
- /** Used to check objects for own properties. */
- var hasOwnProperty$1 = objectProto$1.hasOwnProperty;
- /**
- * Creates an array of the enumerable property names of the array-like `value`.
- *
- * @private
- * @param {*} value The value to query.
- * @param {boolean} inherited Specify returning inherited property names.
- * @returns {Array} Returns the array of property names.
- */
- function arrayLikeKeys(value, inherited) {
- var isArr = isArray(value),
- isArg = !isArr && isArguments(value),
- isBuff = !isArr && !isArg && isBuffer(value),
- isType = !isArr && !isArg && !isBuff && isTypedArray(value),
- skipIndexes = isArr || isArg || isBuff || isType,
- result = skipIndexes ? baseTimes(value.length, String) : [],
- length = result.length;
- for (var key in value) {
- if ((inherited || hasOwnProperty$1.call(value, key)) &&
- !(skipIndexes && (
- // Safari 9 has enumerable `arguments.length` in strict mode.
- key == 'length' ||
- // Node.js 0.10 has enumerable non-index properties on buffers.
- (isBuff && (key == 'offset' || key == 'parent')) ||
- // PhantomJS 2 has enumerable non-index properties on typed arrays.
- (isType && (key == 'buffer' || key == 'byteLength' || key == 'byteOffset')) ||
- // Skip index properties.
- isIndex(key, length)
- ))) {
- result.push(key);
- }
- }
- return result;
- }
- /**
- * This function is like
- * [`Object.keys`](http://ecma-international.org/ecma-262/7.0/#sec-object.keys)
- * except that it includes inherited enumerable properties.
- *
- * @private
- * @param {Object} object The object to query.
- * @returns {Array} Returns the array of property names.
- */
- function nativeKeysIn(object) {
- var result = [];
- if (object != null) {
- for (var key in Object(object)) {
- result.push(key);
- }
- }
- return result;
- }
- /** Used for built-in method references. */
- var objectProto = Object.prototype;
- /** Used to check objects for own properties. */
- var hasOwnProperty = objectProto.hasOwnProperty;
- /**
- * The base implementation of `_.keysIn` which doesn't treat sparse arrays as dense.
- *
- * @private
- * @param {Object} object The object to query.
- * @returns {Array} Returns the array of property names.
- */
- function baseKeysIn(object) {
- if (!isObject(object)) {
- return nativeKeysIn(object);
- }
- var isProto = isPrototype(object),
- result = [];
- for (var key in object) {
- if (!(key == 'constructor' && (isProto || !hasOwnProperty.call(object, key)))) {
- result.push(key);
- }
- }
- return result;
- }
- /**
- * Creates an array of the own and inherited enumerable property names of `object`.
- *
- * **Note:** Non-object values are coerced to objects.
- *
- * @static
- * @memberOf _
- * @since 3.0.0
- * @category Object
- * @param {Object} object The object to query.
- * @returns {Array} Returns the array of property names.
- * @example
- *
- * function Foo() {
- * this.a = 1;
- * this.b = 2;
- * }
- *
- * Foo.prototype.c = 3;
- *
- * _.keysIn(new Foo);
- * // => ['a', 'b', 'c'] (iteration order is not guaranteed)
- */
- function keysIn(object) {
- return isArrayLike(object) ? arrayLikeKeys(object, true) : baseKeysIn(object);
- }
- /**
- * Converts `value` to a string. An empty string is returned for `null`
- * and `undefined` values. The sign of `-0` is preserved.
- *
- * @static
- * @memberOf _
- * @since 4.0.0
- * @category Lang
- * @param {*} value The value to convert.
- * @returns {string} Returns the converted string.
- * @example
- *
- * _.toString(null);
- * // => ''
- *
- * _.toString(-0);
- * // => '-0'
- *
- * _.toString([1, 2, 3]);
- * // => '1,2,3'
- */
- function toString(value) {
- return value == null ? '' : baseToString(value);
- }
- /**
- * Creates a base function for methods like `_.forIn` and `_.forOwn`.
- *
- * @private
- * @param {boolean} [fromRight] Specify iterating from right to left.
- * @returns {Function} Returns the new base function.
- */
- function createBaseFor(fromRight) {
- return function(object, iteratee, keysFunc) {
- var index = -1,
- iterable = Object(object),
- props = keysFunc(object),
- length = props.length;
- while (length--) {
- var key = props[fromRight ? length : ++index];
- if (iteratee(iterable[key], key, iterable) === false) {
- break;
- }
- }
- return object;
- };
- }
- /**
- * The base implementation of `baseForOwn` which iterates over `object`
- * properties returned by `keysFunc` and invokes `iteratee` for each property.
- * Iteratee functions may exit iteration early by explicitly returning `false`.
- *
- * @private
- * @param {Object} object The object to iterate over.
- * @param {Function} iteratee The function invoked per iteration.
- * @param {Function} keysFunc The function to get the keys of `object`.
- * @returns {Object} Returns `object`.
- */
- var baseFor = createBaseFor();
- /**
- * Gets the timestamp of the number of milliseconds that have elapsed since
- * the Unix epoch (1 January 1970 00:00:00 UTC).
- *
- * @static
- * @memberOf _
- * @since 2.4.0
- * @category Date
- * @returns {number} Returns the timestamp.
- * @example
- *
- * _.defer(function(stamp) {
- * console.log(_.now() - stamp);
- * }, _.now());
- * // => Logs the number of milliseconds it took for the deferred invocation.
- */
- var now = function() {
- return root.Date.now();
- };
- /** Error message constants. */
- var FUNC_ERROR_TEXT$1 = 'Expected a function';
- /* Built-in method references for those with the same name as other `lodash` methods. */
- var nativeMax = Math.max,
- nativeMin = Math.min;
- /**
- * Creates a debounced function that delays invoking `func` until after `wait`
- * milliseconds have elapsed since the last time the debounced function was
- * invoked. The debounced function comes with a `cancel` method to cancel
- * delayed `func` invocations and a `flush` method to immediately invoke them.
- * Provide `options` to indicate whether `func` should be invoked on the
- * leading and/or trailing edge of the `wait` timeout. The `func` is invoked
- * with the last arguments provided to the debounced function. Subsequent
- * calls to the debounced function return the result of the last `func`
- * invocation.
- *
- * **Note:** If `leading` and `trailing` options are `true`, `func` is
- * invoked on the trailing edge of the timeout only if the debounced function
- * is invoked more than once during the `wait` timeout.
- *
- * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
- * until to the next tick, similar to `setTimeout` with a timeout of `0`.
- *
- * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
- * for details over the differences between `_.debounce` and `_.throttle`.
- *
- * @static
- * @memberOf _
- * @since 0.1.0
- * @category Function
- * @param {Function} func The function to debounce.
- * @param {number} [wait=0] The number of milliseconds to delay.
- * @param {Object} [options={}] The options object.
- * @param {boolean} [options.leading=false]
- * Specify invoking on the leading edge of the timeout.
- * @param {number} [options.maxWait]
- * The maximum time `func` is allowed to be delayed before it's invoked.
- * @param {boolean} [options.trailing=true]
- * Specify invoking on the trailing edge of the timeout.
- * @returns {Function} Returns the new debounced function.
- * @example
- *
- * // Avoid costly calculations while the window size is in flux.
- * jQuery(window).on('resize', _.debounce(calculateLayout, 150));
- *
- * // Invoke `sendMail` when clicked, debouncing subsequent calls.
- * jQuery(element).on('click', _.debounce(sendMail, 300, {
- * 'leading': true,
- * 'trailing': false
- * }));
- *
- * // Ensure `batchLog` is invoked once after 1 second of debounced calls.
- * var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });
- * var source = new EventSource('/stream');
- * jQuery(source).on('message', debounced);
- *
- * // Cancel the trailing debounced invocation.
- * jQuery(window).on('popstate', debounced.cancel);
- */
- function debounce$1(func, wait, options) {
- var lastArgs,
- lastThis,
- maxWait,
- result,
- timerId,
- lastCallTime,
- lastInvokeTime = 0,
- leading = false,
- maxing = false,
- trailing = true;
- if (typeof func != 'function') {
- throw new TypeError(FUNC_ERROR_TEXT$1);
- }
- wait = toNumber(wait) || 0;
- if (isObject(options)) {
- leading = !!options.leading;
- maxing = 'maxWait' in options;
- maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait;
- trailing = 'trailing' in options ? !!options.trailing : trailing;
- }
- function invokeFunc(time) {
- var args = lastArgs,
- thisArg = lastThis;
- lastArgs = lastThis = undefined;
- lastInvokeTime = time;
- result = func.apply(thisArg, args);
- return result;
- }
- function leadingEdge(time) {
- // Reset any `maxWait` timer.
- lastInvokeTime = time;
- // Start the timer for the trailing edge.
- timerId = setTimeout(timerExpired, wait);
- // Invoke the leading edge.
- return leading ? invokeFunc(time) : result;
- }
- function remainingWait(time) {
- var timeSinceLastCall = time - lastCallTime,
- timeSinceLastInvoke = time - lastInvokeTime,
- timeWaiting = wait - timeSinceLastCall;
- return maxing
- ? nativeMin(timeWaiting, maxWait - timeSinceLastInvoke)
- : timeWaiting;
- }
- function shouldInvoke(time) {
- var timeSinceLastCall = time - lastCallTime,
- timeSinceLastInvoke = time - lastInvokeTime;
- // Either this is the first call, activity has stopped and we're at the
- // trailing edge, the system time has gone backwards and we're treating
- // it as the trailing edge, or we've hit the `maxWait` limit.
- return (lastCallTime === undefined || (timeSinceLastCall >= wait) ||
- (timeSinceLastCall < 0) || (maxing && timeSinceLastInvoke >= maxWait));
- }
- function timerExpired() {
- var time = now();
- if (shouldInvoke(time)) {
- return trailingEdge(time);
- }
- // Restart the timer.
- timerId = setTimeout(timerExpired, remainingWait(time));
- }
- function trailingEdge(time) {
- timerId = undefined;
- // Only invoke if we have `lastArgs` which means `func` has been
- // debounced at least once.
- if (trailing && lastArgs) {
- return invokeFunc(time);
- }
- lastArgs = lastThis = undefined;
- return result;
- }
- function cancel() {
- if (timerId !== undefined) {
- clearTimeout(timerId);
- }
- lastInvokeTime = 0;
- lastArgs = lastCallTime = lastThis = timerId = undefined;
- }
- function flush() {
- return timerId === undefined ? result : trailingEdge(now());
- }
- function debounced() {
- var time = now(),
- isInvoking = shouldInvoke(time);
- lastArgs = arguments;
- lastThis = this;
- lastCallTime = time;
- if (isInvoking) {
- if (timerId === undefined) {
- return leadingEdge(lastCallTime);
- }
- if (maxing) {
- // Handle invocations in a tight loop.
- clearTimeout(timerId);
- timerId = setTimeout(timerExpired, wait);
- return invokeFunc(lastCallTime);
- }
- }
- if (timerId === undefined) {
- timerId = setTimeout(timerExpired, wait);
- }
- return result;
- }
- debounced.cancel = cancel;
- debounced.flush = flush;
- return debounced;
- }
- /**
- * Casts `value` to `identity` if it's not a function.
- *
- * @private
- * @param {*} value The value to inspect.
- * @returns {Function} Returns cast function.
- */
- function castFunction(value) {
- return typeof value == 'function' ? value : identity;
- }
- /**
- * Used to match `RegExp`
- * [syntax characters](http://ecma-international.org/ecma-262/7.0/#sec-patterns).
- */
- var reRegExpChar = /[\\^$.*+?()[\]{}|]/g,
- reHasRegExpChar = RegExp(reRegExpChar.source);
- /**
- * Escapes the `RegExp` special characters "^", "$", "\", ".", "*", "+",
- * "?", "(", ")", "[", "]", "{", "}", and "|" in `string`.
- *
- * @static
- * @memberOf _
- * @since 3.0.0
- * @category String
- * @param {string} [string=''] The string to escape.
- * @returns {string} Returns the escaped string.
- * @example
- *
- * _.escapeRegExp('[lodash](https://lodash.com/)');
- * // => '\[lodash\]\(https://lodash\.com/\)'
- */
- function escapeRegExp(string) {
- string = toString(string);
- return (string && reHasRegExpChar.test(string))
- ? string.replace(reRegExpChar, '\\$&')
- : string;
- }
- /**
- * Iterates over own and inherited enumerable string keyed properties of an
- * object and invokes `iteratee` for each property. The iteratee is invoked
- * with three arguments: (value, key, object). Iteratee functions may exit
- * iteration early by explicitly returning `false`.
- *
- * @static
- * @memberOf _
- * @since 0.3.0
- * @category Object
- * @param {Object} object The object to iterate over.
- * @param {Function} [iteratee=_.identity] The function invoked per iteration.
- * @returns {Object} Returns `object`.
- * @see _.forInRight
- * @example
- *
- * function Foo() {
- * this.a = 1;
- * this.b = 2;
- * }
- *
- * Foo.prototype.c = 3;
- *
- * _.forIn(new Foo, function(value, key) {
- * console.log(key);
- * });
- * // => Logs 'a', 'b', then 'c' (iteration order is not guaranteed).
- */
- function forIn(object, iteratee) {
- return object == null
- ? object
- : baseFor(object, castFunction(iteratee), keysIn);
- }
- /** Error message constants. */
- var FUNC_ERROR_TEXT = 'Expected a function';
- /**
- * Creates a throttled function that only invokes `func` at most once per
- * every `wait` milliseconds. The throttled function comes with a `cancel`
- * method to cancel delayed `func` invocations and a `flush` method to
- * immediately invoke them. Provide `options` to indicate whether `func`
- * should be invoked on the leading and/or trailing edge of the `wait`
- * timeout. The `func` is invoked with the last arguments provided to the
- * throttled function. Subsequent calls to the throttled function return the
- * result of the last `func` invocation.
- *
- * **Note:** If `leading` and `trailing` options are `true`, `func` is
- * invoked on the trailing edge of the timeout only if the throttled function
- * is invoked more than once during the `wait` timeout.
- *
- * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
- * until to the next tick, similar to `setTimeout` with a timeout of `0`.
- *
- * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
- * for details over the differences between `_.throttle` and `_.debounce`.
- *
- * @static
- * @memberOf _
- * @since 0.1.0
- * @category Function
- * @param {Function} func The function to throttle.
- * @param {number} [wait=0] The number of milliseconds to throttle invocations to.
- * @param {Object} [options={}] The options object.
- * @param {boolean} [options.leading=true]
- * Specify invoking on the leading edge of the timeout.
- * @param {boolean} [options.trailing=true]
- * Specify invoking on the trailing edge of the timeout.
- * @returns {Function} Returns the new throttled function.
- * @example
- *
- * // Avoid excessively updating the position while scrolling.
- * jQuery(window).on('scroll', _.throttle(updatePosition, 100));
- *
- * // Invoke `renewToken` when the click event is fired, but not more than once every 5 minutes.
- * var throttled = _.throttle(renewToken, 300000, { 'trailing': false });
- * jQuery(element).on('click', throttled);
- *
- * // Cancel the trailing throttled invocation.
- * jQuery(window).on('popstate', throttled.cancel);
- */
- function throttle$1(func, wait, options) {
- var leading = true,
- trailing = true;
- if (typeof func != 'function') {
- throw new TypeError(FUNC_ERROR_TEXT);
- }
- if (isObject(options)) {
- leading = 'leading' in options ? !!options.leading : leading;
- trailing = 'trailing' in options ? !!options.trailing : trailing;
- }
- return debounce$1(func, wait, {
- 'leading': leading,
- 'maxWait': wait,
- 'trailing': trailing
- });
- }
- const observed = new Set();
- let mutationObserver;
- const observerOptions = { childList: true };
- /**
- * Helper to set up a conditional slot component on connectedCallback.
- */
- function connectConditionalSlotComponent(component) {
- if (!mutationObserver) {
- mutationObserver = createObserver();
- }
- mutationObserver.observe(component.el, observerOptions);
- }
- /**
- * Helper to tear down a conditional slot component on disconnectedCallback.
- */
- function disconnectConditionalSlotComponent(component) {
- observed.delete(component.el);
- // we explicitly process queued mutations and disconnect and reconnect
- // the observer until MutationObserver gets an `unobserve` method
- // see https://github.com/whatwg/dom/issues/126
- processMutations(mutationObserver.takeRecords());
- mutationObserver.disconnect();
- for (const [element] of observed.entries()) {
- mutationObserver.observe(element, observerOptions);
- }
- }
- function processMutations(mutations) {
- mutations.forEach(({ target }) => {
- forceUpdate$1(target);
- });
- }
- const actionBarCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-action-bar:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-action-bar{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-action-bar{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-action-bar{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-action-bar{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-action-bar{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:host*/.sc-calcite-action-bar-h{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}/*!@:host **/.sc-calcite-action-bar-h *.sc-calcite-action-bar{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:root*/.sc-calcite-action-bar:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-action-bar-h{display:none}/*!@:host*/.sc-calcite-action-bar-h{pointer-events:auto;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-item-align:stretch;align-self:stretch;max-width:15vw}/*!@:host([overflow-actions-disabled])*/[overflow-actions-disabled].sc-calcite-action-bar-h{overflow-y:auto}/*!@:host([expanded])*/[expanded].sc-calcite-action-bar-h{max-width:20vw}/*!@::slotted(calcite-action-group)*/.sc-calcite-action-bar-s>calcite-action-group{border-width:0px;border-bottom-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3)}/*!@::slotted(calcite-action-group:last-child)*/.sc-calcite-action-bar-s>calcite-action-group:last-child{border-bottom-width:0px}/*!@.action-group--bottom*/.action-group--bottom.sc-calcite-action-bar{-ms-flex-positive:1;flex-grow:1;-ms-flex-pack:end;justify-content:flex-end;padding-bottom:0px}";
- /**
- * @slot - A slot for adding `calcite-action`s that will appear at the top of the action bar.
- * @slot bottom-actions - A slot for adding `calcite-action`s that will appear at the bottom of the action bar, above the collapse/expand button.
- * @slot expand-tooltip - Used to set the tooltip for the expand toggle.
- */
- class ActionBar {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteActionBarToggle = createEvent(this, "calciteActionBarToggle", 7);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * When set to true, the expand-toggling behavior will be disabled.
- */
- this.expandDisabled = false;
- /**
- * Indicates whether widget is expanded.
- */
- this.expanded = false;
- /**
- * Disables automatically overflowing actions that won't fit into menus.
- */
- this.overflowActionsDisabled = false;
- this.mutationObserver = createObserver();
- this.resizeObserver = createObserver();
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.actionMenuOpenChangeHandler = (event) => {
- if (event.detail) {
- const composedPath = event.composedPath();
- Array.from(this.el.querySelectorAll("calcite-action-group")).forEach((group) => {
- if (!composedPath.includes(group)) {
- group.menuOpen = false;
- }
- });
- }
- };
- this.resizeHandlerEntries = (entries) => {
- entries.forEach(this.resizeHandler);
- };
- this.resizeHandler = (entry) => {
- const { height } = entry.contentRect;
- this.resize(height);
- };
- this.resize = debounce$1((height) => {
- var _a;
- const { el, expanded, expandDisabled } = this;
- if (!height) {
- return;
- }
- const actions = queryActions(el);
- const actionCount = expandDisabled ? actions.length : actions.length + 1;
- const actionGroups = Array.from(el.querySelectorAll("calcite-action-group"));
- const groupCount = getSlotted(el, SLOTS$n.bottomActions) || !expandDisabled
- ? actionGroups.length + 1
- : actionGroups.length;
- const overflowCount = getOverflowCount({
- actionCount,
- actionHeight: (_a = actions[0]) === null || _a === void 0 ? void 0 : _a.clientHeight,
- height,
- groupCount
- });
- overflowActions({
- actionGroups,
- expanded,
- overflowCount
- });
- }, overflowActionsDebounceInMs);
- this.conditionallyOverflowActions = () => {
- if (!this.overflowActionsDisabled) {
- this.overflowActions();
- }
- };
- this.toggleExpand = () => {
- this.expanded = !this.expanded;
- this.calciteActionBarToggle.emit();
- };
- this.setExpandToggleRef = (el) => {
- this.expandToggleEl = el;
- };
- }
- expandHandler() {
- this.conditionallyOverflowActions();
- }
- expandedHandler(expanded) {
- toggleChildActionText({ parent: this.el, expanded });
- }
- overflowDisabledHandler(overflowActionsDisabled) {
- overflowActionsDisabled
- ? this.resizeObserver.disconnect()
- : this.resizeObserver.observe(this.el);
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- componentDidLoad() {
- this.conditionallyOverflowActions();
- }
- connectedCallback() {
- var _a, _b;
- const { el, expanded } = this;
- toggleChildActionText({ parent: el, expanded });
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(el, { childList: true, subtree: true });
- if (!this.overflowActionsDisabled) {
- (_b = this.resizeObserver) === null || _b === void 0 ? void 0 : _b.observe(el);
- }
- this.conditionallyOverflowActions();
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- var _a, _b;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- (_b = this.resizeObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
- disconnectConditionalSlotComponent(this);
- }
- // --------------------------------------------------------------------------
- //
- // Methods
- //
- // --------------------------------------------------------------------------
- /**
- * Overflows actions that won't fit into menus.
- * @internal
- */
- async overflowActions() {
- this.resize(this.el.clientHeight);
- }
- /** Sets focus on the component. */
- async setFocus(focusId) {
- if (focusId === "expand-toggle") {
- await focusElement(this.expandToggleEl);
- return;
- }
- this.el.focus();
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- renderBottomActionGroup() {
- const { expanded, expandDisabled, intlExpand, intlCollapse, el, position, toggleExpand, scale } = this;
- const tooltip = getSlotted(el, SLOTS$n.expandTooltip);
- const expandLabel = intlExpand || TEXT$p.expand;
- const collapseLabel = intlCollapse || TEXT$p.collapse;
- const expandToggleNode = !expandDisabled ? (hAsync(ExpandToggle, { el: el, expanded: expanded, intlCollapse: collapseLabel, intlExpand: expandLabel, position: position, ref: this.setExpandToggleRef, scale: scale, toggle: toggleExpand, tooltip: tooltip })) : null;
- return getSlotted(el, SLOTS$n.bottomActions) || expandToggleNode ? (hAsync("calcite-action-group", { class: CSS$N.actionGroupBottom, scale: scale }, hAsync("slot", { name: SLOTS$n.bottomActions }), hAsync("slot", { name: SLOTS$n.expandTooltip }), expandToggleNode)) : null;
- }
- render() {
- return (hAsync(Host, { onCalciteActionMenuOpenChange: this.actionMenuOpenChangeHandler }, hAsync("slot", null), this.renderBottomActionGroup()));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "expandDisabled": ["expandHandler"],
- "expanded": ["expandedHandler"],
- "overflowActionsDisabled": ["overflowDisabledHandler"]
- }; }
- static get style() { return actionBarCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-action-bar",
- "$members$": {
- "expandDisabled": [516, "expand-disabled"],
- "expanded": [1540],
- "intlExpand": [1, "intl-expand"],
- "intlCollapse": [1, "intl-collapse"],
- "overflowActionsDisabled": [4, "overflow-actions-disabled"],
- "position": [513],
- "scale": [513],
- "overflowActions": [64],
- "setFocus": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["expandDisabled", "expand-disabled"], ["expanded", "expanded"], ["position", "position"], ["scale", "scale"]]
- }; }
- }
- const actionGroupCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-action-group:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-action-group{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-action-group{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-action-group{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-action-group{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-action-group{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:host*/.sc-calcite-action-group-h{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}/*!@:host **/.sc-calcite-action-group-h *.sc-calcite-action-group{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:root*/.sc-calcite-action-group:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-action-group-h{display:none}/*!@:host*/.sc-calcite-action-group-h{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding:0px;--calcite-action-group-columns:3}/*!@:host([columns=\"1\"])*/[columns=\"1\"].sc-calcite-action-group-h{--calcite-action-group-columns:1}/*!@:host([columns=\"2\"])*/[columns=\"2\"].sc-calcite-action-group-h{--calcite-action-group-columns:2}/*!@:host([columns=\"3\"])*/[columns=\"3\"].sc-calcite-action-group-h{--calcite-action-group-columns:3}/*!@:host([columns=\"4\"])*/[columns=\"4\"].sc-calcite-action-group-h{--calcite-action-group-columns:4}/*!@:host([columns=\"5\"])*/[columns=\"5\"].sc-calcite-action-group-h{--calcite-action-group-columns:5}/*!@:host([columns=\"6\"])*/[columns=\"6\"].sc-calcite-action-group-h{--calcite-action-group-columns:6}/*!@:host(:first-child)*/.sc-calcite-action-group-h:first-child{padding-top:0px}/*!@:host([layout=horizontal])*/[layout=horizontal].sc-calcite-action-group-h{-ms-flex-direction:row;flex-direction:row}/*!@:host([layout=grid])*/[layout=grid].sc-calcite-action-group-h{display:grid;place-content:stretch;gap:1px;background-color:var(--calcite-ui-background);padding:1px;grid-template-columns:repeat(var(--calcite-action-group-columns), auto)}";
- /**
- * @slot - A slot for adding a group of `calcite-action`s.
- * @slot menu-actions - a slot for adding an overflow menu with actions inside a dropdown.
- * @slot menu-tooltip - a slot for adding an tooltip for the menu.
- */
- class ActionGroup {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * Indicates whether widget is expanded.
- */
- this.expanded = false;
- /**
- * Indicates the horizontal, vertical, or grid layout of the component.
- */
- this.layout = "vertical";
- /**
- * Opens the action menu.
- */
- this.menuOpen = false;
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.setMenuOpen = (event) => {
- this.menuOpen = !!event.detail;
- };
- }
- expandedHandler() {
- this.menuOpen = false;
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- disconnectConditionalSlotComponent(this);
- }
- // --------------------------------------------------------------------------
- //
- // Component Methods
- //
- // --------------------------------------------------------------------------
- renderTooltip() {
- const { el } = this;
- const hasTooltip = getSlotted(el, SLOTS$o.menuTooltip);
- return hasTooltip ? hAsync("slot", { name: SLOTS$o.menuTooltip, slot: SLOTS$p.tooltip }) : null;
- }
- renderMenu() {
- const { el, expanded, intlMore, menuOpen, scale } = this;
- const hasMenuItems = getSlotted(el, SLOTS$o.menuActions);
- return hasMenuItems ? (hAsync("calcite-action-menu", { expanded: expanded, flipPlacements: ["left", "right"], label: intlMore || TEXT$q.more, onCalciteActionMenuOpenChange: this.setMenuOpen, open: menuOpen, placement: "leading-start", scale: scale }, hAsync("calcite-action", { icon: ICONS$e.menu, scale: scale, slot: SLOTS$p.trigger, text: intlMore || TEXT$q.more, textEnabled: expanded }), hAsync("slot", { name: SLOTS$o.menuActions }), this.renderTooltip())) : null;
- }
- render() {
- return (hAsync(Fragment, null, hAsync("slot", null), this.renderMenu()));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "expanded": ["expandedHandler"]
- }; }
- static get style() { return actionGroupCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-action-group",
- "$members$": {
- "expanded": [516],
- "layout": [513],
- "columns": [514],
- "intlMore": [1, "intl-more"],
- "menuOpen": [1540, "menu-open"],
- "scale": [513]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["expanded", "expanded"], ["layout", "layout"], ["columns", "columns"], ["menuOpen", "menu-open"], ["scale", "scale"]]
- }; }
- }
- function getRoundRobinIndex(index, total) {
- return (index + total) % total;
- }
- const actionMenuCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-action-menu:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-action-menu{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-action-menu{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-action-menu{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-action-menu{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-action-menu{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-action-menu:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-action-menu-h{display:none}/*!@:host*/.sc-calcite-action-menu-h{-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;background-color:var(--calcite-ui-foreground-1);font-size:var(--calcite-font-size-1);color:var(--calcite-ui-text-2)}/*!@.menu ::slotted(calcite-action)*/.menu .sc-calcite-action-menu-s>calcite-action{margin:0.125rem;display:-ms-flexbox;display:flex;outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@::slotted(calcite-action[active])*/.sc-calcite-action-menu-s>calcite-action[active]{outline:2px solid var(--calcite-ui-brand);outline-offset:0px}/*!@.default-trigger*/.default-trigger.sc-calcite-action-menu{position:relative;height:100%;-ms-flex:0 1 auto;flex:0 1 auto;-ms-flex-item-align:stretch;align-self:stretch}/*!@slot[name=trigger]::slotted(calcite-action), calcite-action::slotted([slot=trigger])*/slot[name=trigger].sc-calcite-action-menu-s>calcite-action,calcite-action.sc-calcite-action-menu-s>[slot=trigger]{position:relative;height:100%;-ms-flex:0 1 auto;flex:0 1 auto;-ms-flex-item-align:stretch;align-self:stretch}/*!@.menu*/.menu.sc-calcite-action-menu{-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap;outline:2px solid transparent;outline-offset:2px}";
- const SUPPORTED_BUTTON_NAV_KEYS = ["ArrowUp", "ArrowDown"];
- const SUPPORTED_MENU_NAV_KEYS = ["ArrowUp", "ArrowDown", "End", "Home"];
- /**
- * @slot - A slot for adding `calcite-action`s.
- * @slot trigger - A slot for adding a `calcite-action` to trigger opening the menu.
- * @slot tooltip - A slot for adding an tooltip for the menu.
- */
- class ActionMenu {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteActionMenuOpenChange = createEvent(this, "calciteActionMenuOpenChange", 7);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * Indicates whether widget is expanded.
- */
- this.expanded = false;
- /**
- * Opens the action menu.
- */
- this.open = false;
- /** Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value. */
- this.overlayPositioning = "absolute";
- /**
- * Determines where the component will be positioned relative to the referenceElement.
- * @see [PopperPlacement](https://github.com/Esri/calcite-components/blob/master/src/utils/popper.ts#L25)
- */
- this.placement = "auto";
- this.actionElements = [];
- this.mutationObserver = createObserver();
- this.guid = `calcite-action-menu-${guid()}`;
- this.menuId = `${this.guid}-menu`;
- this.menuButtonId = `${this.guid}-menu-button`;
- this.activeMenuItemIndex = -1;
- // --------------------------------------------------------------------------
- //
- // Component Methods
- //
- // --------------------------------------------------------------------------
- this.connectMenuButtonEl = () => {
- const { el, menuButtonId, menuId, open, label } = this;
- const menuButtonEl = getSlotted(el, SLOTS$p.trigger) || this.defaultMenuButtonEl;
- if (this.menuButtonEl === menuButtonEl) {
- return;
- }
- this.disconnectMenuButtonEl();
- this.menuButtonEl = menuButtonEl;
- this.setTooltipReferenceElement();
- if (!menuButtonEl) {
- return;
- }
- menuButtonEl.active = open;
- menuButtonEl.setAttribute("aria-controls", menuId);
- menuButtonEl.setAttribute("aria-expanded", toAriaBoolean(open));
- menuButtonEl.setAttribute("aria-haspopup", "true");
- if (!menuButtonEl.id) {
- menuButtonEl.id = menuButtonId;
- }
- if (!menuButtonEl.label) {
- menuButtonEl.label = label;
- }
- if (!menuButtonEl.text) {
- menuButtonEl.text = label;
- }
- menuButtonEl.addEventListener("click", this.menuButtonClick);
- menuButtonEl.addEventListener("keydown", this.menuButtonKeyDown);
- menuButtonEl.addEventListener("keyup", this.menuButtonKeyUp);
- };
- this.disconnectMenuButtonEl = () => {
- const { menuButtonEl } = this;
- if (!menuButtonEl) {
- return;
- }
- menuButtonEl.removeEventListener("click", this.menuButtonClick);
- menuButtonEl.removeEventListener("keydown", this.menuButtonKeyDown);
- menuButtonEl.removeEventListener("keyup", this.menuButtonKeyUp);
- };
- this.setDefaultMenuButtonEl = (el) => {
- this.defaultMenuButtonEl = el;
- this.connectMenuButtonEl();
- };
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.handleCalciteActionClick = () => {
- this.open = false;
- this.setFocus();
- };
- this.menuButtonClick = () => {
- this.toggleOpen();
- };
- this.updateTooltip = (event) => {
- const tooltips = event.target
- .assignedElements({
- flatten: true
- })
- .filter((el) => el === null || el === void 0 ? void 0 : el.matches("calcite-tooltip"));
- this.tooltipEl = tooltips[0];
- this.setTooltipReferenceElement();
- };
- this.setTooltipReferenceElement = () => {
- const { tooltipEl, expanded, menuButtonEl } = this;
- if (tooltipEl) {
- tooltipEl.referenceElement = !expanded ? menuButtonEl : null;
- }
- };
- this.updateAction = (action, index) => {
- const { guid, activeMenuItemIndex } = this;
- const id = `${guid}-action-${index}`;
- action.tabIndex = -1;
- action.setAttribute("role", "menuitem");
- if (!action.id) {
- action.id = id;
- }
- action.active = index === activeMenuItemIndex;
- };
- this.updateActions = (actions) => {
- actions === null || actions === void 0 ? void 0 : actions.forEach(this.updateAction);
- };
- this.getActions = () => {
- const { el } = this;
- const actionElements = getSlotted(el, { all: true, matches: "calcite-action" });
- this.updateActions(actionElements);
- this.actionElements = actionElements;
- this.connectMenuButtonEl();
- };
- this.menuButtonKeyUp = (event) => {
- const { key } = event;
- const { actionElements } = this;
- if (!this.isValidKey(key, SUPPORTED_BUTTON_NAV_KEYS)) {
- return;
- }
- event.preventDefault();
- if (!actionElements.length) {
- return;
- }
- this.toggleOpen(true);
- this.handleActionNavigation(key, actionElements);
- };
- this.menuButtonKeyDown = (event) => {
- const { key } = event;
- if (!this.isValidKey(key, SUPPORTED_BUTTON_NAV_KEYS)) {
- return;
- }
- event.preventDefault();
- };
- this.menuActionsContainerKeyDown = (event) => {
- const { key } = event;
- const { actionElements, activeMenuItemIndex } = this;
- if (key === "Tab") {
- this.open = false;
- return;
- }
- if (key === " " || key === "Enter") {
- event.preventDefault();
- const action = actionElements[activeMenuItemIndex];
- action ? action.click() : this.toggleOpen(false);
- return;
- }
- if (this.isValidKey(key, SUPPORTED_MENU_NAV_KEYS)) {
- event.preventDefault();
- }
- };
- this.menuActionsContainerKeyUp = (event) => {
- const { key } = event;
- const { actionElements } = this;
- if (key === "Escape") {
- this.toggleOpen(false);
- return;
- }
- if (!this.isValidKey(key, SUPPORTED_MENU_NAV_KEYS)) {
- return;
- }
- event.preventDefault();
- if (!actionElements.length) {
- return;
- }
- this.handleActionNavigation(key, actionElements);
- };
- this.handleActionNavigation = (key, actions) => {
- const currentIndex = this.activeMenuItemIndex;
- if (key === "Home") {
- this.activeMenuItemIndex = 0;
- }
- if (key === "End") {
- this.activeMenuItemIndex = actions.length - 1;
- }
- if (key === "ArrowUp") {
- this.activeMenuItemIndex = getRoundRobinIndex(Math.max(currentIndex - 1, -1), actions.length);
- }
- if (key === "ArrowDown") {
- this.activeMenuItemIndex = getRoundRobinIndex(currentIndex + 1, actions.length);
- }
- };
- this.toggleOpenEnd = () => {
- this.setFocus();
- this.el.removeEventListener("calcitePopoverOpen", this.toggleOpenEnd);
- };
- this.toggleOpen = (value = !this.open) => {
- this.el.addEventListener("calcitePopoverOpen", this.toggleOpenEnd);
- this.open = value;
- };
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });
- this.getActions();
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- this.disconnectMenuButtonEl();
- disconnectConditionalSlotComponent(this);
- }
- expandedHandler() {
- this.open = false;
- this.setTooltipReferenceElement();
- }
- openHandler(open) {
- this.activeMenuItemIndex = this.open ? 0 : -1;
- if (this.menuButtonEl) {
- this.menuButtonEl.active = open;
- }
- this.calciteActionMenuOpenChange.emit(open);
- }
- closeCalciteActionMenuOnClick(event) {
- const composedPath = event.composedPath();
- if (composedPath.includes(this.el)) {
- return;
- }
- this.open = false;
- }
- activeMenuItemIndexHandler() {
- this.updateActions(this.actionElements);
- }
- // --------------------------------------------------------------------------
- //
- // Methods
- //
- // --------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- focusElement(this.open ? this.menuEl : this.menuButtonEl);
- }
- renderMenuButton() {
- const { label, scale } = this;
- const menuButtonSlot = (hAsync("slot", { name: SLOTS$p.trigger }, hAsync("calcite-action", { class: CSS$O.defaultTrigger, icon: ICONS$f.menu, ref: this.setDefaultMenuButtonEl, scale: scale, text: label })));
- return menuButtonSlot;
- }
- renderMenuItems() {
- const { actionElements, activeMenuItemIndex, open, menuId, menuButtonEl, label, placement, overlayPositioning, flipPlacements } = this;
- const activeAction = actionElements[activeMenuItemIndex];
- const activeDescendantId = (activeAction === null || activeAction === void 0 ? void 0 : activeAction.id) || null;
- return (hAsync("calcite-popover", { disablePointer: true, flipPlacements: flipPlacements, label: label, offsetDistance: 0, open: open, overlayPositioning: overlayPositioning, placement: placement, referenceElement: menuButtonEl }, hAsync("div", { "aria-activedescendant": activeDescendantId, "aria-labelledby": menuButtonEl === null || menuButtonEl === void 0 ? void 0 : menuButtonEl.id, class: CSS$O.menu, id: menuId, onClick: this.handleCalciteActionClick, onKeyDown: this.menuActionsContainerKeyDown, onKeyUp: this.menuActionsContainerKeyUp, ref: (el) => (this.menuEl = el), role: "menu", tabIndex: -1 }, hAsync("slot", null))));
- }
- render() {
- return (hAsync(Fragment, null, this.renderMenuButton(), this.renderMenuItems(), hAsync("slot", { name: SLOTS$p.tooltip, onSlotchange: this.updateTooltip })));
- }
- isValidKey(key, supportedKeys) {
- return !!supportedKeys.find((k) => k === key);
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "expanded": ["expandedHandler"],
- "open": ["openHandler"],
- "activeMenuItemIndex": ["activeMenuItemIndexHandler"]
- }; }
- static get style() { return actionMenuCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-action-menu",
- "$members$": {
- "expanded": [516],
- "flipPlacements": [16],
- "label": [1],
- "open": [1540],
- "overlayPositioning": [1, "overlay-positioning"],
- "placement": [513],
- "scale": [513],
- "activeMenuItemIndex": [32],
- "setFocus": [64]
- },
- "$listeners$": [[8, "click", "closeCalciteActionMenuOnClick"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["expanded", "expanded"], ["open", "open"], ["placement", "placement"], ["scale", "scale"]]
- }; }
- }
- const CSS$M = {
- actionGroupBottom: "action-group--bottom",
- container: "container"
- };
- const TEXT$o = {
- expand: "Expand",
- collapse: "Collapse"
- };
- const SLOTS$m = {
- expandTooltip: "expand-tooltip"
- };
- const actionPadCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-action-pad:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-action-pad{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-action-pad{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-action-pad{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-action-pad{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-action-pad{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:host*/.sc-calcite-action-pad-h{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}/*!@:host **/.sc-calcite-action-pad-h *.sc-calcite-action-pad{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:root*/.sc-calcite-action-pad:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-action-pad-h{display:none}/*!@:host*/.sc-calcite-action-pad-h{display:block}@keyframes in{0%{opacity:0}100%{opacity:1}}/*!@:host*/.sc-calcite-action-pad-h{-webkit-animation:in var(--calcite-internal-animation-timing-slow) ease-in-out;animation:in var(--calcite-internal-animation-timing-slow) ease-in-out;border-radius:0.125rem}/*!@:host([expanded])*/[expanded].sc-calcite-action-pad-h{max-width:20vw}/*!@::slotted(calcite-action-group)*/.sc-calcite-action-pad-s>calcite-action-group{border-width:0px;border-bottom-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3);padding-bottom:0px;padding-top:0px}/*!@.container*/.container.sc-calcite-action-pad{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:column;flex-direction:column;overflow-y:auto;border-radius:0.25rem;background-color:var(--calcite-ui-background);--tw-shadow:0 6px 20px -4px rgba(0, 0, 0, 0.1), 0 4px 12px -2px rgba(0, 0, 0, 0.08);--tw-shadow-colored:0 6px 20px -4px var(--tw-shadow-color), 0 4px 12px -2px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);max-width:15vw}/*!@.action-group--bottom*/.action-group--bottom.sc-calcite-action-pad{-ms-flex-positive:1;flex-grow:1;-ms-flex-pack:end;justify-content:flex-end;padding-bottom:0px}/*!@:host([layout=horizontal]) .container*/[layout=horizontal].sc-calcite-action-pad-h .container.sc-calcite-action-pad{-ms-flex-direction:row;flex-direction:row;max-width:unset}/*!@:host([layout=horizontal]) .container .action-group--bottom*/[layout=horizontal].sc-calcite-action-pad-h .container.sc-calcite-action-pad .action-group--bottom.sc-calcite-action-pad{padding:0px}/*!@:host([layout=horizontal]) .container ::slotted(calcite-action-group)*/.sc-calcite-action-pad-h[layout=horizontal] .container .sc-calcite-action-pad-s>calcite-action-group{border-width:0px;padding:0px;border-inline-end-width:1px}/*!@::slotted(calcite-action-group:last-child)*/.sc-calcite-action-pad-s>calcite-action-group:last-child{border-bottom-width:0px}";
- /**
- * @slot - A slot for adding `calcite-action`s to the action pad.
- * @slot expand-tooltip - Used to set the tooltip for the expand toggle.
- */
- class ActionPad {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteActionPadToggle = createEvent(this, "calciteActionPadToggle", 7);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * When set to true, the expand-toggling behavior will be disabled.
- */
- this.expandDisabled = false;
- /**
- * Indicates whether widget is expanded.
- */
- this.expanded = false;
- /**
- * Indicates the horizontal or vertical layout of the component.
- */
- this.layout = "vertical";
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.actionMenuOpenChangeHandler = (event) => {
- if (event.detail) {
- const composedPath = event.composedPath();
- Array.from(this.el.querySelectorAll("calcite-action-group")).forEach((group) => {
- if (!composedPath.includes(group)) {
- group.menuOpen = false;
- }
- });
- }
- };
- this.toggleExpand = () => {
- this.expanded = !this.expanded;
- this.calciteActionPadToggle.emit();
- };
- this.setExpandToggleRef = (el) => {
- this.expandToggleEl = el;
- };
- }
- expandedHandler(expanded) {
- toggleChildActionText({ parent: this.el, expanded });
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- disconnectConditionalSlotComponent(this);
- }
- componentWillLoad() {
- const { el, expanded } = this;
- toggleChildActionText({ parent: el, expanded });
- }
- // --------------------------------------------------------------------------
- //
- // Methods
- //
- // --------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus(focusId) {
- if (focusId === "expand-toggle") {
- await focusElement(this.expandToggleEl);
- return;
- }
- this.el.focus();
- }
- // --------------------------------------------------------------------------
- //
- // Component Methods
- //
- // --------------------------------------------------------------------------
- renderBottomActionGroup() {
- const { expanded, expandDisabled, intlExpand, intlCollapse, el, position, toggleExpand, scale } = this;
- const tooltip = getSlotted(el, SLOTS$m.expandTooltip);
- const expandLabel = intlExpand || TEXT$o.expand;
- const collapseLabel = intlCollapse || TEXT$o.collapse;
- const expandToggleNode = !expandDisabled ? (hAsync(ExpandToggle, { el: el, expanded: expanded, intlCollapse: collapseLabel, intlExpand: expandLabel, position: position, ref: this.setExpandToggleRef, scale: scale, toggle: toggleExpand, tooltip: tooltip })) : null;
- return expandToggleNode ? (hAsync("calcite-action-group", { class: CSS$M.actionGroupBottom, scale: scale }, hAsync("slot", { name: SLOTS$m.expandTooltip }), expandToggleNode)) : null;
- }
- render() {
- return (hAsync(Host, { onCalciteActionMenuOpenChange: this.actionMenuOpenChangeHandler }, hAsync("div", { class: CSS$M.container }, hAsync("slot", null), this.renderBottomActionGroup())));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "expanded": ["expandedHandler"]
- }; }
- static get style() { return actionPadCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-action-pad",
- "$members$": {
- "expandDisabled": [516, "expand-disabled"],
- "expanded": [1540],
- "layout": [513],
- "intlExpand": [1, "intl-expand"],
- "intlCollapse": [1, "intl-collapse"],
- "position": [513],
- "scale": [513],
- "setFocus": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["expandDisabled", "expand-disabled"], ["expanded", "expanded"], ["layout", "layout"], ["position", "position"], ["scale", "scale"]]
- }; }
- }
- const TEXT$n = {
- intlClose: "Close"
- };
- const DURATIONS = {
- slow: 14000,
- medium: 10000,
- fast: 6000
- };
- const SLOTS$l = {
- title: "title",
- message: "message",
- link: "link"
- };
- var StatusIcons;
- (function (StatusIcons) {
- StatusIcons["green"] = "checkCircle";
- StatusIcons["yellow"] = "exclamationMarkTriangle";
- StatusIcons["red"] = "exclamationMarkTriangle";
- StatusIcons["blue"] = "lightbulb";
- })(StatusIcons || (StatusIcons = {}));
- const alertCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-alert:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-alert{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-alert{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-alert{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-alert{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-alert{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-alert:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-alert-h{display:none}/*!@:host([scale=s])*/[scale=s].sc-calcite-alert-h{--calcite-alert-width:40em;--calcite-alert-spacing-token-small:0.5rem;--calcite-alert-spacing-token-large:0.75rem}/*!@:host([scale=s]) slot[name=title]::slotted(*), :host([scale=s]) *::slotted([slot=title])*/.sc-calcite-alert-h[scale=s] slot[name=title].sc-calcite-alert-s>*,.sc-calcite-alert-h[scale=s] *.sc-calcite-alert-s>[slot=title]{font-size:var(--calcite-font-size--1);line-height:1.375}/*!@:host([scale=s]) slot[name=message]::slotted(*), :host([scale=s]) *::slotted([slot=message])*/.sc-calcite-alert-h[scale=s] slot[name=message].sc-calcite-alert-s>*,.sc-calcite-alert-h[scale=s] *.sc-calcite-alert-s>[slot=message]{font-size:var(--calcite-font-size--2);line-height:1.375}/*!@:host([scale=s]) slot[name=link]::slotted(*), :host([scale=s]) *::slotted([slot=link])*/.sc-calcite-alert-h[scale=s] slot[name=link].sc-calcite-alert-s>*,.sc-calcite-alert-h[scale=s] *.sc-calcite-alert-s>[slot=link]{font-size:var(--calcite-font-size--2);line-height:1.375}/*!@:host([scale=s]) .alert-queue-count*/[scale=s].sc-calcite-alert-h .alert-queue-count.sc-calcite-alert{margin-left:0.5rem;margin-right:0.5rem}/*!@:host([scale=s]) .container*/[scale=s].sc-calcite-alert-h .container.sc-calcite-alert{--calcite-alert-min-height:3.5rem}/*!@:host([scale=s]) .alert-close*/[scale=s].sc-calcite-alert-h .alert-close.sc-calcite-alert{padding:0.5rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-alert-h{--calcite-alert-width:50em;--calcite-alert-spacing-token-small:0.75rem;--calcite-alert-spacing-token-large:1rem}/*!@:host([scale=m]) slot[name=title]::slotted(*), :host([scale=m]) *::slotted([slot=title])*/.sc-calcite-alert-h[scale=m] slot[name=title].sc-calcite-alert-s>*,.sc-calcite-alert-h[scale=m] *.sc-calcite-alert-s>[slot=title]{font-size:var(--calcite-font-size-0);line-height:1.375}/*!@:host([scale=m]) slot[name=message]::slotted(*), :host([scale=m]) *::slotted([slot=message])*/.sc-calcite-alert-h[scale=m] slot[name=message].sc-calcite-alert-s>*,.sc-calcite-alert-h[scale=m] *.sc-calcite-alert-s>[slot=message]{font-size:var(--calcite-font-size--1);line-height:1.375}/*!@:host([scale=m]) slot[name=link]::slotted(*), :host([scale=m]) *::slotted([slot=link])*/.sc-calcite-alert-h[scale=m] slot[name=link].sc-calcite-alert-s>*,.sc-calcite-alert-h[scale=m] *.sc-calcite-alert-s>[slot=link]{font-size:var(--calcite-font-size--1);line-height:1.375}/*!@:host([scale=m]) .alert-queue-count*/[scale=m].sc-calcite-alert-h .alert-queue-count.sc-calcite-alert{margin-left:0.75rem;margin-right:0.75rem}/*!@:host([scale=m]) .container*/[scale=m].sc-calcite-alert-h .container.sc-calcite-alert{--calcite-alert-min-height:4.1875rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-alert-h{--calcite-alert-width:60em;--calcite-alert-spacing-token-small:1rem;--calcite-alert-spacing-token-large:1.25rem}/*!@:host([scale=l]) slot[name=title]::slotted(*), :host([scale=l]) *::slotted([slot=title])*/.sc-calcite-alert-h[scale=l] slot[name=title].sc-calcite-alert-s>*,.sc-calcite-alert-h[scale=l] *.sc-calcite-alert-s>[slot=title]{margin-bottom:0.25rem;font-size:var(--calcite-font-size-1);line-height:1.375}/*!@:host([scale=l]) slot[name=message]::slotted(*), :host([scale=l]) *::slotted([slot=message])*/.sc-calcite-alert-h[scale=l] slot[name=message].sc-calcite-alert-s>*,.sc-calcite-alert-h[scale=l] *.sc-calcite-alert-s>[slot=message]{font-size:var(--calcite-font-size-0);line-height:1.375}/*!@:host([scale=l]) slot[name=link]::slotted(*), :host([scale=l]) *::slotted([slot=link])*/.sc-calcite-alert-h[scale=l] slot[name=link].sc-calcite-alert-s>*,.sc-calcite-alert-h[scale=l] *.sc-calcite-alert-s>[slot=link]{font-size:var(--calcite-font-size-0);line-height:1.375}/*!@:host([scale=l]) .alert-queue-count*/[scale=l].sc-calcite-alert-h .alert-queue-count.sc-calcite-alert{margin-left:1rem;margin-right:1rem}/*!@:host([scale=l]) .container*/[scale=l].sc-calcite-alert-h .container.sc-calcite-alert{--calcite-alert-min-height:5.625rem}/*!@:host*/.sc-calcite-alert-h{--calcite-alert-edge-distance:2rem;display:block}/*!@:host .container*/.sc-calcite-alert-h .container.sc-calcite-alert{pointer-events:none;position:fixed;margin-top:0px;margin-bottom:0px;margin-left:auto;margin-right:auto;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background-color:var(--calcite-ui-foreground-1);opacity:0;--tw-shadow:0 6px 20px -4px rgba(0, 0, 0, 0.1), 0 4px 12px -2px rgba(0, 0, 0, 0.08);--tw-shadow-colored:0 6px 20px -4px var(--tw-shadow-color), 0 4px 12px -2px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);border-radius:var(--calcite-border-radius);border-top:0px solid transparent;border-left:1px solid var(--calcite-ui-border-3);border-right:1px solid var(--calcite-ui-border-3);border-bottom:1px solid var(--calcite-ui-border-3);min-height:var(--calcite-alert-min-height);width:var(--calcite-alert-width);max-width:calc(100% - (var(--calcite-alert-edge-distance) * 2 + 2px));max-height:0;z-index:101;-webkit-transition:var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), all var(--calcite-animation-timing) ease-in-out;transition:var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), all var(--calcite-animation-timing) ease-in-out}/*!@:host .container.bottom, :host .container.top*/.sc-calcite-alert-h .container.bottom.sc-calcite-alert,.sc-calcite-alert-h .container.top.sc-calcite-alert{inset-inline-end:0;inset-inline-start:0}/*!@:host .container[class*=bottom]*/.sc-calcite-alert-h .container[class*=bottom].sc-calcite-alert{-webkit-transform:translate3d(0, var(--calcite-alert-edge-distance), 0);transform:translate3d(0, var(--calcite-alert-edge-distance), 0);inset-block-end:var(--calcite-alert-edge-distance)}/*!@:host .container[class*=top]*/.sc-calcite-alert-h .container[class*=top].sc-calcite-alert{-webkit-transform:translate3d(0, calc(-1 * var(--calcite-alert-edge-distance)), 0);transform:translate3d(0, calc(-1 * var(--calcite-alert-edge-distance)), 0);inset-block-start:var(--calcite-alert-edge-distance)}/*!@:host .container[class*=-start]*/.sc-calcite-alert-h .container[class*=-start].sc-calcite-alert{inset-inline-start:var(--calcite-alert-edge-distance);inset-inline-end:auto}/*!@:host .container[class*=-end]*/.sc-calcite-alert-h .container[class*=-end].sc-calcite-alert{inset-inline-end:var(--calcite-alert-edge-distance);inset-inline-start:auto}/*!@.container*/.container.sc-calcite-alert{display:-ms-flexbox;display:flex;width:100%;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}/*!@.alert-close*/.alert-close.sc-calcite-alert{outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@.alert-close:focus*/.alert-close.sc-calcite-alert:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@:host([active]) .container:not(.queued)*/[active].sc-calcite-alert-h .container.sc-calcite-alert:not(.queued){max-height:100%;border-top-width:2px;opacity:1;pointer-events:initial}/*!@:host([active]) .container:not(.queued)[class*=bottom]*/[active].sc-calcite-alert-h .container.sc-calcite-alert:not(.queued)[class*=bottom]{-webkit-transform:translate3d(0, calc(-1 * var(--calcite-alert-edge-distance)), inherit);transform:translate3d(0, calc(-1 * var(--calcite-alert-edge-distance)), inherit)}/*!@:host([active]) .container:not(.queued)[class*=top]*/[active].sc-calcite-alert-h .container.sc-calcite-alert:not(.queued)[class*=top]{-webkit-transform:translate3d(0, var(--calcite-alert-edge-distance), inherit);transform:translate3d(0, var(--calcite-alert-edge-distance), inherit)}/*!@slot[name=title]::slotted(*), *::slotted([slot=title])*/slot[name=title].sc-calcite-alert-s>*,*.sc-calcite-alert-s>[slot=title]{font-size:var(--calcite-font-size-0);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1)}/*!@slot[name=message]::slotted(*), *::slotted([slot=message])*/slot[name=message].sc-calcite-alert-s>*,*.sc-calcite-alert-s>[slot=message]{margin:0px;display:inline;font-size:var(--calcite-font-size--1);line-height:1.375;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-2);-webkit-margin-end:0.5rem;margin-inline-end:0.5rem}/*!@slot[name=link]::slotted(*), *::slotted([slot=link])*/slot[name=link].sc-calcite-alert-s>*,*.sc-calcite-alert-s>[slot=link]{display:-ms-inline-flexbox;display:inline-flex;color:var(--calcite-ui-text-link)}/*!@.alert-content*/.alert-content.sc-calcite-alert{-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;padding:var(--calcite-alert-spacing-token-small) var(--calcite-alert-spacing-token-large);-ms-flex:0 0 auto;flex:0 0 auto;overflow-wrap:break-word;background-color:var(--calcite-ui-foreground-1);-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;padding-block:var(--calcite-alert-spacing-token-small);padding-inline:0 var(--calcite-alert-spacing-token-small);border-bottom-left-radius:var(--calcite-border-radius);border-bottom-right-radius:var(--calcite-border-radius)}/*!@.alert-content:first-of-type:not(:only-child)*/.alert-content.sc-calcite-alert:first-of-type:not(:only-child){-webkit-padding-start:var(--calcite-alert-spacing-token-large);padding-inline-start:var(--calcite-alert-spacing-token-large)}/*!@.alert-content:only-child*/.alert-content.sc-calcite-alert:only-child{padding:var(--calcite-alert-spacing-token-small)}/*!@.alert-icon*/.alert-icon.sc-calcite-alert{-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;padding:var(--calcite-alert-spacing-token-small) var(--calcite-alert-spacing-token-large);-ms-flex:0 0 auto;flex:0 0 auto;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-item-align:stretch;align-self:stretch;background-color:var(--calcite-ui-foreground-1);padding-top:0px;padding-bottom:0px}/*!@.alert-close*/.alert-close.sc-calcite-alert{-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;padding:var(--calcite-alert-spacing-token-small) var(--calcite-alert-spacing-token-large);-ms-flex:0 0 auto;flex:0 0 auto;cursor:pointer;-ms-flex-item-align:stretch;align-self:stretch;overflow:hidden;border-style:none;background-color:var(--calcite-ui-foreground-1);padding-top:0px;padding-bottom:0px;color:var(--calcite-ui-text-3);outline:2px solid transparent;outline-offset:2px;border-end-end-radius:var(--calcite-border-radius)}/*!@.alert-close:hover, .alert-close:focus*/.alert-close.sc-calcite-alert:hover,.alert-close.sc-calcite-alert:focus{background-color:var(--calcite-ui-foreground-2);color:var(--calcite-ui-text-1)}/*!@.alert-close:active*/.alert-close.sc-calcite-alert:active{background-color:var(--calcite-ui-foreground-3)}/*!@.alert-queue-count*/.alert-queue-count.sc-calcite-alert{visibility:hidden;display:-ms-flexbox;display:flex;cursor:default;-ms-flex-align:center;align-items:center;-ms-flex-pack:distribute;justify-content:space-around;-ms-flex-item-align:stretch;align-self:stretch;overflow:hidden;background-color:var(--calcite-ui-foreground-1);text-align:center;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-2);opacity:0;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;border-left:0px solid transparent;border-right:0px solid transparent;border-top-right-radius:0}/*!@.alert-queue-count.active*/.alert-queue-count.active.sc-calcite-alert{visibility:visible;opacity:1}/*!@:host([auto-dismiss]) > .alert-queue-count*/[auto-dismiss].sc-calcite-alert-h>.alert-queue-count.sc-calcite-alert{-webkit-border-end:0px solid transparent;border-inline-end:0px solid transparent}/*!@.alert-dismiss-progress*/.alert-dismiss-progress.sc-calcite-alert{position:absolute;left:0px;right:0px;display:block;width:100%;overflow:hidden;top:-2px;height:2px;z-index:103;border-radius:var(--calcite-border-radius) var(--calcite-border-radius) 0 0}/*!@.alert-dismiss-progress:after*/.alert-dismiss-progress.sc-calcite-alert:after{position:absolute;top:0px;display:block;height:2px;content:\"\";background-color:var(--calcite-alert-dismiss-progress-background);z-index:104;inset-inline-end:0}/*!@:host([color=blue]) .container*/[color=blue].sc-calcite-alert-h .container.sc-calcite-alert{border-top-color:var(--calcite-ui-info)}/*!@:host([color=blue]) .container .alert-icon*/[color=blue].sc-calcite-alert-h .container.sc-calcite-alert .alert-icon.sc-calcite-alert{color:var(--calcite-ui-info)}/*!@:host([color=red]) .container*/[color=red].sc-calcite-alert-h .container.sc-calcite-alert{border-top-color:var(--calcite-ui-danger)}/*!@:host([color=red]) .container .alert-icon*/[color=red].sc-calcite-alert-h .container.sc-calcite-alert .alert-icon.sc-calcite-alert{color:var(--calcite-ui-danger)}/*!@:host([color=yellow]) .container*/[color=yellow].sc-calcite-alert-h .container.sc-calcite-alert{border-top-color:var(--calcite-ui-warning)}/*!@:host([color=yellow]) .container .alert-icon*/[color=yellow].sc-calcite-alert-h .container.sc-calcite-alert .alert-icon.sc-calcite-alert{color:var(--calcite-ui-warning)}/*!@:host([color=green]) .container*/[color=green].sc-calcite-alert-h .container.sc-calcite-alert{border-top-color:var(--calcite-ui-success)}/*!@:host([color=green]) .container .alert-icon*/[color=green].sc-calcite-alert-h .container.sc-calcite-alert .alert-icon.sc-calcite-alert{color:var(--calcite-ui-success)}/*!@:host([auto-dismiss-duration=fast]) .alert-dismiss-progress:after*/[auto-dismiss-duration=fast].sc-calcite-alert-h .alert-dismiss-progress.sc-calcite-alert:after{-webkit-animation:dismissProgress 6000ms ease-out;animation:dismissProgress 6000ms ease-out}/*!@:host([auto-dismiss-duration=medium]) .alert-dismiss-progress:after*/[auto-dismiss-duration=medium].sc-calcite-alert-h .alert-dismiss-progress.sc-calcite-alert:after{-webkit-animation:dismissProgress 10000ms ease-out;animation:dismissProgress 10000ms ease-out}/*!@:host([auto-dismiss-duration=slow]) .alert-dismiss-progress:after*/[auto-dismiss-duration=slow].sc-calcite-alert-h .alert-dismiss-progress.sc-calcite-alert:after{-webkit-animation:dismissProgress 14000ms ease-out;animation:dismissProgress 14000ms ease-out}@-webkit-keyframes dismissProgress{0%{width:0px;opacity:0.75}100%{width:100%;opacity:1}}@keyframes dismissProgress{0%{width:0px;opacity:0.75}100%{width:100%;opacity:1}}";
- /** Alerts are meant to provide a way to communicate urgent or important information to users, frequently as a result of an action they took in your app. Alerts are positioned
- * at the bottom of the page. Multiple opened alerts will be added to a queue, allowing users to dismiss them in the order they are provided.
- */
- /**
- * @slot title - Title of the alert (optional)
- * @slot message - Main text of the alert
- * @slot link - Optional action to take from the alert (undo, try again, link to page, etc.)
- */
- class Alert {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteAlertClose = createEvent(this, "calciteAlertClose", 7);
- this.calciteAlertOpen = createEvent(this, "calciteAlertOpen", 7);
- this.calciteAlertSync = createEvent(this, "calciteAlertSync", 7);
- this.calciteAlertRegister = createEvent(this, "calciteAlertRegister", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //---------------------------------------------------------------------------
- /** Is the alert currently active or not */
- this.active = false;
- /** Close the alert automatically (recommended for passive, non-blocking alerts) */
- this.autoDismiss = false;
- /** Duration of autoDismiss (only used with `autoDismiss`) */
- this.autoDismissDuration = this.autoDismiss ? "medium" : null;
- /** Color for the alert (will apply to top border and icon) */
- this.color = "blue";
- /** string to override English close text
- * @default "Close"
- */
- this.intlClose = TEXT$n.intlClose;
- /** specify the placement of the alert */
- this.placement = "bottom";
- /** specify the scale of the alert, defaults to m */
- this.scale = "m";
- //--------------------------------------------------------------------------
- //
- // Private State/Props
- //
- //--------------------------------------------------------------------------
- /** the list of queued alerts */
- this.queue = [];
- /** the count of queued alerts */
- this.queueLength = 0;
- /** is the alert queued */
- this.queued = false;
- this.autoDismissTimeoutId = null;
- this.trackTimer = Date.now();
- this.activeTransitionProp = "opacity";
- /** close and emit the closed alert and the queue */
- this.closeAlert = () => {
- this.autoDismissTimeoutId = null;
- this.queued = false;
- this.active = false;
- this.queue = this.queue.filter((e) => e !== this.el);
- this.determineActiveAlert();
- this.calciteAlertSync.emit({ queue: this.queue });
- };
- this.transitionEnd = (event) => {
- if (event.propertyName === this.activeTransitionProp) {
- this.active
- ? this.calciteAlertOpen.emit({
- el: this.el,
- queue: this.queue
- })
- : this.calciteAlertClose.emit({
- el: this.el,
- queue: this.queue
- });
- }
- };
- }
- watchActive() {
- if (this.active && !this.queued) {
- this.calciteAlertRegister.emit();
- }
- if (!this.active) {
- this.queue = this.queue.filter((e) => e !== this.el);
- this.calciteAlertSync.emit({ queue: this.queue });
- }
- }
- updateRequestedIcon() {
- this.requestedIcon = setRequestedIcon(StatusIcons, this.icon, this.color);
- }
- updateDuration() {
- if (this.autoDismiss && this.autoDismissTimeoutId) {
- window.clearTimeout(this.autoDismissTimeoutId);
- this.autoDismissTimeoutId = window.setTimeout(() => this.closeAlert(), DURATIONS[this.autoDismissDuration] - (Date.now() - this.trackTimer));
- }
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- if (this.active && !this.queued) {
- this.calciteAlertRegister.emit();
- }
- }
- componentWillLoad() {
- this.requestedIcon = setRequestedIcon(StatusIcons, this.icon, this.color);
- }
- disconnectedCallback() {
- window.clearTimeout(this.autoDismissTimeoutId);
- }
- render() {
- const closeButton = (hAsync("button", { "aria-label": this.intlClose, class: "alert-close", onClick: this.closeAlert, ref: (el) => (this.closeButton = el), type: "button" }, hAsync("calcite-icon", { icon: "x", scale: this.scale === "l" ? "m" : "s" })));
- const queueText = `+${this.queueLength > 2 ? this.queueLength - 1 : 1}`;
- const queueCount = (hAsync("div", { class: `${this.queueLength > 1 ? "active " : ""}alert-queue-count` }, hAsync("calcite-chip", { scale: this.scale, value: queueText }, queueText)));
- const { active, autoDismiss, label, placement, queued, requestedIcon } = this;
- const role = autoDismiss ? "alert" : "alertdialog";
- const hidden = !active;
- return (hAsync(Host, { "aria-hidden": toAriaBoolean(hidden), "aria-label": label, "calcite-hydrated-hidden": hidden, role: role }, hAsync("div", { class: {
- container: true,
- queued,
- [placement]: true
- }, onTransitionEnd: this.transitionEnd }, requestedIcon ? (hAsync("div", { class: "alert-icon" }, hAsync("calcite-icon", { icon: requestedIcon, scale: this.scale === "l" ? "m" : "s" }))) : null, hAsync("div", { class: "alert-content" }, hAsync("slot", { name: SLOTS$l.title }), hAsync("slot", { name: SLOTS$l.message }), hAsync("slot", { name: SLOTS$l.link })), queueCount, !autoDismiss ? closeButton : null, active && !queued && autoDismiss ? hAsync("div", { class: "alert-dismiss-progress" }) : null)));
- }
- // when an alert is opened or closed, update queue and determine active alert
- alertSync(event) {
- if (this.queue !== event.detail.queue) {
- this.queue = event.detail.queue;
- }
- this.queueLength = this.queue.length;
- this.determineActiveAlert();
- }
- // when an alert is first registered, trigger a queue sync to get queue
- alertRegister() {
- if (this.active && !this.queue.includes(this.el)) {
- this.queued = true;
- this.queue.push(this.el);
- }
- this.calciteAlertSync.emit({ queue: this.queue });
- this.determineActiveAlert();
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- const alertLinkEl = getSlotted(this.el, { selector: "calcite-link" });
- if (!this.closeButton && !alertLinkEl) {
- return;
- }
- else if (alertLinkEl) {
- alertLinkEl.setFocus();
- }
- else if (this.closeButton) {
- this.closeButton.focus();
- }
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- /** determine which alert is active */
- determineActiveAlert() {
- var _a;
- if (((_a = this.queue) === null || _a === void 0 ? void 0 : _a[0]) === this.el) {
- this.openAlert();
- if (this.autoDismiss && !this.autoDismissTimeoutId) {
- this.trackTimer = Date.now();
- this.autoDismissTimeoutId = window.setTimeout(() => this.closeAlert(), DURATIONS[this.autoDismissDuration]);
- }
- }
- else {
- return;
- }
- }
- /** emit the opened alert and the queue */
- openAlert() {
- window.clearTimeout(this.queueTimeout);
- this.queueTimeout = window.setTimeout(() => (this.queued = false), 300);
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "active": ["watchActive"],
- "icon": ["updateRequestedIcon"],
- "color": ["updateRequestedIcon"],
- "autoDismissDuration": ["updateDuration"]
- }; }
- static get style() { return alertCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-alert",
- "$members$": {
- "active": [1540],
- "autoDismiss": [4, "auto-dismiss"],
- "autoDismissDuration": [513, "auto-dismiss-duration"],
- "color": [513],
- "icon": [520],
- "intlClose": [1, "intl-close"],
- "label": [1],
- "placement": [1],
- "scale": [513],
- "queue": [32],
- "queueLength": [32],
- "queued": [32],
- "requestedIcon": [32],
- "setFocus": [64]
- },
- "$listeners$": [[8, "calciteAlertSync", "alertSync"], [8, "calciteAlertRegister", "alertRegister"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["active", "active"], ["autoDismissDuration", "auto-dismiss-duration"], ["color", "color"], ["icon", "icon"], ["scale", "scale"]]
- }; }
- }
- function rgbToHex(color) {
- const { r, g, b } = color;
- return `#${r.toString(16).padStart(2, "0")}${g.toString(16).padStart(2, "0")}${b
- .toString(16)
- .padStart(2, "0")}`.toLowerCase();
- }
- const hexChar = /^[0-9A-F]$/i;
- const shortHandHex = /^#[0-9A-F]{3}$/i;
- const longhandHex = /^#[0-9A-F]{6}$/i;
- function isValidHex(hex) {
- return isShorthandHex(hex) || isLonghandHex(hex);
- }
- function isShorthandHex(hex) {
- return hex && hex.length === 4 && shortHandHex.test(hex);
- }
- function isLonghandHex(hex) {
- return hex && hex.length === 7 && longhandHex.test(hex);
- }
- function normalizeHex(hex) {
- hex = hex.toLowerCase();
- if (!hex.startsWith("#")) {
- hex = `#${hex}`;
- }
- if (isShorthandHex(hex)) {
- return rgbToHex(hexToRGB(hex));
- }
- return hex;
- }
- function hexToRGB(hex) {
- if (!isValidHex(hex)) {
- return null;
- }
- hex = hex.replace("#", "");
- if (hex.length === 3) {
- const [first, second, third] = hex.split("");
- const r = parseInt(`${first}${first}`, 16);
- const g = parseInt(`${second}${second}`, 16);
- const b = parseInt(`${third}${third}`, 16);
- return { r, g, b };
- }
- const r = parseInt(hex.slice(0, 2), 16);
- const g = parseInt(hex.slice(2, 4), 16);
- const b = parseInt(hex.slice(4, 6), 16);
- return { r, g, b };
- }
- // these utils allow users to pass enum values as strings without having to access the enum
- // based on the approach suggested by https://github.com/microsoft/TypeScript/issues/17690#issuecomment-321365759,
- const enumify = (x) => x;
- const CSSColorMode = enumify({
- HEX: "hex",
- HEXA: "hexa",
- RGB_CSS: "rgb-css",
- RGBA_CSS: "rgba-css",
- HSL_CSS: "hsl-css",
- HSLA_CSS: "hsla-css"
- });
- const ObjectColorMode = enumify({
- RGB: "rgb",
- RGBA: "rgba",
- HSL: "hsl",
- HSLA: "hsla",
- HSV: "hsv",
- HSVA: "hsva"
- });
- function parseMode(colorValue) {
- if (typeof colorValue === "string") {
- if (colorValue.startsWith("#")) {
- const { length } = colorValue;
- if (length === 4 || length === 7) {
- return CSSColorMode.HEX;
- }
- if (length === 5 || length === 9) {
- return CSSColorMode.HEXA;
- }
- }
- if (colorValue.startsWith("rgba(")) {
- return CSSColorMode.RGBA_CSS;
- }
- if (colorValue.startsWith("rgb(")) {
- return CSSColorMode.RGB_CSS;
- }
- if (colorValue.startsWith("hsl(")) {
- return CSSColorMode.HSL_CSS;
- }
- if (colorValue.startsWith("hsla(")) {
- return CSSColorMode.HSLA_CSS;
- }
- }
- if (typeof colorValue === "object") {
- if (hasChannels(colorValue, "r", "g", "b")) {
- return hasChannels(colorValue, "a") ? ObjectColorMode.RGBA : ObjectColorMode.RGB;
- }
- if (hasChannels(colorValue, "h", "s", "l")) {
- return hasChannels(colorValue, "a") ? ObjectColorMode.HSLA : ObjectColorMode.HSL;
- }
- if (hasChannels(colorValue, "h", "s", "v")) {
- return hasChannels(colorValue, "a") ? ObjectColorMode.HSVA : ObjectColorMode.HSV;
- }
- }
- return null;
- }
- function hasChannels(colorObject, ...channels) {
- return channels.every((channel) => channel && colorObject && `${channel}` in colorObject);
- }
- function colorEqual(value1, value2) {
- return (value1 === null || value1 === void 0 ? void 0 : value1.rgbNumber()) === (value2 === null || value2 === void 0 ? void 0 : value2.rgbNumber());
- }
- /**
- * Convert a string to a valid hex by hashing its contents
- * and using the hash as a seed for three distinct color values
- */
- function stringToHex(str) {
- let hash = 0;
- for (let i = 0; i < str.length; i++) {
- hash = str.charCodeAt(i) + ((hash << 5) - hash);
- }
- let hex = "#";
- for (let j = 0; j < 3; j++) {
- const value = (hash >> (j * 8)) & 0xff;
- hex += ("00" + value.toString(16)).substr(-2);
- }
- return hex;
- }
- /**
- * Find the hue of a color given the separate RGB color channels
- */
- function rgbToHue(rgb) {
- let { r, g, b } = rgb;
- r /= 255;
- g /= 255;
- b /= 255;
- const max = Math.max(r, g, b);
- const min = Math.min(r, g, b);
- const delta = max - min;
- if (max === min) {
- return 0;
- }
- let hue = (max + min) / 2;
- switch (max) {
- case r:
- hue = (g - b) / delta + (g < b ? 6 : 0);
- break;
- case g:
- hue = (b - r) / delta + 2;
- break;
- case b:
- hue = (r - g) / delta + 4;
- break;
- }
- return Math.round(hue * 60);
- }
- /**
- * For a hex color, find the hue
- * @param hex {string} - form of "#------"
- */
- function hexToHue(hex) {
- return rgbToHue(hexToRGB(hex));
- }
- const avatarCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-avatar:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-avatar{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-avatar{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-avatar{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-avatar{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-avatar{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-avatar:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-avatar-h{display:none}/*!@:host*/.sc-calcite-avatar-h{display:inline-block;overflow:hidden;border-radius:50%}/*!@:host([scale=s])*/[scale=s].sc-calcite-avatar-h{height:1.5rem;width:1.5rem;font-size:var(--calcite-font-size--3)}/*!@:host([scale=m])*/[scale=m].sc-calcite-avatar-h{height:2rem;width:2rem;font-size:var(--calcite-font-size--2)}/*!@:host([scale=l])*/[scale=l].sc-calcite-avatar-h{height:2.75rem;width:2.75rem;font-size:var(--calcite-font-size-0)}/*!@.icon*/.icon.sc-calcite-avatar{display:-ms-flexbox;display:flex}/*!@.background*/.background.sc-calcite-avatar{display:-ms-flexbox;display:flex;height:100%;width:100%;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border-radius:50%}/*!@.initials*/.initials.sc-calcite-avatar{font-weight:var(--calcite-font-weight-bold);text-transform:uppercase;color:var(--calcite-ui-text-3)}/*!@.thumbnail*/.thumbnail.sc-calcite-avatar{height:100%;width:100%;border-radius:50%}";
- class Avatar {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** specify the scale of the avatar, defaults to m */
- this.scale = "m";
- //--------------------------------------------------------------------------
- //
- // Private State/Props
- //
- //--------------------------------------------------------------------------
- /** True if thumnail fails to load */
- this.error = false;
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- render() {
- return this.determineContent();
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- determineContent() {
- if (this.thumbnail && !this.error) {
- return (hAsync("img", { alt: "", class: "thumbnail", onError: () => (this.error = true), src: this.thumbnail }));
- }
- const initials = this.generateInitials();
- const backgroundColor = this.generateFillColor();
- return (hAsync("span", { class: "background", style: { backgroundColor } }, initials ? (hAsync("span", { "aria-hidden": "true", class: "initials" }, initials)) : (hAsync("calcite-icon", { class: "icon", icon: "user", scale: this.scale }))));
- }
- /**
- * Generate a valid background color that is consistent and unique to this user
- */
- generateFillColor() {
- const { userId, username, fullName, el } = this;
- const theme = getThemeName(el);
- const id = userId && `#${userId.substr(userId.length - 6)}`;
- const name = username || fullName || "";
- const hex = id && isValidHex(id) ? id : stringToHex(name);
- // if there is not unique information, or an invalid hex is produced, return a default
- if ((!userId && !name) || !isValidHex(hex)) {
- return `var(--calcite-ui-foreground-2)`;
- }
- const hue = hexToHue(hex);
- const l = theme === "dark" ? 20 : 90;
- return `hsl(${hue}, 60%, ${l}%)`;
- }
- /**
- * Use fullname or username to generate initials
- */
- generateInitials() {
- const { fullName, username } = this;
- if (fullName) {
- return fullName
- .trim()
- .split(" ")
- .map((name) => name.substring(0, 1))
- .join("");
- }
- else if (username) {
- return username.substring(0, 2);
- }
- return false;
- }
- get el() { return getElement(this); }
- static get style() { return avatarCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-avatar",
- "$members$": {
- "scale": [513],
- "thumbnail": [1],
- "fullName": [1, "full-name"],
- "username": [1],
- "userId": [1, "user-id"],
- "error": [32]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["scale", "scale"]]
- }; }
- }
- const CSS$L = {
- article: "article",
- content: "content",
- headerContainer: "header-container",
- icon: "icon",
- statusIcon: "status-icon",
- toggle: "toggle",
- toggleIcon: "toggle-icon",
- title: "title",
- heading: "heading",
- header: "header",
- button: "button",
- summary: "summary",
- controlContainer: "control-container",
- valid: "valid",
- invalid: "invalid",
- loading: "loading"
- };
- const TEXT$m = {
- collapse: "Collapse",
- expand: "Expand",
- loading: "Loading",
- options: "Options"
- };
- const SLOTS$k = {
- icon: "icon",
- control: "control",
- headerMenuActions: "header-menu-actions"
- };
- const ICONS$c = {
- opened: "chevron-up",
- closed: "chevron-down",
- valid: "check-circle",
- invalid: "exclamation-mark-triangle",
- refresh: "refresh"
- };
- const HEADING_LEVEL$7 = 4;
- function constrainHeadingLevel(level) {
- return Math.min(Math.max(Math.ceil(level), 1), 6);
- }
- const Heading = (props, children) => {
- const HeadingTag = `h${props.level}`;
- delete props.level;
- return hAsync(HeadingTag, Object.assign({}, props), children);
- };
- const blockCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-block:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-block{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-block{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-block{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-block{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-block{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:host*/.sc-calcite-block-h{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}/*!@:host **/.sc-calcite-block-h *.sc-calcite-block{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:host*/.sc-calcite-block-h{--calcite-icon-size:1rem;--calcite-spacing-eighth:0.125rem;--calcite-spacing-quarter:0.25rem;--calcite-spacing-half:0.5rem;--calcite-spacing-three-quarters:0.75rem;--calcite-spacing:1rem;--calcite-spacing-plus-quarter:1.25rem;--calcite-spacing-plus-half:1.5rem;--calcite-spacing-double:2rem;--calcite-menu-min-width:10rem;--calcite-header-min-height:3rem;--calcite-footer-min-height:3rem}/*!@:root*/.sc-calcite-block:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-block-h{display:none}/*!@:host*/.sc-calcite-block-h{display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;-ms-flex-positive:0;flex-grow:0;-ms-flex-direction:column;flex-direction:column;border-width:0px;border-bottom-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3);padding:0px;-webkit-transition-property:margin;transition-property:margin;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.215, 0.440, 0.420, 0.880);transition-timing-function:cubic-bezier(0.215, 0.440, 0.420, 0.880);-ms-flex-preferred-size:auto;flex-basis:auto}/*!@:host([disabled])*/[disabled].sc-calcite-block-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-block-h[disabled] .sc-calcite-block-s>[calcite-hydrated][disabled],[disabled].sc-calcite-block-h [calcite-hydrated][disabled].sc-calcite-block{opacity:1}/*!@.header*/.header.sc-calcite-block{margin:0px;display:-ms-flexbox;display:flex;-ms-flex-line-pack:justify;align-content:space-between;-ms-flex-align:center;align-items:center;fill:var(--calcite-ui-text-2);color:var(--calcite-ui-text-2)}/*!@.heading*/.heading.sc-calcite-block{margin:0px;padding:0px;font-weight:var(--calcite-font-weight-medium)}/*!@.header .heading*/.header.sc-calcite-block .heading.sc-calcite-block{-ms-flex:1 1 auto;flex:1 1 auto;padding:0.5rem}/*!@h1.heading*/h1.heading.sc-calcite-block{font-size:var(--calcite-font-size-2);line-height:1.5rem}/*!@h2.heading*/h2.heading.sc-calcite-block{font-size:var(--calcite-font-size-1);line-height:1.5rem}/*!@h3.heading*/h3.heading.sc-calcite-block{font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@h4.heading, h5.heading*/h4.heading.sc-calcite-block,h5.heading.sc-calcite-block{font-size:var(--calcite-font-size--1);line-height:1rem}/*!@.header*/.header.sc-calcite-block{-ms-flex-pack:start;justify-content:flex-start;padding:0px}/*!@.header,\n.toggle*/.header.sc-calcite-block,.toggle.sc-calcite-block{grid-area:header}/*!@.header-container*/.header-container.sc-calcite-block{display:grid;-ms-flex-align:stretch;align-items:stretch;grid-template:auto/auto 1fr auto auto;grid-template-areas:\"handle header control menu\";grid-column:header-start/menu-end;grid-row:1/2}/*!@.toggle*/.toggle.sc-calcite-block{margin:0px;display:-ms-flexbox;display:flex;cursor:pointer;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;border-style:none;padding:0px;font-family:inherit;outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;text-align:initial;background-color:transparent}/*!@.toggle:hover*/.toggle.sc-calcite-block:hover{background-color:var(--calcite-ui-foreground-2)}/*!@.toggle:focus*/.toggle.sc-calcite-block:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@calcite-loader[inline]*/calcite-loader[inline].sc-calcite-block{grid-area:control;align-self:center}/*!@calcite-handle*/calcite-handle.sc-calcite-block{grid-area:handle}/*!@.title*/.title.sc-calcite-block{margin:0px;padding:0.75rem}/*!@.header .title .heading*/.header.sc-calcite-block .title.sc-calcite-block .heading.sc-calcite-block{padding:0px;font-size:var(--calcite-font-size--1);font-weight:var(--calcite-font-weight-medium);line-height:1.25;color:var(--calcite-ui-text-2);-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);word-wrap:break-word;word-break:break-word}/*!@.summary*/.summary.sc-calcite-block{margin-top:0.125rem;padding:0px;font-size:var(--calcite-font-size--2);color:var(--calcite-ui-text-3);word-wrap:break-word;word-break:break-word}/*!@.icon*/.icon.sc-calcite-block{-webkit-margin-start:0.75rem;margin-inline-start:0.75rem;-webkit-margin-end:0px;margin-inline-end:0px;margin-block:0.75rem}/*!@.status-icon.valid*/.status-icon.valid.sc-calcite-block{color:var(--calcite-ui-success)}/*!@.status-icon.invalid*/.status-icon.invalid.sc-calcite-block{color:var(--calcite-ui-danger)}/*!@.status-icon.loading*/.status-icon.loading.sc-calcite-block{-webkit-animation:spin 2s linear infinite;animation:spin 2s linear infinite}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}50%{-webkit-transform:rotate(180deg);transform:rotate(180deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}50%{-webkit-transform:rotate(180deg);transform:rotate(180deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}/*!@.toggle-icon*/.toggle-icon.sc-calcite-block{margin-top:0.75rem;margin-bottom:0.75rem;-ms-flex-item-align:center;align-self:center;justify-self:end;color:var(--calcite-ui-text-3);-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-margin-end:1rem;margin-inline-end:1rem;-webkit-margin-start:auto;margin-inline-start:auto}/*!@.toggle:hover .toggle-icon*/.toggle.sc-calcite-block:hover .toggle-icon.sc-calcite-block{color:var(--calcite-ui-text-1)}/*!@.content*/.content.sc-calcite-block{position:relative}@keyframes in{0%{opacity:0}100%{opacity:1}}/*!@.content*/.content.sc-calcite-block{-webkit-animation:in var(--calcite-internal-animation-timing-slow) ease-in-out;animation:in var(--calcite-internal-animation-timing-slow) ease-in-out;padding-left:0.75rem;padding-right:0.75rem;padding-top:0.5rem;padding-bottom:0.5rem}/*!@.control-container*/.control-container.sc-calcite-block{margin:0px;display:-ms-flexbox;display:flex;grid-area:control}/*!@calcite-action-menu*/calcite-action-menu.sc-calcite-block{grid-area:menu}/*!@:host([open])*/[open].sc-calcite-block-h{margin-top:0.5rem;margin-bottom:0.5rem}/*!@:host([open]) .header .title .heading*/[open].sc-calcite-block-h .header.sc-calcite-block .title.sc-calcite-block .heading.sc-calcite-block{color:var(--calcite-ui-text-1)}";
- /**
- * @slot - A slot for adding content to the block.
- * @slot icon - A slot for adding a leading header icon.
- * @slot control - A slot for adding a single HTML input element in a header.
- * @slot header-menu-actions - a slot for adding an overflow menu with actions inside a dropdown.
- */
- class Block {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteBlockToggle = createEvent(this, "calciteBlockToggle", 7);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * When true, this block will be collapsible.
- */
- this.collapsible = false;
- /**
- * When true, disabled prevents interaction. This state shows items with lower opacity/grayed.
- */
- this.disabled = false;
- /**
- * When true, displays a drag handle in the header.
- */
- this.dragHandle = false;
- /**
- * Aria-label for collapsing the toggle and tooltip used for the toggle when expanded.
- */
- this.intlCollapse = TEXT$m.collapse;
- /**
- * Aria-label for expanding the toggle and tooltip used for the toggle when collapsed.
- */
- this.intlExpand = TEXT$m.expand;
- /** string to override English loading text
- * @default "Loading"
- */
- this.intlLoading = TEXT$m.loading;
- /** Text string used for the actions menu
- * @default "Options"
- */
- this.intlOptions = TEXT$m.options;
- /**
- * When true, content is waiting to be loaded. This state shows a busy indicator.
- */
- this.loading = false;
- /**
- * When true, the block's content will be displayed.
- */
- this.open = false;
- this.guid = guid();
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.onHeaderClick = () => {
- this.open = !this.open;
- this.calciteBlockToggle.emit();
- };
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentDidRender() {
- updateHostInteraction(this);
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- disconnectConditionalSlotComponent(this);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- renderScrim() {
- const { loading } = this;
- const defaultSlot = hAsync("slot", null);
- return [loading ? hAsync("calcite-scrim", { loading: loading }) : null, defaultSlot];
- }
- renderIcon() {
- const { el, status } = this;
- const showingLoadingStatus = this.loading && !this.open;
- const statusIcon = showingLoadingStatus ? ICONS$c.refresh : ICONS$c[status];
- const hasIcon = getSlotted(el, SLOTS$k.icon) || statusIcon;
- const iconEl = !statusIcon ? (hAsync("slot", { key: "icon-slot", name: SLOTS$k.icon })) : (hAsync("calcite-icon", { class: {
- [CSS$L.statusIcon]: true,
- [CSS$L.valid]: status == "valid",
- [CSS$L.invalid]: status == "invalid",
- [CSS$L.loading]: showingLoadingStatus
- }, icon: statusIcon, scale: "m" }));
- return hasIcon ? hAsync("div", { class: CSS$L.icon }, iconEl) : null;
- }
- renderTitle() {
- const { heading, headingLevel, summary } = this;
- return heading || summary ? (hAsync("div", { class: CSS$L.title }, hAsync(Heading, { class: CSS$L.heading, level: headingLevel || HEADING_LEVEL$7 }, heading), summary ? hAsync("div", { class: CSS$L.summary }, summary) : null)) : null;
- }
- render() {
- const { collapsible, el, intlCollapse, intlExpand, loading, open, intlLoading } = this;
- const toggleLabel = open ? intlCollapse || TEXT$m.collapse : intlExpand || TEXT$m.expand;
- const headerContent = (hAsync("header", { class: CSS$L.header }, this.renderIcon(), this.renderTitle()));
- const hasControl = !!getSlotted(el, SLOTS$k.control);
- const hasMenuActions = !!getSlotted(el, SLOTS$k.headerMenuActions);
- const collapseIcon = open ? ICONS$c.opened : ICONS$c.closed;
- const { guid } = this;
- const regionId = `${guid}-region`;
- const buttonId = `${guid}-button`;
- const headerNode = (hAsync("div", { class: CSS$L.headerContainer }, this.dragHandle ? hAsync("calcite-handle", null) : null, collapsible ? (hAsync("button", { "aria-controls": regionId, "aria-expanded": collapsible ? toAriaBoolean(open) : null, "aria-label": toggleLabel, class: CSS$L.toggle, id: buttonId, onClick: this.onHeaderClick, title: toggleLabel }, headerContent, !hasControl && !hasMenuActions ? (hAsync("calcite-icon", { "aria-hidden": "true", class: CSS$L.toggleIcon, icon: collapseIcon, scale: "s" })) : null)) : (headerContent), loading ? (hAsync("calcite-loader", { inline: true, "is-active": true, label: intlLoading })) : hasControl ? (hAsync("div", { class: CSS$L.controlContainer }, hAsync("slot", { name: SLOTS$k.control }))) : null, hasMenuActions ? (hAsync("calcite-action-menu", { label: this.intlOptions || TEXT$m.options }, hAsync("slot", { name: SLOTS$k.headerMenuActions }))) : null));
- return (hAsync(Host, null, hAsync("article", { "aria-busy": toAriaBoolean(loading), class: {
- [CSS$L.article]: true
- } }, headerNode, hAsync("section", { "aria-expanded": toAriaBoolean(open), "aria-labelledby": buttonId, class: CSS$L.content, hidden: !open, id: regionId }, this.renderScrim()))));
- }
- get el() { return getElement(this); }
- static get style() { return blockCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-block",
- "$members$": {
- "collapsible": [4],
- "disabled": [516],
- "dragHandle": [516, "drag-handle"],
- "heading": [1],
- "headingLevel": [2, "heading-level"],
- "intlCollapse": [1, "intl-collapse"],
- "intlExpand": [1, "intl-expand"],
- "intlLoading": [1, "intl-loading"],
- "intlOptions": [1, "intl-options"],
- "loading": [516],
- "open": [1540],
- "status": [513],
- "summary": [1]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"], ["dragHandle", "drag-handle"], ["loading", "loading"], ["open", "open"], ["status", "status"]]
- }; }
- }
- const CSS$K = {
- content: "content",
- invalid: "invalid",
- toggle: "toggle",
- toggleSwitch: "toggle--switch",
- toggleSwitchContent: "toggle--switch__content",
- toggleSwitchText: "toggle--switch__text",
- sectionHeader: "section-header",
- sectionHeaderText: "section-header__text",
- statusIcon: "status-icon",
- valid: "valid"
- };
- const TEXT$l = {
- collapse: "Collapse",
- expand: "Expand"
- };
- const ICONS$b = {
- menuOpen: "chevron-down",
- menuClosedLeft: "chevron-left",
- menuClosedRight: "chevron-right",
- valid: "check-circle",
- invalid: "exclamation-mark-triangle"
- };
- const blockSectionCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-block-section:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-block-section{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-block-section{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-block-section{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-block-section{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-block-section{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-block-section:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-block-section-h{display:none}/*!@:host*/.sc-calcite-block-section-h{-webkit-box-sizing:border-box;box-sizing:border-box;display:block;background-color:var(--calcite-ui-foreground-1);font-size:var(--calcite-font-size--1);color:var(--calcite-ui-text-2)}/*!@:host([open])*/[open].sc-calcite-block-section-h{border-width:0px;border-bottom-width:1px;border-style:solid;border-bottom-color:var(--calcite-ui-border-3)}/*!@:host(:last-child)*/.sc-calcite-block-section-h:last-child{border-bottom-width:0px}/*!@.toggle*/.toggle.sc-calcite-block-section{width:100%;border-width:0px;background-color:transparent;font-family:var(--calcite-sans-family);font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-2)}/*!@.toggle--switch, .section-header*/.toggle--switch.sc-calcite-block-section,.section-header.sc-calcite-block-section{margin-left:0px;margin-right:0px;margin-top:0.25rem;margin-bottom:0.25rem;display:-ms-flexbox;display:flex;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-ms-flex-align:center;align-items:center;padding-left:0px;padding-right:0px;padding-top:0.5rem;padding-bottom:0.5rem;font-size:var(--calcite-font-size--1);outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@.toggle--switch:focus, .section-header:focus*/.toggle--switch.sc-calcite-block-section:focus,.section-header.sc-calcite-block-section:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:2px}/*!@.toggle--switch:hover, .section-header:hover*/.toggle--switch.sc-calcite-block-section:hover,.section-header.sc-calcite-block-section:hover{color:var(--calcite-ui-text-1)}/*!@.section-header .status-icon*/.section-header.sc-calcite-block-section .status-icon.sc-calcite-block-section{-ms-flex-item-align:end;align-self:flex-end}/*!@.section-header__text*/.section-header__text.sc-calcite-block-section{margin-left:0.75rem;margin-right:0.75rem;margin-top:0px;margin-bottom:0px;-ms-flex:1 1 auto;flex:1 1 auto;text-align:initial;word-wrap:anywhere}/*!@.toggle--switch calcite-switch*/.toggle--switch.sc-calcite-block-section calcite-switch.sc-calcite-block-section{pointer-events:none;-webkit-margin-start:0.25rem;margin-inline-start:0.25rem}/*!@.toggle--switch .status-icon*/.toggle--switch.sc-calcite-block-section .status-icon.sc-calcite-block-section{-webkit-margin-start:0.5rem;margin-inline-start:0.5rem}/*!@.toggle--switch__content*/.toggle--switch__content.sc-calcite-block-section{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-align:center;align-items:center}/*!@.status-icon.valid*/.status-icon.valid.sc-calcite-block-section{color:var(--calcite-ui-success)}/*!@.status-icon.invalid*/.status-icon.invalid.sc-calcite-block-section{color:var(--calcite-ui-danger)}";
- /**
- * @slot - A slot for adding content to the block section.
- */
- class BlockSection {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteBlockSectionToggle = createEvent(this, "calciteBlockSectionToggle", 7);
- /**
- * When true, the block's section content will be displayed.
- */
- this.open = false;
- /**
- * This property determines the look of the section toggle.
- * If the value is "switch", a toggle-switch will be displayed.
- * If the value is "button", a clickable header is displayed.
- */
- this.toggleDisplay = "button";
- this.guid = guid();
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.handleHeaderKeyDown = (event) => {
- if (event.key === " " || event.key === "Enter") {
- this.toggleSection();
- event.preventDefault();
- event.stopPropagation();
- }
- };
- this.toggleSection = () => {
- this.open = !this.open;
- this.calciteBlockSectionToggle.emit();
- };
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- renderStatusIcon() {
- var _a;
- const { status } = this;
- const statusIcon = (_a = ICONS$b[status]) !== null && _a !== void 0 ? _a : false;
- const statusIconClasses = {
- [CSS$K.statusIcon]: true,
- [CSS$K.valid]: status == "valid",
- [CSS$K.invalid]: status == "invalid"
- };
- return !!statusIcon ? (hAsync("calcite-icon", { class: statusIconClasses, icon: statusIcon, scale: "s" })) : null;
- }
- render() {
- const { el, intlCollapse, intlExpand, open, text, toggleDisplay } = this;
- const dir = getElementDir(el);
- const arrowIcon = open
- ? ICONS$b.menuOpen
- : dir === "rtl"
- ? ICONS$b.menuClosedLeft
- : ICONS$b.menuClosedRight;
- const toggleLabel = open ? intlCollapse || TEXT$l.collapse : intlExpand || TEXT$l.expand;
- const { guid } = this;
- const regionId = `${guid}-region`;
- const buttonId = `${guid}-button`;
- const headerNode = toggleDisplay === "switch" ? (hAsync("div", { "aria-controls": regionId, "aria-label": toggleLabel, class: {
- [CSS$K.toggle]: true,
- [CSS$K.toggleSwitch]: true
- }, id: buttonId, onClick: this.toggleSection, onKeyDown: this.handleHeaderKeyDown, tabIndex: 0, title: toggleLabel }, hAsync("div", { class: CSS$K.toggleSwitchContent }, hAsync("span", { class: CSS$K.toggleSwitchText }, text)), hAsync("calcite-switch", { checked: open, label: toggleLabel, scale: "s", tabIndex: -1 }), this.renderStatusIcon())) : (hAsync("button", { "aria-controls": regionId, "aria-label": toggleLabel, class: {
- [CSS$K.sectionHeader]: true,
- [CSS$K.toggle]: true
- }, id: buttonId, name: toggleLabel, onClick: this.toggleSection }, hAsync("calcite-icon", { icon: arrowIcon, scale: "s" }), hAsync("span", { class: CSS$K.sectionHeaderText }, text), this.renderStatusIcon()));
- return (hAsync(Host, null, headerNode, hAsync("section", { "aria-expanded": toAriaBoolean(open), "aria-labelledby": buttonId, class: CSS$K.content, hidden: !open, id: regionId }, hAsync("slot", null))));
- }
- get el() { return getElement(this); }
- static get style() { return blockSectionCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-block-section",
- "$members$": {
- "intlCollapse": [1, "intl-collapse"],
- "intlExpand": [1, "intl-expand"],
- "open": [1540],
- "status": [513],
- "text": [1],
- "toggleDisplay": [513, "toggle-display"]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["open", "open"], ["status", "status"], ["toggleDisplay", "toggle-display"]]
- }; }
- }
- (function(prototype) {
- if (typeof prototype.requestSubmit == "function") return
- prototype.requestSubmit = function(submitter) {
- if (submitter) {
- validateSubmitter(submitter, this);
- submitter.click();
- } else {
- submitter = document.createElement("input");
- submitter.type = "submit";
- submitter.hidden = true;
- this.appendChild(submitter);
- submitter.click();
- this.removeChild(submitter);
- }
- };
- function validateSubmitter(submitter, form) {
- submitter instanceof HTMLElement || raise(TypeError, "parameter 1 is not of type 'HTMLElement'");
- submitter.type == "submit" || raise(TypeError, "The specified element is not a submit button");
- submitter.form == form || raise(DOMException, "The specified element is not owned by this form element", "NotFoundError");
- }
- function raise(errorConstructor, message, name) {
- throw new errorConstructor("Failed to execute 'requestSubmit' on 'HTMLFormElement': " + message + ".", name)
- }
- })(HTMLFormElement.prototype);
- const CSS$J = {
- buttonLoader: "calcite-button--loader",
- content: "content",
- contentSlotted: "content--slotted",
- icon: "icon",
- iconStart: "icon--start",
- iconEnd: "icon--end",
- loadingIn: "loading-in",
- loadingOut: "loading-out",
- iconStartEmpty: "icon-start-empty",
- iconEndEmpty: "icon-end-empty"
- };
- const TEXT$k = {
- loading: "Loading"
- };
- /**
- * Exported for testing purposes only
- * @internal
- */
- const labelClickEvent = "calciteInternalLabelClick";
- const labelConnectedEvent = "calciteInternalLabelConnected";
- const labelDisconnectedEvent = "calciteInternaLabelDisconnected";
- const labelTagName = "calcite-label";
- const onLabelClickMap = new WeakMap();
- const onLabelConnectedMap = new WeakMap();
- const onLabelDisconnectedMap = new WeakMap();
- const unlabeledComponents = new Set();
- const findLabelForComponent = (componentEl) => {
- const { id } = componentEl;
- const forLabel = id && queryElementRoots(componentEl, { selector: `${labelTagName}[for="${id}"]` });
- if (forLabel) {
- return forLabel;
- }
- const parentLabel = closestElementCrossShadowBoundary(componentEl, labelTagName);
- if (!parentLabel ||
- // labelable components within other custom elements are not considered labelable
- hasAncestorCustomElements(parentLabel, componentEl)) {
- return null;
- }
- return parentLabel;
- };
- function hasAncestorCustomElements(label, componentEl) {
- let traversedElements;
- const customElementAncestorCheckEventType = "custom-element-ancestor-check";
- const listener = (event) => {
- event.stopImmediatePropagation();
- const composedPath = event.composedPath();
- traversedElements = composedPath.slice(composedPath.indexOf(componentEl), composedPath.indexOf(label));
- };
- label.addEventListener(customElementAncestorCheckEventType, listener, { once: true });
- componentEl.dispatchEvent(new CustomEvent(customElementAncestorCheckEventType, { composed: true, bubbles: true }));
- label.removeEventListener(customElementAncestorCheckEventType, listener);
- const ancestorCustomElements = traversedElements
- .filter((el) => el !== componentEl && el !== label)
- .filter((el) => { var _a; return (_a = el.tagName) === null || _a === void 0 ? void 0 : _a.includes("-"); });
- return ancestorCustomElements.length > 0;
- }
- /**
- * Helper to set up label interactions on connectedCallback.
- */
- function connectLabel(component) {
- const labelEl = findLabelForComponent(component.el);
- if (onLabelClickMap.has(labelEl) || (!labelEl && unlabeledComponents.has(component))) {
- return;
- }
- const boundOnLabelDisconnected = onLabelDisconnected.bind(component);
- if (labelEl) {
- component.labelEl = labelEl;
- const boundOnLabelClick = onLabelClick.bind(component);
- onLabelClickMap.set(component.labelEl, boundOnLabelClick);
- component.labelEl.addEventListener(labelClickEvent, boundOnLabelClick);
- unlabeledComponents.delete(component);
- document.removeEventListener(labelConnectedEvent, onLabelConnectedMap.get(component));
- onLabelDisconnectedMap.set(component, boundOnLabelDisconnected);
- document.addEventListener(labelDisconnectedEvent, boundOnLabelDisconnected);
- }
- else if (!unlabeledComponents.has(component)) {
- boundOnLabelDisconnected();
- document.removeEventListener(labelDisconnectedEvent, onLabelDisconnectedMap.get(component));
- }
- }
- /**
- * Helper to tear down label interactions on disconnectedCallback on labelable components.
- */
- function disconnectLabel(component) {
- unlabeledComponents.delete(component);
- document.removeEventListener(labelConnectedEvent, onLabelConnectedMap.get(component));
- document.removeEventListener(labelDisconnectedEvent, onLabelDisconnectedMap.get(component));
- onLabelConnectedMap.delete(component);
- onLabelDisconnectedMap.delete(component);
- if (!component.labelEl) {
- return;
- }
- const boundOnLabelClick = onLabelClickMap.get(component.labelEl);
- component.labelEl.removeEventListener(labelClickEvent, boundOnLabelClick);
- onLabelClickMap.delete(component.labelEl);
- }
- /**
- * Helper to get the label text from a component.
- */
- function getLabelText(component) {
- var _a, _b;
- return component.label || ((_b = (_a = component.labelEl) === null || _a === void 0 ? void 0 : _a.textContent) === null || _b === void 0 ? void 0 : _b.trim()) || "";
- }
- function onLabelClick(event) {
- if (this.disabled) {
- return;
- }
- const containedLabelableChildClicked = this.el.contains(event.detail.sourceEvent.target);
- if (containedLabelableChildClicked) {
- return;
- }
- this.onLabelClick(event);
- }
- function onLabelConnected() {
- if (unlabeledComponents.has(this)) {
- connectLabel(this);
- }
- }
- function onLabelDisconnected() {
- unlabeledComponents.add(this);
- const boundOnLabelConnected = onLabelConnectedMap.get(this) || onLabelConnected.bind(this);
- onLabelConnectedMap.set(this, boundOnLabelConnected);
- document.addEventListener(labelConnectedEvent, boundOnLabelConnected);
- }
- /**
- * Exported for testing purposes.
- */
- const hiddenFormInputSlotName = "hidden-form-input";
- function isCheckable(component) {
- return "checked" in component;
- }
- const onFormResetMap = new WeakMap();
- const formComponentSet = new WeakSet();
- function hasRegisteredFormComponentParent(form, formComponentEl) {
- // we use events as a way to test for nested form-associated components across shadow bounds
- const formComponentRegisterEventName = "calciteInternalFormComponentRegister";
- let hasRegisteredFormComponentParent = false;
- form.addEventListener(formComponentRegisterEventName, (event) => {
- hasRegisteredFormComponentParent = event
- .composedPath()
- .some((element) => formComponentSet.has(element));
- event.stopPropagation();
- }, { once: true });
- formComponentEl.dispatchEvent(new CustomEvent(formComponentRegisterEventName, {
- bubbles: true,
- composed: true
- }));
- return hasRegisteredFormComponentParent;
- }
- /**
- * Helper to submit a form.
- */
- function submitForm(component) {
- var _a;
- (_a = component.formEl) === null || _a === void 0 ? void 0 : _a.requestSubmit();
- }
- /**
- * Helper to reset a form.
- */
- function resetForm(component) {
- var _a;
- (_a = component.formEl) === null || _a === void 0 ? void 0 : _a.reset();
- }
- /**
- * Helper to set up form interactions on connectedCallback.
- */
- function connectForm(component) {
- const { el, value } = component;
- const form = closestElementCrossShadowBoundary(el, "form");
- if (!form || hasRegisteredFormComponentParent(form, el)) {
- return;
- }
- component.formEl = form;
- component.defaultValue = value;
- if (isCheckable(component)) {
- component.defaultChecked = component.checked;
- }
- const boundOnFormReset = (component.onFormReset || onFormReset).bind(component);
- form.addEventListener("reset", boundOnFormReset);
- onFormResetMap.set(component.el, boundOnFormReset);
- formComponentSet.add(el);
- }
- function onFormReset() {
- if (isCheckable(this)) {
- this.checked = this.defaultChecked;
- return;
- }
- this.value = this.defaultValue;
- }
- /**
- * Helper to tear down form interactions on disconnectedCallback.
- */
- function disconnectForm(component) {
- const { el, formEl } = component;
- if (!formEl) {
- return;
- }
- const boundOnFormReset = onFormResetMap.get(el);
- formEl.removeEventListener("reset", boundOnFormReset);
- onFormResetMap.delete(el);
- component.formEl = null;
- formComponentSet.delete(el);
- }
- /**
- * Helper for setting the default value on initialization after connectedCallback.
- *
- * Note that this is only needed if the default value cannot be determined on connectedCallback.
- */
- function afterConnectDefaultValueSet(component, value) {
- component.defaultValue = value;
- }
- /**
- * Helper for maintaining a form-associated's hidden input in sync with the component.
- *
- * Based on Ionic's approach: https://github.com/ionic-team/ionic-framework/blob/e4bf052794af9aac07f887013b9250d2a045eba3/core/src/utils/helpers.ts#L198
- */
- function syncHiddenFormInput(component) {
- const { el, formEl, name, value } = component;
- const { ownerDocument } = el;
- const inputs = el.querySelectorAll(`input[slot="${hiddenFormInputSlotName}"]`);
- if (!formEl || !name) {
- inputs.forEach((input) => input.remove());
- return;
- }
- const values = Array.isArray(value) ? value : [value];
- const extra = [];
- const seen = new Set();
- inputs.forEach((input) => {
- const valueMatch = values.find((val) =>
- /* intentional non-strict equality check */
- val == input.value);
- if (valueMatch != null) {
- seen.add(valueMatch);
- defaultSyncHiddenFormInput(component, input, valueMatch);
- }
- else {
- extra.push(input);
- }
- });
- let docFrag;
- values.forEach((value) => {
- if (seen.has(value)) {
- return;
- }
- let input = extra.pop();
- if (!input) {
- input = ownerDocument.createElement("input");
- input.slot = hiddenFormInputSlotName;
- }
- if (!docFrag) {
- docFrag = ownerDocument.createDocumentFragment();
- }
- docFrag.append(input);
- defaultSyncHiddenFormInput(component, input, value);
- });
- if (docFrag) {
- el.append(docFrag);
- }
- extra.forEach((input) => input.remove());
- }
- function defaultSyncHiddenFormInput(component, input, value) {
- var _a;
- const { defaultValue, disabled, name, required } = component;
- // keep in sync to prevent losing reset value
- input.defaultValue = defaultValue;
- input.disabled = disabled;
- input.name = name;
- input.required = required;
- input.tabIndex = -1;
- if (isCheckable(component)) {
- // keep in sync to prevent losing reset value
- input.defaultChecked = component.defaultChecked;
- // heuristic to support default/on mode from https://html.spec.whatwg.org/multipage/input.html#dom-input-value-default-on
- input.value = component.checked ? value || "on" : "";
- // we disable the component when not checked to avoid having its value submitted
- if (!disabled && !component.checked) {
- input.disabled = true;
- }
- }
- else {
- input.value = value || "";
- }
- (_a = component.syncHiddenFormInput) === null || _a === void 0 ? void 0 : _a.call(component, input);
- }
- /**
- * Helper to render the slot for form-associated component's hidden input.
- *
- * If the component has a default slot, this must be placed at the bottom of the component's root container to ensure it is the last child.
- *
- * render(): VNode {
- * <Host>
- * <div class={CSS.container}>
- * // ...
- * <HiddenFormInputSlot component={this} />
- * </div>
- * </Host>
- * }
- *
- * Note that the hidden-form-input Sass mixin must be added to the component's style to apply specific styles.
- */
- const HiddenFormInputSlot = ({ component }) => {
- syncHiddenFormInput(component);
- return hAsync("slot", { name: hiddenFormInputSlotName });
- };
- const buttonCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-button:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-button{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-button{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-button{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-button{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-button{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-button:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-button-h{display:none}/*!@:host*/.sc-calcite-button-h{display:inline-block;width:auto;vertical-align:middle}/*!@:host([round])*/[round].sc-calcite-button-h{border-radius:50px}/*!@:host([round]) a, :host([round]) button*/[round].sc-calcite-button-h a.sc-calcite-button,[round].sc-calcite-button-h button.sc-calcite-button{border-radius:50px}/*!@:host button, :host a*/.sc-calcite-button-h button.sc-calcite-button,.sc-calcite-button-h a.sc-calcite-button{outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@:host button:focus, :host a:focus*/.sc-calcite-button-h button.sc-calcite-button:focus,.sc-calcite-button-h a.sc-calcite-button:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:2px}/*!@:host button,\n:host a*/.sc-calcite-button-h button.sc-calcite-button,.sc-calcite-button-h a.sc-calcite-button{--calcite-button-content-margin:0.5rem;--calcite-button-padding-x:7px;--calcite-button-padding-y:3px;padding:var(--calcite-button-padding-y) var(--calcite-button-padding-x) var(--calcite-button-padding-y) var(--calcite-button-padding-x);position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;height:100%;width:100%;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border-radius:0px;border-style:none;text-align:center;font-family:inherit;font-weight:var(--calcite-font-weight-normal);-webkit-text-decoration-line:none;text-decoration-line:none;-webkit-transition:color var(--calcite-animation-timing) ease-in-out, background-color var(--calcite-animation-timing) ease-in-out, outline-offset var(--calcite-internal-animation-timing-fast) ease-in-out, outline-color var(--calcite-internal-animation-timing-fast) ease-in-out, -webkit-box-shadow var(--calcite-animation-timing) ease-in-out;transition:color var(--calcite-animation-timing) ease-in-out, background-color var(--calcite-animation-timing) ease-in-out, outline-offset var(--calcite-internal-animation-timing-fast) ease-in-out, outline-color var(--calcite-internal-animation-timing-fast) ease-in-out, -webkit-box-shadow var(--calcite-animation-timing) ease-in-out;transition:color var(--calcite-animation-timing) ease-in-out, background-color var(--calcite-animation-timing) ease-in-out, box-shadow var(--calcite-animation-timing) ease-in-out, outline-offset var(--calcite-internal-animation-timing-fast) ease-in-out, outline-color var(--calcite-internal-animation-timing-fast) ease-in-out;transition:color var(--calcite-animation-timing) ease-in-out, background-color var(--calcite-animation-timing) ease-in-out, box-shadow var(--calcite-animation-timing) ease-in-out, outline-offset var(--calcite-internal-animation-timing-fast) ease-in-out, outline-color var(--calcite-internal-animation-timing-fast) ease-in-out, -webkit-box-shadow var(--calcite-animation-timing) ease-in-out}/*!@:host button:hover, :host a:hover*/.sc-calcite-button-h button.sc-calcite-button:hover,.sc-calcite-button-h a.sc-calcite-button:hover{-webkit-text-decoration-line:none;text-decoration-line:none}/*!@.content*/.content.sc-calcite-button{display:-ms-flexbox;display:flex;-ms-flex-preferred-size:auto;flex-basis:auto;-webkit-margin-start:var(--calcite-button-content-margin);margin-inline-start:var(--calcite-button-content-margin);-webkit-margin-end:var(--calcite-button-content-margin);margin-inline-end:var(--calcite-button-content-margin)}/*!@.icon-start-empty .content*/.icon-start-empty.sc-calcite-button .content.sc-calcite-button{-webkit-margin-start:unset;margin-inline-start:unset}/*!@.icon-end-empty .content*/.icon-end-empty.sc-calcite-button .content.sc-calcite-button{-webkit-margin-end:unset;margin-inline-end:unset}/*!@:host([scale=m]) button,\n:host([scale=m]) a*/[scale=m].sc-calcite-button-h button.sc-calcite-button,[scale=m].sc-calcite-button-h a.sc-calcite-button{--calcite-button-content-margin:0.75rem}/*!@:host([scale=l]) button,\n:host([scale=l]) a*/[scale=l].sc-calcite-button-h button.sc-calcite-button,[scale=l].sc-calcite-button-h a.sc-calcite-button{--calcite-button-content-margin:1rem}/*!@:host([width=auto])*/[width=auto].sc-calcite-button-h{width:auto}/*!@:host([width=half])*/[width=half].sc-calcite-button-h{width:50%}/*!@:host([width=full])*/[width=full].sc-calcite-button-h{width:100%}/*!@:host([alignment=center]:not([width=auto])) a, :host([alignment=center]:not([width=auto])) button*/[alignment=center].sc-calcite-button-h:not([width=auto]) a.sc-calcite-button,[alignment=center].sc-calcite-button-h:not([width=auto]) button.sc-calcite-button{-ms-flex-pack:center;justify-content:center}/*!@:host([alignment=start]:not([width=auto])) a, :host([alignment=start]:not([width=auto])) button*/[alignment=start].sc-calcite-button-h:not([width=auto]) a.sc-calcite-button,[alignment=start].sc-calcite-button-h:not([width=auto]) button.sc-calcite-button{-ms-flex-pack:start;justify-content:flex-start}/*!@:host([alignment=end]:not([width=auto])) a, :host([alignment=end]:not([width=auto])) button*/[alignment=end].sc-calcite-button-h:not([width=auto]) a.sc-calcite-button,[alignment=end].sc-calcite-button-h:not([width=auto]) button.sc-calcite-button{-ms-flex-pack:end;justify-content:flex-end}/*!@:host([alignment*=space-between]:not([width=auto])) a, :host([alignment*=space-between]:not([width=auto])) button*/[alignment*=space-between].sc-calcite-button-h:not([width=auto]) a.sc-calcite-button,[alignment*=space-between].sc-calcite-button-h:not([width=auto]) button.sc-calcite-button{-ms-flex-pack:justify;justify-content:space-between}/*!@:host([alignment=icon-start-space-between]:not([width=auto])) .icon--start*/[alignment=icon-start-space-between].sc-calcite-button-h:not([width=auto]) .icon--start.sc-calcite-button{-webkit-margin-end:auto;margin-inline-end:auto}/*!@:host([alignment=icon-start-space-between]:not([width=auto])) a,\n:host([alignment=icon-start-space-between]:not([width=auto])) button*/[alignment=icon-start-space-between].sc-calcite-button-h:not([width=auto]) a.sc-calcite-button,[alignment=icon-start-space-between].sc-calcite-button-h:not([width=auto]) button.sc-calcite-button{text-align:unset}/*!@:host([alignment=icon-end-space-between]:not([width=auto])) .icon--end*/[alignment=icon-end-space-between].sc-calcite-button-h:not([width=auto]) .icon--end.sc-calcite-button{-webkit-margin-start:auto;margin-inline-start:auto}/*!@:host([alignment=icon-end-space-between]:not([width=auto])) a,\n:host([alignment=icon-end-space-between]:not([width=auto])) button*/[alignment=icon-end-space-between].sc-calcite-button-h:not([width=auto]) a.sc-calcite-button,[alignment=icon-end-space-between].sc-calcite-button-h:not([width=auto]) button.sc-calcite-button{text-align:unset}/*!@:host([alignment=center]) a:not(.content--slotted) .icon--start + .icon--end,\n:host([alignment=center]) button:not(.content--slotted) .icon--start + .icon--end*/[alignment=center].sc-calcite-button-h a.sc-calcite-button:not(.content--slotted) .icon--start.sc-calcite-button+.icon--end.sc-calcite-button,[alignment=center].sc-calcite-button-h button.sc-calcite-button:not(.content--slotted) .icon--start.sc-calcite-button+.icon--end.sc-calcite-button{-webkit-margin-start:var(--calcite-button-content-margin);margin-inline-start:var(--calcite-button-content-margin)}/*!@.icon*/.icon.sc-calcite-button{position:relative;margin:0px;display:-ms-inline-flexbox;display:inline-flex;font-weight:var(--calcite-font-weight-normal);line-height:inherit}/*!@:host([disabled])*/[disabled].sc-calcite-button-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-button-h[disabled] .sc-calcite-button-s>[calcite-hydrated][disabled],[disabled].sc-calcite-button-h [calcite-hydrated][disabled].sc-calcite-button{opacity:1}/*!@:host([loading])*/[loading].sc-calcite-button-h{pointer-events:none}/*!@:host([loading]) button, :host([loading]) a*/[loading].sc-calcite-button-h button.sc-calcite-button,[loading].sc-calcite-button-h a.sc-calcite-button{pointer-events:none;opacity:var(--calcite-ui-opacity-disabled)}@-webkit-keyframes loader-in{0%{width:0;opacity:0;-webkit-transform:scale(0.5);transform:scale(0.5)}100%{width:1em;opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes loader-in{0%{width:0;opacity:0;-webkit-transform:scale(0.5);transform:scale(0.5)}100%{width:1em;opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes loader-out{0%{width:1em;opacity:1;-webkit-transform:scale(1);transform:scale(1)}100%{width:0;opacity:0;-webkit-transform:scale(0.5);transform:scale(0.5)}}@keyframes loader-out{0%{width:1em;opacity:1;-webkit-transform:scale(1);transform:scale(1)}100%{width:0;opacity:0;-webkit-transform:scale(0.5);transform:scale(0.5)}}/*!@.calcite-button--loader*/.calcite-button--loader.sc-calcite-button{display:-ms-flexbox;display:flex}/*!@.calcite-button--loader calcite-loader*/.calcite-button--loader.sc-calcite-button calcite-loader.sc-calcite-button{margin:0px;-webkit-transition:width var(--calcite-internal-animation-timing-slow) ease-in-out, opacity var(--calcite-internal-animation-timing-slow) ease-in-out, -webkit-transform var(--calcite-internal-animation-timing-slow) ease-in-out;transition:width var(--calcite-internal-animation-timing-slow) ease-in-out, opacity var(--calcite-internal-animation-timing-slow) ease-in-out, -webkit-transform var(--calcite-internal-animation-timing-slow) ease-in-out;transition:width var(--calcite-internal-animation-timing-slow) ease-in-out, opacity var(--calcite-internal-animation-timing-slow) ease-in-out, transform var(--calcite-internal-animation-timing-slow) ease-in-out;transition:width var(--calcite-internal-animation-timing-slow) ease-in-out, opacity var(--calcite-internal-animation-timing-slow) ease-in-out, transform var(--calcite-internal-animation-timing-slow) ease-in-out, -webkit-transform var(--calcite-internal-animation-timing-slow) ease-in-out}/*!@.calcite-button--loader calcite-loader.loading-in*/.calcite-button--loader.sc-calcite-button calcite-loader.loading-in.sc-calcite-button{-webkit-animation-name:loader-in;animation-name:loader-in;-webkit-animation-duration:310ms;animation-duration:310ms}/*!@.calcite-button--loader calcite-loader.loading-out*/.calcite-button--loader.sc-calcite-button calcite-loader.loading-out.sc-calcite-button{-webkit-animation-name:loader-out;animation-name:loader-out;-webkit-animation-duration:310ms;animation-duration:310ms}/*!@:host([loading]) button.content--slotted .calcite-button--loader calcite-loader,\n:host([loading]) a.content--slotted .calcite-button--loader calcite-loader*/[loading].sc-calcite-button-h button.content--slotted.sc-calcite-button .calcite-button--loader.sc-calcite-button calcite-loader.sc-calcite-button,[loading].sc-calcite-button-h a.content--slotted.sc-calcite-button .calcite-button--loader.sc-calcite-button calcite-loader.sc-calcite-button{-webkit-margin-end:var(--calcite-button-content-margin);margin-inline-end:var(--calcite-button-content-margin)}/*!@:host([loading]) button:not(.content--slotted) .icon--start, :host([loading]) button:not(.content--slotted) .icon--end, :host([loading]) a:not(.content--slotted) .icon--start, :host([loading]) a:not(.content--slotted) .icon--end*/[loading].sc-calcite-button-h button.sc-calcite-button:not(.content--slotted) .icon--start.sc-calcite-button,[loading].sc-calcite-button-h button.sc-calcite-button:not(.content--slotted) .icon--end.sc-calcite-button,[loading].sc-calcite-button-h a.sc-calcite-button:not(.content--slotted) .icon--start.sc-calcite-button,[loading].sc-calcite-button-h a.sc-calcite-button:not(.content--slotted) .icon--end.sc-calcite-button{display:none}/*!@:host([appearance=solid]) button, :host([appearance=solid]) a*/[appearance=solid].sc-calcite-button-h button.sc-calcite-button,[appearance=solid].sc-calcite-button-h a.sc-calcite-button{border-width:1px;border-style:solid;border-color:transparent}/*!@:host([appearance=solid][color=blue]) button, :host([appearance=solid][color=blue]) a*/[appearance=solid][color=blue].sc-calcite-button-h button.sc-calcite-button,[appearance=solid][color=blue].sc-calcite-button-h a.sc-calcite-button{background-color:var(--calcite-ui-brand);color:var(--calcite-ui-text-inverse)}/*!@:host([appearance=solid][color=blue]) button:hover, :host([appearance=solid][color=blue]) button:focus, :host([appearance=solid][color=blue]) a:hover, :host([appearance=solid][color=blue]) a:focus*/[appearance=solid][color=blue].sc-calcite-button-h button.sc-calcite-button:hover,[appearance=solid][color=blue].sc-calcite-button-h button.sc-calcite-button:focus,[appearance=solid][color=blue].sc-calcite-button-h a.sc-calcite-button:hover,[appearance=solid][color=blue].sc-calcite-button-h a.sc-calcite-button:focus{background-color:var(--calcite-ui-brand-hover)}/*!@:host([appearance=solid][color=blue]) button:active, :host([appearance=solid][color=blue]) a:active*/[appearance=solid][color=blue].sc-calcite-button-h button.sc-calcite-button:active,[appearance=solid][color=blue].sc-calcite-button-h a.sc-calcite-button:active{background-color:var(--calcite-ui-brand-press)}/*!@:host([appearance=solid][color=blue]) button calcite-loader, :host([appearance=solid][color=blue]) a calcite-loader*/[appearance=solid][color=blue].sc-calcite-button-h button.sc-calcite-button calcite-loader.sc-calcite-button,[appearance=solid][color=blue].sc-calcite-button-h a.sc-calcite-button calcite-loader.sc-calcite-button{color:var(--calcite-ui-text-inverse)}/*!@:host([appearance=solid][color=red]) button, :host([appearance=solid][color=red]) a*/[appearance=solid][color=red].sc-calcite-button-h button.sc-calcite-button,[appearance=solid][color=red].sc-calcite-button-h a.sc-calcite-button{background-color:var(--calcite-ui-danger);color:var(--calcite-ui-text-inverse)}/*!@:host([appearance=solid][color=red]) button:hover, :host([appearance=solid][color=red]) button:focus, :host([appearance=solid][color=red]) a:hover, :host([appearance=solid][color=red]) a:focus*/[appearance=solid][color=red].sc-calcite-button-h button.sc-calcite-button:hover,[appearance=solid][color=red].sc-calcite-button-h button.sc-calcite-button:focus,[appearance=solid][color=red].sc-calcite-button-h a.sc-calcite-button:hover,[appearance=solid][color=red].sc-calcite-button-h a.sc-calcite-button:focus{background-color:var(--calcite-ui-danger-hover)}/*!@:host([appearance=solid][color=red]) button:active, :host([appearance=solid][color=red]) a:active*/[appearance=solid][color=red].sc-calcite-button-h button.sc-calcite-button:active,[appearance=solid][color=red].sc-calcite-button-h a.sc-calcite-button:active{background-color:var(--calcite-ui-danger-press)}/*!@:host([appearance=solid][color=red]) button calcite-loader, :host([appearance=solid][color=red]) a calcite-loader*/[appearance=solid][color=red].sc-calcite-button-h button.sc-calcite-button calcite-loader.sc-calcite-button,[appearance=solid][color=red].sc-calcite-button-h a.sc-calcite-button calcite-loader.sc-calcite-button{color:var(--calcite-ui-text-inverse)}/*!@:host([appearance=solid][color=neutral]) button, :host([appearance=solid][color=neutral]) a*/[appearance=solid][color=neutral].sc-calcite-button-h button.sc-calcite-button,[appearance=solid][color=neutral].sc-calcite-button-h a.sc-calcite-button{background-color:var(--calcite-ui-foreground-3);color:var(--calcite-ui-text-1)}/*!@:host([appearance=solid][color=neutral]) button:hover, :host([appearance=solid][color=neutral]) button:focus, :host([appearance=solid][color=neutral]) a:hover, :host([appearance=solid][color=neutral]) a:focus*/[appearance=solid][color=neutral].sc-calcite-button-h button.sc-calcite-button:hover,[appearance=solid][color=neutral].sc-calcite-button-h button.sc-calcite-button:focus,[appearance=solid][color=neutral].sc-calcite-button-h a.sc-calcite-button:hover,[appearance=solid][color=neutral].sc-calcite-button-h a.sc-calcite-button:focus{background-color:var(--calcite-ui-foreground-2)}/*!@:host([appearance=solid][color=neutral]) button:active, :host([appearance=solid][color=neutral]) a:active*/[appearance=solid][color=neutral].sc-calcite-button-h button.sc-calcite-button:active,[appearance=solid][color=neutral].sc-calcite-button-h a.sc-calcite-button:active{background-color:var(--calcite-ui-foreground-1)}/*!@:host([appearance=solid][color=neutral]) button calcite-loader, :host([appearance=solid][color=neutral]) a calcite-loader*/[appearance=solid][color=neutral].sc-calcite-button-h button.sc-calcite-button calcite-loader.sc-calcite-button,[appearance=solid][color=neutral].sc-calcite-button-h a.sc-calcite-button calcite-loader.sc-calcite-button{color:var(--calcite-ui-text-1)}/*!@:host([appearance=solid][color=inverse]) button, :host([appearance=solid][color=inverse]) a*/[appearance=solid][color=inverse].sc-calcite-button-h button.sc-calcite-button,[appearance=solid][color=inverse].sc-calcite-button-h a.sc-calcite-button{color:var(--calcite-ui-text-inverse);background-color:var(--calcite-ui-inverse)}/*!@:host([appearance=solid][color=inverse]) button:hover, :host([appearance=solid][color=inverse]) button:focus,\n:host([appearance=solid][color=inverse]) a:hover,\n:host([appearance=solid][color=inverse]) a:focus*/[appearance=solid][color=inverse].sc-calcite-button-h button.sc-calcite-button:hover,[appearance=solid][color=inverse].sc-calcite-button-h button.sc-calcite-button:focus,[appearance=solid][color=inverse].sc-calcite-button-h a.sc-calcite-button:hover,[appearance=solid][color=inverse].sc-calcite-button-h a.sc-calcite-button:focus{background-color:var(--calcite-ui-inverse-hover)}/*!@:host([appearance=solid][color=inverse]) button:active,\n:host([appearance=solid][color=inverse]) a:active*/[appearance=solid][color=inverse].sc-calcite-button-h button.sc-calcite-button:active,[appearance=solid][color=inverse].sc-calcite-button-h a.sc-calcite-button:active{background-color:var(--calcite-ui-inverse-press)}/*!@:host([appearance=solid][color=inverse]) button calcite-loader, :host([appearance=solid][color=inverse]) a calcite-loader*/[appearance=solid][color=inverse].sc-calcite-button-h button.sc-calcite-button calcite-loader.sc-calcite-button,[appearance=solid][color=inverse].sc-calcite-button-h a.sc-calcite-button calcite-loader.sc-calcite-button{color:var(--calcite-ui-text-inverse)}/*!@:host([appearance=outline]) button, :host([appearance=outline]) a*/[appearance=outline].sc-calcite-button-h button.sc-calcite-button,[appearance=outline].sc-calcite-button-h a.sc-calcite-button{border-width:1px;border-style:solid;background-color:var(--calcite-ui-foreground-1);-webkit-box-shadow:inset 0 0 0 1px transparent;box-shadow:inset 0 0 0 1px transparent}/*!@:host([appearance=outline][color=blue]) button, :host([appearance=outline][color=blue]) a*/[appearance=outline][color=blue].sc-calcite-button-h button.sc-calcite-button,[appearance=outline][color=blue].sc-calcite-button-h a.sc-calcite-button{border-color:var(--calcite-ui-brand);color:var(--calcite-ui-brand)}/*!@:host([appearance=outline][color=blue]) button:hover, :host([appearance=outline][color=blue]) a:hover*/[appearance=outline][color=blue].sc-calcite-button-h button.sc-calcite-button:hover,[appearance=outline][color=blue].sc-calcite-button-h a.sc-calcite-button:hover{border-color:var(--calcite-ui-brand-hover);color:var(--calcite-ui-brand-hover);-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-brand-hover);box-shadow:inset 0 0 0 1px var(--calcite-ui-brand-hover)}/*!@:host([appearance=outline][color=blue]) button:focus, :host([appearance=outline][color=blue]) a:focus*/[appearance=outline][color=blue].sc-calcite-button-h button.sc-calcite-button:focus,[appearance=outline][color=blue].sc-calcite-button-h a.sc-calcite-button:focus{border-color:var(--calcite-ui-brand);color:var(--calcite-ui-brand);-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-brand);box-shadow:inset 0 0 0 2px var(--calcite-ui-brand)}/*!@:host([appearance=outline][color=blue]) button:active, :host([appearance=outline][color=blue]) a:active*/[appearance=outline][color=blue].sc-calcite-button-h button.sc-calcite-button:active,[appearance=outline][color=blue].sc-calcite-button-h a.sc-calcite-button:active{border-color:var(--calcite-ui-brand-press);color:var(--calcite-ui-brand-press);-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-brand-press);box-shadow:inset 0 0 0 2px var(--calcite-ui-brand-press)}/*!@:host([appearance=outline][color=blue]) button calcite-loader,\n:host([appearance=outline][color=blue]) a calcite-loader*/[appearance=outline][color=blue].sc-calcite-button-h button.sc-calcite-button calcite-loader.sc-calcite-button,[appearance=outline][color=blue].sc-calcite-button-h a.sc-calcite-button calcite-loader.sc-calcite-button{color:var(--calcite-ui-brand)}/*!@:host([appearance=outline][color=red]) button, :host([appearance=outline][color=red]) a*/[appearance=outline][color=red].sc-calcite-button-h button.sc-calcite-button,[appearance=outline][color=red].sc-calcite-button-h a.sc-calcite-button{border-color:var(--calcite-ui-danger);color:var(--calcite-ui-danger)}/*!@:host([appearance=outline][color=red]) button:hover, :host([appearance=outline][color=red]) a:hover*/[appearance=outline][color=red].sc-calcite-button-h button.sc-calcite-button:hover,[appearance=outline][color=red].sc-calcite-button-h a.sc-calcite-button:hover{border-color:var(--calcite-ui-danger-hover);color:var(--calcite-ui-danger-hover);-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-danger-hover);box-shadow:inset 0 0 0 1px var(--calcite-ui-danger-hover)}/*!@:host([appearance=outline][color=red]) button:focus, :host([appearance=outline][color=red]) a:focus*/[appearance=outline][color=red].sc-calcite-button-h button.sc-calcite-button:focus,[appearance=outline][color=red].sc-calcite-button-h a.sc-calcite-button:focus{border-color:var(--calcite-ui-danger);color:var(--calcite-ui-danger);-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-danger);box-shadow:inset 0 0 0 2px var(--calcite-ui-danger)}/*!@:host([appearance=outline][color=red]) button:active, :host([appearance=outline][color=red]) a:active*/[appearance=outline][color=red].sc-calcite-button-h button.sc-calcite-button:active,[appearance=outline][color=red].sc-calcite-button-h a.sc-calcite-button:active{border-color:var(--calcite-ui-danger-press);color:var(--calcite-ui-danger-press);-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-danger-press);box-shadow:inset 0 0 0 2px var(--calcite-ui-danger-press)}/*!@:host([appearance=outline][color=red]) button calcite-loader,\n:host([appearance=outline][color=red]) a calcite-loader*/[appearance=outline][color=red].sc-calcite-button-h button.sc-calcite-button calcite-loader.sc-calcite-button,[appearance=outline][color=red].sc-calcite-button-h a.sc-calcite-button calcite-loader.sc-calcite-button{color:var(--calcite-ui-danger)}/*!@:host([appearance=outline][color=neutral]) button, :host([appearance=outline][color=neutral]) a*/[appearance=outline][color=neutral].sc-calcite-button-h button.sc-calcite-button,[appearance=outline][color=neutral].sc-calcite-button-h a.sc-calcite-button{color:var(--calcite-ui-text-1);border-color:var(--calcite-ui-foreground-3)}/*!@:host([appearance=outline][color=neutral]) button:hover,\n:host([appearance=outline][color=neutral]) a:hover*/[appearance=outline][color=neutral].sc-calcite-button-h button.sc-calcite-button:hover,[appearance=outline][color=neutral].sc-calcite-button-h a.sc-calcite-button:hover{-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-foreground-3);box-shadow:inset 0 0 0 1px var(--calcite-ui-foreground-3)}/*!@:host([appearance=outline][color=neutral]) button:focus,\n:host([appearance=outline][color=neutral]) a:focus*/[appearance=outline][color=neutral].sc-calcite-button-h button.sc-calcite-button:focus,[appearance=outline][color=neutral].sc-calcite-button-h a.sc-calcite-button:focus{-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-foreground-3);box-shadow:inset 0 0 0 2px var(--calcite-ui-foreground-3)}/*!@:host([appearance=outline][color=neutral]) button:active,\n:host([appearance=outline][color=neutral]) a:active*/[appearance=outline][color=neutral].sc-calcite-button-h button.sc-calcite-button:active,[appearance=outline][color=neutral].sc-calcite-button-h a.sc-calcite-button:active{-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-foreground-3);box-shadow:inset 0 0 0 2px var(--calcite-ui-foreground-3)}/*!@:host([appearance=outline][color=neutral]) button calcite-loader, :host([appearance=outline][color=neutral]) a calcite-loader*/[appearance=outline][color=neutral].sc-calcite-button-h button.sc-calcite-button calcite-loader.sc-calcite-button,[appearance=outline][color=neutral].sc-calcite-button-h a.sc-calcite-button calcite-loader.sc-calcite-button{color:var(--calcite-ui-text-1)}/*!@:host([appearance=outline][color=inverse]) button, :host([appearance=outline][color=inverse]) a*/[appearance=outline][color=inverse].sc-calcite-button-h button.sc-calcite-button,[appearance=outline][color=inverse].sc-calcite-button-h a.sc-calcite-button{color:var(--calcite-ui-text-1);border-color:var(--calcite-ui-inverse)}/*!@:host([appearance=outline][color=inverse]) button:hover,\n:host([appearance=outline][color=inverse]) a:hover*/[appearance=outline][color=inverse].sc-calcite-button-h button.sc-calcite-button:hover,[appearance=outline][color=inverse].sc-calcite-button-h a.sc-calcite-button:hover{border-color:var(--calcite-ui-inverse-hover);-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-inverse-hover);box-shadow:inset 0 0 0 1px var(--calcite-ui-inverse-hover)}/*!@:host([appearance=outline][color=inverse]) button:focus,\n:host([appearance=outline][color=inverse]) a:focus*/[appearance=outline][color=inverse].sc-calcite-button-h button.sc-calcite-button:focus,[appearance=outline][color=inverse].sc-calcite-button-h a.sc-calcite-button:focus{border-color:var(--calcite-ui-inverse);-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-inverse);box-shadow:inset 0 0 0 2px var(--calcite-ui-inverse)}/*!@:host([appearance=outline][color=inverse]) button:active,\n:host([appearance=outline][color=inverse]) a:active*/[appearance=outline][color=inverse].sc-calcite-button-h button.sc-calcite-button:active,[appearance=outline][color=inverse].sc-calcite-button-h a.sc-calcite-button:active{border-color:var(--calcite-ui-inverse-press);-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-inverse-press);box-shadow:inset 0 0 0 2px var(--calcite-ui-inverse-press)}/*!@:host([appearance=outline][color=inverse]) button calcite-loader, :host([appearance=outline][color=inverse]) a calcite-loader*/[appearance=outline][color=inverse].sc-calcite-button-h button.sc-calcite-button calcite-loader.sc-calcite-button,[appearance=outline][color=inverse].sc-calcite-button-h a.sc-calcite-button calcite-loader.sc-calcite-button{color:var(--calcite-ui-text-1)}/*!@:host([appearance=clear]) button, :host([appearance=clear]) a*/[appearance=clear].sc-calcite-button-h button.sc-calcite-button,[appearance=clear].sc-calcite-button-h a.sc-calcite-button{border-width:1px;border-style:solid;background-color:transparent;-webkit-box-shadow:inset 0 0 0 1px transparent;box-shadow:inset 0 0 0 1px transparent}/*!@:host([appearance=clear][color=blue]) button, :host([appearance=clear][color=blue]) a*/[appearance=clear][color=blue].sc-calcite-button-h button.sc-calcite-button,[appearance=clear][color=blue].sc-calcite-button-h a.sc-calcite-button{border-color:var(--calcite-ui-brand);color:var(--calcite-ui-brand)}/*!@:host([appearance=clear][color=blue]) button:hover, :host([appearance=clear][color=blue]) a:hover*/[appearance=clear][color=blue].sc-calcite-button-h button.sc-calcite-button:hover,[appearance=clear][color=blue].sc-calcite-button-h a.sc-calcite-button:hover{border-color:var(--calcite-ui-brand-hover);color:var(--calcite-ui-brand-hover);-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-brand-hover);box-shadow:inset 0 0 0 1px var(--calcite-ui-brand-hover)}/*!@:host([appearance=clear][color=blue]) button:focus, :host([appearance=clear][color=blue]) a:focus*/[appearance=clear][color=blue].sc-calcite-button-h button.sc-calcite-button:focus,[appearance=clear][color=blue].sc-calcite-button-h a.sc-calcite-button:focus{border-color:var(--calcite-ui-brand);color:var(--calcite-ui-brand);-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-brand);box-shadow:inset 0 0 0 2px var(--calcite-ui-brand)}/*!@:host([appearance=clear][color=blue]) button:active, :host([appearance=clear][color=blue]) a:active*/[appearance=clear][color=blue].sc-calcite-button-h button.sc-calcite-button:active,[appearance=clear][color=blue].sc-calcite-button-h a.sc-calcite-button:active{border-color:var(--calcite-ui-brand-press);color:var(--calcite-ui-brand-press);-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-brand-press);box-shadow:inset 0 0 0 2px var(--calcite-ui-brand-press)}/*!@:host([appearance=clear][color=blue]) button calcite-loader,\n:host([appearance=clear][color=blue]) a calcite-loader*/[appearance=clear][color=blue].sc-calcite-button-h button.sc-calcite-button calcite-loader.sc-calcite-button,[appearance=clear][color=blue].sc-calcite-button-h a.sc-calcite-button calcite-loader.sc-calcite-button{color:var(--calcite-ui-brand)}/*!@:host([appearance=clear][color=red]) button, :host([appearance=clear][color=red]) a*/[appearance=clear][color=red].sc-calcite-button-h button.sc-calcite-button,[appearance=clear][color=red].sc-calcite-button-h a.sc-calcite-button{border-color:var(--calcite-ui-danger);color:var(--calcite-ui-danger)}/*!@:host([appearance=clear][color=red]) button:hover, :host([appearance=clear][color=red]) a:hover*/[appearance=clear][color=red].sc-calcite-button-h button.sc-calcite-button:hover,[appearance=clear][color=red].sc-calcite-button-h a.sc-calcite-button:hover{border-color:var(--calcite-ui-danger-hover);color:var(--calcite-ui-danger-hover);-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-danger-hover);box-shadow:inset 0 0 0 1px var(--calcite-ui-danger-hover)}/*!@:host([appearance=clear][color=red]) button:focus, :host([appearance=clear][color=red]) a:focus*/[appearance=clear][color=red].sc-calcite-button-h button.sc-calcite-button:focus,[appearance=clear][color=red].sc-calcite-button-h a.sc-calcite-button:focus{border-color:var(--calcite-ui-danger);color:var(--calcite-ui-danger);-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-danger);box-shadow:inset 0 0 0 2px var(--calcite-ui-danger)}/*!@:host([appearance=clear][color=red]) button:active, :host([appearance=clear][color=red]) a:active*/[appearance=clear][color=red].sc-calcite-button-h button.sc-calcite-button:active,[appearance=clear][color=red].sc-calcite-button-h a.sc-calcite-button:active{border-color:var(--calcite-ui-danger-press);color:var(--calcite-ui-danger-press);-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-danger-press);box-shadow:inset 0 0 0 2px var(--calcite-ui-danger-press)}/*!@:host([appearance=clear][color=red]) button calcite-loader,\n:host([appearance=clear][color=red]) a calcite-loader*/[appearance=clear][color=red].sc-calcite-button-h button.sc-calcite-button calcite-loader.sc-calcite-button,[appearance=clear][color=red].sc-calcite-button-h a.sc-calcite-button calcite-loader.sc-calcite-button{color:var(--calcite-ui-danger)}/*!@:host([appearance=clear][color=neutral]) button, :host([appearance=clear][color=neutral]) a*/[appearance=clear][color=neutral].sc-calcite-button-h button.sc-calcite-button,[appearance=clear][color=neutral].sc-calcite-button-h a.sc-calcite-button{color:var(--calcite-ui-text-1);border-color:var(--calcite-ui-foreground-3)}/*!@:host([appearance=clear][color=neutral]) button:hover,\n:host([appearance=clear][color=neutral]) a:hover*/[appearance=clear][color=neutral].sc-calcite-button-h button.sc-calcite-button:hover,[appearance=clear][color=neutral].sc-calcite-button-h a.sc-calcite-button:hover{-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-foreground-3);box-shadow:inset 0 0 0 1px var(--calcite-ui-foreground-3)}/*!@:host([appearance=clear][color=neutral]) button:focus,\n:host([appearance=clear][color=neutral]) a:focus*/[appearance=clear][color=neutral].sc-calcite-button-h button.sc-calcite-button:focus,[appearance=clear][color=neutral].sc-calcite-button-h a.sc-calcite-button:focus{-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-foreground-3);box-shadow:inset 0 0 0 2px var(--calcite-ui-foreground-3)}/*!@:host([appearance=clear][color=neutral]) button:active,\n:host([appearance=clear][color=neutral]) a:active*/[appearance=clear][color=neutral].sc-calcite-button-h button.sc-calcite-button:active,[appearance=clear][color=neutral].sc-calcite-button-h a.sc-calcite-button:active{-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-foreground-3);box-shadow:inset 0 0 0 2px var(--calcite-ui-foreground-3)}/*!@:host([appearance=clear][color=neutral]) button calcite-loader, :host([appearance=clear][color=neutral]) a calcite-loader*/[appearance=clear][color=neutral].sc-calcite-button-h button.sc-calcite-button calcite-loader.sc-calcite-button,[appearance=clear][color=neutral].sc-calcite-button-h a.sc-calcite-button calcite-loader.sc-calcite-button{color:var(--calcite-ui-text-1)}/*!@:host([appearance=clear][color=inverse]) button, :host([appearance=clear][color=inverse]) a*/[appearance=clear][color=inverse].sc-calcite-button-h button.sc-calcite-button,[appearance=clear][color=inverse].sc-calcite-button-h a.sc-calcite-button{color:var(--calcite-ui-text-1);border-color:var(--calcite-ui-inverse)}/*!@:host([appearance=clear][color=inverse]) button:hover,\n:host([appearance=clear][color=inverse]) a:hover*/[appearance=clear][color=inverse].sc-calcite-button-h button.sc-calcite-button:hover,[appearance=clear][color=inverse].sc-calcite-button-h a.sc-calcite-button:hover{border-color:var(--calcite-ui-inverse-hover);-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-inverse-hover);box-shadow:inset 0 0 0 1px var(--calcite-ui-inverse-hover)}/*!@:host([appearance=clear][color=inverse]) button:focus,\n:host([appearance=clear][color=inverse]) a:focus*/[appearance=clear][color=inverse].sc-calcite-button-h button.sc-calcite-button:focus,[appearance=clear][color=inverse].sc-calcite-button-h a.sc-calcite-button:focus{border-color:var(--calcite-ui-inverse);-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-inverse);box-shadow:inset 0 0 0 2px var(--calcite-ui-inverse)}/*!@:host([appearance=clear][color=inverse]) button:active,\n:host([appearance=clear][color=inverse]) a:active*/[appearance=clear][color=inverse].sc-calcite-button-h button.sc-calcite-button:active,[appearance=clear][color=inverse].sc-calcite-button-h a.sc-calcite-button:active{border-color:var(--calcite-ui-inverse-press);-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-inverse-press);box-shadow:inset 0 0 0 2px var(--calcite-ui-inverse-press)}/*!@:host([appearance=clear][color=inverse]) button calcite-loader, :host([appearance=clear][color=inverse]) a calcite-loader*/[appearance=clear][color=inverse].sc-calcite-button-h button.sc-calcite-button calcite-loader.sc-calcite-button,[appearance=clear][color=inverse].sc-calcite-button-h a.sc-calcite-button calcite-loader.sc-calcite-button{color:var(--calcite-ui-text-1)}/*!@:host([appearance=outline][split-child=primary]) button,\n:host([appearance=clear][split-child=primary]) button*/[appearance=outline][split-child=primary].sc-calcite-button-h button.sc-calcite-button,[appearance=clear][split-child=primary].sc-calcite-button-h button.sc-calcite-button{border-inline-end-width:0;border-inline-start-width:1px}/*!@:host([appearance=outline][split-child=secondary]) button,\n:host([appearance=clear][split-child=secondary]) button*/[appearance=outline][split-child=secondary].sc-calcite-button-h button.sc-calcite-button,[appearance=clear][split-child=secondary].sc-calcite-button-h button.sc-calcite-button{border-inline-start-width:0;border-inline-end-width:1px}/*!@:host([appearance=transparent]:not(.enable-editing-button)) button, :host([appearance=transparent]:not(.enable-editing-button)) a*/[appearance=transparent].sc-calcite-button-h:not(.enable-editing-button) button.sc-calcite-button,[appearance=transparent].sc-calcite-button-h:not(.enable-editing-button) a.sc-calcite-button{background-color:transparent}/*!@:host([appearance=transparent]:not(.enable-editing-button)) button:hover, :host([appearance=transparent]:not(.enable-editing-button)) button:focus,\n:host([appearance=transparent]:not(.enable-editing-button)) a:hover,\n:host([appearance=transparent]:not(.enable-editing-button)) a:focus*/[appearance=transparent].sc-calcite-button-h:not(.enable-editing-button) button.sc-calcite-button:hover,[appearance=transparent].sc-calcite-button-h:not(.enable-editing-button) button.sc-calcite-button:focus,[appearance=transparent].sc-calcite-button-h:not(.enable-editing-button) a.sc-calcite-button:hover,[appearance=transparent].sc-calcite-button-h:not(.enable-editing-button) a.sc-calcite-button:focus{background-color:var(--calcite-button-transparent-hover)}/*!@:host([appearance=transparent]:not(.enable-editing-button)) button:active,\n:host([appearance=transparent]:not(.enable-editing-button)) a:active*/[appearance=transparent].sc-calcite-button-h:not(.enable-editing-button) button.sc-calcite-button:active,[appearance=transparent].sc-calcite-button-h:not(.enable-editing-button) a.sc-calcite-button:active{background-color:var(--calcite-button-transparent-press)}/*!@:host([appearance=transparent][color=blue]) button,\n:host([appearance=transparent][color=blue]) a*/[appearance=transparent][color=blue].sc-calcite-button-h button.sc-calcite-button,[appearance=transparent][color=blue].sc-calcite-button-h a.sc-calcite-button{color:var(--calcite-ui-brand)}/*!@:host([appearance=transparent][color=blue]) button:hover,\n:host([appearance=transparent][color=blue]) a:hover*/[appearance=transparent][color=blue].sc-calcite-button-h button.sc-calcite-button:hover,[appearance=transparent][color=blue].sc-calcite-button-h a.sc-calcite-button:hover{color:var(--calcite-ui-brand-hover)}/*!@:host([appearance=transparent][color=blue]) button:focus,\n:host([appearance=transparent][color=blue]) a:focus*/[appearance=transparent][color=blue].sc-calcite-button-h button.sc-calcite-button:focus,[appearance=transparent][color=blue].sc-calcite-button-h a.sc-calcite-button:focus{color:var(--calcite-ui-brand)}/*!@:host([appearance=transparent][color=blue]) button:active,\n:host([appearance=transparent][color=blue]) a:active*/[appearance=transparent][color=blue].sc-calcite-button-h button.sc-calcite-button:active,[appearance=transparent][color=blue].sc-calcite-button-h a.sc-calcite-button:active{color:var(--calcite-ui-brand-press)}/*!@:host([appearance=transparent][color=blue]) button calcite-loader,\n:host([appearance=transparent][color=blue]) a calcite-loader*/[appearance=transparent][color=blue].sc-calcite-button-h button.sc-calcite-button calcite-loader.sc-calcite-button,[appearance=transparent][color=blue].sc-calcite-button-h a.sc-calcite-button calcite-loader.sc-calcite-button{color:var(--calcite-ui-brand)}/*!@:host([appearance=transparent][color=red]) button,\n:host([appearance=transparent][color=red]) a*/[appearance=transparent][color=red].sc-calcite-button-h button.sc-calcite-button,[appearance=transparent][color=red].sc-calcite-button-h a.sc-calcite-button{color:var(--calcite-ui-danger)}/*!@:host([appearance=transparent][color=red]) button:hover,\n:host([appearance=transparent][color=red]) a:hover*/[appearance=transparent][color=red].sc-calcite-button-h button.sc-calcite-button:hover,[appearance=transparent][color=red].sc-calcite-button-h a.sc-calcite-button:hover{color:var(--calcite-ui-danger-hover)}/*!@:host([appearance=transparent][color=red]) button:focus,\n:host([appearance=transparent][color=red]) a:focus*/[appearance=transparent][color=red].sc-calcite-button-h button.sc-calcite-button:focus,[appearance=transparent][color=red].sc-calcite-button-h a.sc-calcite-button:focus{color:var(--calcite-ui-danger)}/*!@:host([appearance=transparent][color=red]) button:active,\n:host([appearance=transparent][color=red]) a:active*/[appearance=transparent][color=red].sc-calcite-button-h button.sc-calcite-button:active,[appearance=transparent][color=red].sc-calcite-button-h a.sc-calcite-button:active{color:var(--calcite-ui-danger-press)}/*!@:host([appearance=transparent][color=red]) button calcite-loader,\n:host([appearance=transparent][color=red]) a calcite-loader*/[appearance=transparent][color=red].sc-calcite-button-h button.sc-calcite-button calcite-loader.sc-calcite-button,[appearance=transparent][color=red].sc-calcite-button-h a.sc-calcite-button calcite-loader.sc-calcite-button{color:var(--calcite-ui-danger)}/*!@:host([appearance=transparent][color=neutral]:not(.cancel-editing-button)) button, :host([appearance=transparent][color=neutral]:not(.cancel-editing-button)) a, :host([appearance=transparent][color=neutral]:not(.cancel-editing-button)) calcite-loader*/[appearance=transparent][color=neutral].sc-calcite-button-h:not(.cancel-editing-button) button.sc-calcite-button,[appearance=transparent][color=neutral].sc-calcite-button-h:not(.cancel-editing-button) a.sc-calcite-button,[appearance=transparent][color=neutral].sc-calcite-button-h:not(.cancel-editing-button) calcite-loader.sc-calcite-button{color:var(--calcite-ui-text-1)}/*!@:host([appearance=transparent][color=neutral].cancel-editing-button) button*/[appearance=transparent][color=neutral].cancel-editing-button.sc-calcite-button-h button.sc-calcite-button{border-top-width:1px;border-bottom-width:1px;color:var(--calcite-ui-text-3);border-top-color:var(--calcite-ui-border-input);border-bottom-color:var(--calcite-ui-border-input);border-bottom-style:solid;border-top-style:solid}/*!@:host([appearance=transparent][color=neutral].cancel-editing-button) button:not(.content--slotted)*/[appearance=transparent][color=neutral].cancel-editing-button.sc-calcite-button-h button.sc-calcite-button:not(.content--slotted){--calcite-button-padding-y:0}/*!@:host([appearance=transparent][color=neutral].cancel-editing-button) button:hover*/[appearance=transparent][color=neutral].cancel-editing-button.sc-calcite-button-h button.sc-calcite-button:hover{color:var(--calcite-ui-text-1)}/*!@:host([appearance=transparent][color=neutral].enable-editing-button) button*/[appearance=transparent][color=neutral].enable-editing-button.sc-calcite-button-h button.sc-calcite-button{background-color:transparent}/*!@:host(.confirm-changes-button) button:focus,\n:host(.cancel-editing-button) button:focus,\n:host(.enable-editing-button) button:focus*/.confirm-changes-button.sc-calcite-button-h button.sc-calcite-button:focus,.cancel-editing-button.sc-calcite-button-h button.sc-calcite-button:focus,.enable-editing-button.sc-calcite-button-h button.sc-calcite-button:focus{outline-offset:-2px}/*!@:host([appearance=transparent][color=inverse]) button, :host([appearance=transparent][color=inverse]) a, :host([appearance=transparent][color=inverse]) calcite-loader*/[appearance=transparent][color=inverse].sc-calcite-button-h button.sc-calcite-button,[appearance=transparent][color=inverse].sc-calcite-button-h a.sc-calcite-button,[appearance=transparent][color=inverse].sc-calcite-button-h calcite-loader.sc-calcite-button{color:var(--calcite-ui-text-inverse)}/*!@:host([scale=s]) button.content--slotted, :host([scale=s]) a.content--slotted*/[scale=s].sc-calcite-button-h button.content--slotted.sc-calcite-button,[scale=s].sc-calcite-button-h a.content--slotted.sc-calcite-button{font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=s][appearance=transparent]) button.content--slotted,\n:host([scale=s][appearance=transparent]) a.content--slotted*/[scale=s][appearance=transparent].sc-calcite-button-h button.content--slotted.sc-calcite-button,[scale=s][appearance=transparent].sc-calcite-button-h a.content--slotted.sc-calcite-button{--calcite-button-padding-x:0.5rem;--calcite-button-padding-y:0.25rem}/*!@:host([scale=m]) button.content--slotted,\n:host([scale=m]) a.content--slotted*/[scale=m].sc-calcite-button-h button.content--slotted.sc-calcite-button,[scale=m].sc-calcite-button-h a.content--slotted.sc-calcite-button{--calcite-button-padding-x:11px;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=m]:not([appearance=transparent])) button.content--slotted,\n:host([scale=m]:not([appearance=transparent])) a.content--slotted*/[scale=m].sc-calcite-button-h:not([appearance=transparent]) button.content--slotted.sc-calcite-button,[scale=m].sc-calcite-button-h:not([appearance=transparent]) a.content--slotted.sc-calcite-button{--calcite-button-padding-y:7px}/*!@:host([scale=m][appearance=transparent]) button.content--slotted,\n:host([scale=m][appearance=transparent]) a.content--slotted*/[scale=m][appearance=transparent].sc-calcite-button-h button.content--slotted.sc-calcite-button,[scale=m][appearance=transparent].sc-calcite-button-h a.content--slotted.sc-calcite-button{--calcite-button-padding-x:0.75rem;--calcite-button-padding-y:0.5rem}/*!@:host([scale=l]) button.content--slotted,\n:host([scale=l]) a.content--slotted*/[scale=l].sc-calcite-button-h button.content--slotted.sc-calcite-button,[scale=l].sc-calcite-button-h a.content--slotted.sc-calcite-button{--calcite-button-padding-x:15px;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host([scale=l]:not([appearance=transparent])) button.content--slotted,\n:host([scale=l]:not([appearance=transparent])) a.content--slotted*/[scale=l].sc-calcite-button-h:not([appearance=transparent]) button.content--slotted.sc-calcite-button,[scale=l].sc-calcite-button-h:not([appearance=transparent]) a.content--slotted.sc-calcite-button{--calcite-button-padding-y:11px}/*!@:host([scale=l][appearance=transparent]) button.content--slotted,\n:host([scale=l][appearance=transparent]) a.content--slotted*/[scale=l][appearance=transparent].sc-calcite-button-h button.content--slotted.sc-calcite-button,[scale=l][appearance=transparent].sc-calcite-button-h a.content--slotted.sc-calcite-button{--calcite-button-padding-x:1rem;--calcite-button-padding-y:0.75rem}/*!@:host([scale=s]) button:not(.content--slotted),\n:host([scale=s]) a:not(.content--slotted)*/[scale=s].sc-calcite-button-h button.sc-calcite-button:not(.content--slotted),[scale=s].sc-calcite-button-h a.sc-calcite-button:not(.content--slotted){--calcite-button-padding-x:0.125rem;--calcite-button-padding-y:3px;width:1.5rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;min-height:1.5rem}/*!@:host([scale=s][appearance=transparent]) button:not(.content--slotted),\n:host([scale=s][appearance=transparent]) a:not(.content--slotted)*/[scale=s][appearance=transparent].sc-calcite-button-h button.sc-calcite-button:not(.content--slotted),[scale=s][appearance=transparent].sc-calcite-button-h a.sc-calcite-button:not(.content--slotted){--calcite-button-padding-y:0.25rem}/*!@:host([scale=m]) button:not(.content--slotted),\n:host([scale=m]) a:not(.content--slotted)*/[scale=m].sc-calcite-button-h button.sc-calcite-button:not(.content--slotted),[scale=m].sc-calcite-button-h a.sc-calcite-button:not(.content--slotted){--calcite-button-padding-x:0.125rem;--calcite-button-padding-y:7px;width:2rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;min-height:2rem}/*!@:host([scale=m][appearance=transparent]) button:not(.content--slotted),\n:host([scale=m][appearance=transparent]) a:not(.content--slotted)*/[scale=m][appearance=transparent].sc-calcite-button-h button.sc-calcite-button:not(.content--slotted),[scale=m][appearance=transparent].sc-calcite-button-h a.sc-calcite-button:not(.content--slotted){--calcite-button-padding-y:0.5rem}/*!@:host([scale=l]) button:not(.content--slotted),\n:host([scale=l]) a:not(.content--slotted)*/[scale=l].sc-calcite-button-h button.sc-calcite-button:not(.content--slotted),[scale=l].sc-calcite-button-h a.sc-calcite-button:not(.content--slotted){--calcite-button-padding-x:0.125rem;--calcite-button-padding-y:9px;width:2.75rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;min-height:2.75rem}/*!@:host([scale=l][appearance=transparent]) button:not(.content--slotted),\n:host([scale=l][appearance=transparent]) a:not(.content--slotted)*/[scale=l][appearance=transparent].sc-calcite-button-h button.sc-calcite-button:not(.content--slotted),[scale=l][appearance=transparent].sc-calcite-button-h a.sc-calcite-button:not(.content--slotted){--calcite-button-padding-y:0.625rem}/*!@:host([scale=s][icon-start][icon-end]) button:not(.content--slotted),\n:host([scale=s][icon-start][icon-end]) a:not(.content--slotted)*/[scale=s][icon-start][icon-end].sc-calcite-button-h button.sc-calcite-button:not(.content--slotted),[scale=s][icon-start][icon-end].sc-calcite-button-h a.sc-calcite-button:not(.content--slotted){--calcite-button-padding-x:23px;height:1.5rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host([scale=s][icon-start][icon-end][appearance=transparent]) button:not(.content--slotted),\n:host([scale=s][icon-start][icon-end][appearance=transparent]) a:not(.content--slotted)*/[scale=s][icon-start][icon-end][appearance=transparent].sc-calcite-button-h button.sc-calcite-button:not(.content--slotted),[scale=s][icon-start][icon-end][appearance=transparent].sc-calcite-button-h a.sc-calcite-button:not(.content--slotted){--calcite-button-padding-x:1.5rem}/*!@:host([scale=m][icon-start][icon-end]) button:not(.content--slotted),\n:host([scale=m][icon-start][icon-end]) a:not(.content--slotted)*/[scale=m][icon-start][icon-end].sc-calcite-button-h button.sc-calcite-button:not(.content--slotted),[scale=m][icon-start][icon-end].sc-calcite-button-h a.sc-calcite-button:not(.content--slotted){--calcite-button-padding-x:2rem;height:2rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host([scale=m][icon-start][icon-end][appearance=transparent]) button:not(.content--slotted),\n:host([scale=m][icon-start][icon-end][appearance=transparent]) a:not(.content--slotted)*/[scale=m][icon-start][icon-end][appearance=transparent].sc-calcite-button-h button.sc-calcite-button:not(.content--slotted),[scale=m][icon-start][icon-end][appearance=transparent].sc-calcite-button-h a.sc-calcite-button:not(.content--slotted){--calcite-button-padding-x:33px}/*!@:host([scale=l][icon-start][icon-end]) button:not(.content--slotted),\n:host([scale=l][icon-start][icon-end]) a:not(.content--slotted)*/[scale=l][icon-start][icon-end].sc-calcite-button-h button.sc-calcite-button:not(.content--slotted),[scale=l][icon-start][icon-end].sc-calcite-button-h a.sc-calcite-button:not(.content--slotted){--calcite-button-padding-x:43px;height:2.75rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host([scale=l][icon-start][icon-end]) button:not(.content--slotted) .icon--start + .icon--end,\n:host([scale=l][icon-start][icon-end]) a:not(.content--slotted) .icon--start + .icon--end*/[scale=l][icon-start][icon-end].sc-calcite-button-h button.sc-calcite-button:not(.content--slotted) .icon--start.sc-calcite-button+.icon--end.sc-calcite-button,[scale=l][icon-start][icon-end].sc-calcite-button-h a.sc-calcite-button:not(.content--slotted) .icon--start.sc-calcite-button+.icon--end.sc-calcite-button{-webkit-margin-start:1rem;margin-inline-start:1rem}/*!@:host([scale=l][icon-start][icon-end][appearance=transparent]) button:not(.content--slotted),\n:host([scale=l][icon-start][icon-end][appearance=transparent]) a:not(.content--slotted)*/[scale=l][icon-start][icon-end][appearance=transparent].sc-calcite-button-h button.sc-calcite-button:not(.content--slotted),[scale=l][icon-start][icon-end][appearance=transparent].sc-calcite-button-h a.sc-calcite-button:not(.content--slotted){--calcite-button-padding-x:2.75rem}";
- /** Passing a 'href' will render an anchor link, instead of a button. Role will be set to link, or button, depending on this. */
- /** It is the consumers responsibility to add aria information, rel, target, for links, and any button attributes for form submission */
- /** @slot - A slot for adding text. */
- class Button {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** optionally specify alignment of button elements. */
- this.alignment = "center";
- /** specify the appearance style of the button, defaults to solid. */
- this.appearance = "solid";
- /** specify the color of the button, defaults to blue */
- this.color = "blue";
- /** is the button disabled */
- this.disabled = false;
- /** string to override English loading text
- * @default "Loading"
- */
- this.intlLoading = TEXT$k.loading;
- /** optionally add a calcite-loader component to the button, disabling interaction. */
- this.loading = false;
- /** optionally add a round style to the button */
- this.round = false;
- /** specify the scale of the button, defaults to m */
- this.scale = "m";
- /** is the button a child of a calcite-split-button */
- this.splitChild = false;
- /** The type attribute to apply to the button */
- this.type = "button";
- /** specify the width of the button, defaults to auto */
- this.width = "auto";
- /** watches for changing text content **/
- this.mutationObserver = createObserver();
- /** determine if there is slotted content for styling purposes */
- this.hasContent = false;
- /** determine if loader present for styling purposes */
- this.hasLoader = false;
- // act on a requested or nearby form based on type
- this.handleClick = () => {
- const { type } = this;
- if (this.href) {
- return;
- }
- // this.type refers to type attribute, not child element type
- if (type === "submit") {
- submitForm(this);
- }
- else if (type === "reset") {
- resetForm(this);
- }
- };
- }
- loadingChanged(newValue, oldValue) {
- if (!!newValue && !oldValue) {
- this.hasLoader = true;
- }
- if (!newValue && !!oldValue) {
- window.setTimeout(() => {
- this.hasLoader = false;
- }, 300);
- }
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- this.hasLoader = this.loading;
- this.setupTextContentObserver();
- connectLabel(this);
- this.formEl = closestElementCrossShadowBoundary(this.el, this.form ? `#${this.form}` : "form");
- }
- disconnectedCallback() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- disconnectLabel(this);
- this.formEl = null;
- }
- componentWillLoad() {
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- render() {
- const childElType = this.href ? "a" : "button";
- const Tag = childElType;
- const loaderNode = this.hasLoader ? (hAsync("div", { class: CSS$J.buttonLoader }, hAsync("calcite-loader", { active: true, class: this.loading ? CSS$J.loadingIn : CSS$J.loadingOut, inline: true, label: this.intlLoading, scale: "m" }))) : null;
- const iconStartEl = (hAsync("calcite-icon", { class: { [CSS$J.icon]: true, [CSS$J.iconStart]: true }, flipRtl: this.iconFlipRtl === "start" || this.iconFlipRtl === "both", icon: this.iconStart, scale: "s" }));
- const iconEndEl = (hAsync("calcite-icon", { class: { [CSS$J.icon]: true, [CSS$J.iconEnd]: true }, flipRtl: this.iconFlipRtl === "end" || this.iconFlipRtl === "both", icon: this.iconEnd, scale: "s" }));
- const contentEl = (hAsync("span", { class: CSS$J.content }, hAsync("slot", null)));
- return (hAsync(Tag, { "aria-label": getLabelText(this), class: {
- [CSS$J.contentSlotted]: this.hasContent,
- [CSS$J.iconStartEmpty]: !this.iconStart,
- [CSS$J.iconEndEmpty]: !this.iconEnd
- }, disabled: this.disabled || this.loading, href: childElType === "a" && this.href, name: childElType === "button" && this.name, onClick: this.handleClick, ref: (el) => (this.childEl = el), rel: childElType === "a" && this.rel, tabIndex: this.disabled || this.loading ? -1 : null, target: childElType === "a" && this.target, type: childElType === "button" && this.type }, loaderNode, this.iconStart ? iconStartEl : null, this.hasContent ? contentEl : null, this.iconEnd ? iconEndEl : null));
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- this.childEl.focus();
- }
- updateHasContent() {
- var _a, _b;
- const slottedContent = this.el.textContent.trim().length > 0 || this.el.childNodes.length > 0;
- this.hasContent =
- this.el.childNodes.length === 1 && ((_a = this.el.childNodes[0]) === null || _a === void 0 ? void 0 : _a.nodeName) === "#text"
- ? ((_b = this.el.textContent) === null || _b === void 0 ? void 0 : _b.trim().length) > 0
- : slottedContent;
- }
- setupTextContentObserver() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- onLabelClick() {
- this.handleClick();
- this.setFocus();
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "loading": ["loadingChanged"]
- }; }
- static get style() { return buttonCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-button",
- "$members$": {
- "alignment": [513],
- "appearance": [513],
- "label": [1],
- "color": [513],
- "disabled": [516],
- "href": [513],
- "iconEnd": [513, "icon-end"],
- "iconFlipRtl": [513, "icon-flip-rtl"],
- "iconStart": [513, "icon-start"],
- "intlLoading": [1, "intl-loading"],
- "loading": [516],
- "name": [1],
- "rel": [1],
- "form": [1],
- "round": [516],
- "scale": [513],
- "splitChild": [520, "split-child"],
- "target": [1],
- "type": [1025],
- "width": [513],
- "hasContent": [32],
- "hasLoader": [32],
- "setFocus": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["alignment", "alignment"], ["appearance", "appearance"], ["color", "color"], ["disabled", "disabled"], ["href", "href"], ["iconEnd", "icon-end"], ["iconFlipRtl", "icon-flip-rtl"], ["iconStart", "icon-start"], ["loading", "loading"], ["round", "round"], ["scale", "scale"], ["splitChild", "split-child"], ["width", "width"]]
- }; }
- }
- const CSS$I = {
- container: "container",
- header: "header",
- footer: "footer",
- title: "title",
- subtitle: "subtitle",
- thumbnailWrapper: "thumbnail-wrapper",
- checkboxWrapper: "checkbox-wrapper"
- };
- const SLOTS$j = {
- thumbnail: "thumbnail",
- title: "title",
- subtitle: "subtitle",
- footerLeading: "footer-leading",
- footerTrailing: "footer-trailing"
- };
- const TEXT$j = {
- select: "Select",
- deselect: "Deselect",
- loading: "Loading"
- };
- const cardCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-card:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-card{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-card{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-card{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-card{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-card{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-card:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-card-h{display:none}/*!@:host*/.sc-calcite-card-h{display:block;max-width:100%}/*!@:host .calcite-card-container*/.sc-calcite-card-h .calcite-card-container.sc-calcite-card{position:relative;display:-ms-flexbox;display:flex;height:100%;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-2);background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-3);--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);border-radius:var(--calcite-border-radius-base)}/*!@:host .calcite-card-container:hover*/.sc-calcite-card-h .calcite-card-container.sc-calcite-card:hover{--tw-shadow:0 4px 16px 0 rgba(0, 0, 0, 0.08), 0 2px 8px 0 rgba(0, 0, 0, 0.04);--tw-shadow-colored:0 4px 16px 0 var(--tw-shadow-color), 0 2px 8px 0 var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);z-index:1}/*!@:host .calcite-card-container:active*/.sc-calcite-card-h .calcite-card-container.sc-calcite-card:active{--tw-shadow:0 1px 6px -1px rgba(0, 0, 0, 0.16), 0 1px 2px -1px rgba(0, 0, 0, 0.08);--tw-shadow-colored:0 1px 6px -1px var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);-webkit-transition-duration:75ms;transition-duration:75ms;z-index:1}/*!@.container*/.container.sc-calcite-card{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column}/*!@:host([loading]) .calcite-card-container *:not(calcite-loader):not(.calcite-card-loader-container)*/[loading].sc-calcite-card-h .calcite-card-container.sc-calcite-card *.sc-calcite-card:not(calcite-loader):not(.calcite-card-loader-container){pointer-events:none;opacity:0}/*!@:host([loading]) .calcite-card-loader-container*/[loading].sc-calcite-card-h .calcite-card-loader-container.sc-calcite-card{position:absolute;top:0px;right:0px;bottom:0px;left:0px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}/*!@.header, .footer*/.header.sc-calcite-card,.footer.sc-calcite-card{display:-ms-flexbox;display:flex;padding-left:0.75rem;padding-right:0.75rem;padding-top:0.75rem;padding-bottom:0.25rem}/*!@.header*/.header.sc-calcite-card{-ms-flex-direction:column;flex-direction:column}/*!@.footer*/.footer.sc-calcite-card{margin-top:auto;-ms-flex-direction:row;flex-direction:row;-ms-flex-line-pack:justify;align-content:space-between;-ms-flex-pack:justify;justify-content:space-between;padding-left:0.75rem;padding-right:0.75rem;padding-top:0.25rem;padding-bottom:0.75rem}/*!@.card-content*/.card-content.sc-calcite-card{padding:0.75rem;font-size:var(--calcite-font-size--2);line-height:1.375;color:var(--calcite-ui-text-3)}/*!@:host([selectable]) .calcite-card-container:active*/[selectable].sc-calcite-card-h .calcite-card-container.sc-calcite-card:active{--tw-shadow:0 1px 6px -1px rgba(0, 0, 0, 0.16), 0 1px 2px -1px rgba(0, 0, 0, 0.08);--tw-shadow-colored:0 1px 6px -1px var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@:host([selected]) .calcite-card-container*/[selected].sc-calcite-card-h .calcite-card-container.sc-calcite-card{border-color:var(--calcite-ui-brand)}/*!@slot[name=title]::slotted(*), *::slotted([slot=title])*/slot[name=title].sc-calcite-card-s>*,*.sc-calcite-card-s>[slot=title]{margin:0px;font-size:var(--calcite-font-size--1);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1)}/*!@slot[name=subtitle]::slotted(*), *::slotted([slot=subtitle])*/slot[name=subtitle].sc-calcite-card-s>*,*.sc-calcite-card-s>[slot=subtitle]{margin:0px;margin-top:0.5rem;font-size:var(--calcite-font-size--2);line-height:1.375;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-2)}/*!@slot[name=thumbnail]::slotted(img), img::slotted([slot=thumbnail])*/slot[name=thumbnail].sc-calcite-card-s>img,img.sc-calcite-card-s>[slot=thumbnail]{min-width:100%;max-width:100%}/*!@slot[name=footer-leading]::slotted(*), *::slotted([slot=footer-leading])*/slot[name=footer-leading].sc-calcite-card-s>*,*.sc-calcite-card-s>[slot=footer-leading]{-ms-flex-item-align:center;align-self:center;font-size:var(--calcite-font-size--2);line-height:1.375;-webkit-margin-end:auto;margin-inline-end:auto}/*!@slot[name=footer-trailing]::slotted(*), *::slotted([slot=footer-trailing])*/slot[name=footer-trailing].sc-calcite-card-s>*,*.sc-calcite-card-s>[slot=footer-trailing]{-ms-flex-item-align:center;align-self:center;font-size:var(--calcite-font-size--2);line-height:1.375}/*!@.thumbnail-wrapper*/.thumbnail-wrapper.sc-calcite-card{font-size:var(--calcite-font-size-0);line-height:1.375}/*!@.checkbox-wrapper*/.checkbox-wrapper.sc-calcite-card{position:absolute;margin:0px;padding:0px;top:0.5rem;inset-inline-end:0.5rem}";
- /** Cards do not include a grid or bounding container
- * - cards will expand to fit the width of their container
- */
- /**
- * @slot - A slot for adding subheader/description content.
- * @slot thumbnail - A slot for adding a thumbnail to the card.
- * @slot title - A slot for adding a card title.
- * @slot subtitle - A slot for adding a card subtitle or short summary.
- * @slot footer-leading - A slot for adding a leading footer.
- * @slot footer-trailing - A slot for adding a trailing footer.
- */
- class Card {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteCardSelect = createEvent(this, "calciteCardSelect", 7);
- //--------------------------------------------------------------------------
- //
- // Public Properties
- //
- //--------------------------------------------------------------------------
- /** When true, the cards content is waiting to be loaded. This state shows a busy indicator.*/
- this.loading = false;
- /** Indicates whether the card is selected. */
- this.selected = false;
- /** Indicates whether the card is selectable. */
- this.selectable = false;
- /** string to override English loading text
- * @default "Loading"
- */
- this.intlLoading = TEXT$j.loading;
- /** string to override English select text for checkbox when selectable is true
- * @default "Select"
- */
- this.intlSelect = TEXT$j.select;
- /** string to override English deselect text for checkbox when selectable is true
- * @default "Deselect"
- */
- this.intlDeselect = TEXT$j.deselect;
- //--------------------------------------------------------------------------
- //
- // Private State/Props
- //
- //--------------------------------------------------------------------------
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- this.cardSelectClick = () => {
- this.selectCard();
- };
- this.cardSelectKeyDown = (e) => {
- switch (e.key) {
- case " ":
- case "Enter":
- this.selectCard();
- e.preventDefault();
- break;
- }
- };
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- connectConditionalSlotComponent(this);
- }
- disonnectedCallback() {
- disconnectConditionalSlotComponent(this);
- }
- render() {
- return (hAsync("div", { class: "calcite-card-container" }, this.loading ? (hAsync("div", { class: "calcite-card-loader-container" }, hAsync("calcite-loader", { active: true, label: this.intlLoading }))) : null, hAsync("section", { "aria-busy": toAriaBoolean(this.loading), class: { [CSS$I.container]: true } }, this.selectable ? this.renderCheckbox() : null, this.renderThumbnail(), this.renderHeader(), hAsync("div", { class: "card-content" }, hAsync("slot", null)), this.renderFooter())));
- }
- selectCard() {
- this.selected = !this.selected;
- this.calciteCardSelect.emit();
- }
- renderThumbnail() {
- return getSlotted(this.el, SLOTS$j.thumbnail) ? (hAsync("div", { class: CSS$I.thumbnailWrapper, key: "thumbnail-wrapper" }, hAsync("slot", { name: SLOTS$j.thumbnail }))) : null;
- }
- renderCheckbox() {
- const checkboxLabel = this.selected ? this.intlDeselect : this.intlSelect;
- return (hAsync("calcite-label", { class: CSS$I.checkboxWrapper, onClick: this.cardSelectClick, onKeyDown: this.cardSelectKeyDown }, hAsync("calcite-checkbox", { checked: this.selected, label: checkboxLabel })));
- }
- renderHeader() {
- const { el } = this;
- const title = getSlotted(el, SLOTS$j.title);
- const subtitle = getSlotted(el, SLOTS$j.subtitle);
- const hasHeader = title || subtitle;
- return hasHeader ? (hAsync("header", { class: CSS$I.header }, hAsync("slot", { name: SLOTS$j.title }), hAsync("slot", { name: SLOTS$j.subtitle }))) : null;
- }
- renderFooter() {
- const { el } = this;
- const leadingFooter = getSlotted(el, SLOTS$j.footerLeading);
- const trailingFooter = getSlotted(el, SLOTS$j.footerTrailing);
- const hasFooter = leadingFooter || trailingFooter;
- return hasFooter ? (hAsync("footer", { class: CSS$I.footer }, hAsync("slot", { name: SLOTS$j.footerLeading }), hAsync("slot", { name: SLOTS$j.footerTrailing }))) : null;
- }
- get el() { return getElement(this); }
- static get style() { return cardCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-card",
- "$members$": {
- "loading": [516],
- "selected": [1540],
- "selectable": [516],
- "intlLoading": [1, "intl-loading"],
- "intlSelect": [1, "intl-select"],
- "intlDeselect": [1, "intl-deselect"]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["loading", "loading"], ["selected", "selected"], ["selectable", "selectable"]]
- }; }
- }
- const checkboxCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-checkbox:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-checkbox{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-checkbox{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-checkbox{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-checkbox{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-checkbox{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-checkbox:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-checkbox-h{display:none}/*!@:host([scale=s])*/[scale=s].sc-calcite-checkbox-h{--calcite-checkbox-size:0.75rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-checkbox-h{--calcite-checkbox-size:var(--calcite-font-size--1)}/*!@:host([scale=l])*/[scale=l].sc-calcite-checkbox-h{--calcite-checkbox-size:1rem}/*!@:host*/.sc-calcite-checkbox-h{position:relative;display:-ms-inline-flexbox;display:inline-flex;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}/*!@:host .check-svg*/.sc-calcite-checkbox-h .check-svg.sc-calcite-checkbox{pointer-events:none;-webkit-box-sizing:border-box;box-sizing:border-box;display:block;overflow:hidden;background-color:var(--calcite-ui-foreground-1);fill:currentColor;stroke:currentColor;stroke-width:1;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);width:var(--calcite-checkbox-size);height:var(--calcite-checkbox-size);-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-border-input);box-shadow:inset 0 0 0 1px var(--calcite-ui-border-input);color:var(--calcite-ui-background)}/*!@:host([checked]) .check-svg, :host([indeterminate]) .check-svg*/[checked].sc-calcite-checkbox-h .check-svg.sc-calcite-checkbox,[indeterminate].sc-calcite-checkbox-h .check-svg.sc-calcite-checkbox{background-color:var(--calcite-ui-brand);-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-brand);box-shadow:inset 0 0 0 1px var(--calcite-ui-brand)}/*!@:host([hovered]) .toggle .check-svg,\n:host .toggle:hover .check-svg*/[hovered].sc-calcite-checkbox-h .toggle.sc-calcite-checkbox .check-svg.sc-calcite-checkbox,.sc-calcite-checkbox-h .toggle.sc-calcite-checkbox:hover .check-svg.sc-calcite-checkbox{-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-brand);box-shadow:inset 0 0 0 2px var(--calcite-ui-brand)}/*!@:host .toggle:focus .check-svg,\n:host .toggle:active .check-svg*/.sc-calcite-checkbox-h .toggle.sc-calcite-checkbox:focus .check-svg.sc-calcite-checkbox,.sc-calcite-checkbox-h .toggle.sc-calcite-checkbox:active .check-svg.sc-calcite-checkbox{-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-brand), 0 0 0 2px var(--calcite-ui-foreground-1), 0 0 0 4px var(--calcite-ui-brand);box-shadow:inset 0 0 0 1px var(--calcite-ui-brand), 0 0 0 2px var(--calcite-ui-foreground-1), 0 0 0 4px var(--calcite-ui-brand);-webkit-transition:var(--calcite-animation-timing);transition:var(--calcite-animation-timing)}/*!@.toggle:focus-visible*/.toggle.sc-calcite-checkbox:focus-visible{outline:none}/*!@:host([disabled])*/[disabled].sc-calcite-checkbox-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-checkbox-h[disabled] .sc-calcite-checkbox-s>[calcite-hydrated][disabled],[disabled].sc-calcite-checkbox-h [calcite-hydrated][disabled].sc-calcite-checkbox{opacity:1}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-checkbox-s>input[slot=hidden-form-input]{bottom:0 !important;left:0 !important;margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;right:0 !important;top:0 !important;-webkit-transform:none !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}";
- class Checkbox {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteInternalCheckboxBlur = createEvent(this, "calciteInternalCheckboxBlur", 7);
- this.calciteCheckboxChange = createEvent(this, "calciteCheckboxChange", 7);
- this.calciteInternalCheckboxFocus = createEvent(this, "calciteInternalCheckboxFocus", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** The checked state of the checkbox. */
- this.checked = false;
- /** True if the checkbox is disabled */
- this.disabled = false;
- /**
- * The hovered state of the checkbox.
- * @internal
- */
- this.hovered = false;
- /**
- * True if the checkbox is initially indeterminate,
- * which is independent from its checked state
- * https://css-tricks.com/indeterminate-checkboxes/
- * */
- this.indeterminate = false;
- /**
- * When true, makes the component required for form-submission.
- *
- * @internal
- */
- this.required = false;
- /** specify the scale of the checkbox, defaults to m */
- this.scale = "m";
- //--------------------------------------------------------------------------
- //
- // Private Properties
- //
- //--------------------------------------------------------------------------
- this.checkedPath = "M5.5 12L2 8.689l.637-.636L5.5 10.727l8.022-7.87.637.637z";
- this.indeterminatePath = "M13 8v1H3V8z";
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- this.getPath = () => this.indeterminate ? this.indeterminatePath : this.checked ? this.checkedPath : "";
- this.toggle = () => {
- if (!this.disabled) {
- this.checked = !this.checked;
- this.setFocus();
- this.indeterminate = false;
- this.calciteCheckboxChange.emit();
- }
- };
- this.keyDownHandler = (event) => {
- if (event.key === " " || event.key === "Enter") {
- this.toggle();
- event.preventDefault();
- }
- };
- this.clickHandler = () => {
- this.toggle();
- };
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- this.onToggleBlur = () => {
- this.calciteInternalCheckboxBlur.emit(false);
- };
- this.onToggleFocus = () => {
- this.calciteInternalCheckboxFocus.emit(true);
- };
- this.onLabelClick = () => {
- this.toggle();
- };
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- var _a;
- (_a = this.toggleEl) === null || _a === void 0 ? void 0 : _a.focus();
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- this.guid = this.el.id || `calcite-checkbox-${guid()}`;
- connectLabel(this);
- connectForm(this);
- }
- disconnectedCallback() {
- disconnectLabel(this);
- disconnectForm(this);
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- return (hAsync(Host, { onClick: this.clickHandler, onKeyDown: this.keyDownHandler }, hAsync("div", { "aria-checked": toAriaBoolean(this.checked), "aria-label": getLabelText(this), class: "toggle", onBlur: this.onToggleBlur, onFocus: this.onToggleFocus, ref: (toggleEl) => (this.toggleEl = toggleEl), role: "checkbox", tabIndex: this.disabled ? undefined : 0 }, hAsync("svg", { class: "check-svg", viewBox: "0 0 16 16" }, hAsync("path", { d: this.getPath() })), hAsync("slot", null)), hAsync(HiddenFormInputSlot, { component: this })));
- }
- get el() { return getElement(this); }
- static get style() { return checkboxCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-checkbox",
- "$members$": {
- "checked": [1540],
- "disabled": [516],
- "guid": [1537],
- "hovered": [1540],
- "indeterminate": [1540],
- "label": [1],
- "name": [520],
- "required": [516],
- "scale": [513],
- "value": [8],
- "setFocus": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["checked", "checked"], ["disabled", "disabled"], ["guid", "guid"], ["hovered", "hovered"], ["indeterminate", "indeterminate"], ["name", "name"], ["required", "required"], ["scale", "scale"]]
- }; }
- }
- const CSS$H = {
- title: "title",
- close: "close",
- imageContainer: "image-container",
- chipIcon: "chip-icon",
- closeIcon: "close-icon"
- };
- const TEXT$i = {
- close: "Close"
- };
- const SLOTS$i = {
- image: "image"
- };
- const ICONS$a = {
- close: "x"
- };
- const chipCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-chip:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-chip{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-chip{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-chip{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-chip{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-chip{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-chip:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-chip-h{display:none}/*!@:host([scale=s])*/[scale=s].sc-calcite-chip-h{height:1.5rem;font-size:var(--calcite-font-size--2);--calcite-chip-spacing-unit-l:0.5rem;--calcite-chip-spacing-unit-s:0.25rem}/*!@:host([scale=s]) .image-container*/[scale=s].sc-calcite-chip-h .image-container.sc-calcite-chip{height:1.25rem;width:1.25rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-chip-h{height:2rem;font-size:var(--calcite-font-size--1);--calcite-chip-spacing-unit-l:0.75rem;--calcite-chip-spacing-unit-s:6px}/*!@:host([scale=m]) .image-container*/[scale=m].sc-calcite-chip-h .image-container.sc-calcite-chip{height:1.5rem;width:1.5rem;-webkit-padding-start:0.25rem;padding-inline-start:0.25rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-chip-h{height:2.75rem;font-size:var(--calcite-font-size-0);--calcite-chip-spacing-unit-l:1rem;--calcite-chip-spacing-unit-s:0.5rem}/*!@:host([scale=l]) .image-container*/[scale=l].sc-calcite-chip-h .image-container.sc-calcite-chip{height:2rem;width:2rem;padding-left:0.25rem}/*!@:host*/.sc-calcite-chip-h{-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-inline-flexbox;display:inline-flex;cursor:default;-ms-flex-align:center;align-items:center;border-radius:9999px;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-1);font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1)}/*!@.container*/.container.sc-calcite-chip{display:-ms-inline-flexbox;display:inline-flex;height:100%;max-width:100%;-ms-flex-align:center;align-items:center}/*!@.title*/.title.sc-calcite-chip{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}/*!@:host span*/.sc-calcite-chip-h span.sc-calcite-chip{padding:0 var(--calcite-chip-spacing-unit-l)}/*!@:host([dismissible]) span*/[dismissible].sc-calcite-chip-h span.sc-calcite-chip{padding-inline:var(--calcite-chip-spacing-unit-l) var(--calcite-chip-spacing-unit-s)}/*!@:host([icon]:not([dismissible])) span*/[icon].sc-calcite-chip-h:not([dismissible]) span.sc-calcite-chip{padding:0 var(--calcite-chip-spacing-unit-l)}/*!@:host button*/.sc-calcite-chip-h button.sc-calcite-chip{margin:0px;display:-ms-inline-flexbox;display:inline-flex;max-height:100%;min-height:100%;cursor:pointer;-ms-flex-align:center;align-items:center;-ms-flex-item-align:stretch;align-self:stretch;border-style:none;background-color:transparent;color:var(--calcite-ui-text-1);outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;-webkit-appearance:none;border-start-start-radius:0;border-start-end-radius:50px;border-end-end-radius:50px;border-end-start-radius:0;padding:0 var(--calcite-chip-spacing-unit-s);color:inherit;--calcite-chip-transparent-hover:var(--calcite-button-transparent-hover);--calcite-chip-transparent-press:var(--calcite-button-transparent-press)}/*!@:host button:hover*/.sc-calcite-chip-h button.sc-calcite-chip:hover{background-color:var(--calcite-chip-transparent-hover)}/*!@:host button:focus*/.sc-calcite-chip-h button.sc-calcite-chip:focus{background-color:var(--calcite-chip-transparent-hover);outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@:host button:active*/.sc-calcite-chip-h button.sc-calcite-chip:active{background-color:var(--calcite-chip-transparent-press)}/*!@.image-container*/.image-container.sc-calcite-chip{display:-ms-inline-flexbox;display:inline-flex;overflow:hidden;border-radius:50%}/*!@:host slot[name=image]::slotted(*)*/.sc-calcite-chip-h slot[name=image].sc-calcite-chip-s>*{display:-ms-flexbox;display:flex;height:100%;width:100%;overflow:hidden;border-radius:50%}/*!@.chip-icon*/.chip-icon.sc-calcite-chip{position:relative;margin-top:0px;margin-bottom:0px;display:-ms-inline-flexbox;display:inline-flex;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-margin-end:0;margin-inline-end:0;-webkit-margin-start:var(--calcite-chip-spacing-unit-l);margin-inline-start:var(--calcite-chip-spacing-unit-l);border-start-start-radius:0;border-start-end-radius:50px;border-end-end-radius:50px;border-end-start-radius:0}/*!@:host([color=blue][appearance=solid])*/[color=blue][appearance=solid].sc-calcite-chip-h{border-color:transparent;background-color:var(--calcite-ui-info);color:var(--calcite-ui-text-inverse)}/*!@:host([color=red][appearance=solid])*/[color=red][appearance=solid].sc-calcite-chip-h{border-color:transparent;background-color:var(--calcite-ui-danger);color:var(--calcite-ui-text-inverse)}/*!@:host([color=yellow][appearance=solid])*/[color=yellow][appearance=solid].sc-calcite-chip-h{border-color:transparent;background-color:var(--calcite-ui-warning);color:#151515}/*!@:host([color=green][appearance=solid])*/[color=green][appearance=solid].sc-calcite-chip-h{border-color:transparent;background-color:var(--calcite-ui-success);color:#151515}/*!@:host([color=grey][appearance=solid])*/[color=grey][appearance=solid].sc-calcite-chip-h{border-color:transparent;background-color:var(--calcite-ui-foreground-2);color:var(--calcite-ui-text-1)}/*!@:host([color=grey][appearance=solid]) button,\n:host([color=grey][appearance=solid]) .close-icon*/[color=grey][appearance=solid].sc-calcite-chip-h button.sc-calcite-chip,[color=grey][appearance=solid].sc-calcite-chip-h .close-icon.sc-calcite-chip{color:var(--calcite-ui-text-3)}/*!@:host([color=grey][appearance=solid]) .chip-icon*/[color=grey][appearance=solid].sc-calcite-chip-h .chip-icon.sc-calcite-chip{color:var(--calcite-ui-icon-color, var(--calcite-ui-text-3))}/*!@:host([color=blue][appearance=clear])*/[color=blue][appearance=clear].sc-calcite-chip-h{border-color:var(--calcite-ui-info)}/*!@:host([color=blue][appearance=clear]) .chip-icon*/[color=blue][appearance=clear].sc-calcite-chip-h .chip-icon.sc-calcite-chip{color:var(--calcite-ui-icon-color, var(--calcite-ui-info))}/*!@:host([color=red][appearance=clear])*/[color=red][appearance=clear].sc-calcite-chip-h{border-color:var(--calcite-ui-danger)}/*!@:host([color=red][appearance=clear]) .chip-icon*/[color=red][appearance=clear].sc-calcite-chip-h .chip-icon.sc-calcite-chip{color:var(--calcite-ui-icon-color, var(--calcite-ui-danger))}/*!@:host([color=yellow][appearance=clear])*/[color=yellow][appearance=clear].sc-calcite-chip-h{border-color:var(--calcite-ui-warning)}/*!@:host([color=yellow][appearance=clear]) .chip-icon*/[color=yellow][appearance=clear].sc-calcite-chip-h .chip-icon.sc-calcite-chip{color:var(--calcite-ui-icon-color, var(--calcite-ui-warning))}/*!@:host([color=green][appearance=clear])*/[color=green][appearance=clear].sc-calcite-chip-h{border-color:var(--calcite-ui-success)}/*!@:host([color=green][appearance=clear]) .chip-icon*/[color=green][appearance=clear].sc-calcite-chip-h .chip-icon.sc-calcite-chip{color:var(--calcite-ui-icon-color, var(--calcite-ui-success))}/*!@:host([color=grey][appearance=clear])*/[color=grey][appearance=clear].sc-calcite-chip-h{border-color:var(--calcite-ui-border-1)}/*!@:host([color=grey][appearance=clear]) .chip-icon*/[color=grey][appearance=clear].sc-calcite-chip-h .chip-icon.sc-calcite-chip{color:var(--calcite-ui-icon-color, var(--calcite-ui-text-3))}";
- /**
- * @slot - A slot for adding text.
- * @slot image - A slot for adding an image.
- */
- class Chip {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteChipDismiss = createEvent(this, "calciteChipDismiss", 7);
- //--------------------------------------------------------------------------
- //
- // Public Properties
- //
- //--------------------------------------------------------------------------
- /** specify the appearance style of the button, defaults to solid. */
- this.appearance = "solid";
- /** specify the color of the button, defaults to blue */
- this.color = "grey";
- /** Optionally show a button the user can click to dismiss the chip */
- this.dismissible = false;
- /** Aria label for the "x" button
- * @default "Close"
- */
- this.dismissLabel = TEXT$i.close;
- /** flip the icon in rtl */
- this.iconFlipRtl = false;
- /** specify the scale of the chip, defaults to m */
- this.scale = "m";
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.closeClickHandler = (event) => {
- event.preventDefault();
- this.calciteChipDismiss.emit(this.el);
- };
- this.guid = guid();
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- disconnectConditionalSlotComponent(this);
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- var _a;
- (_a = this.closeButton) === null || _a === void 0 ? void 0 : _a.focus();
- }
- //--------------------------------------------------------------------------
- //
- // Render Methods
- //
- //--------------------------------------------------------------------------
- renderChipImage() {
- const { el } = this;
- const hasChipImage = getSlotted(el, SLOTS$i.image);
- return hasChipImage ? (hAsync("div", { class: CSS$H.imageContainer, key: "image" }, hAsync("slot", { name: SLOTS$i.image }))) : null;
- }
- render() {
- const iconEl = (hAsync("calcite-icon", { class: CSS$H.chipIcon, flipRtl: this.iconFlipRtl, icon: this.icon, scale: "s" }));
- const closeButton = (hAsync("button", { "aria-describedby": this.guid, "aria-label": this.dismissLabel, class: CSS$H.close, onClick: this.closeClickHandler, ref: (el) => (this.closeButton = el) }, hAsync("calcite-icon", { class: CSS$H.closeIcon, icon: ICONS$a.close, scale: "s" })));
- return (hAsync("div", { class: "container" }, this.renderChipImage(), this.icon ? iconEl : null, hAsync("span", { class: CSS$H.title, id: this.guid }, hAsync("slot", null)), this.dismissible ? closeButton : null));
- }
- get el() { return getElement(this); }
- static get style() { return chipCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-chip",
- "$members$": {
- "appearance": [513],
- "color": [513],
- "dismissible": [516],
- "dismissLabel": [1, "dismiss-label"],
- "icon": [513],
- "iconFlipRtl": [516, "icon-flip-rtl"],
- "scale": [513],
- "value": [8],
- "setFocus": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["appearance", "appearance"], ["color", "color"], ["dismissible", "dismissible"], ["icon", "icon"], ["iconFlipRtl", "icon-flip-rtl"], ["scale", "scale"]]
- }; }
- }
- function createCommonjsModule(fn, basedir, module) {
- return module = {
- path: basedir,
- exports: {},
- require: function (path, base) {
- return commonjsRequire();
- }
- }, fn(module, module.exports), module.exports;
- }
- function commonjsRequire () {
- throw new Error('Dynamic requires are not currently supported by @rollup/plugin-commonjs');
- }
- var colorName$1 = {
- "aliceblue": [240, 248, 255],
- "antiquewhite": [250, 235, 215],
- "aqua": [0, 255, 255],
- "aquamarine": [127, 255, 212],
- "azure": [240, 255, 255],
- "beige": [245, 245, 220],
- "bisque": [255, 228, 196],
- "black": [0, 0, 0],
- "blanchedalmond": [255, 235, 205],
- "blue": [0, 0, 255],
- "blueviolet": [138, 43, 226],
- "brown": [165, 42, 42],
- "burlywood": [222, 184, 135],
- "cadetblue": [95, 158, 160],
- "chartreuse": [127, 255, 0],
- "chocolate": [210, 105, 30],
- "coral": [255, 127, 80],
- "cornflowerblue": [100, 149, 237],
- "cornsilk": [255, 248, 220],
- "crimson": [220, 20, 60],
- "cyan": [0, 255, 255],
- "darkblue": [0, 0, 139],
- "darkcyan": [0, 139, 139],
- "darkgoldenrod": [184, 134, 11],
- "darkgray": [169, 169, 169],
- "darkgreen": [0, 100, 0],
- "darkgrey": [169, 169, 169],
- "darkkhaki": [189, 183, 107],
- "darkmagenta": [139, 0, 139],
- "darkolivegreen": [85, 107, 47],
- "darkorange": [255, 140, 0],
- "darkorchid": [153, 50, 204],
- "darkred": [139, 0, 0],
- "darksalmon": [233, 150, 122],
- "darkseagreen": [143, 188, 143],
- "darkslateblue": [72, 61, 139],
- "darkslategray": [47, 79, 79],
- "darkslategrey": [47, 79, 79],
- "darkturquoise": [0, 206, 209],
- "darkviolet": [148, 0, 211],
- "deeppink": [255, 20, 147],
- "deepskyblue": [0, 191, 255],
- "dimgray": [105, 105, 105],
- "dimgrey": [105, 105, 105],
- "dodgerblue": [30, 144, 255],
- "firebrick": [178, 34, 34],
- "floralwhite": [255, 250, 240],
- "forestgreen": [34, 139, 34],
- "fuchsia": [255, 0, 255],
- "gainsboro": [220, 220, 220],
- "ghostwhite": [248, 248, 255],
- "gold": [255, 215, 0],
- "goldenrod": [218, 165, 32],
- "gray": [128, 128, 128],
- "green": [0, 128, 0],
- "greenyellow": [173, 255, 47],
- "grey": [128, 128, 128],
- "honeydew": [240, 255, 240],
- "hotpink": [255, 105, 180],
- "indianred": [205, 92, 92],
- "indigo": [75, 0, 130],
- "ivory": [255, 255, 240],
- "khaki": [240, 230, 140],
- "lavender": [230, 230, 250],
- "lavenderblush": [255, 240, 245],
- "lawngreen": [124, 252, 0],
- "lemonchiffon": [255, 250, 205],
- "lightblue": [173, 216, 230],
- "lightcoral": [240, 128, 128],
- "lightcyan": [224, 255, 255],
- "lightgoldenrodyellow": [250, 250, 210],
- "lightgray": [211, 211, 211],
- "lightgreen": [144, 238, 144],
- "lightgrey": [211, 211, 211],
- "lightpink": [255, 182, 193],
- "lightsalmon": [255, 160, 122],
- "lightseagreen": [32, 178, 170],
- "lightskyblue": [135, 206, 250],
- "lightslategray": [119, 136, 153],
- "lightslategrey": [119, 136, 153],
- "lightsteelblue": [176, 196, 222],
- "lightyellow": [255, 255, 224],
- "lime": [0, 255, 0],
- "limegreen": [50, 205, 50],
- "linen": [250, 240, 230],
- "magenta": [255, 0, 255],
- "maroon": [128, 0, 0],
- "mediumaquamarine": [102, 205, 170],
- "mediumblue": [0, 0, 205],
- "mediumorchid": [186, 85, 211],
- "mediumpurple": [147, 112, 219],
- "mediumseagreen": [60, 179, 113],
- "mediumslateblue": [123, 104, 238],
- "mediumspringgreen": [0, 250, 154],
- "mediumturquoise": [72, 209, 204],
- "mediumvioletred": [199, 21, 133],
- "midnightblue": [25, 25, 112],
- "mintcream": [245, 255, 250],
- "mistyrose": [255, 228, 225],
- "moccasin": [255, 228, 181],
- "navajowhite": [255, 222, 173],
- "navy": [0, 0, 128],
- "oldlace": [253, 245, 230],
- "olive": [128, 128, 0],
- "olivedrab": [107, 142, 35],
- "orange": [255, 165, 0],
- "orangered": [255, 69, 0],
- "orchid": [218, 112, 214],
- "palegoldenrod": [238, 232, 170],
- "palegreen": [152, 251, 152],
- "paleturquoise": [175, 238, 238],
- "palevioletred": [219, 112, 147],
- "papayawhip": [255, 239, 213],
- "peachpuff": [255, 218, 185],
- "peru": [205, 133, 63],
- "pink": [255, 192, 203],
- "plum": [221, 160, 221],
- "powderblue": [176, 224, 230],
- "purple": [128, 0, 128],
- "rebeccapurple": [102, 51, 153],
- "red": [255, 0, 0],
- "rosybrown": [188, 143, 143],
- "royalblue": [65, 105, 225],
- "saddlebrown": [139, 69, 19],
- "salmon": [250, 128, 114],
- "sandybrown": [244, 164, 96],
- "seagreen": [46, 139, 87],
- "seashell": [255, 245, 238],
- "sienna": [160, 82, 45],
- "silver": [192, 192, 192],
- "skyblue": [135, 206, 235],
- "slateblue": [106, 90, 205],
- "slategray": [112, 128, 144],
- "slategrey": [112, 128, 144],
- "snow": [255, 250, 250],
- "springgreen": [0, 255, 127],
- "steelblue": [70, 130, 180],
- "tan": [210, 180, 140],
- "teal": [0, 128, 128],
- "thistle": [216, 191, 216],
- "tomato": [255, 99, 71],
- "turquoise": [64, 224, 208],
- "violet": [238, 130, 238],
- "wheat": [245, 222, 179],
- "white": [255, 255, 255],
- "whitesmoke": [245, 245, 245],
- "yellow": [255, 255, 0],
- "yellowgreen": [154, 205, 50]
- };
- var isArrayish = function isArrayish(obj) {
- if (!obj || typeof obj === 'string') {
- return false;
- }
- return obj instanceof Array || Array.isArray(obj) ||
- (obj.length >= 0 && (obj.splice instanceof Function ||
- (Object.getOwnPropertyDescriptor(obj, (obj.length - 1)) && obj.constructor.name !== 'String')));
- };
- var simpleSwizzle = createCommonjsModule(function (module) {
- var concat = Array.prototype.concat;
- var slice = Array.prototype.slice;
- var swizzle = module.exports = function swizzle(args) {
- var results = [];
- for (var i = 0, len = args.length; i < len; i++) {
- var arg = args[i];
- if (isArrayish(arg)) {
- // http://jsperf.com/javascript-array-concat-vs-push/98
- results = concat.call(results, slice.call(arg));
- } else {
- results.push(arg);
- }
- }
- return results;
- };
- swizzle.wrap = function (fn) {
- return function () {
- return fn(swizzle(arguments));
- };
- };
- });
- var colorString = createCommonjsModule(function (module) {
- /* MIT license */
- var hasOwnProperty = Object.hasOwnProperty;
- var reverseNames = {};
- // create a list of reverse color names
- for (var name in colorName$1) {
- if (hasOwnProperty.call(colorName$1, name)) {
- reverseNames[colorName$1[name]] = name;
- }
- }
- var cs = module.exports = {
- to: {},
- get: {}
- };
- cs.get = function (string) {
- var prefix = string.substring(0, 3).toLowerCase();
- var val;
- var model;
- switch (prefix) {
- case 'hsl':
- val = cs.get.hsl(string);
- model = 'hsl';
- break;
- case 'hwb':
- val = cs.get.hwb(string);
- model = 'hwb';
- break;
- default:
- val = cs.get.rgb(string);
- model = 'rgb';
- break;
- }
- if (!val) {
- return null;
- }
- return {model: model, value: val};
- };
- cs.get.rgb = function (string) {
- if (!string) {
- return null;
- }
- var abbr = /^#([a-f0-9]{3,4})$/i;
- var hex = /^#([a-f0-9]{6})([a-f0-9]{2})?$/i;
- var rgba = /^rgba?\(\s*([+-]?\d+)(?=[\s,])\s*(?:,\s*)?([+-]?\d+)(?=[\s,])\s*(?:,\s*)?([+-]?\d+)\s*(?:[,|\/]\s*([+-]?[\d\.]+)(%?)\s*)?\)$/;
- var per = /^rgba?\(\s*([+-]?[\d\.]+)\%\s*,?\s*([+-]?[\d\.]+)\%\s*,?\s*([+-]?[\d\.]+)\%\s*(?:[,|\/]\s*([+-]?[\d\.]+)(%?)\s*)?\)$/;
- var keyword = /^(\w+)$/;
- var rgb = [0, 0, 0, 1];
- var match;
- var i;
- var hexAlpha;
- if (match = string.match(hex)) {
- hexAlpha = match[2];
- match = match[1];
- for (i = 0; i < 3; i++) {
- // https://jsperf.com/slice-vs-substr-vs-substring-methods-long-string/19
- var i2 = i * 2;
- rgb[i] = parseInt(match.slice(i2, i2 + 2), 16);
- }
- if (hexAlpha) {
- rgb[3] = parseInt(hexAlpha, 16) / 255;
- }
- } else if (match = string.match(abbr)) {
- match = match[1];
- hexAlpha = match[3];
- for (i = 0; i < 3; i++) {
- rgb[i] = parseInt(match[i] + match[i], 16);
- }
- if (hexAlpha) {
- rgb[3] = parseInt(hexAlpha + hexAlpha, 16) / 255;
- }
- } else if (match = string.match(rgba)) {
- for (i = 0; i < 3; i++) {
- rgb[i] = parseInt(match[i + 1], 0);
- }
- if (match[4]) {
- if (match[5]) {
- rgb[3] = parseFloat(match[4]) * 0.01;
- } else {
- rgb[3] = parseFloat(match[4]);
- }
- }
- } else if (match = string.match(per)) {
- for (i = 0; i < 3; i++) {
- rgb[i] = Math.round(parseFloat(match[i + 1]) * 2.55);
- }
- if (match[4]) {
- if (match[5]) {
- rgb[3] = parseFloat(match[4]) * 0.01;
- } else {
- rgb[3] = parseFloat(match[4]);
- }
- }
- } else if (match = string.match(keyword)) {
- if (match[1] === 'transparent') {
- return [0, 0, 0, 0];
- }
- if (!hasOwnProperty.call(colorName$1, match[1])) {
- return null;
- }
- rgb = colorName$1[match[1]];
- rgb[3] = 1;
- return rgb;
- } else {
- return null;
- }
- for (i = 0; i < 3; i++) {
- rgb[i] = clamp(rgb[i], 0, 255);
- }
- rgb[3] = clamp(rgb[3], 0, 1);
- return rgb;
- };
- cs.get.hsl = function (string) {
- if (!string) {
- return null;
- }
- var hsl = /^hsla?\(\s*([+-]?(?:\d{0,3}\.)?\d+)(?:deg)?\s*,?\s*([+-]?[\d\.]+)%\s*,?\s*([+-]?[\d\.]+)%\s*(?:[,|\/]\s*([+-]?(?=\.\d|\d)(?:0|[1-9]\d*)?(?:\.\d*)?(?:[eE][+-]?\d+)?)\s*)?\)$/;
- var match = string.match(hsl);
- if (match) {
- var alpha = parseFloat(match[4]);
- var h = ((parseFloat(match[1]) % 360) + 360) % 360;
- var s = clamp(parseFloat(match[2]), 0, 100);
- var l = clamp(parseFloat(match[3]), 0, 100);
- var a = clamp(isNaN(alpha) ? 1 : alpha, 0, 1);
- return [h, s, l, a];
- }
- return null;
- };
- cs.get.hwb = function (string) {
- if (!string) {
- return null;
- }
- var hwb = /^hwb\(\s*([+-]?\d{0,3}(?:\.\d+)?)(?:deg)?\s*,\s*([+-]?[\d\.]+)%\s*,\s*([+-]?[\d\.]+)%\s*(?:,\s*([+-]?(?=\.\d|\d)(?:0|[1-9]\d*)?(?:\.\d*)?(?:[eE][+-]?\d+)?)\s*)?\)$/;
- var match = string.match(hwb);
- if (match) {
- var alpha = parseFloat(match[4]);
- var h = ((parseFloat(match[1]) % 360) + 360) % 360;
- var w = clamp(parseFloat(match[2]), 0, 100);
- var b = clamp(parseFloat(match[3]), 0, 100);
- var a = clamp(isNaN(alpha) ? 1 : alpha, 0, 1);
- return [h, w, b, a];
- }
- return null;
- };
- cs.to.hex = function () {
- var rgba = simpleSwizzle(arguments);
- return (
- '#' +
- hexDouble(rgba[0]) +
- hexDouble(rgba[1]) +
- hexDouble(rgba[2]) +
- (rgba[3] < 1
- ? (hexDouble(Math.round(rgba[3] * 255)))
- : '')
- );
- };
- cs.to.rgb = function () {
- var rgba = simpleSwizzle(arguments);
- return rgba.length < 4 || rgba[3] === 1
- ? 'rgb(' + Math.round(rgba[0]) + ', ' + Math.round(rgba[1]) + ', ' + Math.round(rgba[2]) + ')'
- : 'rgba(' + Math.round(rgba[0]) + ', ' + Math.round(rgba[1]) + ', ' + Math.round(rgba[2]) + ', ' + rgba[3] + ')';
- };
- cs.to.rgb.percent = function () {
- var rgba = simpleSwizzle(arguments);
- var r = Math.round(rgba[0] / 255 * 100);
- var g = Math.round(rgba[1] / 255 * 100);
- var b = Math.round(rgba[2] / 255 * 100);
- return rgba.length < 4 || rgba[3] === 1
- ? 'rgb(' + r + '%, ' + g + '%, ' + b + '%)'
- : 'rgba(' + r + '%, ' + g + '%, ' + b + '%, ' + rgba[3] + ')';
- };
- cs.to.hsl = function () {
- var hsla = simpleSwizzle(arguments);
- return hsla.length < 4 || hsla[3] === 1
- ? 'hsl(' + hsla[0] + ', ' + hsla[1] + '%, ' + hsla[2] + '%)'
- : 'hsla(' + hsla[0] + ', ' + hsla[1] + '%, ' + hsla[2] + '%, ' + hsla[3] + ')';
- };
- // hwb is a bit different than rgb(a) & hsl(a) since there is no alpha specific syntax
- // (hwb have alpha optional & 1 is default value)
- cs.to.hwb = function () {
- var hwba = simpleSwizzle(arguments);
- var a = '';
- if (hwba.length >= 4 && hwba[3] !== 1) {
- a = ', ' + hwba[3];
- }
- return 'hwb(' + hwba[0] + ', ' + hwba[1] + '%, ' + hwba[2] + '%' + a + ')';
- };
- cs.to.keyword = function (rgb) {
- return reverseNames[rgb.slice(0, 3)];
- };
- // helpers
- function clamp(num, min, max) {
- return Math.min(Math.max(min, num), max);
- }
- function hexDouble(num) {
- var str = Math.round(num).toString(16).toUpperCase();
- return (str.length < 2) ? '0' + str : str;
- }
- });
- var colorName = {
- "aliceblue": [240, 248, 255],
- "antiquewhite": [250, 235, 215],
- "aqua": [0, 255, 255],
- "aquamarine": [127, 255, 212],
- "azure": [240, 255, 255],
- "beige": [245, 245, 220],
- "bisque": [255, 228, 196],
- "black": [0, 0, 0],
- "blanchedalmond": [255, 235, 205],
- "blue": [0, 0, 255],
- "blueviolet": [138, 43, 226],
- "brown": [165, 42, 42],
- "burlywood": [222, 184, 135],
- "cadetblue": [95, 158, 160],
- "chartreuse": [127, 255, 0],
- "chocolate": [210, 105, 30],
- "coral": [255, 127, 80],
- "cornflowerblue": [100, 149, 237],
- "cornsilk": [255, 248, 220],
- "crimson": [220, 20, 60],
- "cyan": [0, 255, 255],
- "darkblue": [0, 0, 139],
- "darkcyan": [0, 139, 139],
- "darkgoldenrod": [184, 134, 11],
- "darkgray": [169, 169, 169],
- "darkgreen": [0, 100, 0],
- "darkgrey": [169, 169, 169],
- "darkkhaki": [189, 183, 107],
- "darkmagenta": [139, 0, 139],
- "darkolivegreen": [85, 107, 47],
- "darkorange": [255, 140, 0],
- "darkorchid": [153, 50, 204],
- "darkred": [139, 0, 0],
- "darksalmon": [233, 150, 122],
- "darkseagreen": [143, 188, 143],
- "darkslateblue": [72, 61, 139],
- "darkslategray": [47, 79, 79],
- "darkslategrey": [47, 79, 79],
- "darkturquoise": [0, 206, 209],
- "darkviolet": [148, 0, 211],
- "deeppink": [255, 20, 147],
- "deepskyblue": [0, 191, 255],
- "dimgray": [105, 105, 105],
- "dimgrey": [105, 105, 105],
- "dodgerblue": [30, 144, 255],
- "firebrick": [178, 34, 34],
- "floralwhite": [255, 250, 240],
- "forestgreen": [34, 139, 34],
- "fuchsia": [255, 0, 255],
- "gainsboro": [220, 220, 220],
- "ghostwhite": [248, 248, 255],
- "gold": [255, 215, 0],
- "goldenrod": [218, 165, 32],
- "gray": [128, 128, 128],
- "green": [0, 128, 0],
- "greenyellow": [173, 255, 47],
- "grey": [128, 128, 128],
- "honeydew": [240, 255, 240],
- "hotpink": [255, 105, 180],
- "indianred": [205, 92, 92],
- "indigo": [75, 0, 130],
- "ivory": [255, 255, 240],
- "khaki": [240, 230, 140],
- "lavender": [230, 230, 250],
- "lavenderblush": [255, 240, 245],
- "lawngreen": [124, 252, 0],
- "lemonchiffon": [255, 250, 205],
- "lightblue": [173, 216, 230],
- "lightcoral": [240, 128, 128],
- "lightcyan": [224, 255, 255],
- "lightgoldenrodyellow": [250, 250, 210],
- "lightgray": [211, 211, 211],
- "lightgreen": [144, 238, 144],
- "lightgrey": [211, 211, 211],
- "lightpink": [255, 182, 193],
- "lightsalmon": [255, 160, 122],
- "lightseagreen": [32, 178, 170],
- "lightskyblue": [135, 206, 250],
- "lightslategray": [119, 136, 153],
- "lightslategrey": [119, 136, 153],
- "lightsteelblue": [176, 196, 222],
- "lightyellow": [255, 255, 224],
- "lime": [0, 255, 0],
- "limegreen": [50, 205, 50],
- "linen": [250, 240, 230],
- "magenta": [255, 0, 255],
- "maroon": [128, 0, 0],
- "mediumaquamarine": [102, 205, 170],
- "mediumblue": [0, 0, 205],
- "mediumorchid": [186, 85, 211],
- "mediumpurple": [147, 112, 219],
- "mediumseagreen": [60, 179, 113],
- "mediumslateblue": [123, 104, 238],
- "mediumspringgreen": [0, 250, 154],
- "mediumturquoise": [72, 209, 204],
- "mediumvioletred": [199, 21, 133],
- "midnightblue": [25, 25, 112],
- "mintcream": [245, 255, 250],
- "mistyrose": [255, 228, 225],
- "moccasin": [255, 228, 181],
- "navajowhite": [255, 222, 173],
- "navy": [0, 0, 128],
- "oldlace": [253, 245, 230],
- "olive": [128, 128, 0],
- "olivedrab": [107, 142, 35],
- "orange": [255, 165, 0],
- "orangered": [255, 69, 0],
- "orchid": [218, 112, 214],
- "palegoldenrod": [238, 232, 170],
- "palegreen": [152, 251, 152],
- "paleturquoise": [175, 238, 238],
- "palevioletred": [219, 112, 147],
- "papayawhip": [255, 239, 213],
- "peachpuff": [255, 218, 185],
- "peru": [205, 133, 63],
- "pink": [255, 192, 203],
- "plum": [221, 160, 221],
- "powderblue": [176, 224, 230],
- "purple": [128, 0, 128],
- "rebeccapurple": [102, 51, 153],
- "red": [255, 0, 0],
- "rosybrown": [188, 143, 143],
- "royalblue": [65, 105, 225],
- "saddlebrown": [139, 69, 19],
- "salmon": [250, 128, 114],
- "sandybrown": [244, 164, 96],
- "seagreen": [46, 139, 87],
- "seashell": [255, 245, 238],
- "sienna": [160, 82, 45],
- "silver": [192, 192, 192],
- "skyblue": [135, 206, 235],
- "slateblue": [106, 90, 205],
- "slategray": [112, 128, 144],
- "slategrey": [112, 128, 144],
- "snow": [255, 250, 250],
- "springgreen": [0, 255, 127],
- "steelblue": [70, 130, 180],
- "tan": [210, 180, 140],
- "teal": [0, 128, 128],
- "thistle": [216, 191, 216],
- "tomato": [255, 99, 71],
- "turquoise": [64, 224, 208],
- "violet": [238, 130, 238],
- "wheat": [245, 222, 179],
- "white": [255, 255, 255],
- "whitesmoke": [245, 245, 245],
- "yellow": [255, 255, 0],
- "yellowgreen": [154, 205, 50]
- };
- /* MIT license */
- /* eslint-disable no-mixed-operators */
- // NOTE: conversions should only return primitive values (i.e. arrays, or
- // values that give correct `typeof` results).
- // do not use box values types (i.e. Number(), String(), etc.)
- const reverseKeywords = {};
- for (const key of Object.keys(colorName)) {
- reverseKeywords[colorName[key]] = key;
- }
- const convert$1 = {
- rgb: {channels: 3, labels: 'rgb'},
- hsl: {channels: 3, labels: 'hsl'},
- hsv: {channels: 3, labels: 'hsv'},
- hwb: {channels: 3, labels: 'hwb'},
- cmyk: {channels: 4, labels: 'cmyk'},
- xyz: {channels: 3, labels: 'xyz'},
- lab: {channels: 3, labels: 'lab'},
- lch: {channels: 3, labels: 'lch'},
- hex: {channels: 1, labels: ['hex']},
- keyword: {channels: 1, labels: ['keyword']},
- ansi16: {channels: 1, labels: ['ansi16']},
- ansi256: {channels: 1, labels: ['ansi256']},
- hcg: {channels: 3, labels: ['h', 'c', 'g']},
- apple: {channels: 3, labels: ['r16', 'g16', 'b16']},
- gray: {channels: 1, labels: ['gray']}
- };
- var conversions = convert$1;
- // Hide .channels and .labels properties
- for (const model of Object.keys(convert$1)) {
- if (!('channels' in convert$1[model])) {
- throw new Error('missing channels property: ' + model);
- }
- if (!('labels' in convert$1[model])) {
- throw new Error('missing channel labels property: ' + model);
- }
- if (convert$1[model].labels.length !== convert$1[model].channels) {
- throw new Error('channel and label counts mismatch: ' + model);
- }
- const {channels, labels} = convert$1[model];
- delete convert$1[model].channels;
- delete convert$1[model].labels;
- Object.defineProperty(convert$1[model], 'channels', {value: channels});
- Object.defineProperty(convert$1[model], 'labels', {value: labels});
- }
- convert$1.rgb.hsl = function (rgb) {
- const r = rgb[0] / 255;
- const g = rgb[1] / 255;
- const b = rgb[2] / 255;
- const min = Math.min(r, g, b);
- const max = Math.max(r, g, b);
- const delta = max - min;
- let h;
- let s;
- if (max === min) {
- h = 0;
- } else if (r === max) {
- h = (g - b) / delta;
- } else if (g === max) {
- h = 2 + (b - r) / delta;
- } else if (b === max) {
- h = 4 + (r - g) / delta;
- }
- h = Math.min(h * 60, 360);
- if (h < 0) {
- h += 360;
- }
- const l = (min + max) / 2;
- if (max === min) {
- s = 0;
- } else if (l <= 0.5) {
- s = delta / (max + min);
- } else {
- s = delta / (2 - max - min);
- }
- return [h, s * 100, l * 100];
- };
- convert$1.rgb.hsv = function (rgb) {
- let rdif;
- let gdif;
- let bdif;
- let h;
- let s;
- const r = rgb[0] / 255;
- const g = rgb[1] / 255;
- const b = rgb[2] / 255;
- const v = Math.max(r, g, b);
- const diff = v - Math.min(r, g, b);
- const diffc = function (c) {
- return (v - c) / 6 / diff + 1 / 2;
- };
- if (diff === 0) {
- h = 0;
- s = 0;
- } else {
- s = diff / v;
- rdif = diffc(r);
- gdif = diffc(g);
- bdif = diffc(b);
- if (r === v) {
- h = bdif - gdif;
- } else if (g === v) {
- h = (1 / 3) + rdif - bdif;
- } else if (b === v) {
- h = (2 / 3) + gdif - rdif;
- }
- if (h < 0) {
- h += 1;
- } else if (h > 1) {
- h -= 1;
- }
- }
- return [
- h * 360,
- s * 100,
- v * 100
- ];
- };
- convert$1.rgb.hwb = function (rgb) {
- const r = rgb[0];
- const g = rgb[1];
- let b = rgb[2];
- const h = convert$1.rgb.hsl(rgb)[0];
- const w = 1 / 255 * Math.min(r, Math.min(g, b));
- b = 1 - 1 / 255 * Math.max(r, Math.max(g, b));
- return [h, w * 100, b * 100];
- };
- convert$1.rgb.cmyk = function (rgb) {
- const r = rgb[0] / 255;
- const g = rgb[1] / 255;
- const b = rgb[2] / 255;
- const k = Math.min(1 - r, 1 - g, 1 - b);
- const c = (1 - r - k) / (1 - k) || 0;
- const m = (1 - g - k) / (1 - k) || 0;
- const y = (1 - b - k) / (1 - k) || 0;
- return [c * 100, m * 100, y * 100, k * 100];
- };
- function comparativeDistance(x, y) {
- /*
- See https://en.m.wikipedia.org/wiki/Euclidean_distance#Squared_Euclidean_distance
- */
- return (
- ((x[0] - y[0]) ** 2) +
- ((x[1] - y[1]) ** 2) +
- ((x[2] - y[2]) ** 2)
- );
- }
- convert$1.rgb.keyword = function (rgb) {
- const reversed = reverseKeywords[rgb];
- if (reversed) {
- return reversed;
- }
- let currentClosestDistance = Infinity;
- let currentClosestKeyword;
- for (const keyword of Object.keys(colorName)) {
- const value = colorName[keyword];
- // Compute comparative distance
- const distance = comparativeDistance(rgb, value);
- // Check if its less, if so set as closest
- if (distance < currentClosestDistance) {
- currentClosestDistance = distance;
- currentClosestKeyword = keyword;
- }
- }
- return currentClosestKeyword;
- };
- convert$1.keyword.rgb = function (keyword) {
- return colorName[keyword];
- };
- convert$1.rgb.xyz = function (rgb) {
- let r = rgb[0] / 255;
- let g = rgb[1] / 255;
- let b = rgb[2] / 255;
- // Assume sRGB
- r = r > 0.04045 ? (((r + 0.055) / 1.055) ** 2.4) : (r / 12.92);
- g = g > 0.04045 ? (((g + 0.055) / 1.055) ** 2.4) : (g / 12.92);
- b = b > 0.04045 ? (((b + 0.055) / 1.055) ** 2.4) : (b / 12.92);
- const x = (r * 0.4124) + (g * 0.3576) + (b * 0.1805);
- const y = (r * 0.2126) + (g * 0.7152) + (b * 0.0722);
- const z = (r * 0.0193) + (g * 0.1192) + (b * 0.9505);
- return [x * 100, y * 100, z * 100];
- };
- convert$1.rgb.lab = function (rgb) {
- const xyz = convert$1.rgb.xyz(rgb);
- let x = xyz[0];
- let y = xyz[1];
- let z = xyz[2];
- x /= 95.047;
- y /= 100;
- z /= 108.883;
- x = x > 0.008856 ? (x ** (1 / 3)) : (7.787 * x) + (16 / 116);
- y = y > 0.008856 ? (y ** (1 / 3)) : (7.787 * y) + (16 / 116);
- z = z > 0.008856 ? (z ** (1 / 3)) : (7.787 * z) + (16 / 116);
- const l = (116 * y) - 16;
- const a = 500 * (x - y);
- const b = 200 * (y - z);
- return [l, a, b];
- };
- convert$1.hsl.rgb = function (hsl) {
- const h = hsl[0] / 360;
- const s = hsl[1] / 100;
- const l = hsl[2] / 100;
- let t2;
- let t3;
- let val;
- if (s === 0) {
- val = l * 255;
- return [val, val, val];
- }
- if (l < 0.5) {
- t2 = l * (1 + s);
- } else {
- t2 = l + s - l * s;
- }
- const t1 = 2 * l - t2;
- const rgb = [0, 0, 0];
- for (let i = 0; i < 3; i++) {
- t3 = h + 1 / 3 * -(i - 1);
- if (t3 < 0) {
- t3++;
- }
- if (t3 > 1) {
- t3--;
- }
- if (6 * t3 < 1) {
- val = t1 + (t2 - t1) * 6 * t3;
- } else if (2 * t3 < 1) {
- val = t2;
- } else if (3 * t3 < 2) {
- val = t1 + (t2 - t1) * (2 / 3 - t3) * 6;
- } else {
- val = t1;
- }
- rgb[i] = val * 255;
- }
- return rgb;
- };
- convert$1.hsl.hsv = function (hsl) {
- const h = hsl[0];
- let s = hsl[1] / 100;
- let l = hsl[2] / 100;
- let smin = s;
- const lmin = Math.max(l, 0.01);
- l *= 2;
- s *= (l <= 1) ? l : 2 - l;
- smin *= lmin <= 1 ? lmin : 2 - lmin;
- const v = (l + s) / 2;
- const sv = l === 0 ? (2 * smin) / (lmin + smin) : (2 * s) / (l + s);
- return [h, sv * 100, v * 100];
- };
- convert$1.hsv.rgb = function (hsv) {
- const h = hsv[0] / 60;
- const s = hsv[1] / 100;
- let v = hsv[2] / 100;
- const hi = Math.floor(h) % 6;
- const f = h - Math.floor(h);
- const p = 255 * v * (1 - s);
- const q = 255 * v * (1 - (s * f));
- const t = 255 * v * (1 - (s * (1 - f)));
- v *= 255;
- switch (hi) {
- case 0:
- return [v, t, p];
- case 1:
- return [q, v, p];
- case 2:
- return [p, v, t];
- case 3:
- return [p, q, v];
- case 4:
- return [t, p, v];
- case 5:
- return [v, p, q];
- }
- };
- convert$1.hsv.hsl = function (hsv) {
- const h = hsv[0];
- const s = hsv[1] / 100;
- const v = hsv[2] / 100;
- const vmin = Math.max(v, 0.01);
- let sl;
- let l;
- l = (2 - s) * v;
- const lmin = (2 - s) * vmin;
- sl = s * vmin;
- sl /= (lmin <= 1) ? lmin : 2 - lmin;
- sl = sl || 0;
- l /= 2;
- return [h, sl * 100, l * 100];
- };
- // http://dev.w3.org/csswg/css-color/#hwb-to-rgb
- convert$1.hwb.rgb = function (hwb) {
- const h = hwb[0] / 360;
- let wh = hwb[1] / 100;
- let bl = hwb[2] / 100;
- const ratio = wh + bl;
- let f;
- // Wh + bl cant be > 1
- if (ratio > 1) {
- wh /= ratio;
- bl /= ratio;
- }
- const i = Math.floor(6 * h);
- const v = 1 - bl;
- f = 6 * h - i;
- if ((i & 0x01) !== 0) {
- f = 1 - f;
- }
- const n = wh + f * (v - wh); // Linear interpolation
- let r;
- let g;
- let b;
- /* eslint-disable max-statements-per-line,no-multi-spaces */
- switch (i) {
- default:
- case 6:
- case 0: r = v; g = n; b = wh; break;
- case 1: r = n; g = v; b = wh; break;
- case 2: r = wh; g = v; b = n; break;
- case 3: r = wh; g = n; b = v; break;
- case 4: r = n; g = wh; b = v; break;
- case 5: r = v; g = wh; b = n; break;
- }
- /* eslint-enable max-statements-per-line,no-multi-spaces */
- return [r * 255, g * 255, b * 255];
- };
- convert$1.cmyk.rgb = function (cmyk) {
- const c = cmyk[0] / 100;
- const m = cmyk[1] / 100;
- const y = cmyk[2] / 100;
- const k = cmyk[3] / 100;
- const r = 1 - Math.min(1, c * (1 - k) + k);
- const g = 1 - Math.min(1, m * (1 - k) + k);
- const b = 1 - Math.min(1, y * (1 - k) + k);
- return [r * 255, g * 255, b * 255];
- };
- convert$1.xyz.rgb = function (xyz) {
- const x = xyz[0] / 100;
- const y = xyz[1] / 100;
- const z = xyz[2] / 100;
- let r;
- let g;
- let b;
- r = (x * 3.2406) + (y * -1.5372) + (z * -0.4986);
- g = (x * -0.9689) + (y * 1.8758) + (z * 0.0415);
- b = (x * 0.0557) + (y * -0.2040) + (z * 1.0570);
- // Assume sRGB
- r = r > 0.0031308
- ? ((1.055 * (r ** (1.0 / 2.4))) - 0.055)
- : r * 12.92;
- g = g > 0.0031308
- ? ((1.055 * (g ** (1.0 / 2.4))) - 0.055)
- : g * 12.92;
- b = b > 0.0031308
- ? ((1.055 * (b ** (1.0 / 2.4))) - 0.055)
- : b * 12.92;
- r = Math.min(Math.max(0, r), 1);
- g = Math.min(Math.max(0, g), 1);
- b = Math.min(Math.max(0, b), 1);
- return [r * 255, g * 255, b * 255];
- };
- convert$1.xyz.lab = function (xyz) {
- let x = xyz[0];
- let y = xyz[1];
- let z = xyz[2];
- x /= 95.047;
- y /= 100;
- z /= 108.883;
- x = x > 0.008856 ? (x ** (1 / 3)) : (7.787 * x) + (16 / 116);
- y = y > 0.008856 ? (y ** (1 / 3)) : (7.787 * y) + (16 / 116);
- z = z > 0.008856 ? (z ** (1 / 3)) : (7.787 * z) + (16 / 116);
- const l = (116 * y) - 16;
- const a = 500 * (x - y);
- const b = 200 * (y - z);
- return [l, a, b];
- };
- convert$1.lab.xyz = function (lab) {
- const l = lab[0];
- const a = lab[1];
- const b = lab[2];
- let x;
- let y;
- let z;
- y = (l + 16) / 116;
- x = a / 500 + y;
- z = y - b / 200;
- const y2 = y ** 3;
- const x2 = x ** 3;
- const z2 = z ** 3;
- y = y2 > 0.008856 ? y2 : (y - 16 / 116) / 7.787;
- x = x2 > 0.008856 ? x2 : (x - 16 / 116) / 7.787;
- z = z2 > 0.008856 ? z2 : (z - 16 / 116) / 7.787;
- x *= 95.047;
- y *= 100;
- z *= 108.883;
- return [x, y, z];
- };
- convert$1.lab.lch = function (lab) {
- const l = lab[0];
- const a = lab[1];
- const b = lab[2];
- let h;
- const hr = Math.atan2(b, a);
- h = hr * 360 / 2 / Math.PI;
- if (h < 0) {
- h += 360;
- }
- const c = Math.sqrt(a * a + b * b);
- return [l, c, h];
- };
- convert$1.lch.lab = function (lch) {
- const l = lch[0];
- const c = lch[1];
- const h = lch[2];
- const hr = h / 360 * 2 * Math.PI;
- const a = c * Math.cos(hr);
- const b = c * Math.sin(hr);
- return [l, a, b];
- };
- convert$1.rgb.ansi16 = function (args, saturation = null) {
- const [r, g, b] = args;
- let value = saturation === null ? convert$1.rgb.hsv(args)[2] : saturation; // Hsv -> ansi16 optimization
- value = Math.round(value / 50);
- if (value === 0) {
- return 30;
- }
- let ansi = 30
- + ((Math.round(b / 255) << 2)
- | (Math.round(g / 255) << 1)
- | Math.round(r / 255));
- if (value === 2) {
- ansi += 60;
- }
- return ansi;
- };
- convert$1.hsv.ansi16 = function (args) {
- // Optimization here; we already know the value and don't need to get
- // it converted for us.
- return convert$1.rgb.ansi16(convert$1.hsv.rgb(args), args[2]);
- };
- convert$1.rgb.ansi256 = function (args) {
- const r = args[0];
- const g = args[1];
- const b = args[2];
- // We use the extended greyscale palette here, with the exception of
- // black and white. normal palette only has 4 greyscale shades.
- if (r === g && g === b) {
- if (r < 8) {
- return 16;
- }
- if (r > 248) {
- return 231;
- }
- return Math.round(((r - 8) / 247) * 24) + 232;
- }
- const ansi = 16
- + (36 * Math.round(r / 255 * 5))
- + (6 * Math.round(g / 255 * 5))
- + Math.round(b / 255 * 5);
- return ansi;
- };
- convert$1.ansi16.rgb = function (args) {
- let color = args % 10;
- // Handle greyscale
- if (color === 0 || color === 7) {
- if (args > 50) {
- color += 3.5;
- }
- color = color / 10.5 * 255;
- return [color, color, color];
- }
- const mult = (~~(args > 50) + 1) * 0.5;
- const r = ((color & 1) * mult) * 255;
- const g = (((color >> 1) & 1) * mult) * 255;
- const b = (((color >> 2) & 1) * mult) * 255;
- return [r, g, b];
- };
- convert$1.ansi256.rgb = function (args) {
- // Handle greyscale
- if (args >= 232) {
- const c = (args - 232) * 10 + 8;
- return [c, c, c];
- }
- args -= 16;
- let rem;
- const r = Math.floor(args / 36) / 5 * 255;
- const g = Math.floor((rem = args % 36) / 6) / 5 * 255;
- const b = (rem % 6) / 5 * 255;
- return [r, g, b];
- };
- convert$1.rgb.hex = function (args) {
- const integer = ((Math.round(args[0]) & 0xFF) << 16)
- + ((Math.round(args[1]) & 0xFF) << 8)
- + (Math.round(args[2]) & 0xFF);
- const string = integer.toString(16).toUpperCase();
- return '000000'.substring(string.length) + string;
- };
- convert$1.hex.rgb = function (args) {
- const match = args.toString(16).match(/[a-f0-9]{6}|[a-f0-9]{3}/i);
- if (!match) {
- return [0, 0, 0];
- }
- let colorString = match[0];
- if (match[0].length === 3) {
- colorString = colorString.split('').map(char => {
- return char + char;
- }).join('');
- }
- const integer = parseInt(colorString, 16);
- const r = (integer >> 16) & 0xFF;
- const g = (integer >> 8) & 0xFF;
- const b = integer & 0xFF;
- return [r, g, b];
- };
- convert$1.rgb.hcg = function (rgb) {
- const r = rgb[0] / 255;
- const g = rgb[1] / 255;
- const b = rgb[2] / 255;
- const max = Math.max(Math.max(r, g), b);
- const min = Math.min(Math.min(r, g), b);
- const chroma = (max - min);
- let grayscale;
- let hue;
- if (chroma < 1) {
- grayscale = min / (1 - chroma);
- } else {
- grayscale = 0;
- }
- if (chroma <= 0) {
- hue = 0;
- } else
- if (max === r) {
- hue = ((g - b) / chroma) % 6;
- } else
- if (max === g) {
- hue = 2 + (b - r) / chroma;
- } else {
- hue = 4 + (r - g) / chroma;
- }
- hue /= 6;
- hue %= 1;
- return [hue * 360, chroma * 100, grayscale * 100];
- };
- convert$1.hsl.hcg = function (hsl) {
- const s = hsl[1] / 100;
- const l = hsl[2] / 100;
- const c = l < 0.5 ? (2.0 * s * l) : (2.0 * s * (1.0 - l));
- let f = 0;
- if (c < 1.0) {
- f = (l - 0.5 * c) / (1.0 - c);
- }
- return [hsl[0], c * 100, f * 100];
- };
- convert$1.hsv.hcg = function (hsv) {
- const s = hsv[1] / 100;
- const v = hsv[2] / 100;
- const c = s * v;
- let f = 0;
- if (c < 1.0) {
- f = (v - c) / (1 - c);
- }
- return [hsv[0], c * 100, f * 100];
- };
- convert$1.hcg.rgb = function (hcg) {
- const h = hcg[0] / 360;
- const c = hcg[1] / 100;
- const g = hcg[2] / 100;
- if (c === 0.0) {
- return [g * 255, g * 255, g * 255];
- }
- const pure = [0, 0, 0];
- const hi = (h % 1) * 6;
- const v = hi % 1;
- const w = 1 - v;
- let mg = 0;
- /* eslint-disable max-statements-per-line */
- switch (Math.floor(hi)) {
- case 0:
- pure[0] = 1; pure[1] = v; pure[2] = 0; break;
- case 1:
- pure[0] = w; pure[1] = 1; pure[2] = 0; break;
- case 2:
- pure[0] = 0; pure[1] = 1; pure[2] = v; break;
- case 3:
- pure[0] = 0; pure[1] = w; pure[2] = 1; break;
- case 4:
- pure[0] = v; pure[1] = 0; pure[2] = 1; break;
- default:
- pure[0] = 1; pure[1] = 0; pure[2] = w;
- }
- /* eslint-enable max-statements-per-line */
- mg = (1.0 - c) * g;
- return [
- (c * pure[0] + mg) * 255,
- (c * pure[1] + mg) * 255,
- (c * pure[2] + mg) * 255
- ];
- };
- convert$1.hcg.hsv = function (hcg) {
- const c = hcg[1] / 100;
- const g = hcg[2] / 100;
- const v = c + g * (1.0 - c);
- let f = 0;
- if (v > 0.0) {
- f = c / v;
- }
- return [hcg[0], f * 100, v * 100];
- };
- convert$1.hcg.hsl = function (hcg) {
- const c = hcg[1] / 100;
- const g = hcg[2] / 100;
- const l = g * (1.0 - c) + 0.5 * c;
- let s = 0;
- if (l > 0.0 && l < 0.5) {
- s = c / (2 * l);
- } else
- if (l >= 0.5 && l < 1.0) {
- s = c / (2 * (1 - l));
- }
- return [hcg[0], s * 100, l * 100];
- };
- convert$1.hcg.hwb = function (hcg) {
- const c = hcg[1] / 100;
- const g = hcg[2] / 100;
- const v = c + g * (1.0 - c);
- return [hcg[0], (v - c) * 100, (1 - v) * 100];
- };
- convert$1.hwb.hcg = function (hwb) {
- const w = hwb[1] / 100;
- const b = hwb[2] / 100;
- const v = 1 - b;
- const c = v - w;
- let g = 0;
- if (c < 1) {
- g = (v - c) / (1 - c);
- }
- return [hwb[0], c * 100, g * 100];
- };
- convert$1.apple.rgb = function (apple) {
- return [(apple[0] / 65535) * 255, (apple[1] / 65535) * 255, (apple[2] / 65535) * 255];
- };
- convert$1.rgb.apple = function (rgb) {
- return [(rgb[0] / 255) * 65535, (rgb[1] / 255) * 65535, (rgb[2] / 255) * 65535];
- };
- convert$1.gray.rgb = function (args) {
- return [args[0] / 100 * 255, args[0] / 100 * 255, args[0] / 100 * 255];
- };
- convert$1.gray.hsl = function (args) {
- return [0, 0, args[0]];
- };
- convert$1.gray.hsv = convert$1.gray.hsl;
- convert$1.gray.hwb = function (gray) {
- return [0, 100, gray[0]];
- };
- convert$1.gray.cmyk = function (gray) {
- return [0, 0, 0, gray[0]];
- };
- convert$1.gray.lab = function (gray) {
- return [gray[0], 0, 0];
- };
- convert$1.gray.hex = function (gray) {
- const val = Math.round(gray[0] / 100 * 255) & 0xFF;
- const integer = (val << 16) + (val << 8) + val;
- const string = integer.toString(16).toUpperCase();
- return '000000'.substring(string.length) + string;
- };
- convert$1.rgb.gray = function (rgb) {
- const val = (rgb[0] + rgb[1] + rgb[2]) / 3;
- return [val / 255 * 100];
- };
- /*
- This function routes a model to all other models.
- all functions that are routed have a property `.conversion` attached
- to the returned synthetic function. This property is an array
- of strings, each with the steps in between the 'from' and 'to'
- color models (inclusive).
- conversions that are not possible simply are not included.
- */
- function buildGraph() {
- const graph = {};
- // https://jsperf.com/object-keys-vs-for-in-with-closure/3
- const models = Object.keys(conversions);
- for (let len = models.length, i = 0; i < len; i++) {
- graph[models[i]] = {
- // http://jsperf.com/1-vs-infinity
- // micro-opt, but this is simple.
- distance: -1,
- parent: null
- };
- }
- return graph;
- }
- // https://en.wikipedia.org/wiki/Breadth-first_search
- function deriveBFS(fromModel) {
- const graph = buildGraph();
- const queue = [fromModel]; // Unshift -> queue -> pop
- graph[fromModel].distance = 0;
- while (queue.length) {
- const current = queue.pop();
- const adjacents = Object.keys(conversions[current]);
- for (let len = adjacents.length, i = 0; i < len; i++) {
- const adjacent = adjacents[i];
- const node = graph[adjacent];
- if (node.distance === -1) {
- node.distance = graph[current].distance + 1;
- node.parent = current;
- queue.unshift(adjacent);
- }
- }
- }
- return graph;
- }
- function link(from, to) {
- return function (args) {
- return to(from(args));
- };
- }
- function wrapConversion(toModel, graph) {
- const path = [graph[toModel].parent, toModel];
- let fn = conversions[graph[toModel].parent][toModel];
- let cur = graph[toModel].parent;
- while (graph[cur].parent) {
- path.unshift(graph[cur].parent);
- fn = link(conversions[graph[cur].parent][cur], fn);
- cur = graph[cur].parent;
- }
- fn.conversion = path;
- return fn;
- }
- var route = function (fromModel) {
- const graph = deriveBFS(fromModel);
- const conversion = {};
- const models = Object.keys(graph);
- for (let len = models.length, i = 0; i < len; i++) {
- const toModel = models[i];
- const node = graph[toModel];
- if (node.parent === null) {
- // No possible conversion, or this node is the source model.
- continue;
- }
- conversion[toModel] = wrapConversion(toModel, graph);
- }
- return conversion;
- };
- const convert = {};
- const models = Object.keys(conversions);
- function wrapRaw(fn) {
- const wrappedFn = function (...args) {
- const arg0 = args[0];
- if (arg0 === undefined || arg0 === null) {
- return arg0;
- }
- if (arg0.length > 1) {
- args = arg0;
- }
- return fn(args);
- };
- // Preserve .conversion property if there is one
- if ('conversion' in fn) {
- wrappedFn.conversion = fn.conversion;
- }
- return wrappedFn;
- }
- function wrapRounded(fn) {
- const wrappedFn = function (...args) {
- const arg0 = args[0];
- if (arg0 === undefined || arg0 === null) {
- return arg0;
- }
- if (arg0.length > 1) {
- args = arg0;
- }
- const result = fn(args);
- // We're assuming the result is an array here.
- // see notice in conversions.js; don't use box types
- // in conversion functions.
- if (typeof result === 'object') {
- for (let len = result.length, i = 0; i < len; i++) {
- result[i] = Math.round(result[i]);
- }
- }
- return result;
- };
- // Preserve .conversion property if there is one
- if ('conversion' in fn) {
- wrappedFn.conversion = fn.conversion;
- }
- return wrappedFn;
- }
- models.forEach(fromModel => {
- convert[fromModel] = {};
- Object.defineProperty(convert[fromModel], 'channels', {value: conversions[fromModel].channels});
- Object.defineProperty(convert[fromModel], 'labels', {value: conversions[fromModel].labels});
- const routes = route(fromModel);
- const routeModels = Object.keys(routes);
- routeModels.forEach(toModel => {
- const fn = routes[toModel];
- convert[fromModel][toModel] = wrapRounded(fn);
- convert[fromModel][toModel].raw = wrapRaw(fn);
- });
- });
- var colorConvert = convert;
- const skippedModels = [
- // To be honest, I don't really feel like keyword belongs in color convert, but eh.
- 'keyword',
- // Gray conflicts with some method names, and has its own method defined.
- 'gray',
- // Shouldn't really be in color-convert either...
- 'hex',
- ];
- const hashedModelKeys = {};
- for (const model of Object.keys(colorConvert)) {
- hashedModelKeys[[...colorConvert[model].labels].sort().join('')] = model;
- }
- const limiters = {};
- function Color(object, model) {
- if (!(this instanceof Color)) {
- return new Color(object, model);
- }
- if (model && model in skippedModels) {
- model = null;
- }
- if (model && !(model in colorConvert)) {
- throw new Error('Unknown model: ' + model);
- }
- let i;
- let channels;
- if (object == null) { // eslint-disable-line no-eq-null,eqeqeq
- this.model = 'rgb';
- this.color = [0, 0, 0];
- this.valpha = 1;
- } else if (object instanceof Color) {
- this.model = object.model;
- this.color = [...object.color];
- this.valpha = object.valpha;
- } else if (typeof object === 'string') {
- const result = colorString.get(object);
- if (result === null) {
- throw new Error('Unable to parse color from string: ' + object);
- }
- this.model = result.model;
- channels = colorConvert[this.model].channels;
- this.color = result.value.slice(0, channels);
- this.valpha = typeof result.value[channels] === 'number' ? result.value[channels] : 1;
- } else if (object.length > 0) {
- this.model = model || 'rgb';
- channels = colorConvert[this.model].channels;
- const newArray = Array.prototype.slice.call(object, 0, channels);
- this.color = zeroArray(newArray, channels);
- this.valpha = typeof object[channels] === 'number' ? object[channels] : 1;
- } else if (typeof object === 'number') {
- // This is always RGB - can be converted later on.
- this.model = 'rgb';
- this.color = [
- (object >> 16) & 0xFF,
- (object >> 8) & 0xFF,
- object & 0xFF,
- ];
- this.valpha = 1;
- } else {
- this.valpha = 1;
- const keys = Object.keys(object);
- if ('alpha' in object) {
- keys.splice(keys.indexOf('alpha'), 1);
- this.valpha = typeof object.alpha === 'number' ? object.alpha : 0;
- }
- const hashedKeys = keys.sort().join('');
- if (!(hashedKeys in hashedModelKeys)) {
- throw new Error('Unable to parse color from object: ' + JSON.stringify(object));
- }
- this.model = hashedModelKeys[hashedKeys];
- const {labels} = colorConvert[this.model];
- const color = [];
- for (i = 0; i < labels.length; i++) {
- color.push(object[labels[i]]);
- }
- this.color = zeroArray(color);
- }
- // Perform limitations (clamping, etc.)
- if (limiters[this.model]) {
- channels = colorConvert[this.model].channels;
- for (i = 0; i < channels; i++) {
- const limit = limiters[this.model][i];
- if (limit) {
- this.color[i] = limit(this.color[i]);
- }
- }
- }
- this.valpha = Math.max(0, Math.min(1, this.valpha));
- if (Object.freeze) {
- Object.freeze(this);
- }
- }
- Color.prototype = {
- toString() {
- return this.string();
- },
- toJSON() {
- return this[this.model]();
- },
- string(places) {
- let self = this.model in colorString.to ? this : this.rgb();
- self = self.round(typeof places === 'number' ? places : 1);
- const args = self.valpha === 1 ? self.color : [...self.color, this.valpha];
- return colorString.to[self.model](args);
- },
- percentString(places) {
- const self = this.rgb().round(typeof places === 'number' ? places : 1);
- const args = self.valpha === 1 ? self.color : [...self.color, this.valpha];
- return colorString.to.rgb.percent(args);
- },
- array() {
- return this.valpha === 1 ? [...this.color] : [...this.color, this.valpha];
- },
- object() {
- const result = {};
- const {channels} = colorConvert[this.model];
- const {labels} = colorConvert[this.model];
- for (let i = 0; i < channels; i++) {
- result[labels[i]] = this.color[i];
- }
- if (this.valpha !== 1) {
- result.alpha = this.valpha;
- }
- return result;
- },
- unitArray() {
- const rgb = this.rgb().color;
- rgb[0] /= 255;
- rgb[1] /= 255;
- rgb[2] /= 255;
- if (this.valpha !== 1) {
- rgb.push(this.valpha);
- }
- return rgb;
- },
- unitObject() {
- const rgb = this.rgb().object();
- rgb.r /= 255;
- rgb.g /= 255;
- rgb.b /= 255;
- if (this.valpha !== 1) {
- rgb.alpha = this.valpha;
- }
- return rgb;
- },
- round(places) {
- places = Math.max(places || 0, 0);
- return new Color([...this.color.map(roundToPlace(places)), this.valpha], this.model);
- },
- alpha(value) {
- if (value !== undefined) {
- return new Color([...this.color, Math.max(0, Math.min(1, value))], this.model);
- }
- return this.valpha;
- },
- // Rgb
- red: getset('rgb', 0, maxfn(255)),
- green: getset('rgb', 1, maxfn(255)),
- blue: getset('rgb', 2, maxfn(255)),
- hue: getset(['hsl', 'hsv', 'hsl', 'hwb', 'hcg'], 0, value => ((value % 360) + 360) % 360),
- saturationl: getset('hsl', 1, maxfn(100)),
- lightness: getset('hsl', 2, maxfn(100)),
- saturationv: getset('hsv', 1, maxfn(100)),
- value: getset('hsv', 2, maxfn(100)),
- chroma: getset('hcg', 1, maxfn(100)),
- gray: getset('hcg', 2, maxfn(100)),
- white: getset('hwb', 1, maxfn(100)),
- wblack: getset('hwb', 2, maxfn(100)),
- cyan: getset('cmyk', 0, maxfn(100)),
- magenta: getset('cmyk', 1, maxfn(100)),
- yellow: getset('cmyk', 2, maxfn(100)),
- black: getset('cmyk', 3, maxfn(100)),
- x: getset('xyz', 0, maxfn(95.047)),
- y: getset('xyz', 1, maxfn(100)),
- z: getset('xyz', 2, maxfn(108.833)),
- l: getset('lab', 0, maxfn(100)),
- a: getset('lab', 1),
- b: getset('lab', 2),
- keyword(value) {
- if (value !== undefined) {
- return new Color(value);
- }
- return colorConvert[this.model].keyword(this.color);
- },
- hex(value) {
- if (value !== undefined) {
- return new Color(value);
- }
- return colorString.to.hex(this.rgb().round().color);
- },
- hexa(value) {
- if (value !== undefined) {
- return new Color(value);
- }
- const rgbArray = this.rgb().round().color;
- let alphaHex = Math.round(this.valpha * 255).toString(16).toUpperCase();
- if (alphaHex.length === 1) {
- alphaHex = '0' + alphaHex;
- }
- return colorString.to.hex(rgbArray) + alphaHex;
- },
- rgbNumber() {
- const rgb = this.rgb().color;
- return ((rgb[0] & 0xFF) << 16) | ((rgb[1] & 0xFF) << 8) | (rgb[2] & 0xFF);
- },
- luminosity() {
- // http://www.w3.org/TR/WCAG20/#relativeluminancedef
- const rgb = this.rgb().color;
- const lum = [];
- for (const [i, element] of rgb.entries()) {
- const chan = element / 255;
- lum[i] = (chan <= 0.04045) ? chan / 12.92 : ((chan + 0.055) / 1.055) ** 2.4;
- }
- return 0.2126 * lum[0] + 0.7152 * lum[1] + 0.0722 * lum[2];
- },
- contrast(color2) {
- // http://www.w3.org/TR/WCAG20/#contrast-ratiodef
- const lum1 = this.luminosity();
- const lum2 = color2.luminosity();
- if (lum1 > lum2) {
- return (lum1 + 0.05) / (lum2 + 0.05);
- }
- return (lum2 + 0.05) / (lum1 + 0.05);
- },
- level(color2) {
- // https://www.w3.org/TR/WCAG/#contrast-enhanced
- const contrastRatio = this.contrast(color2);
- if (contrastRatio >= 7) {
- return 'AAA';
- }
- return (contrastRatio >= 4.5) ? 'AA' : '';
- },
- isDark() {
- // YIQ equation from http://24ways.org/2010/calculating-color-contrast
- const rgb = this.rgb().color;
- const yiq = (rgb[0] * 2126 + rgb[1] * 7152 + rgb[2] * 722) / 10000;
- return yiq < 128;
- },
- isLight() {
- return !this.isDark();
- },
- negate() {
- const rgb = this.rgb();
- for (let i = 0; i < 3; i++) {
- rgb.color[i] = 255 - rgb.color[i];
- }
- return rgb;
- },
- lighten(ratio) {
- const hsl = this.hsl();
- hsl.color[2] += hsl.color[2] * ratio;
- return hsl;
- },
- darken(ratio) {
- const hsl = this.hsl();
- hsl.color[2] -= hsl.color[2] * ratio;
- return hsl;
- },
- saturate(ratio) {
- const hsl = this.hsl();
- hsl.color[1] += hsl.color[1] * ratio;
- return hsl;
- },
- desaturate(ratio) {
- const hsl = this.hsl();
- hsl.color[1] -= hsl.color[1] * ratio;
- return hsl;
- },
- whiten(ratio) {
- const hwb = this.hwb();
- hwb.color[1] += hwb.color[1] * ratio;
- return hwb;
- },
- blacken(ratio) {
- const hwb = this.hwb();
- hwb.color[2] += hwb.color[2] * ratio;
- return hwb;
- },
- grayscale() {
- // http://en.wikipedia.org/wiki/Grayscale#Converting_color_to_grayscale
- const rgb = this.rgb().color;
- const value = rgb[0] * 0.3 + rgb[1] * 0.59 + rgb[2] * 0.11;
- return Color.rgb(value, value, value);
- },
- fade(ratio) {
- return this.alpha(this.valpha - (this.valpha * ratio));
- },
- opaquer(ratio) {
- return this.alpha(this.valpha + (this.valpha * ratio));
- },
- rotate(degrees) {
- const hsl = this.hsl();
- let hue = hsl.color[0];
- hue = (hue + degrees) % 360;
- hue = hue < 0 ? 360 + hue : hue;
- hsl.color[0] = hue;
- return hsl;
- },
- mix(mixinColor, weight) {
- // Ported from sass implementation in C
- // https://github.com/sass/libsass/blob/0e6b4a2850092356aa3ece07c6b249f0221caced/functions.cpp#L209
- if (!mixinColor || !mixinColor.rgb) {
- throw new Error('Argument to "mix" was not a Color instance, but rather an instance of ' + typeof mixinColor);
- }
- const color1 = mixinColor.rgb();
- const color2 = this.rgb();
- const p = weight === undefined ? 0.5 : weight;
- const w = 2 * p - 1;
- const a = color1.alpha() - color2.alpha();
- const w1 = (((w * a === -1) ? w : (w + a) / (1 + w * a)) + 1) / 2;
- const w2 = 1 - w1;
- return Color.rgb(
- w1 * color1.red() + w2 * color2.red(),
- w1 * color1.green() + w2 * color2.green(),
- w1 * color1.blue() + w2 * color2.blue(),
- color1.alpha() * p + color2.alpha() * (1 - p));
- },
- };
- // Model conversion methods and static constructors
- for (const model of Object.keys(colorConvert)) {
- if (skippedModels.includes(model)) {
- continue;
- }
- const {channels} = colorConvert[model];
- // Conversion methods
- Color.prototype[model] = function (...args) {
- if (this.model === model) {
- return new Color(this);
- }
- if (args.length > 0) {
- return new Color(args, model);
- }
- return new Color([...assertArray(colorConvert[this.model][model].raw(this.color)), this.valpha], model);
- };
- // 'static' construction methods
- Color[model] = function (...args) {
- let color = args[0];
- if (typeof color === 'number') {
- color = zeroArray(args, channels);
- }
- return new Color(color, model);
- };
- }
- function roundTo(number, places) {
- return Number(number.toFixed(places));
- }
- function roundToPlace(places) {
- return function (number) {
- return roundTo(number, places);
- };
- }
- function getset(model, channel, modifier) {
- model = Array.isArray(model) ? model : [model];
- for (const m of model) {
- (limiters[m] || (limiters[m] = []))[channel] = modifier;
- }
- model = model[0];
- return function (value) {
- let result;
- if (value !== undefined) {
- if (modifier) {
- value = modifier(value);
- }
- result = this[model]();
- result.color[channel] = value;
- return result;
- }
- result = this[model]().color[channel];
- if (modifier) {
- result = modifier(result);
- }
- return result;
- };
- }
- function maxfn(max) {
- return function (v) {
- return Math.max(0, Math.min(max, v));
- };
- }
- function assertArray(value) {
- return Array.isArray(value) ? value : [value];
- }
- function zeroArray(array, length) {
- for (let i = 0; i < length; i++) {
- if (typeof array[i] !== 'number') {
- array[i] = 0;
- }
- }
- return array;
- }
- var color = Color;
- const CSS$G = {
- container: "container",
- controlSection: "control-section",
- hexOptions: "color-hex-options",
- section: "section",
- header: "header",
- control: "control",
- splitSection: "section--split",
- colorModeContainer: "color-mode-container",
- colorMode: "color-mode",
- channels: "channels",
- channel: "channel",
- savedColors: "saved-colors",
- savedColorsSection: "saved-colors-section",
- saveColor: "save-color",
- deleteColor: "delete-color",
- savedColorsButtons: "saved-colors-buttons",
- headerHex: "header--hex",
- colorFieldAndSlider: "color-field-and-slider",
- colorFieldAndSliderInteractive: "color-field-and-slider--interactive",
- colorFieldAndSliderWrap: "color-field-and-slider-wrap",
- scope: "scope",
- hueScope: "scope--hue",
- colorFieldScope: "scope--color-field",
- savedColor: "saved-color"
- };
- const DEFAULT_COLOR$1 = color("#007AC2");
- const DEFAULT_STORAGE_KEY_PREFIX = "calcite-color-";
- const RGB_LIMITS = {
- r: 255,
- g: 255,
- b: 255
- };
- const HSV_LIMITS = {
- h: 360,
- s: 100,
- v: 100
- };
- const TEXT$h = {
- b: "B",
- blue: "Blue",
- deleteColor: "Delete color",
- g: "G",
- green: "Green",
- h: "H",
- hsv: "HSV",
- hex: "Hex",
- hue: "Hue",
- noColor: "No color",
- r: "R",
- red: "Red",
- rgb: "RGB",
- s: "S",
- saturation: "Saturation",
- saveColor: "Save color",
- saved: "Saved",
- v: "V",
- value: "Value"
- };
- const DIMENSIONS = {
- s: {
- slider: {
- height: 10,
- width: 160
- },
- colorField: {
- height: 80,
- width: 160
- },
- thumb: {
- radius: 8
- }
- },
- m: {
- slider: {
- height: 14,
- width: 272
- },
- colorField: {
- height: 150,
- width: 272
- },
- thumb: {
- radius: 10
- }
- },
- l: {
- slider: {
- height: 16,
- width: 464
- },
- colorField: {
- height: 200,
- width: 464
- },
- thumb: {
- radius: 12
- }
- }
- };
- const clamp = (value, min, max) => Math.max(min, Math.min(value, max));
- const decimalPlaces = (value) => {
- const match = ("" + value).match(/(?:\.(\d+))?(?:[eE]([+-]?\d+))?$/);
- if (!match) {
- return 0;
- }
- return Math.max(0,
- // Number of digits right of decimal point.
- (match[1] ? match[1].length : 0) -
- // Adjust for scientific notation.
- (match[2] ? +match[2] : 0));
- };
- const colorPickerCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-color-picker:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-color-picker{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-color-picker{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-color-picker{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-color-picker{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-color-picker{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-color-picker:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-color-picker-h{display:none}/*!@:host*/.sc-calcite-color-picker-h{display:inline-block;font-size:var(--calcite-font-size--2);line-height:1rem;font-weight:var(--calcite-font-weight-normal)}/*!@:host([disabled])*/[disabled].sc-calcite-color-picker-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-color-picker-h[disabled] .sc-calcite-color-picker-s>[calcite-hydrated][disabled],[disabled].sc-calcite-color-picker-h [calcite-hydrated][disabled].sc-calcite-color-picker{opacity:1}/*!@:host([scale=s]) .container*/[scale=s].sc-calcite-color-picker-h .container.sc-calcite-color-picker{width:160px}/*!@:host([scale=s]) .saved-colors*/[scale=s].sc-calcite-color-picker-h .saved-colors.sc-calcite-color-picker{grid-template-columns:repeat(auto-fill, minmax(20px, 1fr))}/*!@:host([scale=s]) .channels*/[scale=s].sc-calcite-color-picker-h .channels.sc-calcite-color-picker{-ms-flex-direction:column;flex-direction:column}/*!@:host([scale=s]) .channel*/[scale=s].sc-calcite-color-picker-h .channel.sc-calcite-color-picker{width:100%;margin-bottom:4px}/*!@:host([scale=s]) .channel:last-child*/[scale=s].sc-calcite-color-picker-h .channel.sc-calcite-color-picker:last-child{margin-bottom:0}/*!@:host([scale=m]) .container*/[scale=m].sc-calcite-color-picker-h .container.sc-calcite-color-picker{width:272px}/*!@:host([scale=l]) .header*/[scale=l].sc-calcite-color-picker-h .header.sc-calcite-color-picker{padding-bottom:0px}/*!@:host([scale=l])*/[scale=l].sc-calcite-color-picker-h{font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=l]) .container*/[scale=l].sc-calcite-color-picker-h .container.sc-calcite-color-picker{width:464px}/*!@:host([scale=l]) .color-field-and-slider*/[scale=l].sc-calcite-color-picker-h .color-field-and-slider.sc-calcite-color-picker{margin-bottom:-20px}/*!@:host([scale=l]) .section*/[scale=l].sc-calcite-color-picker-h .section.sc-calcite-color-picker{padding:0 16px 16px}/*!@:host([scale=l]) .section:first-of-type*/[scale=l].sc-calcite-color-picker-h .section.sc-calcite-color-picker:first-of-type{padding-top:16px}/*!@:host([scale=l]) .saved-colors*/[scale=l].sc-calcite-color-picker-h .saved-colors.sc-calcite-color-picker{grid-template-columns:repeat(auto-fill, minmax(28px, 1fr));grid-gap:12px;padding-top:16px}/*!@:host([scale=l]) .control-section*/[scale=l].sc-calcite-color-picker-h .control-section.sc-calcite-color-picker{-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-align:baseline;align-items:baseline}/*!@:host([scale=l]) .control-section > :nth-child(2)*/[scale=l].sc-calcite-color-picker-h .control-section.sc-calcite-color-picker>.sc-calcite-color-picker:nth-child(2){-webkit-margin-start:12px;margin-inline-start:12px}/*!@:host([scale=l]) .color-hex-options*/[scale=l].sc-calcite-color-picker-h .color-hex-options.sc-calcite-color-picker{display:-ms-flexbox;display:flex;-ms-flex-negative:1;flex-shrink:1;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:distribute;justify-content:space-around;min-height:98px;width:160px}/*!@:host([scale=l]) .color-mode-container*/[scale=l].sc-calcite-color-picker-h .color-mode-container.sc-calcite-color-picker{-ms-flex-negative:3;flex-shrink:3}/*!@:host([appearance=minimal]) .container*/[appearance=minimal].sc-calcite-color-picker-h .container.sc-calcite-color-picker{border:none}/*!@.container*/.container.sc-calcite-color-picker{background-color:var(--calcite-ui-foreground-1);display:inline-block;border:1px solid var(--calcite-ui-border-1)}/*!@.color-field-and-slider-wrap*/.color-field-and-slider-wrap.sc-calcite-color-picker{position:relative}/*!@.scope*/.scope.sc-calcite-color-picker{pointer-events:none;position:absolute;font-size:var(--calcite-font-size--1);outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;outline-offset:14px}/*!@.scope:focus*/.scope.sc-calcite-color-picker:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:16px}/*!@.color-field-and-slider*/.color-field-and-slider.sc-calcite-color-picker{margin-bottom:-16px}/*!@.color-field-and-slider--interactive*/.color-field-and-slider--interactive.sc-calcite-color-picker{cursor:pointer}/*!@.control-section*/.control-section.sc-calcite-color-picker{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap}/*!@.section*/.section.sc-calcite-color-picker{padding:0 12px 12px}/*!@.section:first-of-type*/.section.sc-calcite-color-picker:first-of-type{padding-top:12px}/*!@.color-hex-options,\n.section--split*/.color-hex-options.sc-calcite-color-picker,.section--split.sc-calcite-color-picker{-ms-flex-positive:1;flex-grow:1}/*!@.header*/.header.sc-calcite-color-picker{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:0.25rem;color:var(--calcite-ui-text-1)}/*!@.header--hex,\n.color-mode-container*/.header--hex.sc-calcite-color-picker,.color-mode-container.sc-calcite-color-picker{padding-top:12px}/*!@.channels*/.channels.sc-calcite-color-picker{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}/*!@.channel*/.channel.sc-calcite-color-picker{width:31%}/*!@.saved-colors*/.saved-colors.sc-calcite-color-picker{padding-top:12px;display:grid;grid-template-columns:repeat(auto-fill, minmax(24px, 1fr));grid-gap:8px;width:100%}/*!@.saved-colors-buttons*/.saved-colors-buttons.sc-calcite-color-picker{display:-ms-flexbox;display:flex}/*!@.saved-color*/.saved-color.sc-calcite-color-picker{outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;cursor:pointer}/*!@.saved-color:focus*/.saved-color.sc-calcite-color-picker:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:2px}/*!@.saved-color:hover*/.saved-color.sc-calcite-color-picker:hover{-webkit-transition:outline-color var(--calcite-internal-animation-timing-fast) ease-in-out;transition:outline-color var(--calcite-internal-animation-timing-fast) ease-in-out;outline:2px solid var(--calcite-ui-border-2);outline-offset:2px}";
- const throttleFor60FpsInMs = 16;
- const defaultValue = normalizeHex(DEFAULT_COLOR$1.hex());
- const defaultFormat = "auto";
- class ColorPicker {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteColorPickerChange = createEvent(this, "calciteColorPickerChange", 7);
- this.calciteColorPickerInput = createEvent(this, "calciteColorPickerInput", 7);
- //--------------------------------------------------------------------------
- //
- // Public properties
- //
- //--------------------------------------------------------------------------
- /**
- * When false, empty color (null) will be allowed as a value. Otherwise, a color value is always enforced by the component.
- *
- * When true, clearing the input and blurring will restore the last valid color set. When false, it will set it to empty.
- */
- this.allowEmpty = false;
- /** specify the appearance - default (containing border), or minimal (no containing border) */
- this.appearance = "default";
- /**
- * Internal prop for advanced use-cases.
- *
- * @internal
- */
- this.color = DEFAULT_COLOR$1;
- /**
- * When true, disabled prevents user interaction.
- */
- this.disabled = false;
- /**
- * The format of the value property.
- *
- * When "auto", the format will be inferred from `value` when set.
- * @default "auto"
- */
- this.format = defaultFormat;
- /** When true, hides the hex input */
- this.hideHex = false;
- /** When true, hides the RGB/HSV channel inputs */
- this.hideChannels = false;
- /** When true, hides the saved colors section */
- this.hideSaved = false;
- /** Label used for the blue channel
- * @default "B"
- */
- this.intlB = TEXT$h.b;
- /** Label used for the blue channel description
- * @default "Blue"
- */
- this.intlBlue = TEXT$h.blue;
- /** Label used for the delete color button.
- * @default "Delete color"
- */
- this.intlDeleteColor = TEXT$h.deleteColor;
- /** Label used for the green channel
- * @default "G"
- */
- this.intlG = TEXT$h.g;
- /** Label used for the green channel description
- * @default "Green"
- */
- this.intlGreen = TEXT$h.green;
- /** Label used for the hue channel
- * @default "H"
- */
- this.intlH = TEXT$h.h;
- /** Label used for the HSV mode
- * @default "HSV"
- */
- this.intlHsv = TEXT$h.hsv;
- /** Label used for the hex input
- * @default "Hex"
- */
- this.intlHex = TEXT$h.hex;
- /** Label used for the hue channel description
- * @default "Hue"
- */
- this.intlHue = TEXT$h.hue;
- /**
- * Label used for the hex input when there is no color selected.
- * @default "No color"
- */
- this.intlNoColor = TEXT$h.noColor;
- /** Label used for the red channel
- * @default "R"
- */
- this.intlR = TEXT$h.r;
- /** Label used for the red channel description
- * @default "Red"
- */
- this.intlRed = TEXT$h.red;
- /** Label used for the RGB mode
- * @default "RGB"
- */
- this.intlRgb = TEXT$h.rgb;
- /** Label used for the saturation channel
- * @default "S"
- */
- this.intlS = TEXT$h.s;
- /** Label used for the saturation channel description
- * @default "Saturation"
- */
- this.intlSaturation = TEXT$h.saturation;
- /** Label used for the save color button.
- * @default "Save color"
- */
- this.intlSaveColor = TEXT$h.saveColor;
- /** Label used for the saved colors section
- * @default "Saved"
- */
- this.intlSaved = TEXT$h.saved;
- /** Label used for the value channel
- * @default "V"
- */
- this.intlV = TEXT$h.v;
- /** Label used for the
- * @default "Value"
- */
- this.intlValue = TEXT$h.value;
- /**
- * The scale of the color picker.
- */
- this.scale = "m";
- /**
- * The color value.
- *
- * This value can be either a {@link https://developer.mozilla.org/en-US/docs/Web/CSS/color|CSS string}
- * a RGB, HSL or HSV object.
- *
- * The type will be preserved as the color is updated.
- * @default "#007ac2"
- * @see [ColorValue](https://github.com/Esri/calcite-components/blob/master/src/components/color-picker/interfaces.ts#L10)
- */
- this.value = defaultValue;
- this.colorFieldAndSliderHovered = false;
- this.hueThumbState = "idle";
- this.internalColorUpdateContext = null;
- this.mode = CSSColorMode.HEX;
- this.shiftKeyChannelAdjustment = 0;
- this.sliderThumbState = "idle";
- this.colorFieldAndSliderInteractive = false;
- this.channelMode = "rgb";
- this.channels = this.toChannels(DEFAULT_COLOR$1);
- this.dimensions = DIMENSIONS.m;
- this.savedColors = [];
- this.handleTabActivate = (event) => {
- this.channelMode = event.currentTarget.getAttribute("data-color-mode");
- this.updateChannelsFromColor(this.color);
- };
- this.handleColorFieldScopeKeyDown = (event) => {
- const key = event.key;
- const arrowKeyToXYOffset = {
- ArrowUp: { x: 0, y: -10 },
- ArrowRight: { x: 10, y: 0 },
- ArrowDown: { x: 0, y: 10 },
- ArrowLeft: { x: -10, y: 0 }
- };
- if (arrowKeyToXYOffset[key]) {
- event.preventDefault();
- this.scopeOrientation = key === "ArrowDown" || key === "ArrowUp" ? "vertical" : "horizontal";
- this.captureColorFieldColor(this.colorFieldScopeLeft + arrowKeyToXYOffset[key].x || 0, this.colorFieldScopeTop + arrowKeyToXYOffset[key].y || 0, false);
- }
- };
- this.handleHueScopeKeyDown = (event) => {
- const modifier = event.shiftKey ? 10 : 1;
- const key = event.key;
- const arrowKeyToXOffset = {
- ArrowUp: 1,
- ArrowRight: 1,
- ArrowDown: -1,
- ArrowLeft: -1
- };
- if (arrowKeyToXOffset[key]) {
- event.preventDefault();
- const delta = arrowKeyToXOffset[key] * modifier;
- const hue = this.baseColorFieldColor.hue();
- const color = this.baseColorFieldColor.hue(hue + delta);
- this.internalColorSet(color, false);
- }
- };
- this.handleHexInputChange = (event) => {
- event.stopPropagation();
- const { allowEmpty, color: color$1 } = this;
- const input = event.target;
- const hex = input.value;
- if (allowEmpty && !hex) {
- this.internalColorSet(null);
- return;
- }
- const normalizedHex = color$1 && normalizeHex(color$1.hex());
- if (hex !== normalizedHex) {
- this.internalColorSet(color(hex));
- }
- };
- this.handleSavedColorSelect = (event) => {
- const swatch = event.currentTarget;
- this.internalColorSet(color(swatch.color));
- };
- this.handleChannelInput = (event) => {
- const input = event.currentTarget;
- const internalInput = event.detail.nativeEvent.target;
- const channelIndex = Number(input.getAttribute("data-channel-index"));
- const limit = this.channelMode === "rgb"
- ? RGB_LIMITS[Object.keys(RGB_LIMITS)[channelIndex]]
- : HSV_LIMITS[Object.keys(HSV_LIMITS)[channelIndex]];
- let inputValue;
- if (this.allowEmpty && !input.value) {
- inputValue = "";
- }
- else {
- const value = Number(input.value) + this.shiftKeyChannelAdjustment;
- const clamped = clamp(value, 0, limit);
- inputValue = clamped.toString();
- }
- input.value = inputValue;
- internalInput.value = inputValue;
- };
- this.handleChannelChange = (event) => {
- const input = event.currentTarget;
- const channelIndex = Number(input.getAttribute("data-channel-index"));
- const channels = [...this.channels];
- const shouldClearChannels = this.allowEmpty && !input.value;
- if (shouldClearChannels) {
- this.channels = [null, null, null];
- this.internalColorSet(null);
- return;
- }
- channels[channelIndex] = Number(input.value);
- this.updateColorFromChannels(channels);
- };
- this.handleSavedColorKeyDown = (event) => {
- if (event.key === " " || event.key === "Enter") {
- event.preventDefault();
- event.stopPropagation();
- this.handleSavedColorSelect(event);
- }
- };
- this.handleColorFieldAndSliderMouseLeave = () => {
- this.colorFieldAndSliderInteractive = false;
- this.colorFieldAndSliderHovered = false;
- if (this.sliderThumbState !== "drag" && this.hueThumbState !== "drag") {
- this.hueThumbState = "idle";
- this.sliderThumbState = "idle";
- this.drawColorFieldAndSlider();
- }
- };
- this.handleColorFieldAndSliderMouseDown = (event) => {
- const { offsetX, offsetY } = event;
- const region = this.getCanvasRegion(offsetY);
- if (region === "color-field") {
- this.hueThumbState = "drag";
- this.captureColorFieldColor(offsetX, offsetY);
- this.colorFieldScopeNode.focus();
- }
- else if (region === "slider") {
- this.sliderThumbState = "drag";
- this.captureHueSliderColor(offsetX);
- this.hueScopeNode.focus();
- }
- // prevent text selection outside of color field & slider area
- event.preventDefault();
- document.addEventListener("mousemove", this.globalMouseMoveHandler);
- document.addEventListener("mouseup", this.globalMouseUpHandler, { once: true });
- this.activeColorFieldAndSliderRect =
- this.fieldAndSliderRenderingContext.canvas.getBoundingClientRect();
- };
- this.globalMouseUpHandler = () => {
- const previouslyDragging = this.sliderThumbState === "drag" || this.hueThumbState === "drag";
- this.hueThumbState = "idle";
- this.sliderThumbState = "idle";
- this.activeColorFieldAndSliderRect = null;
- this.drawColorFieldAndSlider();
- if (previouslyDragging) {
- this.calciteColorPickerChange.emit();
- }
- };
- this.globalMouseMoveHandler = (event) => {
- const { el, dimensions } = this;
- const sliderThumbDragging = this.sliderThumbState === "drag";
- const hueThumbDragging = this.hueThumbState === "drag";
- if (!el.isConnected || (!sliderThumbDragging && !hueThumbDragging)) {
- return;
- }
- let samplingX;
- let samplingY;
- const colorFieldAndSliderRect = this.activeColorFieldAndSliderRect;
- const { clientX, clientY } = event;
- if (this.colorFieldAndSliderHovered) {
- samplingX = clientX - colorFieldAndSliderRect.x;
- samplingY = clientY - colorFieldAndSliderRect.y;
- }
- else {
- const colorFieldWidth = dimensions.colorField.width;
- const colorFieldHeight = dimensions.colorField.height;
- const hueSliderHeight = dimensions.slider.height;
- if (clientX < colorFieldAndSliderRect.x + colorFieldWidth &&
- clientX > colorFieldAndSliderRect.x) {
- samplingX = clientX - colorFieldAndSliderRect.x;
- }
- else if (clientX < colorFieldAndSliderRect.x) {
- samplingX = 0;
- }
- else {
- samplingX = colorFieldWidth;
- }
- if (clientY < colorFieldAndSliderRect.y + colorFieldHeight + hueSliderHeight &&
- clientY > colorFieldAndSliderRect.y) {
- samplingY = clientY - colorFieldAndSliderRect.y;
- }
- else if (clientY < colorFieldAndSliderRect.y) {
- samplingY = 0;
- }
- else {
- samplingY = colorFieldHeight + hueSliderHeight;
- }
- }
- if (hueThumbDragging) {
- this.captureColorFieldColor(samplingX, samplingY, false);
- }
- else {
- this.captureHueSliderColor(samplingX);
- }
- };
- this.handleColorFieldAndSliderMouseEnterOrMove = ({ offsetX, offsetY }) => {
- const { dimensions: { colorField, slider, thumb } } = this;
- this.colorFieldAndSliderInteractive = offsetY <= colorField.height + slider.height;
- this.colorFieldAndSliderHovered = true;
- const region = this.getCanvasRegion(offsetY);
- if (region === "color-field") {
- const prevHueThumbState = this.hueThumbState;
- const color = this.baseColorFieldColor.hsv();
- const centerX = Math.round(color.saturationv() / (HSV_LIMITS.s / colorField.width));
- const centerY = Math.round(colorField.height - color.value() / (HSV_LIMITS.v / colorField.height));
- const hoveringThumb = this.containsPoint(offsetX, offsetY, centerX, centerY, thumb.radius);
- let transitionedBetweenHoverAndIdle = false;
- if (prevHueThumbState === "idle" && hoveringThumb) {
- this.hueThumbState = "hover";
- transitionedBetweenHoverAndIdle = true;
- }
- else if (prevHueThumbState === "hover" && !hoveringThumb) {
- this.hueThumbState = "idle";
- transitionedBetweenHoverAndIdle = true;
- }
- if (this.hueThumbState !== "drag") {
- if (transitionedBetweenHoverAndIdle) {
- // refresh since we won't update color and thus no redraw
- this.drawColorFieldAndSlider();
- }
- }
- }
- else if (region === "slider") {
- const sliderThumbColor = this.baseColorFieldColor.hsv().saturationv(100).value(100);
- const prevSliderThumbState = this.sliderThumbState;
- const sliderThumbCenterX = Math.round(sliderThumbColor.hue() / (360 / slider.width));
- const sliderThumbCenterY = Math.round((slider.height + this.getSliderCapSpacing()) / 2) + colorField.height;
- const hoveringSliderThumb = this.containsPoint(offsetX, offsetY, sliderThumbCenterX, sliderThumbCenterY, thumb.radius);
- let sliderThumbTransitionedBetweenHoverAndIdle = false;
- if (prevSliderThumbState === "idle" && hoveringSliderThumb) {
- this.sliderThumbState = "hover";
- sliderThumbTransitionedBetweenHoverAndIdle = true;
- }
- else if (prevSliderThumbState === "hover" && !hoveringSliderThumb) {
- this.sliderThumbState = "idle";
- sliderThumbTransitionedBetweenHoverAndIdle = true;
- }
- if (this.sliderThumbState !== "drag") {
- if (sliderThumbTransitionedBetweenHoverAndIdle) {
- // refresh since we won't update color and thus no redraw
- this.drawColorFieldAndSlider();
- }
- }
- }
- };
- this.storeColorFieldScope = (node) => {
- this.colorFieldScopeNode = node;
- };
- this.storeHueScope = (node) => {
- this.hueScopeNode = node;
- };
- this.renderChannelsTabTitle = (channelMode) => {
- const { channelMode: activeChannelMode, intlRgb, intlHsv } = this;
- const active = channelMode === activeChannelMode;
- const label = channelMode === "rgb" ? intlRgb : intlHsv;
- return (hAsync("calcite-tab-title", { active: active, class: CSS$G.colorMode, "data-color-mode": channelMode, key: channelMode, onCalciteTabsActivate: this.handleTabActivate }, label));
- };
- this.renderChannelsTab = (channelMode) => {
- const { channelMode: activeChannelMode, channels, intlB, intlBlue, intlG, intlGreen, intlH, intlHue, intlR, intlRed, intlS, intlSaturation, intlV, intlValue } = this;
- const active = channelMode === activeChannelMode;
- const isRgb = channelMode === "rgb";
- const channelLabels = isRgb ? [intlR, intlG, intlB] : [intlH, intlS, intlV];
- const channelAriaLabels = isRgb
- ? [intlRed, intlGreen, intlBlue]
- : [intlHue, intlSaturation, intlValue];
- const direction = getElementDir(this.el);
- return (hAsync("calcite-tab", { active: active, class: CSS$G.control, key: channelMode }, hAsync("div", { class: CSS$G.channels, dir: "ltr" }, channels.map((channel, index) =>
- /* the channel container is ltr, so we apply the host's direction */
- this.renderChannel(channel, index, channelLabels[index], channelAriaLabels[index], direction)))));
- };
- this.renderChannel = (value, index, label, ariaLabel, direction) => (hAsync("calcite-input", { class: CSS$G.channel, "data-channel-index": index, dir: direction, label: ariaLabel, numberButtonType: "none", onCalciteInputChange: this.handleChannelChange, onCalciteInputInput: this.handleChannelInput, onKeyDown: this.handleKeyDown, prefixText: label, scale: this.scale === "l" ? "m" : "s", type: "number", value: value === null || value === void 0 ? void 0 : value.toString() }));
- this.deleteColor = () => {
- const colorToDelete = this.color.hex();
- const inStorage = this.savedColors.indexOf(colorToDelete) > -1;
- if (!inStorage) {
- return;
- }
- const savedColors = this.savedColors.filter((color) => color !== colorToDelete);
- this.savedColors = savedColors;
- const storageKey = `${DEFAULT_STORAGE_KEY_PREFIX}${this.storageId}`;
- if (this.storageId) {
- localStorage.setItem(storageKey, JSON.stringify(savedColors));
- }
- };
- this.saveColor = () => {
- const colorToSave = this.color.hex();
- const alreadySaved = this.savedColors.indexOf(colorToSave) > -1;
- if (alreadySaved) {
- return;
- }
- const savedColors = [...this.savedColors, colorToSave];
- this.savedColors = savedColors;
- const storageKey = `${DEFAULT_STORAGE_KEY_PREFIX}${this.storageId}`;
- if (this.storageId) {
- localStorage.setItem(storageKey, JSON.stringify(savedColors));
- }
- };
- this.drawColorFieldAndSlider = throttle$1(() => {
- if (!this.fieldAndSliderRenderingContext) {
- return;
- }
- this.drawColorField();
- this.drawHueSlider();
- }, throttleFor60FpsInMs);
- this.captureColorFieldColor = (x, y, skipEqual = true) => {
- const { dimensions: { colorField: { height, width } } } = this;
- const saturation = Math.round((HSV_LIMITS.s / width) * x);
- const value = Math.round((HSV_LIMITS.v / height) * (height - y));
- this.internalColorSet(this.baseColorFieldColor.hsv().saturationv(saturation).value(value), skipEqual);
- };
- this.initColorFieldAndSlider = (canvas) => {
- this.fieldAndSliderRenderingContext = canvas.getContext("2d");
- this.setCanvasContextSize(canvas, {
- width: this.dimensions.colorField.width,
- height: this.dimensions.colorField.height +
- this.dimensions.slider.height +
- this.getSliderCapSpacing() * 2
- });
- this.drawColorFieldAndSlider();
- };
- }
- handleColorChange(color, oldColor) {
- this.drawColorFieldAndSlider();
- this.updateChannelsFromColor(color);
- this.previousColor = oldColor;
- }
- handleFormatChange(format) {
- this.setMode(format);
- this.internalColorSet(this.color, false, "internal");
- }
- handleScaleChange(scale = "m") {
- this.updateDimensions(scale);
- }
- handleValueChange(value, oldValue) {
- const { allowEmpty, format } = this;
- const checkMode = !allowEmpty || value;
- let modeChanged = false;
- if (checkMode) {
- const nextMode = parseMode(value);
- if (!nextMode || (format !== "auto" && nextMode !== format)) {
- this.showIncompatibleColorWarning(value, format);
- this.value = oldValue;
- return;
- }
- modeChanged = this.mode !== nextMode;
- this.setMode(nextMode);
- }
- const dragging = this.sliderThumbState === "drag" || this.hueThumbState === "drag";
- if (this.internalColorUpdateContext === "initial") {
- return;
- }
- if (this.internalColorUpdateContext === "user-interaction") {
- this.calciteColorPickerInput.emit();
- if (!dragging) {
- this.calciteColorPickerChange.emit();
- }
- return;
- }
- const color$1 = allowEmpty && !value ? null : color(value);
- const colorChanged = !colorEqual(color$1, this.color);
- if (modeChanged || colorChanged) {
- this.internalColorSet(color$1, true, "internal");
- }
- }
- //--------------------------------------------------------------------------
- //
- // Internal State/Props
- //
- //--------------------------------------------------------------------------
- get baseColorFieldColor() {
- return this.color || this.previousColor || DEFAULT_COLOR$1;
- }
- // using @Listen as a workaround for VDOM listener not firing
- handleChannelKeyUpOrDown(event) {
- this.shiftKeyChannelAdjustment = 0;
- const key = event.key;
- if ((key !== "ArrowUp" && key !== "ArrowDown") ||
- !event.composedPath().some((node) => { var _a; return (_a = node.classList) === null || _a === void 0 ? void 0 : _a.contains(CSS$G.channel); })) {
- return;
- }
- const { shiftKey } = event;
- event.preventDefault();
- if (!this.color) {
- this.internalColorSet(this.previousColor);
- event.stopPropagation();
- return;
- }
- // this gets applied to the input's up/down arrow increment/decrement
- const complementaryBump = 9;
- this.shiftKeyChannelAdjustment =
- key === "ArrowUp" && shiftKey
- ? complementaryBump
- : key === "ArrowDown" && shiftKey
- ? -complementaryBump
- : 0;
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- return focusElement(this.colorFieldScopeNode);
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentWillLoad() {
- const { allowEmpty, color: color$1, format, value } = this;
- const willSetNoColor = allowEmpty && !value;
- const parsedMode = parseMode(value);
- const valueIsCompatible = willSetNoColor || (format === "auto" && parsedMode) || format === parsedMode;
- const initialColor = willSetNoColor ? null : valueIsCompatible ? color(value) : color$1;
- if (!valueIsCompatible) {
- this.showIncompatibleColorWarning(value, format);
- }
- this.setMode(format);
- this.internalColorSet(initialColor, false, "initial");
- this.updateDimensions(this.scale);
- const storageKey = `${DEFAULT_STORAGE_KEY_PREFIX}${this.storageId}`;
- if (this.storageId && localStorage.getItem(storageKey)) {
- this.savedColors = JSON.parse(localStorage.getItem(storageKey));
- }
- }
- disconnectedCallback() {
- document.removeEventListener("mousemove", this.globalMouseMoveHandler);
- document.removeEventListener("mouseup", this.globalMouseUpHandler);
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- //--------------------------------------------------------------------------
- //
- // Render Methods
- //
- //--------------------------------------------------------------------------
- render() {
- const { allowEmpty, color, intlDeleteColor, hideHex, hideChannels, hideSaved, intlHex, intlSaved, intlSaveColor, savedColors, scale } = this;
- const selectedColorInHex = color ? color.hex() : null;
- const hexInputScale = scale === "l" ? "m" : "s";
- const { colorFieldAndSliderInteractive, colorFieldScopeTop, colorFieldScopeLeft, hueScopeLeft, hueScopeTop, scopeOrientation, dimensions: { colorField: { height: colorFieldHeight, width: colorFieldWidth }, slider: { height: sliderHeight } } } = this;
- const hueTop = hueScopeTop !== null && hueScopeTop !== void 0 ? hueScopeTop : sliderHeight / 2 + colorFieldHeight;
- const hueLeft = hueScopeLeft !== null && hueScopeLeft !== void 0 ? hueScopeLeft : (colorFieldWidth * DEFAULT_COLOR$1.hue()) / HSV_LIMITS.h;
- const noColor = color === null;
- const vertical = scopeOrientation === "vertical";
- return (hAsync("div", { class: CSS$G.container }, hAsync("div", { class: CSS$G.colorFieldAndSliderWrap }, hAsync("canvas", { class: {
- [CSS$G.colorFieldAndSlider]: true,
- [CSS$G.colorFieldAndSliderInteractive]: colorFieldAndSliderInteractive
- }, onMouseDown: this.handleColorFieldAndSliderMouseDown, onMouseEnter: this.handleColorFieldAndSliderMouseEnterOrMove, onMouseLeave: this.handleColorFieldAndSliderMouseLeave, onMouseMove: this.handleColorFieldAndSliderMouseEnterOrMove, ref: this.initColorFieldAndSlider }), hAsync("div", { "aria-label": vertical ? this.intlValue : this.intlSaturation, "aria-valuemax": vertical ? HSV_LIMITS.v : HSV_LIMITS.s, "aria-valuemin": "0", "aria-valuenow": (vertical ? color === null || color === void 0 ? void 0 : color.saturationv() : color === null || color === void 0 ? void 0 : color.value()) || "0", class: { [CSS$G.scope]: true, [CSS$G.colorFieldScope]: true }, onKeyDown: this.handleColorFieldScopeKeyDown, ref: this.storeColorFieldScope, role: "slider", style: { top: `${colorFieldScopeTop || 0}px`, left: `${colorFieldScopeLeft || 0}px` }, tabindex: "0" }), hAsync("div", { "aria-label": this.intlHue, "aria-valuemax": HSV_LIMITS.h, "aria-valuemin": "0", "aria-valuenow": (color === null || color === void 0 ? void 0 : color.round().hue()) || DEFAULT_COLOR$1.round().hue(), class: { [CSS$G.scope]: true, [CSS$G.hueScope]: true }, onKeyDown: this.handleHueScopeKeyDown, ref: this.storeHueScope, role: "slider", style: { top: `${hueTop}px`, left: `${hueLeft}px` }, tabindex: "0" })), hideHex && hideChannels ? null : (hAsync("div", { class: {
- [CSS$G.controlSection]: true,
- [CSS$G.section]: true
- } }, hideHex ? null : (hAsync("div", { class: CSS$G.hexOptions }, hAsync("span", { class: {
- [CSS$G.header]: true,
- [CSS$G.headerHex]: true
- } }, intlHex), hAsync("calcite-color-picker-hex-input", { allowEmpty: allowEmpty, class: CSS$G.control, onCalciteColorPickerHexInputChange: this.handleHexInputChange, scale: hexInputScale, value: selectedColorInHex }))), hideChannels ? null : (hAsync("calcite-tabs", { class: {
- [CSS$G.colorModeContainer]: true,
- [CSS$G.splitSection]: true
- }, scale: hexInputScale }, hAsync("calcite-tab-nav", { slot: "tab-nav" }, this.renderChannelsTabTitle("rgb"), this.renderChannelsTabTitle("hsv")), this.renderChannelsTab("rgb"), this.renderChannelsTab("hsv"))))), hideSaved ? null : (hAsync("div", { class: { [CSS$G.savedColorsSection]: true, [CSS$G.section]: true } }, hAsync("div", { class: CSS$G.header }, hAsync("label", null, intlSaved), hAsync("div", { class: CSS$G.savedColorsButtons }, hAsync("calcite-button", { appearance: "transparent", class: CSS$G.deleteColor, color: "neutral", disabled: noColor, iconStart: "minus", label: intlDeleteColor, onClick: this.deleteColor, scale: hexInputScale, type: "button" }), hAsync("calcite-button", { appearance: "transparent", class: CSS$G.saveColor, color: "neutral", disabled: noColor, iconStart: "plus", label: intlSaveColor, onClick: this.saveColor, scale: hexInputScale, type: "button" }))), savedColors.length > 0 ? (hAsync("div", { class: CSS$G.savedColors }, [
- ...savedColors.map((color) => (hAsync("calcite-color-picker-swatch", { active: selectedColorInHex === color, class: CSS$G.savedColor, color: color, key: color, onClick: this.handleSavedColorSelect, onKeyDown: this.handleSavedColorKeyDown, scale: scale, tabIndex: 0 })))
- ])) : null))));
- }
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- handleKeyDown(event) {
- if (event.key === "Enter") {
- event.preventDefault();
- }
- }
- showIncompatibleColorWarning(value, format) {
- console.warn(`ignoring color value (${value}) as it is not compatible with the current format (${format})`);
- }
- setMode(format) {
- this.mode = format === "auto" ? this.mode : format;
- }
- captureHueSliderColor(x) {
- const { dimensions: { slider: { width } } } = this;
- const hue = (360 / width) * x;
- this.internalColorSet(this.baseColorFieldColor.hue(hue), false);
- }
- getCanvasRegion(y) {
- const { dimensions: { colorField: { height: colorFieldHeight }, slider: { height: sliderHeight } } } = this;
- if (y <= colorFieldHeight) {
- return "color-field";
- }
- if (y <= colorFieldHeight + sliderHeight) {
- return "slider";
- }
- return "none";
- }
- internalColorSet(color, skipEqual = true, context = "user-interaction") {
- if (skipEqual && colorEqual(color, this.color)) {
- return;
- }
- this.internalColorUpdateContext = context;
- this.color = color;
- this.value = this.toValue(color);
- this.internalColorUpdateContext = null;
- }
- toValue(color, format = this.mode) {
- if (!color) {
- return null;
- }
- const hexMode = "hex";
- if (format.includes(hexMode)) {
- return normalizeHex(color.round()[hexMode]());
- }
- if (format.includes("-css")) {
- return color[format.replace("-css", "").replace("a", "")]().round().string();
- }
- const colorObject = color[format]().round().object();
- if (format.endsWith("a")) {
- // normalize alpha prop
- colorObject.a = colorObject.alpha;
- delete colorObject.alpha;
- }
- return colorObject;
- }
- getSliderCapSpacing() {
- const { dimensions: { slider: { height }, thumb: { radius } } } = this;
- return radius * 2 - height;
- }
- updateDimensions(scale = "m") {
- this.dimensions = DIMENSIONS[scale];
- }
- drawColorField() {
- const context = this.fieldAndSliderRenderingContext;
- const { dimensions: { colorField: { height, width } } } = this;
- context.fillStyle = this.baseColorFieldColor.hsv().saturationv(100).value(100).string();
- context.fillRect(0, 0, width, height);
- const whiteGradient = context.createLinearGradient(0, 0, width, 0);
- whiteGradient.addColorStop(0, "rgba(255,255,255,1)");
- whiteGradient.addColorStop(1, "rgba(255,255,255,0)");
- context.fillStyle = whiteGradient;
- context.fillRect(0, 0, width, height);
- const blackGradient = context.createLinearGradient(0, 0, 0, height);
- blackGradient.addColorStop(0, "rgba(0,0,0,0)");
- blackGradient.addColorStop(1, "rgba(0,0,0,1)");
- context.fillStyle = blackGradient;
- context.fillRect(0, 0, width, height);
- this.drawActiveColorFieldColor();
- }
- setCanvasContextSize(canvas, { height, width }) {
- const devicePixelRatio = window.devicePixelRatio || 1;
- canvas.width = width * devicePixelRatio;
- canvas.height = height * devicePixelRatio;
- canvas.style.height = `${height}px`;
- canvas.style.width = `${width}px`;
- const context = canvas.getContext("2d");
- context.scale(devicePixelRatio, devicePixelRatio);
- }
- containsPoint(testPointX, testPointY, boundsX, boundsY, boundsRadius) {
- return (Math.pow(testPointX - boundsX, 2) + Math.pow(testPointY - boundsY, 2) <=
- Math.pow(boundsRadius, 2));
- }
- drawActiveColorFieldColor() {
- const { color } = this;
- if (!color) {
- return;
- }
- const hsvColor = color.hsv();
- const { dimensions: { colorField: { height, width }, thumb: { radius } } } = this;
- const x = hsvColor.saturationv() / (HSV_LIMITS.s / width);
- const y = height - hsvColor.value() / (HSV_LIMITS.v / height);
- requestAnimationFrame(() => {
- this.colorFieldScopeLeft = x;
- this.colorFieldScopeTop = y;
- });
- this.drawThumb(this.fieldAndSliderRenderingContext, radius, x, y, hsvColor, this.hueThumbState);
- }
- drawThumb(context, radius, x, y, color, state) {
- const startAngle = 0;
- const endAngle = 2 * Math.PI;
- context.beginPath();
- context.arc(x, y, radius, startAngle, endAngle);
- context.shadowBlur = state === "hover" ? 32 : 16;
- context.shadowColor = `rgba(0, 0, 0, ${state === "drag" ? 0.32 : 0.16})`;
- context.fillStyle = "#fff";
- context.fill();
- context.beginPath();
- context.arc(x, y, radius - 3, startAngle, endAngle);
- context.shadowBlur = 0;
- context.shadowColor = "transparent";
- context.fillStyle = color.rgb().string();
- context.fill();
- }
- drawActiveHueSliderColor() {
- const { color } = this;
- if (!color) {
- return;
- }
- const hsvColor = color.hsv().saturationv(100).value(100);
- const { dimensions: { colorField: { height: colorFieldHeight }, slider: { height, width }, thumb: { radius } } } = this;
- const x = hsvColor.hue() / (360 / width);
- const y = height / 2 + colorFieldHeight;
- requestAnimationFrame(() => {
- this.hueScopeLeft = x;
- this.hueScopeTop = y;
- });
- this.drawThumb(this.fieldAndSliderRenderingContext, radius, x, y, hsvColor, this.sliderThumbState);
- }
- drawHueSlider() {
- const context = this.fieldAndSliderRenderingContext;
- const { dimensions: { colorField: { height: colorFieldHeight }, slider: { height, width } } } = this;
- const gradient = context.createLinearGradient(0, 0, width, 0);
- const hueSliderColorStopKeywords = ["red", "yellow", "lime", "cyan", "blue", "magenta", "red"];
- const offset = 1 / (hueSliderColorStopKeywords.length - 1);
- let currentOffset = 0;
- hueSliderColorStopKeywords.forEach((keyword) => {
- gradient.addColorStop(currentOffset, color(keyword).string());
- currentOffset += offset;
- });
- context.fillStyle = gradient;
- context.clearRect(0, colorFieldHeight, width, height + this.getSliderCapSpacing() * 2);
- context.fillRect(0, colorFieldHeight, width, height);
- this.drawActiveHueSliderColor();
- }
- updateColorFromChannels(channels) {
- this.internalColorSet(color(channels, this.channelMode));
- }
- updateChannelsFromColor(color) {
- this.channels = color ? this.toChannels(color) : [null, null, null];
- }
- toChannels(color) {
- const { channelMode } = this;
- return color[channelMode]()
- .array()
- .map((value) => Math.floor(value));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "color": ["handleColorChange"],
- "format": ["handleFormatChange"],
- "scale": ["handleScaleChange"],
- "value": ["handleValueChange"]
- }; }
- static get style() { return colorPickerCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-color-picker",
- "$members$": {
- "allowEmpty": [4, "allow-empty"],
- "appearance": [513],
- "color": [1040],
- "disabled": [516],
- "format": [1],
- "hideHex": [4, "hide-hex"],
- "hideChannels": [4, "hide-channels"],
- "hideSaved": [4, "hide-saved"],
- "intlB": [1, "intl-b"],
- "intlBlue": [1, "intl-blue"],
- "intlDeleteColor": [1, "intl-delete-color"],
- "intlG": [1, "intl-g"],
- "intlGreen": [1, "intl-green"],
- "intlH": [1, "intl-h"],
- "intlHsv": [1, "intl-hsv"],
- "intlHex": [1, "intl-hex"],
- "intlHue": [1, "intl-hue"],
- "intlNoColor": [1, "intl-no-color"],
- "intlR": [1, "intl-r"],
- "intlRed": [1, "intl-red"],
- "intlRgb": [1, "intl-rgb"],
- "intlS": [1, "intl-s"],
- "intlSaturation": [1, "intl-saturation"],
- "intlSaveColor": [1, "intl-save-color"],
- "intlSaved": [1, "intl-saved"],
- "intlV": [1, "intl-v"],
- "intlValue": [1, "intl-value"],
- "scale": [513],
- "storageId": [1, "storage-id"],
- "value": [1025],
- "colorFieldAndSliderInteractive": [32],
- "channelMode": [32],
- "channels": [32],
- "dimensions": [32],
- "savedColors": [32],
- "colorFieldScopeTop": [32],
- "colorFieldScopeLeft": [32],
- "scopeOrientation": [32],
- "hueScopeLeft": [32],
- "hueScopeTop": [32],
- "setFocus": [64]
- },
- "$listeners$": [[2, "keydown", "handleChannelKeyUpOrDown"], [2, "keyup", "handleChannelKeyUpOrDown"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["appearance", "appearance"], ["disabled", "disabled"], ["scale", "scale"]]
- }; }
- }
- const CSS$F = {
- container: "container",
- preview: "preview",
- input: "input"
- };
- const colorPickerHexInputCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-color-picker-hex-input:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-color-picker-hex-input{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-color-picker-hex-input{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-color-picker-hex-input{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-color-picker-hex-input{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-color-picker-hex-input{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-color-picker-hex-input:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-color-picker-hex-input-h{display:none}/*!@:host*/.sc-calcite-color-picker-hex-input-h{display:block}/*!@.container*/.container.sc-calcite-color-picker-hex-input{display:inline-grid;width:100%;-ms-flex-align:center;align-items:center;grid-template-columns:1fr auto}/*!@.preview*/.preview.sc-calcite-color-picker-hex-input{grid-column:2/3;pointer-events:none;margin-top:0px;margin-bottom:0px;margin-left:0.25rem;margin-right:0.25rem;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;z-index:1}/*!@.preview,\n.input*/.preview.sc-calcite-color-picker-hex-input,.input.sc-calcite-color-picker-hex-input{grid-row:1}/*!@.input*/.input.sc-calcite-color-picker-hex-input{grid-column:1/3;width:100%;text-transform:uppercase}";
- const DEFAULT_COLOR = color();
- class ColorPickerHexInput {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteColorPickerHexInputChange = createEvent(this, "calciteColorPickerHexInputChange", 7);
- //--------------------------------------------------------------------------
- //
- // Public Properties
- //
- //--------------------------------------------------------------------------
- /**
- * When false, empty color (null) will be allowed as a value. Otherwise, a color value is always enforced by the component.
- *
- * When true, clearing the input and blurring will restore the last valid color set. When false, it will set it to empty.
- */
- this.allowEmpty = false;
- /**
- * Label used for the hex input.
- * @default "Hex"
- */
- this.intlHex = TEXT$h.hex;
- /**
- * Label used for the hex input when there is no color selected.
- * @default "No color"
- */
- this.intlNoColor = TEXT$h.noColor;
- /**
- * The component's scale.
- */
- this.scale = "m";
- /**
- * The hex value.
- */
- this.value = normalizeHex(DEFAULT_COLOR.hex());
- this.onCalciteInputBlur = () => {
- const node = this.inputNode;
- const inputValue = node.value;
- const hex = `#${inputValue}`;
- const willClearValue = this.allowEmpty && !inputValue;
- if (willClearValue || (isValidHex(hex) && isLonghandHex(hex))) {
- return;
- }
- // manipulating DOM directly since rerender doesn't update input value
- node.value =
- this.allowEmpty && !this.internalColor
- ? ""
- : this.formatForInternalInput(rgbToHex(this.internalColor.object()));
- };
- this.onInputChange = () => {
- this.internalSetValue(this.inputNode.value, this.value);
- };
- /**
- * The last valid/selected color. Used as a fallback if an invalid hex code is entered.
- */
- this.internalColor = DEFAULT_COLOR;
- this.previousNonNullValue = this.value;
- this.storeInputRef = (node) => {
- this.inputNode = node;
- };
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- const { allowEmpty, value } = this;
- if (value) {
- const normalized = normalizeHex(value);
- if (isValidHex(normalized)) {
- this.internalSetValue(normalized, normalized, false);
- }
- return;
- }
- if (allowEmpty) {
- this.internalSetValue(null, null, false);
- }
- }
- handleValueChange(value, oldValue) {
- this.internalSetValue(value, oldValue, false);
- }
- // using @Listen as a workaround for VDOM listener not firing
- onInputKeyDown(event) {
- const { altKey, ctrlKey, metaKey, shiftKey } = event;
- const { internalColor, value } = this;
- const key = event.key;
- if (key === "Tab" || key === "Enter") {
- this.onInputChange();
- return;
- }
- const isNudgeKey = key === "ArrowDown" || key === "ArrowUp";
- const oldValue = this.value;
- if (isNudgeKey) {
- if (!value) {
- this.internalSetValue(this.previousNonNullValue, oldValue);
- event.preventDefault();
- return;
- }
- const direction = key === "ArrowUp" ? 1 : -1;
- const bump = shiftKey ? 10 : 1;
- this.internalSetValue(normalizeHex(this.nudgeRGBChannels(internalColor, bump * direction).hex()), oldValue);
- event.preventDefault();
- return;
- }
- const withModifiers = altKey || ctrlKey || metaKey;
- const singleChar = key.length === 1;
- const validHexChar = hexChar.test(key);
- if (singleChar && !withModifiers && !validHexChar) {
- event.preventDefault();
- }
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- render() {
- const { intlHex, value } = this;
- const hexInputValue = this.formatForInternalInput(value);
- return (hAsync("div", { class: CSS$F.container }, hAsync("calcite-input", { class: CSS$F.input, label: intlHex, maxLength: 6, onCalciteInputBlur: this.onCalciteInputBlur, onCalciteInputChange: this.onInputChange, onKeyDown: this.handleKeyDown, prefixText: "#", ref: this.storeInputRef, scale: this.scale, value: hexInputValue }), hexInputValue ? (hAsync("calcite-color-picker-swatch", { active: true, class: CSS$F.preview, color: `#${hexInputValue}`, scale: this.scale })) : null));
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- focusElement(this.inputNode);
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- internalSetValue(value, oldValue, emit = true) {
- if (value) {
- const normalized = normalizeHex(value);
- if (isValidHex(normalized)) {
- const { internalColor } = this;
- const changed = !internalColor || normalized !== normalizeHex(internalColor.hex());
- this.internalColor = color(normalized);
- this.previousNonNullValue = normalized;
- this.value = normalized;
- if (changed && emit) {
- this.calciteColorPickerHexInputChange.emit();
- }
- return;
- }
- }
- else if (this.allowEmpty) {
- this.internalColor = null;
- this.value = null;
- if (emit) {
- this.calciteColorPickerHexInputChange.emit();
- }
- return;
- }
- this.value = oldValue;
- }
- formatForInternalInput(hex) {
- return hex ? hex.replace("#", "") : "";
- }
- nudgeRGBChannels(color$1, amount) {
- return color.rgb(color$1.array().map((channel) => channel + amount));
- }
- handleKeyDown(event) {
- if (event.key === "Enter") {
- event.preventDefault();
- }
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "value": ["handleValueChange"]
- }; }
- static get style() { return colorPickerHexInputCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-color-picker-hex-input",
- "$members$": {
- "allowEmpty": [4, "allow-empty"],
- "intlHex": [1, "intl-hex"],
- "intlNoColor": [1, "intl-no-color"],
- "scale": [513],
- "value": [1537],
- "internalColor": [32],
- "setFocus": [64]
- },
- "$listeners$": [[2, "keydown", "onInputKeyDown"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["scale", "scale"], ["value", "value"]]
- }; }
- }
- const CSS$E = {
- swatch: "swatch",
- noColorIcon: "no-color-icon"
- };
- const COLORS = {
- borderLight: "rgba(0, 0, 0, 0.3)",
- borderDark: "rgba(255, 255, 255, 0.15)"
- };
- const colorPickerSwatchCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-color-picker-swatch:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-color-picker-swatch{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-color-picker-swatch{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-color-picker-swatch{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-color-picker-swatch{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-color-picker-swatch{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-color-picker-swatch:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-color-picker-swatch-h{display:none}/*!@:host*/.sc-calcite-color-picker-swatch-h{position:relative;display:-ms-inline-flexbox;display:inline-flex}/*!@:host([scale=s])*/[scale=s].sc-calcite-color-picker-swatch-h{height:1.25rem;width:1.25rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-color-picker-swatch-h{height:1.5rem;width:1.5rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-color-picker-swatch-h{height:2rem;width:2rem}/*!@.swatch*/.swatch.sc-calcite-color-picker-swatch{overflow:visible;height:inherit;width:inherit}/*!@.swatch rect*/.swatch.sc-calcite-color-picker-swatch rect.sc-calcite-color-picker-swatch{-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}/*!@.no-color-icon*/.no-color-icon.sc-calcite-color-picker-swatch{position:absolute;top:0px;right:0px;bottom:0px;left:0px;height:100%;width:100%}";
- class ColorPickerSwatch {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /**
- * Used to display whether the swatch is active or not.
- */
- this.active = false;
- /**
- * The component scale.
- */
- this.scale = "m";
- }
- handleColorChange(color$1) {
- this.internalColor = color(color$1);
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentWillLoad() {
- this.handleColorChange(this.color);
- }
- render() {
- const { active, el, internalColor } = this;
- const borderRadius = active ? "100%" : "0";
- const hex = internalColor.hex();
- const theme = getThemeName(el);
- const borderColor = theme === "light" ? COLORS.borderLight : COLORS.borderDark;
- return (hAsync("svg", { class: CSS$E.swatch, xmlns: "http://www.w3.org/2000/svg" }, hAsync("title", null, hex), hAsync("rect", { fill: hex, height: "100%", id: "swatch", rx: borderRadius, stroke: borderColor, "stroke-width": "2", style: { "clip-path": `inset(0 round ${borderRadius})` }, width: "100%" })));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "color": ["handleColorChange"]
- }; }
- static get style() { return colorPickerSwatchCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-color-picker-swatch",
- "$members$": {
- "active": [516],
- "color": [1],
- "scale": [513]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["active", "active"], ["scale", "scale"]]
- }; }
- }
- const filter = (data, value) => {
- const escapedValue = escapeRegExp(value);
- const regex = new RegExp(escapedValue, "i");
- if (data.length === 0) {
- console.warn(`No data was passed to the filter function.
- The data argument should be an array of objects`);
- }
- const find = (input, RE) => {
- var _a;
- if ((_a = input) === null || _a === void 0 ? void 0 : _a.constant) {
- return true;
- }
- let found = false;
- forIn(input, (val) => {
- if (typeof val === "function" || val == null /* intentional == to catch undefined */) {
- return;
- }
- if (Array.isArray(val) || (typeof val === "object" && val !== null)) {
- if (find(val, RE)) {
- found = true;
- }
- }
- else if (RE.test(val)) {
- found = true;
- }
- });
- return found;
- };
- const result = data.filter((item) => {
- return find(item, regex);
- });
- return result;
- };
- var top = 'top';
- var bottom = 'bottom';
- var right = 'right';
- var left = 'left';
- var auto = 'auto';
- var basePlacements = [top, bottom, right, left];
- var start = 'start';
- var end = 'end';
- var clippingParents = 'clippingParents';
- var viewport = 'viewport';
- var popper = 'popper';
- var reference = 'reference';
- var variationPlacements = /*#__PURE__*/basePlacements.reduce(function (acc, placement) {
- return acc.concat([placement + "-" + start, placement + "-" + end]);
- }, []);
- var placements = /*#__PURE__*/[].concat(basePlacements, [auto]).reduce(function (acc, placement) {
- return acc.concat([placement, placement + "-" + start, placement + "-" + end]);
- }, []); // modifiers that need to read the DOM
- var beforeRead = 'beforeRead';
- var read = 'read';
- var afterRead = 'afterRead'; // pure-logic modifiers
- var beforeMain = 'beforeMain';
- var main = 'main';
- var afterMain = 'afterMain'; // modifier with the purpose to write to the DOM (or write into a framework state)
- var beforeWrite = 'beforeWrite';
- var write = 'write';
- var afterWrite = 'afterWrite';
- var modifierPhases = [beforeRead, read, afterRead, beforeMain, main, afterMain, beforeWrite, write, afterWrite];
- function getNodeName(element) {
- return element ? (element.nodeName || '').toLowerCase() : null;
- }
- function getWindow(node) {
- if (node == null) {
- return window;
- }
- if (node.toString() !== '[object Window]') {
- var ownerDocument = node.ownerDocument;
- return ownerDocument ? ownerDocument.defaultView || window : window;
- }
- return node;
- }
- function isElement(node) {
- var OwnElement = getWindow(node).Element;
- return node instanceof OwnElement || node instanceof Element;
- }
- function isHTMLElement(node) {
- var OwnElement = getWindow(node).HTMLElement;
- return node instanceof OwnElement || node instanceof HTMLElement;
- }
- function isShadowRoot(node) {
- // IE 11 has no ShadowRoot
- if (typeof ShadowRoot === 'undefined') {
- return false;
- }
- var OwnElement = getWindow(node).ShadowRoot;
- return node instanceof OwnElement || node instanceof ShadowRoot;
- }
- // and applies them to the HTMLElements such as popper and arrow
- function applyStyles(_ref) {
- var state = _ref.state;
- Object.keys(state.elements).forEach(function (name) {
- var style = state.styles[name] || {};
- var attributes = state.attributes[name] || {};
- var element = state.elements[name]; // arrow is optional + virtual elements
- if (!isHTMLElement(element) || !getNodeName(element)) {
- return;
- } // Flow doesn't support to extend this property, but it's the most
- // effective way to apply styles to an HTMLElement
- // $FlowFixMe[cannot-write]
- Object.assign(element.style, style);
- Object.keys(attributes).forEach(function (name) {
- var value = attributes[name];
- if (value === false) {
- element.removeAttribute(name);
- } else {
- element.setAttribute(name, value === true ? '' : value);
- }
- });
- });
- }
- function effect$2(_ref2) {
- var state = _ref2.state;
- var initialStyles = {
- popper: {
- position: state.options.strategy,
- left: '0',
- top: '0',
- margin: '0'
- },
- arrow: {
- position: 'absolute'
- },
- reference: {}
- };
- Object.assign(state.elements.popper.style, initialStyles.popper);
- state.styles = initialStyles;
- if (state.elements.arrow) {
- Object.assign(state.elements.arrow.style, initialStyles.arrow);
- }
- return function () {
- Object.keys(state.elements).forEach(function (name) {
- var element = state.elements[name];
- var attributes = state.attributes[name] || {};
- var styleProperties = Object.keys(state.styles.hasOwnProperty(name) ? state.styles[name] : initialStyles[name]); // Set all values to an empty string to unset them
- var style = styleProperties.reduce(function (style, property) {
- style[property] = '';
- return style;
- }, {}); // arrow is optional + virtual elements
- if (!isHTMLElement(element) || !getNodeName(element)) {
- return;
- }
- Object.assign(element.style, style);
- Object.keys(attributes).forEach(function (attribute) {
- element.removeAttribute(attribute);
- });
- });
- };
- } // eslint-disable-next-line import/no-unused-modules
- var applyStyles$1 = {
- name: 'applyStyles',
- enabled: true,
- phase: 'write',
- fn: applyStyles,
- effect: effect$2,
- requires: ['computeStyles']
- };
- function getBasePlacement(placement) {
- return placement.split('-')[0];
- }
- var max = Math.max;
- var min = Math.min;
- var round = Math.round;
- function getBoundingClientRect(element, includeScale) {
- if (includeScale === void 0) {
- includeScale = false;
- }
- var rect = element.getBoundingClientRect();
- var scaleX = 1;
- var scaleY = 1;
- if (isHTMLElement(element) && includeScale) {
- var offsetHeight = element.offsetHeight;
- var offsetWidth = element.offsetWidth; // Do not attempt to divide by 0, otherwise we get `Infinity` as scale
- // Fallback to 1 in case both values are `0`
- if (offsetWidth > 0) {
- scaleX = round(rect.width) / offsetWidth || 1;
- }
- if (offsetHeight > 0) {
- scaleY = round(rect.height) / offsetHeight || 1;
- }
- }
- return {
- width: rect.width / scaleX,
- height: rect.height / scaleY,
- top: rect.top / scaleY,
- right: rect.right / scaleX,
- bottom: rect.bottom / scaleY,
- left: rect.left / scaleX,
- x: rect.left / scaleX,
- y: rect.top / scaleY
- };
- }
- // means it doesn't take into account transforms.
- function getLayoutRect(element) {
- var clientRect = getBoundingClientRect(element); // Use the clientRect sizes if it's not been transformed.
- // Fixes https://github.com/popperjs/popper-core/issues/1223
- var width = element.offsetWidth;
- var height = element.offsetHeight;
- if (Math.abs(clientRect.width - width) <= 1) {
- width = clientRect.width;
- }
- if (Math.abs(clientRect.height - height) <= 1) {
- height = clientRect.height;
- }
- return {
- x: element.offsetLeft,
- y: element.offsetTop,
- width: width,
- height: height
- };
- }
- function contains(parent, child) {
- var rootNode = child.getRootNode && child.getRootNode(); // First, attempt with faster native method
- if (parent.contains(child)) {
- return true;
- } // then fallback to custom implementation with Shadow DOM support
- else if (rootNode && isShadowRoot(rootNode)) {
- var next = child;
- do {
- if (next && parent.isSameNode(next)) {
- return true;
- } // $FlowFixMe[prop-missing]: need a better way to handle this...
- next = next.parentNode || next.host;
- } while (next);
- } // Give up, the result is false
- return false;
- }
- function getComputedStyle$1(element) {
- return getWindow(element).getComputedStyle(element);
- }
- function isTableElement(element) {
- return ['table', 'td', 'th'].indexOf(getNodeName(element)) >= 0;
- }
- function getDocumentElement(element) {
- // $FlowFixMe[incompatible-return]: assume body is always available
- return ((isElement(element) ? element.ownerDocument : // $FlowFixMe[prop-missing]
- element.document) || window.document).documentElement;
- }
- function getParentNode(element) {
- if (getNodeName(element) === 'html') {
- return element;
- }
- return (// this is a quicker (but less type safe) way to save quite some bytes from the bundle
- // $FlowFixMe[incompatible-return]
- // $FlowFixMe[prop-missing]
- element.assignedSlot || // step into the shadow DOM of the parent of a slotted node
- element.parentNode || ( // DOM Element detected
- isShadowRoot(element) ? element.host : null) || // ShadowRoot detected
- // $FlowFixMe[incompatible-call]: HTMLElement is a Node
- getDocumentElement(element) // fallback
- );
- }
- function getTrueOffsetParent(element) {
- if (!isHTMLElement(element) || // https://github.com/popperjs/popper-core/issues/837
- getComputedStyle$1(element).position === 'fixed') {
- return null;
- }
- return element.offsetParent;
- } // `.offsetParent` reports `null` for fixed elements, while absolute elements
- // return the containing block
- function getContainingBlock(element) {
- var isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') !== -1;
- var isIE = navigator.userAgent.indexOf('Trident') !== -1;
- if (isIE && isHTMLElement(element)) {
- // In IE 9, 10 and 11 fixed elements containing block is always established by the viewport
- var elementCss = getComputedStyle$1(element);
- if (elementCss.position === 'fixed') {
- return null;
- }
- }
- var currentNode = getParentNode(element);
- if (isShadowRoot(currentNode)) {
- currentNode = currentNode.host;
- }
- while (isHTMLElement(currentNode) && ['html', 'body'].indexOf(getNodeName(currentNode)) < 0) {
- var css = getComputedStyle$1(currentNode); // This is non-exhaustive but covers the most common CSS properties that
- // create a containing block.
- // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
- if (css.transform !== 'none' || css.perspective !== 'none' || css.contain === 'paint' || ['transform', 'perspective'].indexOf(css.willChange) !== -1 || isFirefox && css.willChange === 'filter' || isFirefox && css.filter && css.filter !== 'none') {
- return currentNode;
- } else {
- currentNode = currentNode.parentNode;
- }
- }
- return null;
- } // Gets the closest ancestor positioned element. Handles some edge cases,
- // such as table ancestors and cross browser bugs.
- function getOffsetParent(element) {
- var window = getWindow(element);
- var offsetParent = getTrueOffsetParent(element);
- while (offsetParent && isTableElement(offsetParent) && getComputedStyle$1(offsetParent).position === 'static') {
- offsetParent = getTrueOffsetParent(offsetParent);
- }
- if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle$1(offsetParent).position === 'static')) {
- return window;
- }
- return offsetParent || getContainingBlock(element) || window;
- }
- function getMainAxisFromPlacement(placement) {
- return ['top', 'bottom'].indexOf(placement) >= 0 ? 'x' : 'y';
- }
- function within(min$1, value, max$1) {
- return max(min$1, min(value, max$1));
- }
- function withinMaxClamp(min, value, max) {
- var v = within(min, value, max);
- return v > max ? max : v;
- }
- function getFreshSideObject() {
- return {
- top: 0,
- right: 0,
- bottom: 0,
- left: 0
- };
- }
- function mergePaddingObject(paddingObject) {
- return Object.assign({}, getFreshSideObject(), paddingObject);
- }
- function expandToHashMap(value, keys) {
- return keys.reduce(function (hashMap, key) {
- hashMap[key] = value;
- return hashMap;
- }, {});
- }
- var toPaddingObject = function toPaddingObject(padding, state) {
- padding = typeof padding === 'function' ? padding(Object.assign({}, state.rects, {
- placement: state.placement
- })) : padding;
- return mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, basePlacements));
- };
- function arrow(_ref) {
- var _state$modifiersData$;
- var state = _ref.state,
- name = _ref.name,
- options = _ref.options;
- var arrowElement = state.elements.arrow;
- var popperOffsets = state.modifiersData.popperOffsets;
- var basePlacement = getBasePlacement(state.placement);
- var axis = getMainAxisFromPlacement(basePlacement);
- var isVertical = [left, right].indexOf(basePlacement) >= 0;
- var len = isVertical ? 'height' : 'width';
- if (!arrowElement || !popperOffsets) {
- return;
- }
- var paddingObject = toPaddingObject(options.padding, state);
- var arrowRect = getLayoutRect(arrowElement);
- var minProp = axis === 'y' ? top : left;
- var maxProp = axis === 'y' ? bottom : right;
- var endDiff = state.rects.reference[len] + state.rects.reference[axis] - popperOffsets[axis] - state.rects.popper[len];
- var startDiff = popperOffsets[axis] - state.rects.reference[axis];
- var arrowOffsetParent = getOffsetParent(arrowElement);
- var clientSize = arrowOffsetParent ? axis === 'y' ? arrowOffsetParent.clientHeight || 0 : arrowOffsetParent.clientWidth || 0 : 0;
- var centerToReference = endDiff / 2 - startDiff / 2; // Make sure the arrow doesn't overflow the popper if the center point is
- // outside of the popper bounds
- var min = paddingObject[minProp];
- var max = clientSize - arrowRect[len] - paddingObject[maxProp];
- var center = clientSize / 2 - arrowRect[len] / 2 + centerToReference;
- var offset = within(min, center, max); // Prevents breaking syntax highlighting...
- var axisProp = axis;
- state.modifiersData[name] = (_state$modifiersData$ = {}, _state$modifiersData$[axisProp] = offset, _state$modifiersData$.centerOffset = offset - center, _state$modifiersData$);
- }
- function effect$1(_ref2) {
- var state = _ref2.state,
- options = _ref2.options;
- var _options$element = options.element,
- arrowElement = _options$element === void 0 ? '[data-popper-arrow]' : _options$element;
- if (arrowElement == null) {
- return;
- } // CSS selector
- if (typeof arrowElement === 'string') {
- arrowElement = state.elements.popper.querySelector(arrowElement);
- if (!arrowElement) {
- return;
- }
- }
- if (!contains(state.elements.popper, arrowElement)) {
- return;
- }
- state.elements.arrow = arrowElement;
- } // eslint-disable-next-line import/no-unused-modules
- var arrow$1 = {
- name: 'arrow',
- enabled: true,
- phase: 'main',
- fn: arrow,
- effect: effect$1,
- requires: ['popperOffsets'],
- requiresIfExists: ['preventOverflow']
- };
- function getVariation(placement) {
- return placement.split('-')[1];
- }
- var unsetSides = {
- top: 'auto',
- right: 'auto',
- bottom: 'auto',
- left: 'auto'
- }; // Round the offsets to the nearest suitable subpixel based on the DPR.
- // Zooming can change the DPR, but it seems to report a value that will
- // cleanly divide the values into the appropriate subpixels.
- function roundOffsetsByDPR(_ref) {
- var x = _ref.x,
- y = _ref.y;
- var win = window;
- var dpr = win.devicePixelRatio || 1;
- return {
- x: round(x * dpr) / dpr || 0,
- y: round(y * dpr) / dpr || 0
- };
- }
- function mapToStyles(_ref2) {
- var _Object$assign2;
- var popper = _ref2.popper,
- popperRect = _ref2.popperRect,
- placement = _ref2.placement,
- variation = _ref2.variation,
- offsets = _ref2.offsets,
- position = _ref2.position,
- gpuAcceleration = _ref2.gpuAcceleration,
- adaptive = _ref2.adaptive,
- roundOffsets = _ref2.roundOffsets,
- isFixed = _ref2.isFixed;
- var _offsets$x = offsets.x,
- x = _offsets$x === void 0 ? 0 : _offsets$x,
- _offsets$y = offsets.y,
- y = _offsets$y === void 0 ? 0 : _offsets$y;
- var _ref3 = typeof roundOffsets === 'function' ? roundOffsets({
- x: x,
- y: y
- }) : {
- x: x,
- y: y
- };
- x = _ref3.x;
- y = _ref3.y;
- var hasX = offsets.hasOwnProperty('x');
- var hasY = offsets.hasOwnProperty('y');
- var sideX = left;
- var sideY = top;
- var win = window;
- if (adaptive) {
- var offsetParent = getOffsetParent(popper);
- var heightProp = 'clientHeight';
- var widthProp = 'clientWidth';
- if (offsetParent === getWindow(popper)) {
- offsetParent = getDocumentElement(popper);
- if (getComputedStyle$1(offsetParent).position !== 'static' && position === 'absolute') {
- heightProp = 'scrollHeight';
- widthProp = 'scrollWidth';
- }
- } // $FlowFixMe[incompatible-cast]: force type refinement, we compare offsetParent with window above, but Flow doesn't detect it
- offsetParent = offsetParent;
- if (placement === top || (placement === left || placement === right) && variation === end) {
- sideY = bottom;
- var offsetY = isFixed && offsetParent === win && win.visualViewport ? win.visualViewport.height : // $FlowFixMe[prop-missing]
- offsetParent[heightProp];
- y -= offsetY - popperRect.height;
- y *= gpuAcceleration ? 1 : -1;
- }
- if (placement === left || (placement === top || placement === bottom) && variation === end) {
- sideX = right;
- var offsetX = isFixed && offsetParent === win && win.visualViewport ? win.visualViewport.width : // $FlowFixMe[prop-missing]
- offsetParent[widthProp];
- x -= offsetX - popperRect.width;
- x *= gpuAcceleration ? 1 : -1;
- }
- }
- var commonStyles = Object.assign({
- position: position
- }, adaptive && unsetSides);
- var _ref4 = roundOffsets === true ? roundOffsetsByDPR({
- x: x,
- y: y
- }) : {
- x: x,
- y: y
- };
- x = _ref4.x;
- y = _ref4.y;
- if (gpuAcceleration) {
- var _Object$assign;
- return Object.assign({}, commonStyles, (_Object$assign = {}, _Object$assign[sideY] = hasY ? '0' : '', _Object$assign[sideX] = hasX ? '0' : '', _Object$assign.transform = (win.devicePixelRatio || 1) <= 1 ? "translate(" + x + "px, " + y + "px)" : "translate3d(" + x + "px, " + y + "px, 0)", _Object$assign));
- }
- return Object.assign({}, commonStyles, (_Object$assign2 = {}, _Object$assign2[sideY] = hasY ? y + "px" : '', _Object$assign2[sideX] = hasX ? x + "px" : '', _Object$assign2.transform = '', _Object$assign2));
- }
- function computeStyles(_ref5) {
- var state = _ref5.state,
- options = _ref5.options;
- var _options$gpuAccelerat = options.gpuAcceleration,
- gpuAcceleration = _options$gpuAccelerat === void 0 ? true : _options$gpuAccelerat,
- _options$adaptive = options.adaptive,
- adaptive = _options$adaptive === void 0 ? true : _options$adaptive,
- _options$roundOffsets = options.roundOffsets,
- roundOffsets = _options$roundOffsets === void 0 ? true : _options$roundOffsets;
- var commonStyles = {
- placement: getBasePlacement(state.placement),
- variation: getVariation(state.placement),
- popper: state.elements.popper,
- popperRect: state.rects.popper,
- gpuAcceleration: gpuAcceleration,
- isFixed: state.options.strategy === 'fixed'
- };
- if (state.modifiersData.popperOffsets != null) {
- state.styles.popper = Object.assign({}, state.styles.popper, mapToStyles(Object.assign({}, commonStyles, {
- offsets: state.modifiersData.popperOffsets,
- position: state.options.strategy,
- adaptive: adaptive,
- roundOffsets: roundOffsets
- })));
- }
- if (state.modifiersData.arrow != null) {
- state.styles.arrow = Object.assign({}, state.styles.arrow, mapToStyles(Object.assign({}, commonStyles, {
- offsets: state.modifiersData.arrow,
- position: 'absolute',
- adaptive: false,
- roundOffsets: roundOffsets
- })));
- }
- state.attributes.popper = Object.assign({}, state.attributes.popper, {
- 'data-popper-placement': state.placement
- });
- } // eslint-disable-next-line import/no-unused-modules
- var computeStyles$1 = {
- name: 'computeStyles',
- enabled: true,
- phase: 'beforeWrite',
- fn: computeStyles,
- data: {}
- };
- var passive = {
- passive: true
- };
- function effect(_ref) {
- var state = _ref.state,
- instance = _ref.instance,
- options = _ref.options;
- var _options$scroll = options.scroll,
- scroll = _options$scroll === void 0 ? true : _options$scroll,
- _options$resize = options.resize,
- resize = _options$resize === void 0 ? true : _options$resize;
- var window = getWindow(state.elements.popper);
- var scrollParents = [].concat(state.scrollParents.reference, state.scrollParents.popper);
- if (scroll) {
- scrollParents.forEach(function (scrollParent) {
- scrollParent.addEventListener('scroll', instance.update, passive);
- });
- }
- if (resize) {
- window.addEventListener('resize', instance.update, passive);
- }
- return function () {
- if (scroll) {
- scrollParents.forEach(function (scrollParent) {
- scrollParent.removeEventListener('scroll', instance.update, passive);
- });
- }
- if (resize) {
- window.removeEventListener('resize', instance.update, passive);
- }
- };
- } // eslint-disable-next-line import/no-unused-modules
- var eventListeners = {
- name: 'eventListeners',
- enabled: true,
- phase: 'write',
- fn: function fn() {},
- effect: effect,
- data: {}
- };
- var hash$1 = {
- left: 'right',
- right: 'left',
- bottom: 'top',
- top: 'bottom'
- };
- function getOppositePlacement(placement) {
- return placement.replace(/left|right|bottom|top/g, function (matched) {
- return hash$1[matched];
- });
- }
- var hash = {
- start: 'end',
- end: 'start'
- };
- function getOppositeVariationPlacement(placement) {
- return placement.replace(/start|end/g, function (matched) {
- return hash[matched];
- });
- }
- function getWindowScroll(node) {
- var win = getWindow(node);
- var scrollLeft = win.pageXOffset;
- var scrollTop = win.pageYOffset;
- return {
- scrollLeft: scrollLeft,
- scrollTop: scrollTop
- };
- }
- function getWindowScrollBarX(element) {
- // If <html> has a CSS width greater than the viewport, then this will be
- // incorrect for RTL.
- // Popper 1 is broken in this case and never had a bug report so let's assume
- // it's not an issue. I don't think anyone ever specifies width on <html>
- // anyway.
- // Browsers where the left scrollbar doesn't cause an issue report `0` for
- // this (e.g. Edge 2019, IE11, Safari)
- return getBoundingClientRect(getDocumentElement(element)).left + getWindowScroll(element).scrollLeft;
- }
- function getViewportRect(element) {
- var win = getWindow(element);
- var html = getDocumentElement(element);
- var visualViewport = win.visualViewport;
- var width = html.clientWidth;
- var height = html.clientHeight;
- var x = 0;
- var y = 0; // NB: This isn't supported on iOS <= 12. If the keyboard is open, the popper
- // can be obscured underneath it.
- // Also, `html.clientHeight` adds the bottom bar height in Safari iOS, even
- // if it isn't open, so if this isn't available, the popper will be detected
- // to overflow the bottom of the screen too early.
- if (visualViewport) {
- width = visualViewport.width;
- height = visualViewport.height; // Uses Layout Viewport (like Chrome; Safari does not currently)
- // In Chrome, it returns a value very close to 0 (+/-) but contains rounding
- // errors due to floating point numbers, so we need to check precision.
- // Safari returns a number <= 0, usually < -1 when pinch-zoomed
- // Feature detection fails in mobile emulation mode in Chrome.
- // Math.abs(win.innerWidth / visualViewport.scale - visualViewport.width) <
- // 0.001
- // Fallback here: "Not Safari" userAgent
- if (!/^((?!chrome|android).)*safari/i.test(navigator.userAgent)) {
- x = visualViewport.offsetLeft;
- y = visualViewport.offsetTop;
- }
- }
- return {
- width: width,
- height: height,
- x: x + getWindowScrollBarX(element),
- y: y
- };
- }
- // of the `<html>` and `<body>` rect bounds if horizontally scrollable
- function getDocumentRect(element) {
- var _element$ownerDocumen;
- var html = getDocumentElement(element);
- var winScroll = getWindowScroll(element);
- var body = (_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body;
- var width = max(html.scrollWidth, html.clientWidth, body ? body.scrollWidth : 0, body ? body.clientWidth : 0);
- var height = max(html.scrollHeight, html.clientHeight, body ? body.scrollHeight : 0, body ? body.clientHeight : 0);
- var x = -winScroll.scrollLeft + getWindowScrollBarX(element);
- var y = -winScroll.scrollTop;
- if (getComputedStyle$1(body || html).direction === 'rtl') {
- x += max(html.clientWidth, body ? body.clientWidth : 0) - width;
- }
- return {
- width: width,
- height: height,
- x: x,
- y: y
- };
- }
- function isScrollParent(element) {
- // Firefox wants us to check `-x` and `-y` variations as well
- var _getComputedStyle = getComputedStyle$1(element),
- overflow = _getComputedStyle.overflow,
- overflowX = _getComputedStyle.overflowX,
- overflowY = _getComputedStyle.overflowY;
- return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);
- }
- function getScrollParent(node) {
- if (['html', 'body', '#document'].indexOf(getNodeName(node)) >= 0) {
- // $FlowFixMe[incompatible-return]: assume body is always available
- return node.ownerDocument.body;
- }
- if (isHTMLElement(node) && isScrollParent(node)) {
- return node;
- }
- return getScrollParent(getParentNode(node));
- }
- /*
- given a DOM element, return the list of all scroll parents, up the list of ancesors
- until we get to the top window object. This list is what we attach scroll listeners
- to, because if any of these parent elements scroll, we'll need to re-calculate the
- reference element's position.
- */
- function listScrollParents(element, list) {
- var _element$ownerDocumen;
- if (list === void 0) {
- list = [];
- }
- var scrollParent = getScrollParent(element);
- var isBody = scrollParent === ((_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body);
- var win = getWindow(scrollParent);
- var target = isBody ? [win].concat(win.visualViewport || [], isScrollParent(scrollParent) ? scrollParent : []) : scrollParent;
- var updatedList = list.concat(target);
- return isBody ? updatedList : // $FlowFixMe[incompatible-call]: isBody tells us target will be an HTMLElement here
- updatedList.concat(listScrollParents(getParentNode(target)));
- }
- function rectToClientRect(rect) {
- return Object.assign({}, rect, {
- left: rect.x,
- top: rect.y,
- right: rect.x + rect.width,
- bottom: rect.y + rect.height
- });
- }
- function getInnerBoundingClientRect(element) {
- var rect = getBoundingClientRect(element);
- rect.top = rect.top + element.clientTop;
- rect.left = rect.left + element.clientLeft;
- rect.bottom = rect.top + element.clientHeight;
- rect.right = rect.left + element.clientWidth;
- rect.width = element.clientWidth;
- rect.height = element.clientHeight;
- rect.x = rect.left;
- rect.y = rect.top;
- return rect;
- }
- function getClientRectFromMixedType(element, clippingParent) {
- return clippingParent === viewport ? rectToClientRect(getViewportRect(element)) : isElement(clippingParent) ? getInnerBoundingClientRect(clippingParent) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
- } // A "clipping parent" is an overflowable container with the characteristic of
- // clipping (or hiding) overflowing elements with a position different from
- // `initial`
- function getClippingParents(element) {
- var clippingParents = listScrollParents(getParentNode(element));
- var canEscapeClipping = ['absolute', 'fixed'].indexOf(getComputedStyle$1(element).position) >= 0;
- var clipperElement = canEscapeClipping && isHTMLElement(element) ? getOffsetParent(element) : element;
- if (!isElement(clipperElement)) {
- return [];
- } // $FlowFixMe[incompatible-return]: https://github.com/facebook/flow/issues/1414
- return clippingParents.filter(function (clippingParent) {
- return isElement(clippingParent) && contains(clippingParent, clipperElement) && getNodeName(clippingParent) !== 'body';
- });
- } // Gets the maximum area that the element is visible in due to any number of
- // clipping parents
- function getClippingRect(element, boundary, rootBoundary) {
- var mainClippingParents = boundary === 'clippingParents' ? getClippingParents(element) : [].concat(boundary);
- var clippingParents = [].concat(mainClippingParents, [rootBoundary]);
- var firstClippingParent = clippingParents[0];
- var clippingRect = clippingParents.reduce(function (accRect, clippingParent) {
- var rect = getClientRectFromMixedType(element, clippingParent);
- accRect.top = max(rect.top, accRect.top);
- accRect.right = min(rect.right, accRect.right);
- accRect.bottom = min(rect.bottom, accRect.bottom);
- accRect.left = max(rect.left, accRect.left);
- return accRect;
- }, getClientRectFromMixedType(element, firstClippingParent));
- clippingRect.width = clippingRect.right - clippingRect.left;
- clippingRect.height = clippingRect.bottom - clippingRect.top;
- clippingRect.x = clippingRect.left;
- clippingRect.y = clippingRect.top;
- return clippingRect;
- }
- function computeOffsets(_ref) {
- var reference = _ref.reference,
- element = _ref.element,
- placement = _ref.placement;
- var basePlacement = placement ? getBasePlacement(placement) : null;
- var variation = placement ? getVariation(placement) : null;
- var commonX = reference.x + reference.width / 2 - element.width / 2;
- var commonY = reference.y + reference.height / 2 - element.height / 2;
- var offsets;
- switch (basePlacement) {
- case top:
- offsets = {
- x: commonX,
- y: reference.y - element.height
- };
- break;
- case bottom:
- offsets = {
- x: commonX,
- y: reference.y + reference.height
- };
- break;
- case right:
- offsets = {
- x: reference.x + reference.width,
- y: commonY
- };
- break;
- case left:
- offsets = {
- x: reference.x - element.width,
- y: commonY
- };
- break;
- default:
- offsets = {
- x: reference.x,
- y: reference.y
- };
- }
- var mainAxis = basePlacement ? getMainAxisFromPlacement(basePlacement) : null;
- if (mainAxis != null) {
- var len = mainAxis === 'y' ? 'height' : 'width';
- switch (variation) {
- case start:
- offsets[mainAxis] = offsets[mainAxis] - (reference[len] / 2 - element[len] / 2);
- break;
- case end:
- offsets[mainAxis] = offsets[mainAxis] + (reference[len] / 2 - element[len] / 2);
- break;
- }
- }
- return offsets;
- }
- function detectOverflow(state, options) {
- if (options === void 0) {
- options = {};
- }
- var _options = options,
- _options$placement = _options.placement,
- placement = _options$placement === void 0 ? state.placement : _options$placement,
- _options$boundary = _options.boundary,
- boundary = _options$boundary === void 0 ? clippingParents : _options$boundary,
- _options$rootBoundary = _options.rootBoundary,
- rootBoundary = _options$rootBoundary === void 0 ? viewport : _options$rootBoundary,
- _options$elementConte = _options.elementContext,
- elementContext = _options$elementConte === void 0 ? popper : _options$elementConte,
- _options$altBoundary = _options.altBoundary,
- altBoundary = _options$altBoundary === void 0 ? false : _options$altBoundary,
- _options$padding = _options.padding,
- padding = _options$padding === void 0 ? 0 : _options$padding;
- var paddingObject = mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, basePlacements));
- var altContext = elementContext === popper ? reference : popper;
- var popperRect = state.rects.popper;
- var element = state.elements[altBoundary ? altContext : elementContext];
- var clippingClientRect = getClippingRect(isElement(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary);
- var referenceClientRect = getBoundingClientRect(state.elements.reference);
- var popperOffsets = computeOffsets({
- reference: referenceClientRect,
- element: popperRect,
- strategy: 'absolute',
- placement: placement
- });
- var popperClientRect = rectToClientRect(Object.assign({}, popperRect, popperOffsets));
- var elementClientRect = elementContext === popper ? popperClientRect : referenceClientRect; // positive = overflowing the clipping rect
- // 0 or negative = within the clipping rect
- var overflowOffsets = {
- top: clippingClientRect.top - elementClientRect.top + paddingObject.top,
- bottom: elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom,
- left: clippingClientRect.left - elementClientRect.left + paddingObject.left,
- right: elementClientRect.right - clippingClientRect.right + paddingObject.right
- };
- var offsetData = state.modifiersData.offset; // Offsets can be applied only to the popper element
- if (elementContext === popper && offsetData) {
- var offset = offsetData[placement];
- Object.keys(overflowOffsets).forEach(function (key) {
- var multiply = [right, bottom].indexOf(key) >= 0 ? 1 : -1;
- var axis = [top, bottom].indexOf(key) >= 0 ? 'y' : 'x';
- overflowOffsets[key] += offset[axis] * multiply;
- });
- }
- return overflowOffsets;
- }
- function computeAutoPlacement(state, options) {
- if (options === void 0) {
- options = {};
- }
- var _options = options,
- placement = _options.placement,
- boundary = _options.boundary,
- rootBoundary = _options.rootBoundary,
- padding = _options.padding,
- flipVariations = _options.flipVariations,
- _options$allowedAutoP = _options.allowedAutoPlacements,
- allowedAutoPlacements = _options$allowedAutoP === void 0 ? placements : _options$allowedAutoP;
- var variation = getVariation(placement);
- var placements$1 = variation ? flipVariations ? variationPlacements : variationPlacements.filter(function (placement) {
- return getVariation(placement) === variation;
- }) : basePlacements;
- var allowedPlacements = placements$1.filter(function (placement) {
- return allowedAutoPlacements.indexOf(placement) >= 0;
- });
- if (allowedPlacements.length === 0) {
- allowedPlacements = placements$1;
- } // $FlowFixMe[incompatible-type]: Flow seems to have problems with two array unions...
- var overflows = allowedPlacements.reduce(function (acc, placement) {
- acc[placement] = detectOverflow(state, {
- placement: placement,
- boundary: boundary,
- rootBoundary: rootBoundary,
- padding: padding
- })[getBasePlacement(placement)];
- return acc;
- }, {});
- return Object.keys(overflows).sort(function (a, b) {
- return overflows[a] - overflows[b];
- });
- }
- function getExpandedFallbackPlacements(placement) {
- if (getBasePlacement(placement) === auto) {
- return [];
- }
- var oppositePlacement = getOppositePlacement(placement);
- return [getOppositeVariationPlacement(placement), oppositePlacement, getOppositeVariationPlacement(oppositePlacement)];
- }
- function flip(_ref) {
- var state = _ref.state,
- options = _ref.options,
- name = _ref.name;
- if (state.modifiersData[name]._skip) {
- return;
- }
- var _options$mainAxis = options.mainAxis,
- checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis,
- _options$altAxis = options.altAxis,
- checkAltAxis = _options$altAxis === void 0 ? true : _options$altAxis,
- specifiedFallbackPlacements = options.fallbackPlacements,
- padding = options.padding,
- boundary = options.boundary,
- rootBoundary = options.rootBoundary,
- altBoundary = options.altBoundary,
- _options$flipVariatio = options.flipVariations,
- flipVariations = _options$flipVariatio === void 0 ? true : _options$flipVariatio,
- allowedAutoPlacements = options.allowedAutoPlacements;
- var preferredPlacement = state.options.placement;
- var basePlacement = getBasePlacement(preferredPlacement);
- var isBasePlacement = basePlacement === preferredPlacement;
- var fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipVariations ? [getOppositePlacement(preferredPlacement)] : getExpandedFallbackPlacements(preferredPlacement));
- var placements = [preferredPlacement].concat(fallbackPlacements).reduce(function (acc, placement) {
- return acc.concat(getBasePlacement(placement) === auto ? computeAutoPlacement(state, {
- placement: placement,
- boundary: boundary,
- rootBoundary: rootBoundary,
- padding: padding,
- flipVariations: flipVariations,
- allowedAutoPlacements: allowedAutoPlacements
- }) : placement);
- }, []);
- var referenceRect = state.rects.reference;
- var popperRect = state.rects.popper;
- var checksMap = new Map();
- var makeFallbackChecks = true;
- var firstFittingPlacement = placements[0];
- for (var i = 0; i < placements.length; i++) {
- var placement = placements[i];
- var _basePlacement = getBasePlacement(placement);
- var isStartVariation = getVariation(placement) === start;
- var isVertical = [top, bottom].indexOf(_basePlacement) >= 0;
- var len = isVertical ? 'width' : 'height';
- var overflow = detectOverflow(state, {
- placement: placement,
- boundary: boundary,
- rootBoundary: rootBoundary,
- altBoundary: altBoundary,
- padding: padding
- });
- var mainVariationSide = isVertical ? isStartVariation ? right : left : isStartVariation ? bottom : top;
- if (referenceRect[len] > popperRect[len]) {
- mainVariationSide = getOppositePlacement(mainVariationSide);
- }
- var altVariationSide = getOppositePlacement(mainVariationSide);
- var checks = [];
- if (checkMainAxis) {
- checks.push(overflow[_basePlacement] <= 0);
- }
- if (checkAltAxis) {
- checks.push(overflow[mainVariationSide] <= 0, overflow[altVariationSide] <= 0);
- }
- if (checks.every(function (check) {
- return check;
- })) {
- firstFittingPlacement = placement;
- makeFallbackChecks = false;
- break;
- }
- checksMap.set(placement, checks);
- }
- if (makeFallbackChecks) {
- // `2` may be desired in some cases – research later
- var numberOfChecks = flipVariations ? 3 : 1;
- var _loop = function _loop(_i) {
- var fittingPlacement = placements.find(function (placement) {
- var checks = checksMap.get(placement);
- if (checks) {
- return checks.slice(0, _i).every(function (check) {
- return check;
- });
- }
- });
- if (fittingPlacement) {
- firstFittingPlacement = fittingPlacement;
- return "break";
- }
- };
- for (var _i = numberOfChecks; _i > 0; _i--) {
- var _ret = _loop(_i);
- if (_ret === "break") break;
- }
- }
- if (state.placement !== firstFittingPlacement) {
- state.modifiersData[name]._skip = true;
- state.placement = firstFittingPlacement;
- state.reset = true;
- }
- } // eslint-disable-next-line import/no-unused-modules
- var flip$1 = {
- name: 'flip',
- enabled: true,
- phase: 'main',
- fn: flip,
- requiresIfExists: ['offset'],
- data: {
- _skip: false
- }
- };
- function getSideOffsets(overflow, rect, preventedOffsets) {
- if (preventedOffsets === void 0) {
- preventedOffsets = {
- x: 0,
- y: 0
- };
- }
- return {
- top: overflow.top - rect.height - preventedOffsets.y,
- right: overflow.right - rect.width + preventedOffsets.x,
- bottom: overflow.bottom - rect.height + preventedOffsets.y,
- left: overflow.left - rect.width - preventedOffsets.x
- };
- }
- function isAnySideFullyClipped(overflow) {
- return [top, right, bottom, left].some(function (side) {
- return overflow[side] >= 0;
- });
- }
- function hide(_ref) {
- var state = _ref.state,
- name = _ref.name;
- var referenceRect = state.rects.reference;
- var popperRect = state.rects.popper;
- var preventedOffsets = state.modifiersData.preventOverflow;
- var referenceOverflow = detectOverflow(state, {
- elementContext: 'reference'
- });
- var popperAltOverflow = detectOverflow(state, {
- altBoundary: true
- });
- var referenceClippingOffsets = getSideOffsets(referenceOverflow, referenceRect);
- var popperEscapeOffsets = getSideOffsets(popperAltOverflow, popperRect, preventedOffsets);
- var isReferenceHidden = isAnySideFullyClipped(referenceClippingOffsets);
- var hasPopperEscaped = isAnySideFullyClipped(popperEscapeOffsets);
- state.modifiersData[name] = {
- referenceClippingOffsets: referenceClippingOffsets,
- popperEscapeOffsets: popperEscapeOffsets,
- isReferenceHidden: isReferenceHidden,
- hasPopperEscaped: hasPopperEscaped
- };
- state.attributes.popper = Object.assign({}, state.attributes.popper, {
- 'data-popper-reference-hidden': isReferenceHidden,
- 'data-popper-escaped': hasPopperEscaped
- });
- } // eslint-disable-next-line import/no-unused-modules
- var hide$1 = {
- name: 'hide',
- enabled: true,
- phase: 'main',
- requiresIfExists: ['preventOverflow'],
- fn: hide
- };
- function distanceAndSkiddingToXY(placement, rects, offset) {
- var basePlacement = getBasePlacement(placement);
- var invertDistance = [left, top].indexOf(basePlacement) >= 0 ? -1 : 1;
- var _ref = typeof offset === 'function' ? offset(Object.assign({}, rects, {
- placement: placement
- })) : offset,
- skidding = _ref[0],
- distance = _ref[1];
- skidding = skidding || 0;
- distance = (distance || 0) * invertDistance;
- return [left, right].indexOf(basePlacement) >= 0 ? {
- x: distance,
- y: skidding
- } : {
- x: skidding,
- y: distance
- };
- }
- function offset(_ref2) {
- var state = _ref2.state,
- options = _ref2.options,
- name = _ref2.name;
- var _options$offset = options.offset,
- offset = _options$offset === void 0 ? [0, 0] : _options$offset;
- var data = placements.reduce(function (acc, placement) {
- acc[placement] = distanceAndSkiddingToXY(placement, state.rects, offset);
- return acc;
- }, {});
- var _data$state$placement = data[state.placement],
- x = _data$state$placement.x,
- y = _data$state$placement.y;
- if (state.modifiersData.popperOffsets != null) {
- state.modifiersData.popperOffsets.x += x;
- state.modifiersData.popperOffsets.y += y;
- }
- state.modifiersData[name] = data;
- } // eslint-disable-next-line import/no-unused-modules
- var offset$1 = {
- name: 'offset',
- enabled: true,
- phase: 'main',
- requires: ['popperOffsets'],
- fn: offset
- };
- function popperOffsets(_ref) {
- var state = _ref.state,
- name = _ref.name;
- // Offsets are the actual position the popper needs to have to be
- // properly positioned near its reference element
- // This is the most basic placement, and will be adjusted by
- // the modifiers in the next step
- state.modifiersData[name] = computeOffsets({
- reference: state.rects.reference,
- element: state.rects.popper,
- strategy: 'absolute',
- placement: state.placement
- });
- } // eslint-disable-next-line import/no-unused-modules
- var popperOffsets$1 = {
- name: 'popperOffsets',
- enabled: true,
- phase: 'read',
- fn: popperOffsets,
- data: {}
- };
- function getAltAxis(axis) {
- return axis === 'x' ? 'y' : 'x';
- }
- function preventOverflow(_ref) {
- var state = _ref.state,
- options = _ref.options,
- name = _ref.name;
- var _options$mainAxis = options.mainAxis,
- checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis,
- _options$altAxis = options.altAxis,
- checkAltAxis = _options$altAxis === void 0 ? false : _options$altAxis,
- boundary = options.boundary,
- rootBoundary = options.rootBoundary,
- altBoundary = options.altBoundary,
- padding = options.padding,
- _options$tether = options.tether,
- tether = _options$tether === void 0 ? true : _options$tether,
- _options$tetherOffset = options.tetherOffset,
- tetherOffset = _options$tetherOffset === void 0 ? 0 : _options$tetherOffset;
- var overflow = detectOverflow(state, {
- boundary: boundary,
- rootBoundary: rootBoundary,
- padding: padding,
- altBoundary: altBoundary
- });
- var basePlacement = getBasePlacement(state.placement);
- var variation = getVariation(state.placement);
- var isBasePlacement = !variation;
- var mainAxis = getMainAxisFromPlacement(basePlacement);
- var altAxis = getAltAxis(mainAxis);
- var popperOffsets = state.modifiersData.popperOffsets;
- var referenceRect = state.rects.reference;
- var popperRect = state.rects.popper;
- var tetherOffsetValue = typeof tetherOffset === 'function' ? tetherOffset(Object.assign({}, state.rects, {
- placement: state.placement
- })) : tetherOffset;
- var normalizedTetherOffsetValue = typeof tetherOffsetValue === 'number' ? {
- mainAxis: tetherOffsetValue,
- altAxis: tetherOffsetValue
- } : Object.assign({
- mainAxis: 0,
- altAxis: 0
- }, tetherOffsetValue);
- var offsetModifierState = state.modifiersData.offset ? state.modifiersData.offset[state.placement] : null;
- var data = {
- x: 0,
- y: 0
- };
- if (!popperOffsets) {
- return;
- }
- if (checkMainAxis) {
- var _offsetModifierState$;
- var mainSide = mainAxis === 'y' ? top : left;
- var altSide = mainAxis === 'y' ? bottom : right;
- var len = mainAxis === 'y' ? 'height' : 'width';
- var offset = popperOffsets[mainAxis];
- var min$1 = offset + overflow[mainSide];
- var max$1 = offset - overflow[altSide];
- var additive = tether ? -popperRect[len] / 2 : 0;
- var minLen = variation === start ? referenceRect[len] : popperRect[len];
- var maxLen = variation === start ? -popperRect[len] : -referenceRect[len]; // We need to include the arrow in the calculation so the arrow doesn't go
- // outside the reference bounds
- var arrowElement = state.elements.arrow;
- var arrowRect = tether && arrowElement ? getLayoutRect(arrowElement) : {
- width: 0,
- height: 0
- };
- var arrowPaddingObject = state.modifiersData['arrow#persistent'] ? state.modifiersData['arrow#persistent'].padding : getFreshSideObject();
- var arrowPaddingMin = arrowPaddingObject[mainSide];
- var arrowPaddingMax = arrowPaddingObject[altSide]; // If the reference length is smaller than the arrow length, we don't want
- // to include its full size in the calculation. If the reference is small
- // and near the edge of a boundary, the popper can overflow even if the
- // reference is not overflowing as well (e.g. virtual elements with no
- // width or height)
- var arrowLen = within(0, referenceRect[len], arrowRect[len]);
- var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis : minLen - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis;
- var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis : maxLen + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis;
- var arrowOffsetParent = state.elements.arrow && getOffsetParent(state.elements.arrow);
- var clientOffset = arrowOffsetParent ? mainAxis === 'y' ? arrowOffsetParent.clientTop || 0 : arrowOffsetParent.clientLeft || 0 : 0;
- var offsetModifierValue = (_offsetModifierState$ = offsetModifierState == null ? void 0 : offsetModifierState[mainAxis]) != null ? _offsetModifierState$ : 0;
- var tetherMin = offset + minOffset - offsetModifierValue - clientOffset;
- var tetherMax = offset + maxOffset - offsetModifierValue;
- var preventedOffset = within(tether ? min(min$1, tetherMin) : min$1, offset, tether ? max(max$1, tetherMax) : max$1);
- popperOffsets[mainAxis] = preventedOffset;
- data[mainAxis] = preventedOffset - offset;
- }
- if (checkAltAxis) {
- var _offsetModifierState$2;
- var _mainSide = mainAxis === 'x' ? top : left;
- var _altSide = mainAxis === 'x' ? bottom : right;
- var _offset = popperOffsets[altAxis];
- var _len = altAxis === 'y' ? 'height' : 'width';
- var _min = _offset + overflow[_mainSide];
- var _max = _offset - overflow[_altSide];
- var isOriginSide = [top, left].indexOf(basePlacement) !== -1;
- var _offsetModifierValue = (_offsetModifierState$2 = offsetModifierState == null ? void 0 : offsetModifierState[altAxis]) != null ? _offsetModifierState$2 : 0;
- var _tetherMin = isOriginSide ? _min : _offset - referenceRect[_len] - popperRect[_len] - _offsetModifierValue + normalizedTetherOffsetValue.altAxis;
- var _tetherMax = isOriginSide ? _offset + referenceRect[_len] + popperRect[_len] - _offsetModifierValue - normalizedTetherOffsetValue.altAxis : _max;
- var _preventedOffset = tether && isOriginSide ? withinMaxClamp(_tetherMin, _offset, _tetherMax) : within(tether ? _tetherMin : _min, _offset, tether ? _tetherMax : _max);
- popperOffsets[altAxis] = _preventedOffset;
- data[altAxis] = _preventedOffset - _offset;
- }
- state.modifiersData[name] = data;
- } // eslint-disable-next-line import/no-unused-modules
- var preventOverflow$1 = {
- name: 'preventOverflow',
- enabled: true,
- phase: 'main',
- fn: preventOverflow,
- requiresIfExists: ['offset']
- };
- function getHTMLElementScroll(element) {
- return {
- scrollLeft: element.scrollLeft,
- scrollTop: element.scrollTop
- };
- }
- function getNodeScroll(node) {
- if (node === getWindow(node) || !isHTMLElement(node)) {
- return getWindowScroll(node);
- } else {
- return getHTMLElementScroll(node);
- }
- }
- function isElementScaled(element) {
- var rect = element.getBoundingClientRect();
- var scaleX = round(rect.width) / element.offsetWidth || 1;
- var scaleY = round(rect.height) / element.offsetHeight || 1;
- return scaleX !== 1 || scaleY !== 1;
- } // Returns the composite rect of an element relative to its offsetParent.
- // Composite means it takes into account transforms as well as layout.
- function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
- if (isFixed === void 0) {
- isFixed = false;
- }
- var isOffsetParentAnElement = isHTMLElement(offsetParent);
- var offsetParentIsScaled = isHTMLElement(offsetParent) && isElementScaled(offsetParent);
- var documentElement = getDocumentElement(offsetParent);
- var rect = getBoundingClientRect(elementOrVirtualElement, offsetParentIsScaled);
- var scroll = {
- scrollLeft: 0,
- scrollTop: 0
- };
- var offsets = {
- x: 0,
- y: 0
- };
- if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
- if (getNodeName(offsetParent) !== 'body' || // https://github.com/popperjs/popper-core/issues/1078
- isScrollParent(documentElement)) {
- scroll = getNodeScroll(offsetParent);
- }
- if (isHTMLElement(offsetParent)) {
- offsets = getBoundingClientRect(offsetParent, true);
- offsets.x += offsetParent.clientLeft;
- offsets.y += offsetParent.clientTop;
- } else if (documentElement) {
- offsets.x = getWindowScrollBarX(documentElement);
- }
- }
- return {
- x: rect.left + scroll.scrollLeft - offsets.x,
- y: rect.top + scroll.scrollTop - offsets.y,
- width: rect.width,
- height: rect.height
- };
- }
- function order(modifiers) {
- var map = new Map();
- var visited = new Set();
- var result = [];
- modifiers.forEach(function (modifier) {
- map.set(modifier.name, modifier);
- }); // On visiting object, check for its dependencies and visit them recursively
- function sort(modifier) {
- visited.add(modifier.name);
- var requires = [].concat(modifier.requires || [], modifier.requiresIfExists || []);
- requires.forEach(function (dep) {
- if (!visited.has(dep)) {
- var depModifier = map.get(dep);
- if (depModifier) {
- sort(depModifier);
- }
- }
- });
- result.push(modifier);
- }
- modifiers.forEach(function (modifier) {
- if (!visited.has(modifier.name)) {
- // check for visited object
- sort(modifier);
- }
- });
- return result;
- }
- function orderModifiers(modifiers) {
- // order based on dependencies
- var orderedModifiers = order(modifiers); // order based on phase
- return modifierPhases.reduce(function (acc, phase) {
- return acc.concat(orderedModifiers.filter(function (modifier) {
- return modifier.phase === phase;
- }));
- }, []);
- }
- function debounce(fn) {
- var pending;
- return function () {
- if (!pending) {
- pending = new Promise(function (resolve) {
- Promise.resolve().then(function () {
- pending = undefined;
- resolve(fn());
- });
- });
- }
- return pending;
- };
- }
- function mergeByName(modifiers) {
- var merged = modifiers.reduce(function (merged, current) {
- var existing = merged[current.name];
- merged[current.name] = existing ? Object.assign({}, existing, current, {
- options: Object.assign({}, existing.options, current.options),
- data: Object.assign({}, existing.data, current.data)
- }) : current;
- return merged;
- }, {}); // IE11 does not support Object.values
- return Object.keys(merged).map(function (key) {
- return merged[key];
- });
- }
- var DEFAULT_OPTIONS = {
- placement: 'bottom',
- modifiers: [],
- strategy: 'absolute'
- };
- function areValidElements() {
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
- args[_key] = arguments[_key];
- }
- return !args.some(function (element) {
- return !(element && typeof element.getBoundingClientRect === 'function');
- });
- }
- function popperGenerator(generatorOptions) {
- if (generatorOptions === void 0) {
- generatorOptions = {};
- }
- var _generatorOptions = generatorOptions,
- _generatorOptions$def = _generatorOptions.defaultModifiers,
- defaultModifiers = _generatorOptions$def === void 0 ? [] : _generatorOptions$def,
- _generatorOptions$def2 = _generatorOptions.defaultOptions,
- defaultOptions = _generatorOptions$def2 === void 0 ? DEFAULT_OPTIONS : _generatorOptions$def2;
- return function createPopper(reference, popper, options) {
- if (options === void 0) {
- options = defaultOptions;
- }
- var state = {
- placement: 'bottom',
- orderedModifiers: [],
- options: Object.assign({}, DEFAULT_OPTIONS, defaultOptions),
- modifiersData: {},
- elements: {
- reference: reference,
- popper: popper
- },
- attributes: {},
- styles: {}
- };
- var effectCleanupFns = [];
- var isDestroyed = false;
- var instance = {
- state: state,
- setOptions: function setOptions(setOptionsAction) {
- var options = typeof setOptionsAction === 'function' ? setOptionsAction(state.options) : setOptionsAction;
- cleanupModifierEffects();
- state.options = Object.assign({}, defaultOptions, state.options, options);
- state.scrollParents = {
- reference: isElement(reference) ? listScrollParents(reference) : reference.contextElement ? listScrollParents(reference.contextElement) : [],
- popper: listScrollParents(popper)
- }; // Orders the modifiers based on their dependencies and `phase`
- // properties
- var orderedModifiers = orderModifiers(mergeByName([].concat(defaultModifiers, state.options.modifiers))); // Strip out disabled modifiers
- state.orderedModifiers = orderedModifiers.filter(function (m) {
- return m.enabled;
- }); // Validate the provided modifiers so that the consumer will get warned
- runModifierEffects();
- return instance.update();
- },
- // Sync update – it will always be executed, even if not necessary. This
- // is useful for low frequency updates where sync behavior simplifies the
- // logic.
- // For high frequency updates (e.g. `resize` and `scroll` events), always
- // prefer the async Popper#update method
- forceUpdate: function forceUpdate() {
- if (isDestroyed) {
- return;
- }
- var _state$elements = state.elements,
- reference = _state$elements.reference,
- popper = _state$elements.popper; // Don't proceed if `reference` or `popper` are not valid elements
- // anymore
- if (!areValidElements(reference, popper)) {
- return;
- } // Store the reference and popper rects to be read by modifiers
- state.rects = {
- reference: getCompositeRect(reference, getOffsetParent(popper), state.options.strategy === 'fixed'),
- popper: getLayoutRect(popper)
- }; // Modifiers have the ability to reset the current update cycle. The
- // most common use case for this is the `flip` modifier changing the
- // placement, which then needs to re-run all the modifiers, because the
- // logic was previously ran for the previous placement and is therefore
- // stale/incorrect
- state.reset = false;
- state.placement = state.options.placement; // On each update cycle, the `modifiersData` property for each modifier
- // is filled with the initial data specified by the modifier. This means
- // it doesn't persist and is fresh on each update.
- // To ensure persistent data, use `${name}#persistent`
- state.orderedModifiers.forEach(function (modifier) {
- return state.modifiersData[modifier.name] = Object.assign({}, modifier.data);
- });
- for (var index = 0; index < state.orderedModifiers.length; index++) {
- if (state.reset === true) {
- state.reset = false;
- index = -1;
- continue;
- }
- var _state$orderedModifie = state.orderedModifiers[index],
- fn = _state$orderedModifie.fn,
- _state$orderedModifie2 = _state$orderedModifie.options,
- _options = _state$orderedModifie2 === void 0 ? {} : _state$orderedModifie2,
- name = _state$orderedModifie.name;
- if (typeof fn === 'function') {
- state = fn({
- state: state,
- options: _options,
- name: name,
- instance: instance
- }) || state;
- }
- }
- },
- // Async and optimistically optimized update – it will not be executed if
- // not necessary (debounced to run at most once-per-tick)
- update: debounce(function () {
- return new Promise(function (resolve) {
- instance.forceUpdate();
- resolve(state);
- });
- }),
- destroy: function destroy() {
- cleanupModifierEffects();
- isDestroyed = true;
- }
- };
- if (!areValidElements(reference, popper)) {
- return instance;
- }
- instance.setOptions(options).then(function (state) {
- if (!isDestroyed && options.onFirstUpdate) {
- options.onFirstUpdate(state);
- }
- }); // Modifiers have the ability to execute arbitrary code before the first
- // update cycle runs. They will be executed in the same order as the update
- // cycle. This is useful when a modifier adds some persistent data that
- // other modifiers need to use, but the modifier is run after the dependent
- // one.
- function runModifierEffects() {
- state.orderedModifiers.forEach(function (_ref3) {
- var name = _ref3.name,
- _ref3$options = _ref3.options,
- options = _ref3$options === void 0 ? {} : _ref3$options,
- effect = _ref3.effect;
- if (typeof effect === 'function') {
- var cleanupFn = effect({
- state: state,
- name: name,
- instance: instance,
- options: options
- });
- var noopFn = function noopFn() {};
- effectCleanupFns.push(cleanupFn || noopFn);
- }
- });
- }
- function cleanupModifierEffects() {
- effectCleanupFns.forEach(function (fn) {
- return fn();
- });
- effectCleanupFns = [];
- }
- return instance;
- };
- }
- var defaultModifiers = [eventListeners, popperOffsets$1, computeStyles$1, applyStyles$1, offset$1, flip$1, preventOverflow$1, arrow$1, hide$1];
- var createPopper$1 = /*#__PURE__*/popperGenerator({
- defaultModifiers: defaultModifiers
- }); // eslint-disable-next-line import/no-unused-modules
- const popperComputedPlacements = [
- "top",
- "bottom",
- "right",
- "left",
- "top-start",
- "top-end",
- "bottom-start",
- "bottom-end",
- "right-start",
- "right-end",
- "left-start",
- "left-end"
- ];
- const defaultMenuPlacement = "bottom-leading";
- const popperMenuComputedPlacements = [
- "top-start",
- "top",
- "top-end",
- "bottom-start",
- "bottom",
- "bottom-end"
- ];
- const CSS$D = {
- animation: "calcite-popper-anim",
- animationActive: "calcite-popper-anim--active"
- };
- function filterComputedPlacements(placements, el) {
- const filteredPlacements = placements.filter((placement) => popperComputedPlacements.includes(placement));
- if (filteredPlacements.length !== placements.length) {
- console.warn(`${el.tagName}: Invalid value found in: flipPlacements. Try any of these: ${popperComputedPlacements
- .map((placement) => `"${placement}"`)
- .join(", ")
- .trim()}`, { el });
- }
- return filteredPlacements;
- }
- function getPlacement(el, placement) {
- const placements = ["left", "right"];
- const variations = ["start", "end"];
- if (getElementDir(el) === "rtl") {
- placements.reverse();
- variations.reverse();
- }
- return placement
- .replace(/-leading/gi, `-${variations[0]}`)
- .replace(/-trailing/gi, `-${variations[1]}`)
- .replace(/leading/gi, placements[0])
- .replace(/trailing/gi, placements[1]);
- }
- function createPopper({ referenceEl, el, placement, overlayPositioning = "absolute", modifiers }) {
- if (!referenceEl) {
- return null;
- }
- return createPopper$1(referenceEl, el, {
- strategy: overlayPositioning,
- placement: getPlacement(el, placement),
- modifiers
- });
- }
- async function updatePopper({ el, modifiers, placement: PopperPlacement, popper }) {
- const placement = getPlacement(el, PopperPlacement);
- await popper.setOptions({
- modifiers,
- placement
- });
- }
- function hypotenuse(sideA, sideB) {
- return Math.sqrt(Math.pow(sideA, 2) + Math.pow(sideB, 2));
- }
- const visiblePointerSize = 4;
- const defaultOffsetDistance = Math.ceil(hypotenuse(visiblePointerSize, visiblePointerSize));
- const ComboboxItem$1 = "CALCITE-COMBOBOX-ITEM";
- const ComboboxItemGroup$1 = "CALCITE-COMBOBOX-ITEM-GROUP";
- const ComboboxChildSelector = `${ComboboxItem$1}, ${ComboboxItemGroup$1}`;
- const TEXT$g = {
- removeTag: "Remove tag"
- };
- function getAncestors(element) {
- var _a, _b;
- const parent = (_a = element.parentElement) === null || _a === void 0 ? void 0 : _a.closest(ComboboxChildSelector);
- const grandparent = (_b = parent === null || parent === void 0 ? void 0 : parent.parentElement) === null || _b === void 0 ? void 0 : _b.closest(ComboboxChildSelector);
- return [parent, grandparent].filter((el) => el);
- }
- function getItemAncestors(item) {
- var _a;
- return (((_a = item.ancestors) === null || _a === void 0 ? void 0 : _a.filter((el) => el.nodeName === "CALCITE-COMBOBOX-ITEM")) || []);
- }
- function getItemChildren(item) {
- return nodeListToArray(item.querySelectorAll("calcite-combobox-item"));
- }
- function hasActiveChildren(node) {
- const items = nodeListToArray(node.querySelectorAll("calcite-combobox-item"));
- return items.filter((item) => item.selected).length > 0;
- }
- function getDepth(element) {
- {
- return 0;
- }
- }
- const comboboxCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-combobox:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-combobox{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-combobox{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-combobox{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-combobox{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-combobox{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-combobox:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-combobox-h{display:none}/*!@:host*/.sc-calcite-combobox-h{position:relative;display:block}/*!@:host([disabled])*/[disabled].sc-calcite-combobox-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-combobox-h[disabled] .sc-calcite-combobox-s>[calcite-hydrated][disabled],[disabled].sc-calcite-combobox-h [calcite-hydrated][disabled].sc-calcite-combobox{opacity:1}/*!@:host([scale=s])*/[scale=s].sc-calcite-combobox-h{font-size:var(--calcite-font-size--2);--calcite-combobox-item-spacing-unit-l:0.5rem;--calcite-combobox-item-spacing-unit-s:0.25rem;--calcite-combobox-input-height:1.5rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-combobox-h{font-size:var(--calcite-font-size--1);--calcite-combobox-item-spacing-unit-l:0.75rem;--calcite-combobox-item-spacing-unit-s:0.5rem;--calcite-combobox-input-height:2rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-combobox-h{font-size:var(--calcite-font-size-0);--calcite-combobox-item-spacing-unit-l:1rem;--calcite-combobox-item-spacing-unit-s:0.75rem;--calcite-combobox-input-height:2.75rem}/*!@.wrapper*/.wrapper.sc-calcite-combobox{display:-ms-flexbox;display:flex;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-1);outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-border-input);box-shadow:inset 0 0 0 1px var(--calcite-ui-border-input);padding:calc(var(--calcite-combobox-item-spacing-unit-s) / 4) var(--calcite-combobox-item-spacing-unit-l)}/*!@:host(:focus-within) .wrapper, .wrapper--active*/.sc-calcite-combobox-h:focus-within .wrapper.sc-calcite-combobox,.wrapper--active.sc-calcite-combobox{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@.wrapper--single*/.wrapper--single.sc-calcite-combobox{padding:0 var(--calcite-combobox-item-spacing-unit-l);cursor:pointer;-ms-flex-wrap:nowrap;flex-wrap:nowrap}/*!@.grid-input*/.grid-input.sc-calcite-combobox{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:center;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0px}/*!@.input*/.input.sc-calcite-combobox{-ms-flex-positive:1;flex-grow:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-style:none;background-color:transparent;padding:0px;font-family:inherit;color:var(--calcite-ui-text-1);font-size:inherit;height:var(--calcite-combobox-input-height);line-height:var(--calcite-combobox-input-height);min-width:120px;margin-bottom:var(--calcite-combobox-item-spacing-unit-s)}/*!@.input:focus*/.input.sc-calcite-combobox:focus{outline:2px solid transparent;outline-offset:2px}/*!@.input--transparent*/.input--transparent.sc-calcite-combobox{opacity:0}/*!@.input--single*/.input--single.sc-calcite-combobox{margin-bottom:0px;margin-top:0px;padding:0px}/*!@.wrapper--active .input-single*/.wrapper--active.sc-calcite-combobox .input-single.sc-calcite-combobox{cursor:text}/*!@.input--hidden*/.input--hidden.sc-calcite-combobox{pointer-events:none;width:0px;min-width:0px;opacity:0}/*!@.input--icon*/.input--icon.sc-calcite-combobox{padding:0 var(--calcite-combobox-item-spacing-unit-l)}/*!@.input-wrap*/.input-wrap.sc-calcite-combobox{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1}/*!@.input-wrap--single*/.input-wrap--single.sc-calcite-combobox{-ms-flex:1 1 0%;flex:1 1 0%;overflow:hidden}/*!@.label*/.label.sc-calcite-combobox{pointer-events:none;display:-ms-flexbox;display:flex;max-width:100%;-ms-flex:1 1 auto;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0px;font-weight:var(--calcite-font-weight-normal);height:var(--calcite-combobox-input-height);line-height:var(--calcite-combobox-input-height)}/*!@.label--spaced*/.label--spaced.sc-calcite-combobox{padding-top:0px;padding-bottom:0px;padding-left:var(--calcite-combobox-item-spacing-unit-l);padding-right:var(--calcite-combobox-item-spacing-unit-l)}/*!@.icon-end, .icon-start*/.icon-end.sc-calcite-combobox,.icon-start.sc-calcite-combobox{display:-ms-flexbox;display:flex;width:1rem;cursor:pointer;-ms-flex-align:center;align-items:center}/*!@.icon-end*/.icon-end.sc-calcite-combobox{-ms-flex:none;flex:none}/*!@.popper-container*/.popper-container.sc-calcite-combobox{width:100%;display:block;position:absolute;z-index:900;-webkit-transform:scale(0);transform:scale(0);visibility:hidden;pointer-events:none}/*!@.popper-container .calcite-popper-anim*/.popper-container.sc-calcite-combobox .calcite-popper-anim.sc-calcite-combobox{position:relative;z-index:1;-webkit-transition:var(--calcite-popper-transition);transition:var(--calcite-popper-transition);visibility:hidden;-webkit-transition-property:visibility, opacity, -webkit-transform;transition-property:visibility, opacity, -webkit-transform;transition-property:transform, visibility, opacity;transition-property:transform, visibility, opacity, -webkit-transform;opacity:0;-webkit-box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);border-radius:0.25rem}/*!@.popper-container[data-popper-placement^=bottom] .calcite-popper-anim*/.popper-container[data-popper-placement^=bottom].sc-calcite-combobox .calcite-popper-anim.sc-calcite-combobox{-webkit-transform:translateY(-5px);transform:translateY(-5px)}/*!@.popper-container[data-popper-placement^=top] .calcite-popper-anim*/.popper-container[data-popper-placement^=top].sc-calcite-combobox .calcite-popper-anim.sc-calcite-combobox{-webkit-transform:translateY(5px);transform:translateY(5px)}/*!@.popper-container[data-popper-placement^=left] .calcite-popper-anim*/.popper-container[data-popper-placement^=left].sc-calcite-combobox .calcite-popper-anim.sc-calcite-combobox{-webkit-transform:translateX(5px);transform:translateX(5px)}/*!@.popper-container[data-popper-placement^=right] .calcite-popper-anim*/.popper-container[data-popper-placement^=right].sc-calcite-combobox .calcite-popper-anim.sc-calcite-combobox{-webkit-transform:translateX(-5px);transform:translateX(-5px)}/*!@.popper-container[data-popper-placement] .calcite-popper-anim--active*/.popper-container[data-popper-placement].sc-calcite-combobox .calcite-popper-anim--active.sc-calcite-combobox{opacity:1;visibility:visible;-webkit-transform:translate(0);transform:translate(0)}/*!@.popper-container--active*/.popper-container--active.sc-calcite-combobox{pointer-events:initial;visibility:visible}/*!@.screen-readers-only*/.screen-readers-only.sc-calcite-combobox{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}/*!@.list-container*/.list-container.sc-calcite-combobox{max-height:100vh;overflow-y:auto;background-color:var(--calcite-ui-foreground-1);width:var(--calcite-dropdown-width)}/*!@.list*/.list.sc-calcite-combobox{margin:0px;display:block;padding:0px}/*!@.list--hide*/.list--hide.sc-calcite-combobox{height:0px;overflow:hidden}/*!@.chip*/.chip.sc-calcite-combobox{margin-block:calc(var(--calcite-combobox-item-spacing-unit-s) / 4);margin-inline:0 var(--calcite-combobox-item-spacing-unit-s);max-width:100%}/*!@.chip--active*/.chip--active.sc-calcite-combobox{background-color:var(--calcite-ui-foreground-3)}/*!@.item*/.item.sc-calcite-combobox{display:block}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-combobox-s>input[slot=hidden-form-input]{bottom:0 !important;left:0 !important;margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;right:0 !important;top:0 !important;-webkit-transform:none !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}";
- const isGroup = (el) => el.tagName === ComboboxItemGroup$1;
- const itemUidPrefix = "combobox-item-";
- const chipUidPrefix = "combobox-chip-";
- const labelUidPrefix = "combobox-label-";
- const listboxUidPrefix = "combobox-listbox-";
- const inputUidPrefix = "combobox-input-";
- /**
- * @slot - A slot for adding `calcite-combobox-item`s.
- */
- class Combobox {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteLookupChange = createEvent(this, "calciteLookupChange", 7);
- this.calciteComboboxChange = createEvent(this, "calciteComboboxChange", 7);
- this.calciteComboboxFilterChange = createEvent(this, "calciteComboboxFilterChange", 7);
- this.calciteComboboxChipDismiss = createEvent(this, "calciteComboboxChipDismiss", 7);
- this.calciteComboboxOpen = createEvent(this, "calciteComboboxOpen", 7);
- this.calciteComboboxClose = createEvent(this, "calciteComboboxClose", 7);
- //--------------------------------------------------------------------------
- //
- // Public Properties
- //
- //--------------------------------------------------------------------------
- /** Opens or closes the combobox */
- this.active = false;
- /** Disable combobox input */
- this.disabled = false;
- /** Specify the maximum number of combobox items (including nested children) to display before showing the scroller */
- this.maxItems = 0;
- /** Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value. */
- this.overlayPositioning = "absolute";
- /**
- * When true, makes the component required for form-submission.
- *
- * @internal
- */
- this.required = false;
- /** specify the selection mode
- * - multi: allow any number of selected items (default)
- * - single: only one selection)
- * - ancestors: like multi, but show ancestors of selected items as selected, only deepest children shown in chips
- */
- this.selectionMode = "multi";
- /** Specify the scale of the combobox, defaults to m */
- this.scale = "m";
- /** The value(s) of the selectedItem(s) */
- this.value = null;
- /** string to override the English "Remove tag" text for when an item is selected.
- * @default "Remove tag"
- */
- this.intlRemoveTag = TEXT$g.removeTag;
- this.internalValueChangeFlag = false;
- this.items = [];
- this.groupItems = [];
- this.selectedItems = [];
- this.visibleItems = [];
- this.activeItemIndex = -1;
- this.activeChipIndex = -1;
- this.activeDescendant = "";
- this.text = "";
- this.textInput = null;
- this.mutationObserver = createObserver();
- this.resizeObserver = createObserver();
- this.guid = guid();
- this.inputHeight = 0;
- this.ignoreSelectedEventsFlag = false;
- this.activeTransitionProp = "opacity";
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.setFilteredPlacements = () => {
- const { el, flipPlacements } = this;
- this.filteredFlipPlacements = flipPlacements
- ? filterComputedPlacements(flipPlacements, el)
- : null;
- };
- this.getValue = () => {
- const items = this.selectedItems.map((item) => { var _a; return (_a = item === null || item === void 0 ? void 0 : item.value) === null || _a === void 0 ? void 0 : _a.toString(); });
- return (items === null || items === void 0 ? void 0 : items.length) ? (items.length > 1 ? items : items[0]) : "";
- };
- this.onLabelClick = () => {
- this.setFocus();
- };
- this.keydownHandler = (event) => {
- const { key } = event;
- switch (key) {
- case "Tab":
- this.activeChipIndex = -1;
- this.activeItemIndex = -1;
- if (this.allowCustomValues && this.text) {
- this.addCustomChip(this.text, true);
- event.preventDefault();
- }
- else if (this.active) {
- this.active = false;
- event.preventDefault();
- }
- break;
- case "ArrowLeft":
- this.previousChip();
- break;
- case "ArrowRight":
- this.nextChip();
- break;
- case "ArrowUp":
- this.shiftActiveItemIndex(-1);
- if (!this.comboboxInViewport()) {
- this.el.scrollIntoView();
- }
- break;
- case "ArrowDown":
- if (!this.active) {
- event.preventDefault();
- this.active = true;
- }
- this.shiftActiveItemIndex(1);
- if (!this.comboboxInViewport()) {
- this.el.scrollIntoView();
- }
- break;
- case " ":
- if (!this.textInput.value) {
- event.preventDefault();
- this.active = true;
- this.shiftActiveItemIndex(1);
- }
- break;
- case "Home":
- if (this.active) {
- event.preventDefault();
- }
- this.updateActiveItemIndex(0);
- this.scrollToActiveItem();
- if (!this.comboboxInViewport()) {
- this.el.scrollIntoView();
- }
- break;
- case "End":
- if (this.active) {
- event.preventDefault();
- }
- this.updateActiveItemIndex(this.visibleItems.length - 1);
- this.scrollToActiveItem();
- if (!this.comboboxInViewport()) {
- this.el.scrollIntoView();
- }
- break;
- case "Escape":
- this.active = false;
- break;
- case "Enter":
- if (this.activeItemIndex > -1) {
- this.toggleSelection(this.visibleItems[this.activeItemIndex]);
- }
- else if (this.activeChipIndex > -1) {
- this.removeActiveChip();
- }
- else if (this.allowCustomValues && this.text) {
- this.addCustomChip(this.text, true);
- }
- else if (!event.defaultPrevented) {
- submitForm(this);
- }
- break;
- case "Delete":
- case "Backspace":
- if (this.activeChipIndex > -1) {
- this.removeActiveChip();
- }
- else if (!this.text && this.isMulti()) {
- this.removeLastChip();
- }
- break;
- }
- };
- this.toggleCloseEnd = () => {
- this.active = false;
- this.el.removeEventListener("calciteComboboxClose", this.toggleCloseEnd);
- };
- this.toggleOpenEnd = () => {
- this.active = true;
- this.el.removeEventListener("calciteComboboxOpen", this.toggleOpenEnd);
- };
- this.transitionEnd = (event) => {
- if (event.propertyName === this.activeTransitionProp) {
- this.active ? this.calciteComboboxOpen.emit() : this.calciteComboboxClose.emit();
- }
- };
- this.setMaxScrollerHeight = () => {
- const { active, listContainerEl } = this;
- if (!listContainerEl || !active) {
- return;
- }
- this.reposition();
- const maxScrollerHeight = this.getMaxScrollerHeight();
- listContainerEl.style.maxHeight = maxScrollerHeight > 0 ? `${maxScrollerHeight}px` : "";
- this.reposition();
- };
- this.calciteChipDismissHandler = (event, comboboxItem) => {
- this.active = false;
- const selection = this.items.find((item) => item === comboboxItem);
- if (selection) {
- this.toggleSelection(selection, false);
- }
- this.calciteComboboxChipDismiss.emit(event.detail);
- };
- this.clickHandler = (event) => {
- if (event.composedPath().some((node) => node.tagName === "CALCITE-CHIP")) {
- return;
- }
- this.active = !this.active;
- this.updateActiveItemIndex(0);
- this.setFocus();
- };
- this.setInactiveIfNotContained = (event) => {
- const composedPath = event.composedPath();
- if (!this.active || composedPath.includes(this.el) || composedPath.includes(this.referenceEl)) {
- return;
- }
- if (this.allowCustomValues && this.text.trim().length) {
- this.addCustomChip(this.text);
- }
- if (this.selectionMode === "single") {
- if (this.textInput) {
- this.textInput.value = "";
- }
- this.text = "";
- this.filterItems("");
- this.updateActiveItemIndex(-1);
- }
- this.active = false;
- };
- this.setMenuEl = (el) => {
- this.menuEl = el;
- };
- this.setListContainerEl = (el) => {
- this.resizeObserver.observe(el);
- this.listContainerEl = el;
- };
- this.setReferenceEl = (el) => {
- this.referenceEl = el;
- };
- this.inputHandler = (event) => {
- const value = event.target.value;
- this.text = value;
- this.filterItems(value);
- if (value) {
- this.activeChipIndex = -1;
- }
- };
- this.filterItems = (() => {
- const find = (item, filteredData) => item &&
- filteredData.some(({ label, value }) => {
- if (isGroup(item)) {
- return value === item.label;
- }
- return (value === item.textLabel ||
- value === item.value ||
- label === item.textLabel ||
- label === item.value);
- });
- return debounce$1((text) => {
- const filteredData = filter(this.data, text);
- const items = this.getCombinedItems();
- items.forEach((item) => {
- const hidden = !find(item, filteredData);
- item.hidden = hidden;
- const [parent, grandparent] = item.ancestors;
- if (find(parent, filteredData) || find(grandparent, filteredData)) {
- item.hidden = false;
- }
- if (!hidden) {
- item.ancestors.forEach((ancestor) => (ancestor.hidden = false));
- }
- });
- this.visibleItems = this.getVisibleItems();
- this.calciteComboboxFilterChange.emit({ visibleItems: [...this.visibleItems], text: text });
- }, 100);
- })();
- this.internalCalciteLookupChangeEvent = () => {
- this.calciteLookupChange.emit(this.selectedItems);
- };
- this.emitCalciteLookupChange = debounce$1(this.internalCalciteLookupChangeEvent, 0);
- this.internalComboboxChangeEvent = () => {
- const { selectedItems } = this;
- this.calciteComboboxChange.emit({ selectedItems });
- };
- this.emitComboboxChange = debounce$1(this.internalComboboxChangeEvent, 0);
- this.updateItems = () => {
- this.items = this.getItems();
- this.groupItems = this.getGroupItems();
- this.data = this.getData();
- this.selectedItems = this.getSelectedItems();
- this.visibleItems = this.getVisibleItems();
- this.needsIcon = this.getNeedsIcon();
- if (!this.allowCustomValues) {
- this.setMaxScrollerHeight();
- }
- };
- this.scrollToActiveItem = () => {
- const activeItem = this.visibleItems[this.activeItemIndex];
- const height = this.calculateSingleItemHeight(activeItem);
- const { offsetHeight, scrollTop } = this.listContainerEl;
- if (offsetHeight + scrollTop < activeItem.offsetTop + height) {
- this.listContainerEl.scrollTop = activeItem.offsetTop - offsetHeight + height;
- }
- else if (activeItem.offsetTop < scrollTop) {
- this.listContainerEl.scrollTop = activeItem.offsetTop;
- }
- };
- this.comboboxFocusHandler = () => {
- var _a;
- (_a = this.textInput) === null || _a === void 0 ? void 0 : _a.focus();
- };
- this.comboboxBlurHandler = (event) => {
- this.setInactiveIfNotContained(event);
- };
- }
- activeHandler() {
- if (this.disabled) {
- this.active = false;
- return;
- }
- this.reposition();
- }
- handleDisabledChange(value) {
- if (!value) {
- this.active = false;
- }
- }
- maxItemsHandler() {
- this.setMaxScrollerHeight();
- }
- valueHandler(value) {
- if (!this.internalValueChangeFlag) {
- const items = this.getItems();
- if (Array.isArray(value)) {
- items.forEach((item) => (item.selected = value.includes(item.value)));
- }
- else if (value) {
- items.forEach((item) => (item.selected = value === item.value));
- }
- else {
- items.forEach((item) => (item.selected = false));
- }
- this.updateItems();
- }
- }
- flipPlacementsHandler() {
- this.setFilteredPlacements();
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- documentClickHandler(event) {
- this.setInactiveIfNotContained(event);
- }
- calciteComboboxItemChangeHandler(event) {
- if (this.ignoreSelectedEventsFlag) {
- return;
- }
- const target = event.target;
- const newIndex = this.visibleItems.indexOf(target);
- this.updateActiveItemIndex(newIndex);
- this.toggleSelection(target, target.selected);
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Updates the position of the component. */
- async reposition() {
- const { popper, menuEl } = this;
- const modifiers = this.getModifiers();
- popper
- ? await updatePopper({
- el: menuEl,
- modifiers,
- placement: defaultMenuPlacement,
- popper
- })
- : this.createPopper();
- }
- /** Sets focus on the component. */
- async setFocus() {
- var _a;
- (_a = this.textInput) === null || _a === void 0 ? void 0 : _a.focus();
- this.activeChipIndex = -1;
- this.activeItemIndex = -1;
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- var _a;
- this.internalValueChangeFlag = true;
- this.value = this.getValue();
- this.internalValueChangeFlag = false;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });
- this.createPopper();
- connectLabel(this);
- connectForm(this);
- this.setFilteredPlacements();
- }
- componentWillLoad() {
- this.updateItems();
- }
- componentDidLoad() {
- afterConnectDefaultValueSet(this, this.getValue());
- }
- componentDidRender() {
- if (this.el.offsetHeight !== this.inputHeight) {
- this.reposition();
- this.inputHeight = this.el.offsetHeight;
- }
- updateHostInteraction(this);
- }
- disconnectedCallback() {
- var _a, _b;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- (_b = this.resizeObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
- this.destroyPopper();
- disconnectLabel(this);
- disconnectForm(this);
- }
- selectedItemsHandler() {
- this.internalValueChangeFlag = true;
- this.value = this.getValue();
- this.internalValueChangeFlag = false;
- }
- /** when search text is cleared, reset active to */
- textHandler() {
- this.updateActiveItemIndex(-1);
- }
- comboboxInViewport() {
- const bounding = this.el.getBoundingClientRect();
- return (bounding.top >= 0 &&
- bounding.left >= 0 &&
- bounding.right <= (window.innerWidth || document.documentElement.clientWidth) &&
- bounding.bottom <= (window.innerHeight || document.documentElement.clientHeight));
- }
- getModifiers() {
- const flipModifier = {
- name: "flip",
- enabled: true
- };
- flipModifier.options = {
- fallbackPlacements: this.filteredFlipPlacements || popperMenuComputedPlacements
- };
- const eventListenerModifier = {
- name: "eventListeners",
- enabled: this.active
- };
- return [flipModifier, eventListenerModifier];
- }
- createPopper() {
- this.destroyPopper();
- const { menuEl, referenceEl, overlayPositioning } = this;
- const modifiers = this.getModifiers();
- this.popper = createPopper({
- el: menuEl,
- modifiers,
- overlayPositioning,
- placement: defaultMenuPlacement,
- referenceEl
- });
- }
- destroyPopper() {
- const { popper } = this;
- if (popper) {
- popper.destroy();
- }
- this.popper = null;
- }
- getMaxScrollerHeight() {
- const items = this.getCombinedItems().filter((item) => !item.hidden);
- const { maxItems } = this;
- let itemsToProcess = 0;
- let maxScrollerHeight = 0;
- if (items.length > maxItems) {
- items.forEach((item) => {
- if (itemsToProcess < maxItems && maxItems > 0) {
- const height = this.calculateSingleItemHeight(item);
- if (height > 0) {
- maxScrollerHeight += height;
- itemsToProcess++;
- }
- }
- });
- }
- return maxScrollerHeight;
- }
- calculateSingleItemHeight(item) {
- let height = item.offsetHeight;
- // if item has children items, don't count their height twice
- const children = Array.from(item.querySelectorAll(ComboboxChildSelector));
- children
- .map((child) => child === null || child === void 0 ? void 0 : child.offsetHeight)
- .forEach((offsetHeight) => {
- height -= offsetHeight;
- });
- return height;
- }
- getCombinedItems() {
- return [...this.groupItems, ...this.items];
- }
- toggleSelection(item, value = !item.selected) {
- if (!item) {
- return;
- }
- if (this.isMulti()) {
- item.selected = value;
- this.updateAncestors(item);
- this.selectedItems = this.getSelectedItems();
- this.emitCalciteLookupChange();
- this.emitComboboxChange();
- this.resetText();
- this.filterItems("");
- }
- else {
- this.ignoreSelectedEventsFlag = true;
- this.items.forEach((el) => (el.selected = el === item ? value : false));
- this.ignoreSelectedEventsFlag = false;
- this.selectedItems = this.getSelectedItems();
- this.emitComboboxChange();
- if (this.textInput) {
- this.textInput.value = item.textLabel;
- }
- this.active = false;
- this.updateActiveItemIndex(-1);
- this.resetText();
- this.filterItems("");
- }
- }
- updateAncestors(item) {
- if (this.selectionMode !== "ancestors") {
- return;
- }
- const ancestors = getItemAncestors(item);
- const children = getItemChildren(item);
- if (item.selected) {
- ancestors.forEach((el) => {
- el.selected = true;
- });
- }
- else {
- children.forEach((el) => (el.selected = false));
- [...ancestors].forEach((el) => {
- if (!hasActiveChildren(el)) {
- el.selected = false;
- }
- });
- }
- }
- getVisibleItems() {
- return this.items.filter((item) => !item.hidden);
- }
- getSelectedItems() {
- if (!this.isMulti()) {
- const match = this.items.find(({ selected }) => selected);
- return match ? [match] : [];
- }
- return (this.items
- .filter((item) => item.selected && (this.selectionMode !== "ancestors" || !hasActiveChildren(item)))
- /** Preserve order of entered tags */
- .sort((a, b) => {
- const aIdx = this.selectedItems.indexOf(a);
- const bIdx = this.selectedItems.indexOf(b);
- if (aIdx > -1 && bIdx > -1) {
- return aIdx - bIdx;
- }
- return bIdx - aIdx;
- }));
- }
- getData() {
- return this.items.map((item) => ({
- constant: item.constant,
- value: item.value,
- label: item.textLabel
- }));
- }
- getNeedsIcon() {
- return this.selectionMode === "single" && this.items.some((item) => item.icon);
- }
- resetText() {
- if (this.textInput) {
- this.textInput.value = "";
- }
- this.text = "";
- }
- getItems() {
- const items = Array.from(this.el.querySelectorAll(ComboboxItem$1));
- return items.filter((item) => !item.disabled);
- }
- getGroupItems() {
- return Array.from(this.el.querySelectorAll(ComboboxItemGroup$1));
- }
- addCustomChip(value, focus) {
- const existingItem = this.items.find((el) => el.textLabel === value);
- if (existingItem) {
- this.toggleSelection(existingItem, true);
- }
- else {
- if (!this.isMulti()) {
- this.toggleSelection(this.selectedItems[this.selectedItems.length - 1], false);
- }
- const item = document.createElement(ComboboxItem$1);
- item.value = value;
- item.textLabel = value;
- item.selected = true;
- this.el.appendChild(item);
- this.resetText();
- if (focus) {
- this.setFocus();
- }
- this.updateItems();
- this.filterItems("");
- this.emitCalciteLookupChange();
- this.emitComboboxChange();
- }
- }
- removeActiveChip() {
- this.toggleSelection(this.selectedItems[this.activeChipIndex], false);
- this.setFocus();
- }
- removeLastChip() {
- this.toggleSelection(this.selectedItems[this.selectedItems.length - 1], false);
- this.setFocus();
- }
- previousChip() {
- if (this.text) {
- return;
- }
- const length = this.selectedItems.length - 1;
- const active = this.activeChipIndex;
- this.activeChipIndex = active === -1 ? length : Math.max(active - 1, 0);
- this.updateActiveItemIndex(-1);
- this.focusChip();
- }
- nextChip() {
- if (this.text || this.activeChipIndex === -1) {
- return;
- }
- const last = this.selectedItems.length - 1;
- const newIndex = this.activeChipIndex + 1;
- if (newIndex > last) {
- this.activeChipIndex = -1;
- this.setFocus();
- }
- else {
- this.activeChipIndex = newIndex;
- this.focusChip();
- }
- this.updateActiveItemIndex(-1);
- }
- focusChip() {
- var _a;
- const guid = (_a = this.selectedItems[this.activeChipIndex]) === null || _a === void 0 ? void 0 : _a.guid;
- const chip = guid
- ? this.referenceEl.querySelector(`#${chipUidPrefix}${guid}`)
- : null;
- chip === null || chip === void 0 ? void 0 : chip.setFocus();
- }
- shiftActiveItemIndex(delta) {
- const { length } = this.visibleItems;
- const newIndex = (this.activeItemIndex + length + delta) % length;
- this.updateActiveItemIndex(newIndex);
- this.scrollToActiveItem();
- }
- updateActiveItemIndex(index) {
- var _a;
- this.activeItemIndex = index;
- let activeDescendant = null;
- this.visibleItems.forEach((el, i) => {
- if (i === index) {
- el.active = true;
- activeDescendant = el.guid;
- }
- else {
- el.active = false;
- }
- });
- this.activeDescendant = activeDescendant;
- if (this.activeItemIndex > -1) {
- this.activeChipIndex = -1;
- (_a = this.textInput) === null || _a === void 0 ? void 0 : _a.focus();
- }
- }
- isMulti() {
- return this.selectionMode !== "single";
- }
- //--------------------------------------------------------------------------
- //
- // Render Methods
- //
- //--------------------------------------------------------------------------
- renderChips() {
- const { activeChipIndex, scale, selectionMode, intlRemoveTag } = this;
- return this.selectedItems.map((item, i) => {
- const chipClasses = {
- chip: true,
- "chip--active": activeChipIndex === i
- };
- const ancestors = [...getItemAncestors(item)].reverse();
- const pathLabel = [...ancestors, item].map((el) => el.textLabel);
- const label = selectionMode !== "ancestors" ? item.textLabel : pathLabel.join(" / ");
- return (hAsync("calcite-chip", { class: chipClasses, dismissLabel: intlRemoveTag, dismissible: true, icon: item.icon, id: item.guid ? `${chipUidPrefix}${item.guid}` : null, key: item.textLabel, onCalciteChipDismiss: (event) => this.calciteChipDismissHandler(event, item), scale: scale, title: label, value: item.value }, label));
- });
- }
- renderInput() {
- const { guid, active, disabled, placeholder, selectionMode, needsIcon, selectedItems } = this;
- const single = selectionMode === "single";
- const selectedItem = selectedItems[0];
- const showLabel = !active && single && !!selectedItem;
- return (hAsync("span", { class: {
- "input-wrap": true,
- "input-wrap--single": single
- } }, showLabel && (hAsync("span", { class: {
- label: true,
- "label--spaced": needsIcon
- }, key: "label" }, selectedItem.textLabel)), hAsync("input", { "aria-activedescendant": this.activeDescendant, "aria-autocomplete": "list", "aria-controls": `${listboxUidPrefix}${guid}`, "aria-label": getLabelText(this), class: {
- input: true,
- "input--single": true,
- "input--transparent": this.activeChipIndex > -1,
- "input--hidden": showLabel,
- "input--icon": single && needsIcon
- }, disabled: disabled, id: `${inputUidPrefix}${guid}`, key: "input", onBlur: this.comboboxBlurHandler, onFocus: this.comboboxFocusHandler, onInput: this.inputHandler, placeholder: placeholder, ref: (el) => (this.textInput = el), type: "text" })));
- }
- renderListBoxOptions() {
- return this.visibleItems.map((item) => (hAsync("li", { "aria-selected": toAriaBoolean(item.selected), id: item.guid ? `${itemUidPrefix}${item.guid}` : null, role: "option", tabindex: "-1" }, item.textLabel)));
- }
- renderPopperContainer() {
- const { active, setMenuEl, setListContainerEl } = this;
- const classes = {
- "list-container": true,
- [CSS$D.animation]: true,
- [CSS$D.animationActive]: active
- };
- return (hAsync("div", { "aria-hidden": "true", class: { "popper-container": true, "popper-container--active": active }, ref: setMenuEl }, hAsync("div", { class: classes, onTransitionEnd: this.transitionEnd, ref: setListContainerEl }, hAsync("ul", { class: { list: true, "list--hide": !active } }, hAsync("slot", null)))));
- }
- renderIconStart() {
- const { selectionMode, needsIcon, selectedItems } = this;
- const selectedItem = selectedItems[0];
- return (selectionMode === "single" &&
- needsIcon && (hAsync("span", { class: "icon-start" }, (selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.icon) && (hAsync("calcite-icon", { class: "selected-icon", icon: selectedItem.icon, scale: "s" })))));
- }
- renderIconEnd() {
- const { active } = this;
- return (hAsync("span", { class: "icon-end" }, hAsync("calcite-icon", { icon: active ? "chevron-up" : "chevron-down", scale: "s" })));
- }
- render() {
- const { active, guid, label } = this;
- const single = this.selectionMode === "single";
- return (hAsync(Host, { onKeyDown: this.keydownHandler }, hAsync("div", { "aria-autocomplete": "list", "aria-expanded": toAriaBoolean(active), "aria-haspopup": "listbox", "aria-labelledby": `${labelUidPrefix}${guid}`, "aria-owns": `${listboxUidPrefix}${guid}`, class: {
- wrapper: true,
- "wrapper--single": single || !this.selectedItems.length,
- "wrapper--active": active
- }, onClick: this.clickHandler, ref: this.setReferenceEl, role: "combobox" }, hAsync("div", { class: "grid-input" }, this.renderIconStart(), !single && this.renderChips(), hAsync("label", { class: "screen-readers-only", htmlFor: `${inputUidPrefix}${guid}`, id: `${labelUidPrefix}${guid}` }, label), this.renderInput()), this.renderIconEnd()), hAsync("ul", { "aria-labelledby": `${labelUidPrefix}${guid}`, "aria-multiselectable": "true", class: "screen-readers-only", id: `${listboxUidPrefix}${guid}`, role: "listbox", tabIndex: -1 }, this.renderListBoxOptions()), this.renderPopperContainer(), hAsync(HiddenFormInputSlot, { component: this })));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "active": ["activeHandler"],
- "disabled": ["handleDisabledChange"],
- "maxItems": ["maxItemsHandler"],
- "value": ["valueHandler"],
- "flipPlacements": ["flipPlacementsHandler"],
- "selectedItems": ["selectedItemsHandler"],
- "text": ["textHandler"]
- }; }
- static get style() { return comboboxCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-combobox",
- "$members$": {
- "active": [1540],
- "disabled": [516],
- "label": [1],
- "placeholder": [1],
- "maxItems": [2, "max-items"],
- "name": [513],
- "allowCustomValues": [4, "allow-custom-values"],
- "overlayPositioning": [1, "overlay-positioning"],
- "required": [4],
- "selectionMode": [513, "selection-mode"],
- "scale": [513],
- "value": [1025],
- "intlRemoveTag": [1, "intl-remove-tag"],
- "flipPlacements": [16],
- "items": [32],
- "groupItems": [32],
- "selectedItems": [32],
- "visibleItems": [32],
- "needsIcon": [32],
- "activeItemIndex": [32],
- "activeChipIndex": [32],
- "activeDescendant": [32],
- "text": [32],
- "reposition": [64],
- "setFocus": [64]
- },
- "$listeners$": [[4, "click", "documentClickHandler"], [0, "calciteComboboxItemChange", "calciteComboboxItemChangeHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["active", "active"], ["disabled", "disabled"], ["name", "name"], ["selectionMode", "selection-mode"], ["scale", "scale"]]
- }; }
- }
- const CSS$C = {
- icon: "icon",
- iconActive: "icon--active",
- custom: "icon--custom",
- dot: "icon--dot",
- single: "label--single",
- label: "label",
- active: "label--active",
- selected: "label--selected",
- title: "title",
- textContainer: "text-container"
- };
- const comboboxItemCss = "@charset \"UTF-8\";@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-combobox-item:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-combobox-item{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-combobox-item{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-combobox-item{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-combobox-item{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-combobox-item{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-combobox-item:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-combobox-item-h{display:none}/*!@.scale--s*/.scale--s.sc-calcite-combobox-item{font-size:var(--calcite-font-size--2);line-height:1rem;--calcite-combobox-item-spacing-unit-l:0.5rem;--calcite-combobox-item-spacing-unit-s:0.25rem;--calcite-combobox-item-spacing-indent:0.5rem}/*!@.scale--m*/.scale--m.sc-calcite-combobox-item{font-size:var(--calcite-font-size--1);line-height:1rem;--calcite-combobox-item-spacing-unit-l:0.75rem;--calcite-combobox-item-spacing-unit-s:0.5rem;--calcite-combobox-item-spacing-indent:0.75rem}/*!@.scale--l*/.scale--l.sc-calcite-combobox-item{font-size:var(--calcite-font-size-0);line-height:1.25rem;--calcite-combobox-item-spacing-unit-l:1rem;--calcite-combobox-item-spacing-unit-s:0.75rem;--calcite-combobox-item-spacing-indent:1rem}/*!@.container*/.container.sc-calcite-combobox-item{--calcite-combobox-item-indent-value:calc(\n var(--calcite-combobox-item-spacing-indent) * var(--calcite-combobox-item-spacing-indent-multiplier)\n )}/*!@:host(:focus)*/.sc-calcite-combobox-item-h:focus{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@:host([disabled])*/[disabled].sc-calcite-combobox-item-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-combobox-item-h[disabled] .sc-calcite-combobox-item-s>[calcite-hydrated][disabled],[disabled].sc-calcite-combobox-item-h [calcite-hydrated][disabled].sc-calcite-combobox-item{opacity:1}/*!@:host, ul*/.sc-calcite-combobox-item-h,ul.sc-calcite-combobox-item{margin:0px;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding:0px;outline:2px solid transparent;outline-offset:2px}/*!@.label*/.label.sc-calcite-combobox-item{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;width:100%;min-width:100%;cursor:pointer;-ms-flex-align:center;align-items:center;color:var(--calcite-ui-text-3);-webkit-text-decoration-line:none;text-decoration-line:none;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;padding:var(--calcite-combobox-item-spacing-unit-s) var(--calcite-combobox-item-spacing-unit-l)}/*!@:host([disabled]) .label*/[disabled].sc-calcite-combobox-item-h .label.sc-calcite-combobox-item{cursor:default}/*!@.label--selected*/.label--selected.sc-calcite-combobox-item{font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1)}/*!@.label--active*/.label--active.sc-calcite-combobox-item{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@.label:hover, .label:active*/.label.sc-calcite-combobox-item:hover,.label.sc-calcite-combobox-item:active{background-color:var(--calcite-ui-foreground-2);color:var(--calcite-ui-text-1);-webkit-text-decoration-line:none;text-decoration-line:none;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@.title*/.title.sc-calcite-combobox-item{padding:0 var(--calcite-combobox-item-spacing-unit-l)}/*!@.icon*/.icon.sc-calcite-combobox-item{display:-ms-inline-flexbox;display:inline-flex;opacity:0;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);color:var(--calcite-ui-border-1)}/*!@.icon--indent*/.icon--indent.sc-calcite-combobox-item{-webkit-padding-start:var(--calcite-combobox-item-indent-value);padding-inline-start:var(--calcite-combobox-item-indent-value)}/*!@.icon--custom*/.icon--custom.sc-calcite-combobox-item{margin-top:-1px;color:var(--calcite-ui-text-3)}/*!@.icon--active*/.icon--active.sc-calcite-combobox-item{color:var(--calcite-ui-text-1)}/*!@.icon--dot*/.icon--dot.sc-calcite-combobox-item{display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:flex-end;min-width:var(--calcite-combobox-item-spacing-unit-l)}/*!@.icon--dot:before*/.icon--dot.sc-calcite-combobox-item:before{text-align:start;content:\"•\"}/*!@.label--active .icon*/.label--active.sc-calcite-combobox-item .icon.sc-calcite-combobox-item{opacity:1}/*!@.label--selected .icon*/.label--selected.sc-calcite-combobox-item .icon.sc-calcite-combobox-item{opacity:1;color:var(--calcite-ui-brand)}/*!@:host(:hover[disabled]) .icon*/.sc-calcite-combobox-item-h:hover[disabled] .icon.sc-calcite-combobox-item{opacity:1}";
- /**
- * @slot - A slot for adding nested `calcite-combobox-item`s.
- */
- class ComboboxItem {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteComboboxItemChange = createEvent(this, "calciteComboboxItemChange", 7);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /** When true, the item cannot be clicked and is visually muted. */
- this.disabled = false;
- /** Set this to true to pre-select an item. Toggles when an item is checked/unchecked. */
- this.selected = false;
- /** True when item is highlighted either from keyboard or mouse hover */
- this.active = false;
- /** Unique identifier, used for accessibility */
- this.guid = guid();
- this.scale = "m";
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.itemClickHandler = (event) => {
- event.preventDefault();
- if (this.disabled) {
- return;
- }
- this.selected = !this.selected;
- };
- }
- selectedWatchHandler() {
- this.calciteComboboxItemChange.emit(this.el);
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- this.ancestors = getAncestors(this.el);
- this.scale = getElementProp(this.el, "scale", this.scale);
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- disconnectConditionalSlotComponent(this);
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- // --------------------------------------------------------------------------
- //
- // Public Methods
- //
- // --------------------------------------------------------------------------
- /**
- * Used to toggle the selection state. By default this won't trigger an event.
- * The first argument allows the value to be coerced, rather than swapping values.
- */
- async toggleSelected(coerce) {
- if (this.disabled) {
- return;
- }
- this.selected = typeof coerce === "boolean" ? coerce : !this.selected;
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- renderIcon(isSingle) {
- const { icon, disabled, selected } = this;
- const level = `${CSS$C.icon}--indent`;
- const defaultIcon = isSingle ? "dot" : "check";
- const iconPath = disabled ? "circle-disallowed" : defaultIcon;
- const showDot = isSingle && !icon && !disabled;
- return showDot ? (hAsync("span", { class: {
- [CSS$C.icon]: true,
- [CSS$C.dot]: true,
- [level]: true
- } })) : (hAsync("calcite-icon", { class: {
- [CSS$C.icon]: !icon,
- [CSS$C.custom]: !!icon,
- [CSS$C.iconActive]: icon && selected,
- [level]: true
- }, icon: icon || iconPath, scale: "s" }));
- }
- renderChildren() {
- if (getSlotted(this.el)) {
- return (hAsync("ul", { key: "default-slot-container" }, hAsync("slot", null)));
- }
- return null;
- }
- render() {
- const isSingleSelect = getElementProp(this.el, "selection-mode", "multi") === "single";
- const classes = {
- [CSS$C.label]: true,
- [CSS$C.selected]: this.selected,
- [CSS$C.active]: this.active,
- [CSS$C.single]: isSingleSelect
- };
- const depth = getDepth();
- return (hAsync(Host, { "aria-hidden": "true" }, hAsync("div", { class: `container scale--${this.scale}`, style: { "--calcite-combobox-item-spacing-indent-multiplier": `${depth}` } }, hAsync("li", { class: classes, id: this.guid, onClick: this.itemClickHandler }, this.renderIcon(isSingleSelect), hAsync("span", { class: CSS$C.title }, this.textLabel)), this.renderChildren())));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "selected": ["selectedWatchHandler"]
- }; }
- static get style() { return comboboxItemCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-combobox-item",
- "$members$": {
- "disabled": [516],
- "selected": [1540],
- "active": [4],
- "ancestors": [1040],
- "guid": [1],
- "icon": [1],
- "textLabel": [513, "text-label"],
- "value": [8],
- "constant": [516],
- "toggleSelected": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"], ["selected", "selected"], ["textLabel", "text-label"], ["constant", "constant"]]
- }; }
- }
- const CSS$B = {
- list: "list",
- label: "label",
- title: "title"
- };
- const comboboxItemGroupCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-combobox-item-group:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-combobox-item-group{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-combobox-item-group{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-combobox-item-group{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-combobox-item-group{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-combobox-item-group{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-combobox-item-group:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-combobox-item-group-h{display:none}/*!@.scale--s*/.scale--s.sc-calcite-combobox-item-group{font-size:var(--calcite-font-size--2);line-height:1rem;--calcite-combobox-item-spacing-unit-l:0.5rem;--calcite-combobox-item-spacing-unit-s:0.25rem;--calcite-combobox-item-spacing-indent-1:0.5rem;--calcite-combobox-item-spacing-indent-2:1rem}/*!@.scale--m*/.scale--m.sc-calcite-combobox-item-group{font-size:var(--calcite-font-size--1);line-height:1rem;--calcite-combobox-item-spacing-unit-l:0.75rem;--calcite-combobox-item-spacing-unit-s:0.5rem;--calcite-combobox-item-spacing-indent-1:0.75rem;--calcite-combobox-item-spacing-indent-2:1.5rem}/*!@.scale--l*/.scale--l.sc-calcite-combobox-item-group{font-size:var(--calcite-font-size-0);line-height:1.25rem;--calcite-combobox-item-spacing-unit-l:1rem;--calcite-combobox-item-spacing-unit-s:0.75rem;--calcite-combobox-item-spacing-indent-1:1rem;--calcite-combobox-item-spacing-indent-2:2rem}/*!@:host, .list*/.sc-calcite-combobox-item-group-h,.list.sc-calcite-combobox-item-group{margin:0px;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding:0px;outline:2px solid transparent;outline-offset:2px}/*!@.label*/.label.sc-calcite-combobox-item-group{-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;width:100%;min-width:0px;max-width:100%;color:var(--calcite-ui-text-3)}/*!@.label--indent-1*/.label--indent-1.sc-calcite-combobox-item-group{-webkit-padding-start:var(--calcite-combobox-item-spacing-indent-1);padding-inline-start:var(--calcite-combobox-item-spacing-indent-1)}/*!@.label--indent-2*/.label--indent-2.sc-calcite-combobox-item-group{-webkit-padding-start:var(--calcite-combobox-item-spacing-indent-2);padding-inline-start:var(--calcite-combobox-item-spacing-indent-2)}/*!@.title*/.title.sc-calcite-combobox-item-group{border:0 solid;display:block;-ms-flex:1 1 0%;flex:1 1 0%;border-bottom-width:1px;font-weight:var(--calcite-font-weight-bold);color:var(--calcite-ui-text-2);word-wrap:break-word;word-break:break-word;border-bottom-color:var(--calcite-ui-border-3);padding:var(--calcite-combobox-item-spacing-unit-l) 0;margin-left:var(--calcite-combobox-item-spacing-unit-s);margin-right:var(--calcite-combobox-item-spacing-unit-s)}";
- /**
- * @slot - A slot for adding `calcite-combobox-item`s.
- */
- class ComboboxItemGroup {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.guid = guid();
- this.scale = "m";
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- this.ancestors = getAncestors(this.el);
- this.scale = getElementProp(this.el, "scale", this.scale);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- const { el, scale } = this;
- const indent = `${CSS$B.label}--indent-${getDepth()}`;
- return (hAsync("ul", { "aria-labelledby": this.guid, class: { [CSS$B.list]: true, [`scale--${scale}`]: true }, role: "group" }, hAsync("li", { class: { [CSS$B.label]: true, [indent]: true }, id: this.guid, role: "presentation" }, hAsync("span", { class: CSS$B.title }, this.label)), hAsync("slot", null)));
- }
- get el() { return getElement(this); }
- static get style() { return comboboxItemGroupCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-combobox-item-group",
- "$members$": {
- "ancestors": [1040],
- "label": [1]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": []
- }; }
- }
- function isActivationKey(key) {
- return key === "Enter" || key === " ";
- }
- const numberKeys = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"];
- function isValidNumber(numberString) {
- return !(!numberString || isNaN(Number(numberString)));
- }
- function parseNumberString(numberString) {
- if (!numberString || !stringContainsNumbers(numberString)) {
- return "";
- }
- return sanitizeExponentialNumberString(numberString, (nonExpoNumString) => {
- let containsDecimal = false;
- const result = nonExpoNumString
- .split("")
- .filter((value, i) => {
- if (value.match(/\./g) && !containsDecimal) {
- containsDecimal = true;
- return true;
- }
- if (value.match(/\-/g) && i === 0) {
- return true;
- }
- return numberKeys.includes(value);
- })
- .reduce((string, part) => string + part);
- return isValidNumber(result) ? Number(result).toString() : "";
- });
- }
- function sanitizeDecimalString(decimalString) {
- const decimalAtEndOfStringButNotStart = /(?!^\.)\.$/;
- return decimalString.replace(decimalAtEndOfStringButNotStart, "");
- }
- function sanitizeNegativeString(negativeString) {
- const allHyphensExceptTheStart = /(?!^-)-/g;
- return negativeString.replace(allHyphensExceptTheStart, "");
- }
- function sanitizeLeadingZeroString(zeroString) {
- const allLeadingZerosOptionallyNegative = /^([-0])0+(?=\d)/;
- return zeroString.replace(allLeadingZerosOptionallyNegative, "$1");
- }
- function sanitizeNumberString(numberString) {
- return sanitizeExponentialNumberString(numberString, (nonExpoNumString) => {
- const sanitizedValue = sanitizeNegativeString(sanitizeDecimalString(sanitizeLeadingZeroString(nonExpoNumString)));
- const isNegativeDecimalOnlyZeros = /^-\b0\b\.?0*$/;
- return isValidNumber(sanitizedValue)
- ? isNegativeDecimalOnlyZeros.test(sanitizedValue)
- ? sanitizedValue
- : Number(sanitizedValue).toString()
- : nonExpoNumString;
- });
- }
- function sanitizeExponentialNumberString(numberString, func) {
- if (!numberString) {
- return numberString;
- }
- const firstE = numberString.toLowerCase().indexOf("e") + 1;
- return numberString
- .replace(/[eE]*$/g, "")
- .substring(0, firstE)
- .concat(numberString.slice(firstE).replace(/[eE]/g, ""))
- .split(/[eE]/)
- .map((section, i) => (i === 1 ? func(section.replace(/\./g, "")) : func(section)))
- .join("e")
- .replace(/^e/, "1e");
- }
- function stringContainsNumbers(string) {
- return numberKeys.some((number) => string.includes(number));
- }
- const allDecimalsExceptLast = new RegExp(`[.](?=.*[.])`, "g");
- const everythingExceptNumbersDecimalsAndMinusSigns = new RegExp("[^0-9-.]", "g");
- const defaultGroupSeparator = new RegExp(",", "g");
- function createLocaleNumberFormatter(locale) {
- return new Intl.NumberFormat(locale, {
- minimumFractionDigits: 0,
- maximumFractionDigits: 20
- });
- }
- function delocalizeNumberString(numberString, locale) {
- return sanitizeExponentialNumberString(numberString, (nonExpoNumString) => {
- const delocalizedNumberString = nonExpoNumString
- .replace(getMinusSign(locale), "-")
- .replace(getGroupSeparator(locale), "")
- .replace(getDecimalSeparator(locale), ".")
- .replace(allDecimalsExceptLast, "")
- .replace(everythingExceptNumbersDecimalsAndMinusSigns, "");
- return isValidNumber(delocalizedNumberString) ? delocalizedNumberString : nonExpoNumString;
- });
- }
- function getGroupSeparator(locale) {
- const formatter = createLocaleNumberFormatter(locale);
- const parts = formatter.formatToParts(1234567);
- const value = parts.find((part) => part.type === "group").value;
- // change whitespace group characters that don't render correctly
- return value.trim().length === 0 ? " " : value;
- }
- function getDecimalSeparator(locale) {
- const formatter = createLocaleNumberFormatter(locale);
- const parts = formatter.formatToParts(1.1);
- return parts.find((part) => part.type === "decimal").value;
- }
- function getMinusSign(locale) {
- const formatter = createLocaleNumberFormatter(locale);
- const parts = formatter.formatToParts(-9);
- return parts.find((part) => part.type === "minusSign").value;
- }
- function localizeNumberString(numberString, locale, displayGroupSeparator = false) {
- return sanitizeExponentialNumberString(numberString, (nonExpoNumString) => {
- if (nonExpoNumString) {
- const number = Number(sanitizeDecimalString(nonExpoNumString.replace(defaultGroupSeparator, "")));
- if (!isNaN(number)) {
- const formatter = createLocaleNumberFormatter(locale);
- const parts = formatter.formatToParts(number);
- const localizedNumberString = parts
- .map(({ type, value }) => {
- switch (type) {
- case "group":
- return displayGroupSeparator ? getGroupSeparator(locale) : "";
- case "decimal":
- return getDecimalSeparator(locale);
- case "minusSign":
- return getMinusSign(locale);
- default:
- return value;
- }
- })
- .reduce((string, part) => string + part);
- return localizedNumberString;
- }
- }
- return nonExpoNumString;
- });
- }
- /**
- * Check if date is within a min and max
- */
- function inRange(date, min, max) {
- const time = date.getTime();
- const afterMin = !(min instanceof Date) || time >= min.getTime();
- const beforeMax = !(max instanceof Date) || time <= max.getTime();
- return afterMin && beforeMax;
- }
- /**
- * Ensures date is within range,
- * returns min or max if out of bounds
- */
- function dateFromRange(date, min, max) {
- if (!(date instanceof Date)) {
- return null;
- }
- const time = date.getTime();
- const beforeMin = min instanceof Date && time < min.getTime();
- const afterMax = max instanceof Date && time > max.getTime();
- if (beforeMin) {
- return min;
- }
- if (afterMax) {
- return max;
- }
- return date;
- }
- /**
- * Parse an iso8601 string (YYYY-mm-dd) into a valid date.
- * TODO: handle time when time of day UI is added
- */
- function dateFromISO(iso8601) {
- if (iso8601 instanceof Date) {
- return iso8601;
- }
- if (!iso8601 || typeof iso8601 !== "string") {
- return null;
- }
- const d = iso8601.split(/[: T-]/).map(parseFloat);
- const date = new Date(d[0], (d[1] || 1) - 1, d[2] || 1);
- date.setFullYear(d[0]);
- if (isNaN(date.getTime())) {
- throw new Error(`Invalid ISO 8601 date: "${iso8601}"`);
- }
- return date;
- }
- /**
- * Return first portion of ISO string (YYYY-mm-dd)
- */
- function dateToISO(date) {
- if (typeof date === "string") {
- return date;
- }
- if (date instanceof Date) {
- return new Date(date.getTime() - date.getTimezoneOffset() * 60000).toISOString().split("T")[0];
- }
- return "";
- }
- /**
- * Check if two dates are the same day, month, year
- */
- function sameDate(d1, d2) {
- return (d1 instanceof Date &&
- d2 instanceof Date &&
- d1.getDate() === d2.getDate() &&
- d1.getMonth() === d2.getMonth() &&
- d1.getFullYear() === d2.getFullYear());
- }
- /**
- * Get a date one month in the past
- */
- function prevMonth(date) {
- const month = date.getMonth();
- const nextDate = new Date(date);
- nextDate.setMonth(month - 1);
- // date doesn't exist in new month, use last day
- if (month === nextDate.getMonth()) {
- return new Date(date.getFullYear(), month, 0);
- }
- return nextDate;
- }
- /**
- * Get a date one month in the future
- */
- function nextMonth(date) {
- const month = date.getMonth();
- const nextDate = new Date(date);
- nextDate.setMonth(month + 1);
- // date doesn't exist in new month, use last day
- if ((month + 2) % 7 === nextDate.getMonth() % 7) {
- return new Date(date.getFullYear(), month + 2, 0);
- }
- return nextDate;
- }
- /**
- * Translate a number into a given locals numeral system
- */
- function localizeNumber(num, localeData) {
- return String(num)
- .split("")
- .map((i) => localeData.numerals[i])
- .join("");
- }
- /**
- * Calculate actual number from localized string
- */
- function parseNumber(str, localeData) {
- const numerals = "0123456789";
- return parseInt(str
- .split("")
- .map((i) => numerals[localeData.numerals.indexOf(i)])
- .filter((num) => num)
- .join(""));
- }
- /**
- * Parse numeric units for day, month, and year from a localized string
- * month starts at 0 (can pass to date constructor)
- */
- function parseDateString(str, localeData) {
- const { separator, unitOrder } = localeData;
- const order = getOrder(unitOrder);
- const values = replaceArabicNumerals(str).split(separator);
- return {
- day: parseInt(values[order.indexOf("d")]),
- month: parseInt(values[order.indexOf("m")]) - 1,
- year: parseInt(values[order.indexOf("y")])
- };
- }
- /**
- * Convert eastern arbic numerals
- */
- function replaceArabicNumerals(str = "") {
- return str
- .replace(/[\u0660-\u0669]/g, (c) => (c.charCodeAt(0) - 0x0660))
- .replace(/[\u06f0-\u06f9]/g, (c) => (c.charCodeAt(0) - 0x06f0));
- }
- /**
- * Based on the unitOrder string, find order of month, day, and year for locale
- */
- function getOrder(unitOrder) {
- const signifiers = ["d", "m", "y"];
- const order = unitOrder.toLowerCase();
- return signifiers.sort((a, b) => order.indexOf(a) - order.indexOf(b));
- }
- /**
- * Get number of days between two dates
- */
- function getDaysDiff(date1, date2) {
- const ts1 = date1.getTime();
- const ts2 = date2.getTime();
- return (ts1 - ts2) / (1000 * 3600 * 24);
- }
- const HEADING_LEVEL$6 = 2;
- const TEXT$f = {
- nextMonth: "Next month",
- prevMonth: "Previous month",
- year: "Year"
- };
- const datePickerCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-date-picker:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-date-picker{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-date-picker{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-date-picker{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-date-picker{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-date-picker{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-date-picker:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-date-picker-h{display:none}/*!@:host*/.sc-calcite-date-picker-h{position:relative;display:inline-block;width:100%;overflow:visible;border-radius:0px;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-2);background-color:var(--calcite-ui-foreground-1);vertical-align:top}/*!@:host([scale=s])*/[scale=s].sc-calcite-date-picker-h{max-width:216px}/*!@:host([scale=m])*/[scale=m].sc-calcite-date-picker-h{max-width:286px}/*!@:host([scale=l])*/[scale=l].sc-calcite-date-picker-h{max-width:398px}";
- class DatePicker {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteDatePickerChange = createEvent(this, "calciteDatePickerChange", 7);
- this.calciteDatePickerRangeChange = createEvent(this, "calciteDatePickerRangeChange", 7);
- /** Localized string for "previous month" (used for aria label)
- * @default "Previous month"
- */
- this.intlPrevMonth = TEXT$f.prevMonth;
- /** Localized string for "next month" (used for aria label)
- * @default "Next month"
- */
- this.intlNextMonth = TEXT$f.nextMonth;
- /** Localized string for "year" (used for aria label)
- * @default "Year"
- */
- this.intlYear = TEXT$f.year;
- /** BCP 47 language tag for desired language and country format */
- this.locale = document.documentElement.lang || "en";
- /** specify the scale of the date picker */
- this.scale = "m";
- /** Range mode activation */
- this.range = false;
- /** Disables the default behaviour on the third click of narrowing or extending the range and instead starts a new range. */
- this.proximitySelectionDisabled = false;
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- this.keyUpHandler = (e) => {
- if (e.key === "Escape") {
- this.reset();
- }
- };
- this.monthHeaderSelectChange = (e) => {
- const date = new Date(e.detail);
- if (!this.range) {
- this.activeDate = date;
- }
- else {
- if (this.activeRange === "end") {
- this.activeEndDate = date;
- }
- else {
- this.activeStartDate = date;
- }
- this.mostRecentRangeValue = date;
- }
- };
- this.monthActiveDateChange = (e) => {
- const date = new Date(e.detail);
- if (!this.range) {
- this.activeDate = date;
- }
- else {
- if (this.activeRange === "end") {
- this.activeEndDate = date;
- }
- else {
- this.activeStartDate = date;
- }
- this.mostRecentRangeValue = date;
- }
- };
- this.monthHoverChange = (e) => {
- if (!this.startAsDate) {
- this.hoverRange = undefined;
- return;
- }
- const date = new Date(e.detail);
- this.hoverRange = {
- focused: this.activeRange || "start",
- start: this.startAsDate,
- end: this.endAsDate
- };
- if (!this.proximitySelectionDisabled) {
- if (this.endAsDate) {
- const startDiff = getDaysDiff(date, this.startAsDate);
- const endDiff = getDaysDiff(date, this.endAsDate);
- if (endDiff > 0) {
- this.hoverRange.end = date;
- this.hoverRange.focused = "end";
- }
- else if (startDiff < 0) {
- this.hoverRange.start = date;
- this.hoverRange.focused = "start";
- }
- else if (startDiff > endDiff) {
- this.hoverRange.start = date;
- this.hoverRange.focused = "start";
- }
- else {
- this.hoverRange.end = date;
- this.hoverRange.focused = "end";
- }
- }
- else {
- if (date < this.startAsDate) {
- this.hoverRange = {
- focused: "start",
- start: date,
- end: this.startAsDate
- };
- }
- else {
- this.hoverRange.end = date;
- this.hoverRange.focused = "end";
- }
- }
- }
- else {
- if (!this.endAsDate) {
- if (date < this.startAsDate) {
- this.hoverRange = {
- focused: "start",
- start: date,
- end: this.startAsDate
- };
- }
- else {
- this.hoverRange.end = date;
- this.hoverRange.focused = "end";
- }
- }
- else {
- this.hoverRange = undefined;
- }
- }
- };
- this.monthMouseOutChange = () => {
- if (this.hoverRange) {
- this.hoverRange = undefined;
- }
- };
- /**
- * Reset active date and close
- */
- this.reset = () => {
- var _a, _b, _c, _d, _e, _f;
- if (!Array.isArray(this.valueAsDate) &&
- this.valueAsDate &&
- ((_a = this.valueAsDate) === null || _a === void 0 ? void 0 : _a.getTime()) !== ((_b = this.activeDate) === null || _b === void 0 ? void 0 : _b.getTime())) {
- this.activeDate = new Date(this.valueAsDate);
- }
- if (this.startAsDate && ((_c = this.startAsDate) === null || _c === void 0 ? void 0 : _c.getTime()) !== ((_d = this.activeStartDate) === null || _d === void 0 ? void 0 : _d.getTime())) {
- this.activeStartDate = new Date(this.startAsDate);
- }
- if (this.endAsDate && ((_e = this.endAsDate) === null || _e === void 0 ? void 0 : _e.getTime()) !== ((_f = this.activeEndDate) === null || _f === void 0 ? void 0 : _f.getTime())) {
- this.activeEndDate = new Date(this.endAsDate);
- }
- };
- /**
- * Event handler for when the selected date changes
- */
- this.monthDateChange = (e) => {
- const date = new Date(e.detail);
- if (!this.range) {
- this.value = date ? dateToISO(date) : "";
- this.valueAsDate = date || null;
- this.activeDate = date || null;
- this.calciteDatePickerChange.emit(date);
- return;
- }
- if (!this.startAsDate || (!this.endAsDate && date < this.startAsDate)) {
- if (this.startAsDate) {
- this.setEndDate(new Date(this.startAsDate));
- }
- if (this.activeRange == "end") {
- this.setEndDate(date);
- }
- else {
- this.setStartDate(date);
- }
- }
- else if (!this.endAsDate) {
- this.setEndDate(date);
- }
- else {
- if (!this.proximitySelectionDisabled) {
- if (this.activeRange) {
- if (this.activeRange == "end") {
- this.setEndDate(date);
- }
- else {
- this.setStartDate(date);
- }
- }
- else {
- const startDiff = getDaysDiff(date, this.startAsDate);
- const endDiff = getDaysDiff(date, this.endAsDate);
- if (endDiff === 0 || startDiff < 0) {
- this.setStartDate(date);
- }
- else if (startDiff === 0 || endDiff < 0) {
- this.setEndDate(date);
- }
- else if (startDiff < endDiff) {
- this.setStartDate(date);
- }
- else {
- this.setEndDate(date);
- }
- }
- }
- else {
- this.setStartDate(date);
- this.endAsDate = this.activeEndDate = this.end = undefined;
- }
- }
- this.calciteDatePickerChange.emit(date);
- };
- }
- handleValueAsDate(date) {
- if (!Array.isArray(date) && date && date !== this.activeDate) {
- this.activeDate = date;
- }
- }
- handleRangeChange() {
- const { startAsDate: startDate, endAsDate: endDate } = this;
- this.activeEndDate = endDate;
- this.activeStartDate = startDate;
- }
- onMinChanged(min) {
- if (min) {
- this.minAsDate = dateFromISO(min);
- }
- }
- onMaxChanged(max) {
- if (max) {
- this.maxAsDate = dateFromISO(max);
- }
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- if (Array.isArray(this.value)) {
- this.valueAsDate = this.value.map((v) => dateFromISO(v));
- this.start = this.value[0];
- this.end = this.value[1];
- }
- else if (this.value) {
- this.valueAsDate = dateFromISO(this.value);
- }
- if (this.start) {
- this.setStartAsDate(dateFromISO(this.start));
- }
- if (this.end) {
- this.setEndAsDate(dateFromISO(this.end));
- }
- if (this.min) {
- this.minAsDate = dateFromISO(this.min);
- }
- if (this.max) {
- this.maxAsDate = dateFromISO(this.max);
- }
- }
- async componentWillLoad() {
- await this.loadLocaleData();
- this.onMinChanged(this.min);
- this.onMaxChanged(this.max);
- }
- render() {
- var _a;
- const date = dateFromRange(this.range ? this.startAsDate : this.valueAsDate, this.minAsDate, this.maxAsDate);
- const activeStartDate = this.range
- ? this.getActiveStartDate(date, this.minAsDate, this.maxAsDate)
- : this.getActiveDate(date, this.minAsDate, this.maxAsDate);
- let activeDate = activeStartDate;
- const endDate = this.range
- ? dateFromRange(this.endAsDate, this.minAsDate, this.maxAsDate)
- : null;
- const activeEndDate = this.getActiveEndDate(endDate, this.minAsDate, this.maxAsDate);
- if ((this.activeRange === "end" ||
- (((_a = this.hoverRange) === null || _a === void 0 ? void 0 : _a.focused) === "end" && (!this.proximitySelectionDisabled || endDate))) &&
- activeEndDate) {
- activeDate = activeEndDate;
- }
- if (this.range && this.mostRecentRangeValue) {
- activeDate = this.mostRecentRangeValue;
- }
- const minDate = this.range && this.activeRange
- ? this.activeRange === "start"
- ? this.minAsDate
- : date || this.minAsDate
- : this.minAsDate;
- const maxDate = this.range && this.activeRange
- ? this.activeRange === "start"
- ? endDate || this.maxAsDate
- : this.maxAsDate
- : this.maxAsDate;
- return (hAsync(Host, { onBlur: this.reset, onKeyUp: this.keyUpHandler, role: "application" }, this.renderCalendar(activeDate, maxDate, minDate, date, endDate)));
- }
- valueHandler(value) {
- if (Array.isArray(value)) {
- this.valueAsDate = value.map((v) => dateFromISO(v));
- this.start = value[0];
- this.end = value[1];
- }
- else if (value) {
- this.valueAsDate = dateFromISO(value);
- this.start = "";
- this.end = "";
- }
- }
- startWatcher(start) {
- this.setStartAsDate(dateFromISO(start));
- }
- endWatcher(end) {
- this.setEndAsDate(dateFromISO(end));
- }
- async loadLocaleData() {
- {
- return;
- }
- }
- /**
- * Render calcite-date-picker-month-header and calcite-date-picker-month
- */
- renderCalendar(activeDate, maxDate, minDate, date, endDate) {
- return (this.localeData && [
- hAsync("calcite-date-picker-month-header", { activeDate: activeDate, headingLevel: this.headingLevel || HEADING_LEVEL$6, intlNextMonth: this.intlNextMonth, intlPrevMonth: this.intlPrevMonth, intlYear: this.intlYear, localeData: this.localeData, max: maxDate, min: minDate, onCalciteDatePickerSelect: this.monthHeaderSelectChange, scale: this.scale, selectedDate: this.activeRange === "end" ? endDate : date || new Date() }),
- hAsync("calcite-date-picker-month", { activeDate: activeDate, endDate: this.range ? endDate : undefined, hoverRange: this.hoverRange, localeData: this.localeData, max: maxDate, min: minDate, onCalciteDatePickerActiveDateChange: this.monthActiveDateChange, onCalciteDatePickerHover: this.monthHoverChange, onCalciteDatePickerMouseOut: this.monthMouseOutChange, onCalciteDatePickerSelect: this.monthDateChange, scale: this.scale, selectedDate: this.activeRange === "end" ? endDate : date, startDate: this.range ? date : undefined })
- ]);
- }
- /**
- * Update date instance of start if valid
- */
- setStartAsDate(startDate, emit) {
- this.startAsDate = startDate;
- this.mostRecentRangeValue = this.startAsDate;
- if (emit) {
- this.calciteDatePickerRangeChange.emit({
- startDate,
- endDate: this.endAsDate
- });
- }
- }
- /**
- * Update date instance of end if valid
- */
- setEndAsDate(endDate, emit) {
- this.endAsDate = endDate;
- this.mostRecentRangeValue = this.endAsDate;
- if (emit) {
- this.calciteDatePickerRangeChange.emit({
- startDate: this.startAsDate,
- endDate
- });
- }
- }
- setEndDate(date) {
- this.end = date ? dateToISO(date) : "";
- this.setEndAsDate(date, true);
- this.activeEndDate = date || null;
- }
- setStartDate(date) {
- this.start = date ? dateToISO(date) : "";
- this.setStartAsDate(date, true);
- this.activeStartDate = date || null;
- }
- /**
- * Get an active date using the value, or current date as default
- */
- getActiveDate(value, min, max) {
- return dateFromRange(this.activeDate, min, max) || value || dateFromRange(new Date(), min, max);
- }
- getActiveStartDate(value, min, max) {
- return (dateFromRange(this.activeStartDate, min, max) || value || dateFromRange(new Date(), min, max));
- }
- getActiveEndDate(value, min, max) {
- return (dateFromRange(this.activeEndDate, min, max) || value || dateFromRange(new Date(), min, max));
- }
- static get assetsDirs() { return ["assets"]; }
- get el() { return getElement(this); }
- static get watchers() { return {
- "valueAsDate": ["handleValueAsDate"],
- "startAsDate": ["handleRangeChange"],
- "endAsDate": ["handleRangeChange"],
- "min": ["onMinChanged"],
- "max": ["onMaxChanged"],
- "value": ["valueHandler"],
- "start": ["startWatcher"],
- "end": ["endWatcher"],
- "locale": ["loadLocaleData"]
- }; }
- static get style() { return datePickerCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-date-picker",
- "$members$": {
- "activeRange": [1, "active-range"],
- "value": [1025],
- "headingLevel": [2, "heading-level"],
- "valueAsDate": [1040],
- "startAsDate": [1040],
- "endAsDate": [1040],
- "minAsDate": [1040],
- "maxAsDate": [1040],
- "min": [1025],
- "max": [1025],
- "intlPrevMonth": [1, "intl-prev-month"],
- "intlNextMonth": [1, "intl-next-month"],
- "intlYear": [1, "intl-year"],
- "locale": [1],
- "scale": [513],
- "range": [516],
- "start": [1025],
- "end": [1025],
- "proximitySelectionDisabled": [4, "proximity-selection-disabled"],
- "activeDate": [32],
- "activeStartDate": [32],
- "activeEndDate": [32],
- "localeData": [32],
- "hoverRange": [32]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["scale", "scale"], ["range", "range"]]
- }; }
- }
- const datePickerDayCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-date-picker-day:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-date-picker-day{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-date-picker-day{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-date-picker-day{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-date-picker-day{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-date-picker-day{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-date-picker-day:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-date-picker-day-h{display:none}/*!@:host*/.sc-calcite-date-picker-day-h{display:-ms-flexbox;display:flex;min-width:0px;cursor:pointer;-ms-flex-pack:center;justify-content:center;color:var(--calcite-ui-text-3);width:14.2857142857%}/*!@:host([disabled])*/[disabled].sc-calcite-date-picker-day-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-date-picker-day-h[disabled] .sc-calcite-date-picker-day-s>[calcite-hydrated][disabled],[disabled].sc-calcite-date-picker-day-h [calcite-hydrated][disabled].sc-calcite-date-picker-day{opacity:1}/*!@.day-v-wrapper*/.day-v-wrapper.sc-calcite-date-picker-day{-ms-flex:1 1 auto;flex:1 1 auto}/*!@.day-wrapper*/.day-wrapper.sc-calcite-date-picker-day{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center}/*!@.day*/.day.sc-calcite-date-picker-day{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border-radius:9999px;font-size:var(--calcite-font-size--2);line-height:1rem;line-height:1;color:var(--calcite-ui-text-3);opacity:var(--calcite-ui-opacity-disabled);-webkit-transition-property:all;transition-property:all;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:150ms;transition-duration:150ms;background:none;-webkit-box-shadow:0 0 0 2px transparent, 0 0 0 0px transparent;box-shadow:0 0 0 2px transparent, 0 0 0 0px transparent}/*!@.text*/.text.sc-calcite-date-picker-day{margin-top:1px;margin-right:0px;margin-bottom:0px;margin-left:1px}/*!@:host([scale=s]) .day-v-wrapper*/[scale=s].sc-calcite-date-picker-day-h .day-v-wrapper.sc-calcite-date-picker-day{padding-top:0.125rem;padding-bottom:0.125rem}/*!@:host([scale=s]) .day-wrapper*/[scale=s].sc-calcite-date-picker-day-h .day-wrapper.sc-calcite-date-picker-day{padding:0px}/*!@:host([scale=s]) .day*/[scale=s].sc-calcite-date-picker-day-h .day.sc-calcite-date-picker-day{height:27px;width:27px;font-size:var(--calcite-font-size--2)}/*!@:host([scale=m]) .day-v-wrapper*/[scale=m].sc-calcite-date-picker-day-h .day-v-wrapper.sc-calcite-date-picker-day{padding-top:0.25rem;padding-bottom:0.25rem}/*!@:host([scale=m]) .day-wrapper*/[scale=m].sc-calcite-date-picker-day-h .day-wrapper.sc-calcite-date-picker-day{padding-left:0.25rem;padding-right:0.25rem}/*!@:host([scale=m]) .day*/[scale=m].sc-calcite-date-picker-day-h .day.sc-calcite-date-picker-day{height:33px;width:33px;font-size:var(--calcite-font-size--1)}/*!@:host([scale=l]) .day-v-wrapper*/[scale=l].sc-calcite-date-picker-day-h .day-v-wrapper.sc-calcite-date-picker-day{padding-top:0.25rem;padding-bottom:0.25rem}/*!@:host([scale=l]) .day-wrapper*/[scale=l].sc-calcite-date-picker-day-h .day-wrapper.sc-calcite-date-picker-day{padding-left:0.25rem;padding-right:0.25rem}/*!@:host([scale=l]) .day*/[scale=l].sc-calcite-date-picker-day-h .day.sc-calcite-date-picker-day{height:43px;width:43px;font-size:var(--calcite-font-size-0)}/*!@:host([current-month]) .day*/[current-month].sc-calcite-date-picker-day-h .day.sc-calcite-date-picker-day{opacity:1}/*!@:host(:hover:not([disabled])) .day, :host([active]:not([range])) .day*/.sc-calcite-date-picker-day-h:hover:not([disabled]) .day.sc-calcite-date-picker-day,[active].sc-calcite-date-picker-day-h:not([range]) .day.sc-calcite-date-picker-day{background-color:var(--calcite-ui-foreground-2);color:var(--calcite-ui-text-1)}/*!@:host(:focus), :host([active])*/.sc-calcite-date-picker-day-h:focus,[active].sc-calcite-date-picker-day-h{outline:2px solid transparent;outline-offset:2px;z-index:1}/*!@:host(:focus:not([disabled])) .day*/.sc-calcite-date-picker-day-h:focus:not([disabled]) .day.sc-calcite-date-picker-day{-webkit-box-shadow:0 0 0 2px var(--calcite-ui-foreground-1), 0 0 0 4px var(--calcite-ui-brand);box-shadow:0 0 0 2px var(--calcite-ui-foreground-1), 0 0 0 4px var(--calcite-ui-brand)}/*!@:host([selected]) .day*/[selected].sc-calcite-date-picker-day-h .day.sc-calcite-date-picker-day{font-weight:var(--calcite-font-weight-medium);background-color:var(--calcite-ui-brand) !important;color:var(--calcite-ui-foreground-1) !important;z-index:1}/*!@:host([range][selected]) .day-wrapper*/[range][selected].sc-calcite-date-picker-day-h .day-wrapper.sc-calcite-date-picker-day{background-color:var(--calcite-ui-foreground-current)}/*!@:host([start-of-range]) .day-wrapper*/[start-of-range].sc-calcite-date-picker-day-h .day-wrapper.sc-calcite-date-picker-day{border-start-start-radius:40%;border-end-start-radius:40%}/*!@:host([end-of-range]) .day-wrapper*/[end-of-range].sc-calcite-date-picker-day-h .day-wrapper.sc-calcite-date-picker-day{border-start-end-radius:40%;border-end-end-radius:40%}/*!@:host([start-of-range]) :not(.calcite--rtl) .day-wrapper,\n:host([end-of-range]) .calcite--rtl .day-wrapper*/[start-of-range].sc-calcite-date-picker-day-h .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[end-of-range].sc-calcite-date-picker-day-h .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{-webkit-box-shadow:inset 4px 0 var(--calcite-ui-foreground-1);box-shadow:inset 4px 0 var(--calcite-ui-foreground-1)}/*!@:host([start-of-range]) :not(.calcite--rtl) .day,\n:host([end-of-range]) .calcite--rtl .day*/[start-of-range].sc-calcite-date-picker-day-h .sc-calcite-date-picker-day:not(.calcite--rtl) .day.sc-calcite-date-picker-day,[end-of-range].sc-calcite-date-picker-day-h .calcite--rtl.sc-calcite-date-picker-day .day.sc-calcite-date-picker-day{opacity:1}/*!@:host([start-of-range]:not(:focus)) :not(.calcite--rtl) .day,\n:host([end-of-range]:not(:focus)) .calcite--rtl .day*/[start-of-range].sc-calcite-date-picker-day-h:not(:focus) .sc-calcite-date-picker-day:not(.calcite--rtl) .day.sc-calcite-date-picker-day,[end-of-range].sc-calcite-date-picker-day-h:not(:focus) .calcite--rtl.sc-calcite-date-picker-day .day.sc-calcite-date-picker-day{-webkit-box-shadow:0 0 0 2px var(--calcite-ui-foreground-1);box-shadow:0 0 0 2px var(--calcite-ui-foreground-1)}/*!@:host([end-of-range]) :not(.calcite--rtl) .day-wrapper,\n:host([start-of-range]) .calcite--rtl .day-wrapper*/[end-of-range].sc-calcite-date-picker-day-h .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[start-of-range].sc-calcite-date-picker-day-h .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{-webkit-box-shadow:inset -4px 0 var(--calcite-ui-foreground-1);box-shadow:inset -4px 0 var(--calcite-ui-foreground-1)}/*!@:host([end-of-range]) :not(.calcite--rtl) .day,\n:host([start-of-range]) .calcite--rtl .day*/[end-of-range].sc-calcite-date-picker-day-h .sc-calcite-date-picker-day:not(.calcite--rtl) .day.sc-calcite-date-picker-day,[start-of-range].sc-calcite-date-picker-day-h .calcite--rtl.sc-calcite-date-picker-day .day.sc-calcite-date-picker-day{opacity:1}/*!@:host([end-of-range]:not(:focus)) :not(.calcite--rtl) .day,\n:host([start-of-range]:not(:focus)) .calcite--rtl .day*/[end-of-range].sc-calcite-date-picker-day-h:not(:focus) .sc-calcite-date-picker-day:not(.calcite--rtl) .day.sc-calcite-date-picker-day,[start-of-range].sc-calcite-date-picker-day-h:not(:focus) .calcite--rtl.sc-calcite-date-picker-day .day.sc-calcite-date-picker-day{-webkit-box-shadow:0 0 0 2px var(--calcite-ui-foreground-1);box-shadow:0 0 0 2px var(--calcite-ui-foreground-1)}/*!@:host([end-of-range][scale=l]) :not(.calcite--rtl) .day-wrapper,\n:host([start-of-range][scale=l]) .calcite--rtl .day-wrapper*/[end-of-range][scale=l].sc-calcite-date-picker-day-h .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[start-of-range][scale=l].sc-calcite-date-picker-day-h .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{-webkit-box-shadow:inset -8px 0 var(--calcite-ui-foreground-1);box-shadow:inset -8px 0 var(--calcite-ui-foreground-1)}/*!@:host([start-of-range][scale=l]) :not(.calcite--rtl) .day-wrapper,\n:host([end-of-range][scale=l]) .calcite--rtl .day-wrapper*/[start-of-range][scale=l].sc-calcite-date-picker-day-h .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[end-of-range][scale=l].sc-calcite-date-picker-day-h .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{-webkit-box-shadow:inset 8px 0 var(--calcite-ui-foreground-1);box-shadow:inset 8px 0 var(--calcite-ui-foreground-1)}/*!@:host([highlighted]) .day-wrapper*/[highlighted].sc-calcite-date-picker-day-h .day-wrapper.sc-calcite-date-picker-day{background-color:var(--calcite-ui-foreground-current)}/*!@:host([highlighted]) .day-wrapper .day*/[highlighted].sc-calcite-date-picker-day-h .day-wrapper.sc-calcite-date-picker-day .day.sc-calcite-date-picker-day{color:var(--calcite-ui-text-1)}/*!@:host([highlighted]:not([active]:focus)) .day*/[highlighted].sc-calcite-date-picker-day-h:not([active]:focus) .day.sc-calcite-date-picker-day{border-radius:0px;color:var(--calcite-ui-text-1)}/*!@:host([range-hover]:not([selected])) .day-wrapper*/[range-hover].sc-calcite-date-picker-day-h:not([selected]) .day-wrapper.sc-calcite-date-picker-day{background-color:var(--calcite-ui-foreground-2)}/*!@:host([range-hover]:not([selected])) .day*/[range-hover].sc-calcite-date-picker-day-h:not([selected]) .day.sc-calcite-date-picker-day{border-radius:0px}/*!@:host([end-of-range][range-hover]) :not(.calcite--rtl) .day-wrapper,\n:host([start-of-range][range-hover]) .calcite--rtl .day-wrapper*/[end-of-range][range-hover].sc-calcite-date-picker-day-h .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[start-of-range][range-hover].sc-calcite-date-picker-day-h .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{background-image:-webkit-gradient(linear, left top, right top, from(var(--calcite-ui-foreground-current)), color-stop(var(--calcite-ui-foreground-current)), color-stop(var(--calcite-ui-foreground-2)), to(var(--calcite-ui-foreground-2)));background-image:linear-gradient(to right, var(--calcite-ui-foreground-current), var(--calcite-ui-foreground-current), var(--calcite-ui-foreground-2), var(--calcite-ui-foreground-2));border-radius:0px;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@:host([start-of-range][range-hover]) :not(.calcite--rtl) .day-wrapper,\n:host([end-of-range][range-hover]) .calcite--rtl .day-wrapper*/[start-of-range][range-hover].sc-calcite-date-picker-day-h .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[end-of-range][range-hover].sc-calcite-date-picker-day-h .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{background-image:-webkit-gradient(linear, right top, left top, from(var(--calcite-ui-foreground-current)), color-stop(var(--calcite-ui-foreground-current)), color-stop(var(--calcite-ui-foreground-2)), to(var(--calcite-ui-foreground-2)));background-image:linear-gradient(to left, var(--calcite-ui-foreground-current), var(--calcite-ui-foreground-current), var(--calcite-ui-foreground-2), var(--calcite-ui-foreground-2));border-radius:0px;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@:host(:hover[end-of-range][range-hover]) :not(.calcite--rtl) .day-wrapper,\n:host(:hover[start-of-range][range-hover]) .calcite--rtl .day-wrapper*/.sc-calcite-date-picker-day-h:hover[end-of-range][range-hover] .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,.sc-calcite-date-picker-day-h:hover[start-of-range][range-hover] .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{background-image:-webkit-gradient(linear, left top, right top, from(var(--calcite-ui-foreground-current)), color-stop(var(--calcite-ui-foreground-current)), color-stop(var(--calcite-ui-foreground-1)), to(var(--calcite-ui-foreground-1)));background-image:linear-gradient(to right, var(--calcite-ui-foreground-current), var(--calcite-ui-foreground-current), var(--calcite-ui-foreground-1), var(--calcite-ui-foreground-1));border-radius:0px;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@:host(:hover[start-of-range][range-hover]) :not(.calcite--rtl) .day-wrapper,\n:host(:hover[end-of-range][range-hover]) .calcite--rtl .day-wrapper*/.sc-calcite-date-picker-day-h:hover[start-of-range][range-hover] .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,.sc-calcite-date-picker-day-h:hover[end-of-range][range-hover] .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{background-image:-webkit-gradient(linear, right top, left top, from(var(--calcite-ui-foreground-current)), color-stop(var(--calcite-ui-foreground-current)), color-stop(var(--calcite-ui-foreground-1)), to(var(--calcite-ui-foreground-1)));background-image:linear-gradient(to left, var(--calcite-ui-foreground-current), var(--calcite-ui-foreground-current), var(--calcite-ui-foreground-1), var(--calcite-ui-foreground-1));border-radius:0px;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@:host(:hover[range-hover]:not([selected]).focused--end) :not(.calcite--rtl) .day-wrapper,\n:host(:hover[range-hover]:not([selected]).focused--start) .calcite--rtl .day-wrapper*/.sc-calcite-date-picker-day-h:hover[range-hover]:not([selected]).focused--end .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,.sc-calcite-date-picker-day-h:hover[range-hover]:not([selected]).focused--start .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{background-image:-webkit-gradient(linear, left top, right top, from(var(--calcite-ui-foreground-2)), color-stop(var(--calcite-ui-foreground-2)), color-stop(var(--calcite-ui-foreground-current)), to(var(--calcite-ui-foreground-current)));background-image:linear-gradient(to right, var(--calcite-ui-foreground-2), var(--calcite-ui-foreground-2), var(--calcite-ui-foreground-current), var(--calcite-ui-foreground-current))}/*!@:host(:hover[range-hover]:not([selected]).focused--end) :not(.calcite--rtl) .day, :host(:hover[range-hover]:not([selected]).focused--start) .calcite--rtl .day*/.sc-calcite-date-picker-day-h:hover[range-hover]:not([selected]).focused--end .sc-calcite-date-picker-day:not(.calcite--rtl) .day.sc-calcite-date-picker-day,.sc-calcite-date-picker-day-h:hover[range-hover]:not([selected]).focused--start .calcite--rtl.sc-calcite-date-picker-day .day.sc-calcite-date-picker-day{border-radius:9999px;opacity:1;-webkit-box-shadow:0 0 0 2px var(--calcite-ui-foreground-1);box-shadow:0 0 0 2px var(--calcite-ui-foreground-1)}/*!@:host(:hover[range-hover]:not([selected]).focused--start) :not(.calcite--rtl) .day-wrapper,\n:host(:hover[range-hover]:not([selected]).focused--end) .calcite--rtl .day-wrapper*/.sc-calcite-date-picker-day-h:hover[range-hover]:not([selected]).focused--start .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,.sc-calcite-date-picker-day-h:hover[range-hover]:not([selected]).focused--end .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{background-image:-webkit-gradient(linear, left top, right top, from(var(--calcite-ui-foreground-current)), color-stop(var(--calcite-ui-foreground-current)), color-stop(var(--calcite-ui-foreground-2)), to(var(--calcite-ui-foreground-2)));background-image:linear-gradient(to right, var(--calcite-ui-foreground-current), var(--calcite-ui-foreground-current), var(--calcite-ui-foreground-2), var(--calcite-ui-foreground-2))}/*!@:host(:hover[range-hover]:not([selected]).focused--start) :not(.calcite--rtl) .day, :host(:hover[range-hover]:not([selected]).focused--end) .calcite--rtl .day*/.sc-calcite-date-picker-day-h:hover[range-hover]:not([selected]).focused--start .sc-calcite-date-picker-day:not(.calcite--rtl) .day.sc-calcite-date-picker-day,.sc-calcite-date-picker-day-h:hover[range-hover]:not([selected]).focused--end .calcite--rtl.sc-calcite-date-picker-day .day.sc-calcite-date-picker-day{border-radius:9999px;opacity:1;-webkit-box-shadow:0 0 0 2px var(--calcite-ui-foreground-1);box-shadow:0 0 0 2px var(--calcite-ui-foreground-1)}/*!@:host(:hover[range-hover]:not([selected]).focused--start.hover--outside-range) :not(.calcite--rtl) .day-wrapper,\n:host(:hover[range-hover]:not([selected]).focused--end.hover--outside-range) .calcite--rtl .day-wrapper*/.sc-calcite-date-picker-day-h:hover[range-hover]:not([selected]).focused--start.hover--outside-range .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,.sc-calcite-date-picker-day-h:hover[range-hover]:not([selected]).focused--end.hover--outside-range .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{background-image:-webkit-gradient(linear, left top, right top, from(var(--calcite-ui-foreground-1)), color-stop(var(--calcite-ui-foreground-1)), color-stop(var(--calcite-ui-foreground-2)), to(var(--calcite-ui-foreground-2)));background-image:linear-gradient(to right, var(--calcite-ui-foreground-1), var(--calcite-ui-foreground-1), var(--calcite-ui-foreground-2), var(--calcite-ui-foreground-2))}/*!@:host(:hover[range-hover]:not([selected]).focused--start.hover--outside-range) :not(.calcite--rtl) .day, :host(:hover[range-hover]:not([selected]).focused--end.hover--outside-range) .calcite--rtl .day*/.sc-calcite-date-picker-day-h:hover[range-hover]:not([selected]).focused--start.hover--outside-range .sc-calcite-date-picker-day:not(.calcite--rtl) .day.sc-calcite-date-picker-day,.sc-calcite-date-picker-day-h:hover[range-hover]:not([selected]).focused--end.hover--outside-range .calcite--rtl.sc-calcite-date-picker-day .day.sc-calcite-date-picker-day{border-radius:9999px;opacity:1;-webkit-box-shadow:0 0 0 2px var(--calcite-ui-foreground-1);box-shadow:0 0 0 2px var(--calcite-ui-foreground-1)}/*!@:host(:hover[range-hover]:not([selected]).focused--end.hover--outside-range) :not(.calcite--rtl) .day-wrapper,\n:host(:hover[range-hover]:not([selected]).focused--start.hover--outside-range) .calcite--rtl .day-wrapper*/.sc-calcite-date-picker-day-h:hover[range-hover]:not([selected]).focused--end.hover--outside-range .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,.sc-calcite-date-picker-day-h:hover[range-hover]:not([selected]).focused--start.hover--outside-range .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{background-image:-webkit-gradient(linear, left top, right top, from(var(--calcite-ui-foreground-2)), color-stop(var(--calcite-ui-foreground-2)), color-stop(var(--calcite-ui-foreground-1)), to(var(--calcite-ui-foreground-1)));background-image:linear-gradient(to right, var(--calcite-ui-foreground-2), var(--calcite-ui-foreground-2), var(--calcite-ui-foreground-1), var(--calcite-ui-foreground-1))}/*!@:host(:hover[range-hover]:not([selected]).focused--end.hover--outside-range) :not(.calcite--rtl) .day, :host(:hover[range-hover]:not([selected]).focused--start.hover--outside-range) .calcite--rtl .day*/.sc-calcite-date-picker-day-h:hover[range-hover]:not([selected]).focused--end.hover--outside-range .sc-calcite-date-picker-day:not(.calcite--rtl) .day.sc-calcite-date-picker-day,.sc-calcite-date-picker-day-h:hover[range-hover]:not([selected]).focused--start.hover--outside-range .calcite--rtl.sc-calcite-date-picker-day .day.sc-calcite-date-picker-day{border-radius:9999px;opacity:1;-webkit-box-shadow:0 0 0 2px var(--calcite-ui-foreground-1);box-shadow:0 0 0 2px var(--calcite-ui-foreground-1)}/*!@:host(:hover[start-of-range].hover--inside-range.focused--end) .day-wrapper, :host(:hover[end-of-range].hover--inside-range.focused--start) .day-wrapper*/.sc-calcite-date-picker-day-h:hover[start-of-range].hover--inside-range.focused--end .day-wrapper.sc-calcite-date-picker-day,.sc-calcite-date-picker-day-h:hover[end-of-range].hover--inside-range.focused--start .day-wrapper.sc-calcite-date-picker-day{background-image:none}/*!@:host([start-of-range].hover--inside-range.focused--end) .day-wrapper, :host([end-of-range].hover--inside-range.focused--start) .day-wrapper*/[start-of-range].hover--inside-range.focused--end.sc-calcite-date-picker-day-h .day-wrapper.sc-calcite-date-picker-day,[end-of-range].hover--inside-range.focused--start.sc-calcite-date-picker-day-h .day-wrapper.sc-calcite-date-picker-day{background-color:var(--calcite-ui-foreground-2)}/*!@:host([highlighted]:last-child) :not(.calcite--rtl) .day-wrapper,\n:host([range-hover]:last-child) :not(.calcite--rtl) .day-wrapper,\n:host([highlighted]:first-child) .calcite--rtl .day-wrapper,\n:host([range-hover]:first-child) .calcite--rtl .day-wrapper*/[highlighted].sc-calcite-date-picker-day-h:last-child .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[range-hover].sc-calcite-date-picker-day-h:last-child .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[highlighted].sc-calcite-date-picker-day-h:first-child .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day,[range-hover].sc-calcite-date-picker-day-h:first-child .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{-webkit-box-shadow:inset -4px 0px 0px 0px var(--calcite-ui-foreground-1);box-shadow:inset -4px 0px 0px 0px var(--calcite-ui-foreground-1)}/*!@:host([highlighted]:first-child) :not(.calcite--rtl) .day-wrapper,\n:host([range-hover]:first-child) :not(.calcite--rtl) .day-wrapper,\n:host([highlighted]:last-child) .calcite--rtl .day-wrapper,\n:host([range-hover]:last-child) .calcite--rtl .day-wrapper*/[highlighted].sc-calcite-date-picker-day-h:first-child .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[range-hover].sc-calcite-date-picker-day-h:first-child .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[highlighted].sc-calcite-date-picker-day-h:last-child .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day,[range-hover].sc-calcite-date-picker-day-h:last-child .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{-webkit-box-shadow:inset 4px 0px 0px 0px var(--calcite-ui-foreground-1);box-shadow:inset 4px 0px 0px 0px var(--calcite-ui-foreground-1)}/*!@:host([scale=s][highlighted]:last-child) :not(.calcite--rtl) .day-wrapper,\n:host([scale=s][range-hover]:last-child) :not(.calcite--rtl) .day-wrapper,\n:host([scale=s][highlighted]:first-child) .calcite--rtl .day-wrapper,\n:host([scale=s][range-hover]:first-child) .calcite--rtl .day-wrapper*/[scale=s][highlighted].sc-calcite-date-picker-day-h:last-child .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[scale=s][range-hover].sc-calcite-date-picker-day-h:last-child .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[scale=s][highlighted].sc-calcite-date-picker-day-h:first-child .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day,[scale=s][range-hover].sc-calcite-date-picker-day-h:first-child .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{-webkit-box-shadow:inset -1px 0px 0px 0px var(--calcite-ui-foreground-1);box-shadow:inset -1px 0px 0px 0px var(--calcite-ui-foreground-1)}/*!@:host([scale=s][highlighted]:first-child) :not(.calcite--rtl) .day-wrapper,\n:host([scale=s][range-hover]:first-child) :not(.calcite--rtl) .day-wrapper,\n:host([scale=s][highlighted]:last-child) .calcite--rtl .day-wrapper,\n:host([scale=s][range-hover]:last-child) .calcite--rtl .day-wrapper*/[scale=s][highlighted].sc-calcite-date-picker-day-h:first-child .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[scale=s][range-hover].sc-calcite-date-picker-day-h:first-child .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[scale=s][highlighted].sc-calcite-date-picker-day-h:last-child .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day,[scale=s][range-hover].sc-calcite-date-picker-day-h:last-child .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{-webkit-box-shadow:inset 1px 0px 0px 0px var(--calcite-ui-foreground-1);box-shadow:inset 1px 0px 0px 0px var(--calcite-ui-foreground-1)}/*!@:host([scale=l][highlighted]:first-child) :not(.calcite--rtl) .day-wrapper,\n:host([scale=l][range-hover]:first-child) :not(.calcite--rtl) .day-wrapper,\n:host([scale=l][highlighted]:last-child) .calcite--rtl .day-wrapper,\n:host([scale=l][range-hover]:last-child) .calcite--rtl .day-wrapper*/[scale=l][highlighted].sc-calcite-date-picker-day-h:first-child .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[scale=l][range-hover].sc-calcite-date-picker-day-h:first-child .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[scale=l][highlighted].sc-calcite-date-picker-day-h:last-child .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day,[scale=l][range-hover].sc-calcite-date-picker-day-h:last-child .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{-webkit-box-shadow:inset 6px 0px 0px 0px var(--calcite-ui-foreground-1);box-shadow:inset 6px 0px 0px 0px var(--calcite-ui-foreground-1)}/*!@:host([highlighted]:first-child) .day-wrapper,\n:host([range-hover]:first-child) .day-wrapper*/[highlighted].sc-calcite-date-picker-day-h:first-child .day-wrapper.sc-calcite-date-picker-day,[range-hover].sc-calcite-date-picker-day-h:first-child .day-wrapper.sc-calcite-date-picker-day{border-start-start-radius:45%;border-end-start-radius:45%}/*!@:host([highlighted]:last-child) .day-wrapper,\n:host([range-hover]:last-child) .day-wrapper*/[highlighted].sc-calcite-date-picker-day-h:last-child .day-wrapper.sc-calcite-date-picker-day,[range-hover].sc-calcite-date-picker-day-h:last-child .day-wrapper.sc-calcite-date-picker-day{border-start-end-radius:45%;border-end-end-radius:45%}/*!@:host([scale=l][highlighted]:last-child) :not(.calcite--rtl) .day-wrapper,\n:host([scale=l][range-hover]:last-child) :not(.calcite--rtl) .day-wrapper,\n:host([scale=l][highlighted]:first-child) .calcite--rtl .day-wrapper,\n:host([scale=l][range-hover]:first-child) .calcite--rtl .day-wrapper*/[scale=l][highlighted].sc-calcite-date-picker-day-h:last-child .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[scale=l][range-hover].sc-calcite-date-picker-day-h:last-child .sc-calcite-date-picker-day:not(.calcite--rtl) .day-wrapper.sc-calcite-date-picker-day,[scale=l][highlighted].sc-calcite-date-picker-day-h:first-child .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day,[scale=l][range-hover].sc-calcite-date-picker-day-h:first-child .calcite--rtl.sc-calcite-date-picker-day .day-wrapper.sc-calcite-date-picker-day{-webkit-box-shadow:inset -6px 0px 0px 0px var(--calcite-ui-foreground-1);box-shadow:inset -6px 0px 0px 0px var(--calcite-ui-foreground-1)}@media (forced-colors: active){/*!@:host(:hover:not([disabled])) .day, :host([active]:not([range])) .day*/.sc-calcite-date-picker-day-h:hover:not([disabled]) .day.sc-calcite-date-picker-day,[active].sc-calcite-date-picker-day-h:not([range]) .day.sc-calcite-date-picker-day{border-radius:0px}/*!@:host([selected])*/[selected].sc-calcite-date-picker-day-h{outline:2px solid canvasText;z-index:1}/*!@:host([selected]) .day*/[selected].sc-calcite-date-picker-day-h .day.sc-calcite-date-picker-day{border-radius:0px;background-color:highlight}/*!@:host([range][selected]) .day-wrapper,\n:host([highlighted]) .day-wrapper,\n:host([range-hover]:not([selected])) .day-wrapper*/[range][selected].sc-calcite-date-picker-day-h .day-wrapper.sc-calcite-date-picker-day,[highlighted].sc-calcite-date-picker-day-h .day-wrapper.sc-calcite-date-picker-day,[range-hover].sc-calcite-date-picker-day-h:not([selected]) .day-wrapper.sc-calcite-date-picker-day{background-color:highlight}/*!@:host([range][selected][start-of-range]) .day-wrapper,\n:host([range][selected][end-of-range]) .day-wrapper*/[range][selected][start-of-range].sc-calcite-date-picker-day-h .day-wrapper.sc-calcite-date-picker-day,[range][selected][end-of-range].sc-calcite-date-picker-day-h .day-wrapper.sc-calcite-date-picker-day{background-color:canvas}}";
- class DatePickerDay {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteDaySelect = createEvent(this, "calciteDaySelect", 7);
- this.calciteDayHover = createEvent(this, "calciteDayHover", 7);
- /** Date is outside of range and can't be selected */
- this.disabled = false;
- /** Date is in the current month. */
- this.currentMonth = false;
- /** Date is the current selected date of the picker */
- this.selected = false;
- /** Date is currently highlighted as part of the range */
- this.highlighted = false;
- /** Showing date range */
- this.range = false;
- /** Date is the start of date range */
- this.startOfRange = false;
- /** Date is the end of date range */
- this.endOfRange = false;
- /** Date is being hovered and within the set range */
- this.rangeHover = false;
- /** Date is actively in focus for keyboard navigation */
- this.active = false;
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- this.onClick = () => {
- !this.disabled && this.calciteDaySelect.emit();
- };
- this.keyDownHandler = (e) => {
- const key = e.key;
- if (key === " " || key === "Enter") {
- !this.disabled && this.calciteDaySelect.emit();
- }
- };
- }
- mouseoverHandler() {
- this.calciteDayHover.emit({
- disabled: this.disabled
- });
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- render() {
- const formattedDay = String(this.day)
- .split("")
- .map((i) => this.localeData.numerals[i])
- .join("");
- const dir = getElementDir(this.el);
- return (hAsync(Host, { onClick: this.onClick, onKeyDown: this.keyDownHandler, role: "gridcell" }, hAsync("div", { class: { "day-v-wrapper": true, [CSS_UTILITY.rtl]: dir === "rtl" } }, hAsync("div", { class: "day-wrapper" }, hAsync("span", { class: "day" }, hAsync("span", { class: "text" }, formattedDay))))));
- }
- componentDidRender() {
- updateHostInteraction(this, this.isTabbable);
- }
- isTabbable() {
- return this.active;
- }
- get el() { return getElement(this); }
- static get style() { return datePickerDayCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-date-picker-day",
- "$members$": {
- "day": [2],
- "disabled": [516],
- "currentMonth": [516, "current-month"],
- "selected": [516],
- "highlighted": [516],
- "range": [516],
- "startOfRange": [516, "start-of-range"],
- "endOfRange": [516, "end-of-range"],
- "rangeHover": [516, "range-hover"],
- "active": [516],
- "localeData": [16],
- "scale": [513],
- "value": [16]
- },
- "$listeners$": [[1, "mouseover", "mouseoverHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"], ["currentMonth", "current-month"], ["selected", "selected"], ["highlighted", "highlighted"], ["range", "range"], ["startOfRange", "start-of-range"], ["endOfRange", "end-of-range"], ["rangeHover", "range-hover"], ["active", "active"], ["scale", "scale"]]
- }; }
- }
- const datePickerMonthCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-date-picker-month:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-date-picker-month{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-date-picker-month{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-date-picker-month{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-date-picker-month{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-date-picker-month{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-date-picker-month:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-date-picker-month-h{display:none}/*!@.calender*/.calender.sc-calcite-date-picker-month{margin-bottom:0.25rem}/*!@.week-headers*/.week-headers.sc-calcite-date-picker-month{display:-ms-flexbox;display:flex;border-width:0px;border-top-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3);padding-top:0px;padding-bottom:0px;padding-left:0.25rem;padding-right:0.25rem}/*!@.week-header*/.week-header.sc-calcite-date-picker-month{text-align:center;font-weight:var(--calcite-font-weight-bold);color:var(--calcite-ui-text-3);width:14.2857142857%}/*!@:host([scale=s]) .week-header*/[scale=s].sc-calcite-date-picker-month-h .week-header.sc-calcite-date-picker-month{padding-left:0px;padding-right:0px;padding-top:0.5rem;padding-bottom:0.75rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=m]) .week-header*/[scale=m].sc-calcite-date-picker-month-h .week-header.sc-calcite-date-picker-month{padding-left:0px;padding-right:0px;padding-top:0.75rem;padding-bottom:1rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=l]) .week-header*/[scale=l].sc-calcite-date-picker-month-h .week-header.sc-calcite-date-picker-month{padding-left:0px;padding-right:0px;padding-top:1rem;padding-bottom:1.25rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@.week-days*/.week-days.sc-calcite-date-picker-month{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;padding-top:0px;padding-bottom:0px;padding-left:6px;padding-right:6px}/*!@.week-days:focus*/.week-days.sc-calcite-date-picker-month:focus{outline:2px solid transparent;outline-offset:2px}";
- class DatePickerMonth {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteDatePickerSelect = createEvent(this, "calciteDatePickerSelect", 7);
- this.calciteDatePickerHover = createEvent(this, "calciteDatePickerHover", 7);
- this.calciteDatePickerActiveDateChange = createEvent(this, "calciteDatePickerActiveDateChange", 7);
- this.calciteDatePickerMouseOut = createEvent(this, "calciteDatePickerMouseOut", 7);
- /** Date currently active.*/
- this.activeDate = new Date();
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- this.keyDownHandler = (e) => {
- const isRTL = this.el.dir === "rtl";
- switch (e.key) {
- case "ArrowUp":
- e.preventDefault();
- this.addDays(-7);
- break;
- case "ArrowRight":
- e.preventDefault();
- this.addDays(isRTL ? -1 : 1);
- break;
- case "ArrowDown":
- e.preventDefault();
- this.addDays(7);
- break;
- case "ArrowLeft":
- e.preventDefault();
- this.addDays(isRTL ? 1 : -1);
- break;
- case "PageUp":
- e.preventDefault();
- this.addMonths(-1);
- break;
- case "PageDown":
- e.preventDefault();
- this.addMonths(1);
- break;
- case "Home":
- e.preventDefault();
- this.activeDate.setDate(1);
- this.addDays();
- break;
- case "End":
- e.preventDefault();
- this.activeDate.setDate(new Date(this.activeDate.getFullYear(), this.activeDate.getMonth() + 1, 0).getDate());
- this.addDays();
- break;
- case "Enter":
- case " ":
- e.preventDefault();
- break;
- case "Tab":
- this.activeFocus = false;
- }
- };
- /**
- * Once user is not interacting via keyboard,
- * disable auto focusing of active date
- */
- this.disableActiveFocus = () => {
- this.activeFocus = false;
- };
- this.dayHover = (e) => {
- const target = e.target;
- if (e.detail.disabled) {
- this.calciteDatePickerMouseOut.emit();
- }
- else {
- this.calciteDatePickerHover.emit(target.value);
- }
- };
- this.daySelect = (e) => {
- const target = e.target;
- this.calciteDatePickerSelect.emit(target.value);
- };
- }
- mouseoutHandler() {
- this.calciteDatePickerMouseOut.emit();
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- render() {
- const month = this.activeDate.getMonth();
- const year = this.activeDate.getFullYear();
- const startOfWeek = this.localeData.weekStart % 7;
- const { abbreviated, short, narrow } = this.localeData.days;
- const weekDays = this.scale === "s" ? narrow || short || abbreviated : short || abbreviated || narrow;
- const adjustedWeekDays = [...weekDays.slice(startOfWeek, 7), ...weekDays.slice(0, startOfWeek)];
- const curMonDays = this.getCurrentMonthDays(month, year);
- const prevMonDays = this.getPrevMonthdays(month, year, startOfWeek);
- const nextMonDays = this.getNextMonthDays(month, year, startOfWeek);
- const days = [
- ...prevMonDays.map((day) => {
- const date = new Date(year, month - 1, day);
- return this.renderDateDay(false, day, date);
- }),
- ...curMonDays.map((day) => {
- const date = new Date(year, month, day);
- const active = sameDate(date, this.activeDate);
- return this.renderDateDay(active, day, date, true, true);
- }),
- ...nextMonDays.map((day) => {
- const date = new Date(year, month + 1, day);
- return this.renderDateDay(false, day, date);
- })
- ];
- const weeks = [];
- for (let i = 0; i < days.length; i += 7) {
- weeks.push(days.slice(i, i + 7));
- }
- return (hAsync(Host, { onFocusOut: this.disableActiveFocus, onKeyDown: this.keyDownHandler }, hAsync("div", { class: "calender", role: "grid" }, hAsync("div", { class: "week-headers", role: "row" }, adjustedWeekDays.map((weekday) => (hAsync("span", { class: "week-header", role: "columnheader" }, weekday)))), weeks.map((days) => (hAsync("div", { class: "week-days", role: "row" }, days))))));
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- /**
- * Add n months to the current month
- */
- addMonths(step) {
- const nextDate = new Date(this.activeDate);
- nextDate.setMonth(this.activeDate.getMonth() + step);
- this.calciteDatePickerActiveDateChange.emit(dateFromRange(nextDate, this.min, this.max));
- this.activeFocus = true;
- }
- /**
- * Add n days to the current date
- */
- addDays(step = 0) {
- const nextDate = new Date(this.activeDate);
- nextDate.setDate(this.activeDate.getDate() + step);
- this.calciteDatePickerActiveDateChange.emit(dateFromRange(nextDate, this.min, this.max));
- this.activeFocus = true;
- }
- /**
- * Get dates for last days of the previous month
- */
- getPrevMonthdays(month, year, startOfWeek) {
- const lastDate = new Date(year, month, 0);
- const date = lastDate.getDate();
- const day = lastDate.getDay();
- const days = [];
- if (day - 6 === startOfWeek) {
- return days;
- }
- for (let i = Math.abs(lastDate.getDay() - startOfWeek); i >= 0; i--) {
- days.push(date - i);
- }
- return days;
- }
- /**
- * Get dates for the current month
- */
- getCurrentMonthDays(month, year) {
- const num = new Date(year, month + 1, 0).getDate();
- const days = [];
- for (let i = 0; i < num; i++) {
- days.push(i + 1);
- }
- return days;
- }
- /**
- * Get dates for first days of the next month
- */
- getNextMonthDays(month, year, startOfWeek) {
- const endDay = new Date(year, month + 1, 0).getDay();
- const days = [];
- if (endDay === (startOfWeek + 6) % 7) {
- return days;
- }
- for (let i = 0; i < (6 - (endDay - startOfWeek)) % 7; i++) {
- days.push(i + 1);
- }
- return days;
- }
- /**
- * Determine if the date is in between the start and end dates
- */
- betweenSelectedRange(date) {
- return !!(this.startDate &&
- this.endDate &&
- date > this.startDate &&
- date < this.endDate &&
- !this.isRangeHover(date));
- }
- /**
- * Determine if the date should be in selected state
- */
- isSelected(date) {
- return !!(sameDate(date, this.selectedDate) ||
- (this.startDate && sameDate(date, this.startDate)) ||
- (this.endDate && sameDate(date, this.endDate)));
- }
- /**
- * Determine if the date is the start of the date range
- */
- isStartOfRange(date) {
- return !!(this.startDate &&
- !sameDate(this.startDate, this.endDate) &&
- sameDate(this.startDate, date) &&
- !this.isEndOfRange(date));
- }
- isEndOfRange(date) {
- return !!((this.endDate && !sameDate(this.startDate, this.endDate) && sameDate(this.endDate, date)) ||
- (!this.endDate &&
- this.hoverRange &&
- sameDate(this.startDate, this.hoverRange.end) &&
- sameDate(date, this.hoverRange.end)));
- }
- /**
- * Render calcite-date-picker-day
- */
- renderDateDay(active, day, date, currentMonth, ref) {
- var _a;
- const isFocusedOnStart = this.isFocusedOnStart();
- const isHoverInRange = this.isHoverInRange() ||
- (!this.endDate && this.hoverRange && sameDate((_a = this.hoverRange) === null || _a === void 0 ? void 0 : _a.end, this.startDate));
- return (hAsync("calcite-date-picker-day", { active: active, class: {
- "hover--inside-range": this.startDate && isHoverInRange,
- "hover--outside-range": this.startDate && !isHoverInRange,
- "focused--start": isFocusedOnStart,
- "focused--end": !isFocusedOnStart
- }, currentMonth: currentMonth, day: day, disabled: !inRange(date, this.min, this.max), endOfRange: this.isEndOfRange(date), highlighted: this.betweenSelectedRange(date), key: date.toDateString(), localeData: this.localeData, onCalciteDayHover: this.dayHover, onCalciteDaySelect: this.daySelect, range: !!this.startDate && !!this.endDate && !sameDate(this.startDate, this.endDate), rangeHover: this.isRangeHover(date), ref: (el) => {
- // when moving via keyboard, focus must be updated on active date
- if (ref && active && this.activeFocus) {
- el === null || el === void 0 ? void 0 : el.focus();
- }
- }, scale: this.scale, selected: this.isSelected(date), startOfRange: this.isStartOfRange(date), value: date }));
- }
- isFocusedOnStart() {
- var _a;
- return ((_a = this.hoverRange) === null || _a === void 0 ? void 0 : _a.focused) === "start";
- }
- isHoverInRange() {
- if (!this.hoverRange) {
- return false;
- }
- const { start, end } = this.hoverRange;
- return !!((!this.isFocusedOnStart() && this.startDate && (!this.endDate || end < this.endDate)) ||
- (this.isFocusedOnStart() && this.startDate && start > this.startDate));
- }
- isRangeHover(date) {
- if (!this.hoverRange) {
- return false;
- }
- const { start, end } = this.hoverRange;
- const isStart = this.isFocusedOnStart();
- const insideRange = this.isHoverInRange();
- const cond1 = insideRange &&
- ((!isStart && date > this.startDate && (date < end || sameDate(date, end))) ||
- (isStart && date < this.endDate && (date > start || sameDate(date, start))));
- const cond2 = !insideRange &&
- ((!isStart && date >= this.endDate && (date < end || sameDate(date, end))) ||
- (isStart &&
- (date < this.startDate || (this.endDate && sameDate(date, this.startDate))) &&
- (date > start || sameDate(date, start))));
- return cond1 || cond2;
- }
- get el() { return getElement(this); }
- static get style() { return datePickerMonthCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-date-picker-month",
- "$members$": {
- "selectedDate": [16],
- "activeDate": [16],
- "startDate": [16],
- "endDate": [16],
- "min": [16],
- "max": [16],
- "scale": [513],
- "localeData": [16],
- "hoverRange": [16]
- },
- "$listeners$": [[1, "mouseout", "mouseoutHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["scale", "scale"]]
- }; }
- }
- const datePickerMonthHeaderCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-date-picker-month-header:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-date-picker-month-header{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-date-picker-month-header{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-date-picker-month-header{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-date-picker-month-header{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-date-picker-month-header{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-date-picker-month-header:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-date-picker-month-header-h{display:none}/*!@:host*/.sc-calcite-date-picker-month-header-h{display:block}/*!@.header*/.header.sc-calcite-date-picker-month-header{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;padding-top:0px;padding-bottom:0px;padding-left:0.25rem;padding-right:0.25rem}/*!@:host([scale=s]) .text*/[scale=s].sc-calcite-date-picker-month-header-h .text.sc-calcite-date-picker-month-header{margin-top:0.5rem;margin-bottom:0.5rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=s]) .chevron*/[scale=s].sc-calcite-date-picker-month-header-h .chevron.sc-calcite-date-picker-month-header{height:2.25rem}/*!@:host([scale=m]) .text*/[scale=m].sc-calcite-date-picker-month-header-h .text.sc-calcite-date-picker-month-header{margin-top:0.75rem;margin-bottom:0.75rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host([scale=m]) .chevron*/[scale=m].sc-calcite-date-picker-month-header-h .chevron.sc-calcite-date-picker-month-header{height:3rem}/*!@:host([scale=l]) .text*/[scale=l].sc-calcite-date-picker-month-header-h .text.sc-calcite-date-picker-month-header{margin-top:1rem;margin-bottom:1rem;font-size:var(--calcite-font-size-1);line-height:1.5rem}/*!@:host([scale=l]) .chevron*/[scale=l].sc-calcite-date-picker-month-header-h .chevron.sc-calcite-date-picker-month-header{height:3.5rem}/*!@.chevron*/.chevron.sc-calcite-date-picker-month-header{margin-left:-0.25rem;margin-right:-0.25rem;-webkit-box-sizing:content-box;box-sizing:content-box;display:-ms-flexbox;display:flex;-ms-flex-positive:0;flex-grow:0;cursor:pointer;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border-style:none;background-color:var(--calcite-ui-foreground-1);padding-left:0.25rem;padding-right:0.25rem;color:var(--calcite-ui-text-3);outline:2px solid transparent;outline-offset:2px;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;width:14.2857142857%}/*!@.chevron:focus*/.chevron.sc-calcite-date-picker-month-header:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@.chevron:hover, .chevron:focus*/.chevron.sc-calcite-date-picker-month-header:hover,.chevron.sc-calcite-date-picker-month-header:focus{background-color:var(--calcite-ui-foreground-2);fill:var(--calcite-ui-text-1);color:var(--calcite-ui-text-1)}/*!@.chevron:active*/.chevron.sc-calcite-date-picker-month-header:active{background-color:var(--calcite-ui-foreground-3)}/*!@.chevron[aria-disabled=true]*/.chevron[aria-disabled=true].sc-calcite-date-picker-month-header{pointer-events:none;opacity:0}/*!@.text*/.text.sc-calcite-date-picker-month-header{margin-top:auto;margin-bottom:auto;width:100%;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;text-align:center;line-height:1}/*!@.text-nreverse*/.text-nreverse.sc-calcite-date-picker-month-header{-ms-flex-direction:row-reverse;flex-direction:row-reverse}/*!@.month, .year, .suffix*/.month.sc-calcite-date-picker-month-header,.year.sc-calcite-date-picker-month-header,.suffix.sc-calcite-date-picker-month-header{margin-left:0.25rem;margin-right:0.25rem;margin-top:auto;margin-bottom:auto;display:inline-block;background-color:var(--calcite-ui-foreground-1);font-weight:var(--calcite-font-weight-medium);line-height:1.25;color:var(--calcite-ui-text-1);font-size:inherit}/*!@.year*/.year.sc-calcite-date-picker-month-header{position:relative;width:3rem;border-style:none;background-color:transparent;text-align:center;font-family:inherit;outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;z-index:2}/*!@.year:hover*/.year.sc-calcite-date-picker-month-header:hover{-webkit-transition-duration:100ms;transition-duration:100ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-property:outline-color;transition-property:outline-color;outline:2px solid var(--calcite-ui-border-2);outline-offset:2px}/*!@.year:focus*/.year.sc-calcite-date-picker-month-header:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:2px}/*!@.year--suffix*/.year--suffix.sc-calcite-date-picker-month-header{width:4rem;text-align:left}/*!@.year-wrap*/.year-wrap.sc-calcite-date-picker-month-header{position:relative}/*!@.suffix*/.suffix.sc-calcite-date-picker-month-header{position:absolute;top:0px;left:0px;width:4rem;white-space:nowrap;text-align:left}/*!@.suffix__invisible*/.suffix__invisible.sc-calcite-date-picker-month-header{visibility:hidden}";
- class DatePickerMonthHeader {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteDatePickerSelect = createEvent(this, "calciteDatePickerSelect", 7);
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- /**
- * Increment year on UP/DOWN keys
- */
- this.onYearKey = (e) => {
- const localizedYear = e.target.value;
- switch (e.key) {
- case "ArrowDown":
- e.preventDefault();
- this.setYear({ localizedYear, offset: -1 });
- break;
- case "ArrowUp":
- e.preventDefault();
- this.setYear({ localizedYear, offset: 1 });
- break;
- }
- };
- this.onYearChange = (event) => {
- this.setYear({ localizedYear: event.target.value });
- };
- this.onYearInput = (event) => {
- this.setYear({ localizedYear: event.target.value, commit: false });
- };
- this.prevMonthClick = (e) => {
- this.handleArrowClick(e, this.prevMonthDate);
- };
- this.prevMonthKeydown = (e) => {
- const key = e.key;
- if (key === " " || key === "Enter") {
- this.prevMonthClick(e);
- }
- };
- this.nextMonthClick = (e) => {
- this.handleArrowClick(e, this.nextMonthDate);
- };
- this.nextMonthKeydown = (e) => {
- const key = e.key;
- if (key === " " || key === "Enter") {
- this.nextMonthClick(e);
- }
- };
- /*
- * Update active month on clicks of left/right arrows
- */
- this.handleArrowClick = (e, date) => {
- e === null || e === void 0 ? void 0 : e.preventDefault();
- e.stopPropagation();
- this.calciteDatePickerSelect.emit(date);
- };
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- this.setNextPrevMonthDates();
- }
- render() {
- return hAsync("div", { class: "header" }, this.renderContent());
- }
- renderContent() {
- var _a;
- if (!this.activeDate || !this.localeData) {
- return null;
- }
- const activeMonth = this.activeDate.getMonth();
- const { months, unitOrder } = this.localeData;
- const localizedMonth = (months.wide || months.narrow || months.abbreviated)[activeMonth];
- const localizedYear = localizeNumber(this.activeDate.getFullYear(), this.localeData);
- const iconScale = this.scale === "l" ? "m" : "s";
- const order = getOrder(unitOrder);
- const reverse = order.indexOf("y") < order.indexOf("m");
- const suffix = (_a = this.localeData.year) === null || _a === void 0 ? void 0 : _a.suffix;
- return (hAsync(Fragment, null, hAsync("a", { "aria-disabled": (this.prevMonthDate.getMonth() === activeMonth).toString(), "aria-label": this.intlPrevMonth, class: "chevron", href: "#", onClick: this.prevMonthClick, onKeyDown: this.prevMonthKeydown, role: "button", tabindex: this.prevMonthDate.getMonth() === activeMonth ? -1 : 0 }, hAsync("calcite-icon", { "flip-rtl": true, icon: "chevron-left", scale: iconScale })), hAsync("div", { class: { text: true, "text--reverse": reverse } }, hAsync(Heading, { class: "month", level: this.headingLevel }, localizedMonth), hAsync("span", { class: "year-wrap" }, hAsync("input", { "aria-label": this.intlYear, class: {
- year: true,
- "year--suffix": !!suffix
- }, inputmode: "numeric", maxlength: "4", minlength: "1", onChange: this.onYearChange, onInput: this.onYearInput, onKeyDown: this.onYearKey, pattern: "\\d*", ref: (el) => (this.yearInput = el), type: "text", value: localizedYear }), suffix && (hAsync("span", { class: "suffix" }, hAsync("span", { "aria-hidden": "true", class: "suffix__invisible" }, localizedYear), " " + suffix)))), hAsync("a", { "aria-disabled": (this.nextMonthDate.getMonth() === activeMonth).toString(), "aria-label": this.intlNextMonth, class: "chevron", href: "#", onClick: this.nextMonthClick, onKeyDown: this.nextMonthKeydown, role: "button", tabindex: this.nextMonthDate.getMonth() === activeMonth ? -1 : 0 }, hAsync("calcite-icon", { "flip-rtl": true, icon: "chevron-right", scale: iconScale }))));
- }
- setNextPrevMonthDates() {
- if (!this.activeDate) {
- return;
- }
- this.nextMonthDate = dateFromRange(nextMonth(this.activeDate), this.min, this.max);
- this.prevMonthDate = dateFromRange(prevMonth(this.activeDate), this.min, this.max);
- }
- getInRangeDate({ localizedYear, offset = 0 }) {
- const { min, max, activeDate, localeData } = this;
- const parsedYear = parseNumber(localizedYear, localeData);
- const length = parsedYear.toString().length;
- const year = isNaN(parsedYear) ? false : parsedYear + offset;
- const inRange = year && (!min || min.getFullYear() <= year) && (!max || max.getFullYear() >= year);
- // if you've supplied a year and it's in range
- if (year && inRange && length === localizedYear.length) {
- const nextDate = new Date(activeDate);
- nextDate.setFullYear(year);
- return dateFromRange(nextDate, min, max);
- }
- }
- /**
- * Parse localized year string from input,
- * set to active if in range
- */
- setYear({ localizedYear, commit = true, offset = 0 }) {
- const { yearInput, activeDate, localeData } = this;
- const inRangeDate = this.getInRangeDate({ localizedYear, offset });
- // if you've supplied a year and it's in range, update active date
- if (inRangeDate) {
- this.calciteDatePickerSelect.emit(inRangeDate);
- }
- if (commit) {
- yearInput.value = localizeNumber((inRangeDate || activeDate).getFullYear(), localeData);
- }
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "min": ["setNextPrevMonthDates"],
- "max": ["setNextPrevMonthDates"],
- "activeDate": ["setNextPrevMonthDates"]
- }; }
- static get style() { return datePickerMonthHeaderCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-date-picker-month-header",
- "$members$": {
- "selectedDate": [16],
- "activeDate": [16],
- "headingLevel": [2, "heading-level"],
- "min": [16],
- "max": [16],
- "locale": [1],
- "intlPrevMonth": [1, "intl-prev-month"],
- "intlNextMonth": [1, "intl-next-month"],
- "intlYear": [1, "intl-year"],
- "scale": [513],
- "localeData": [16],
- "nextMonthDate": [32],
- "prevMonthDate": [32]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["scale", "scale"]]
- }; }
- }
- const SLOTS$h = {
- dropdownTrigger: "dropdown-trigger"
- };
- const dropdownCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-dropdown:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-dropdown{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-dropdown{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-dropdown{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-dropdown{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-dropdown{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-dropdown:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-dropdown-h{display:none}/*!@:host*/.sc-calcite-dropdown-h{display:-ms-inline-flexbox;display:inline-flex;-ms-flex:0 1 auto;flex:0 1 auto}/*!@:host([disabled])*/[disabled].sc-calcite-dropdown-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-dropdown-h[disabled] .sc-calcite-dropdown-s>[calcite-hydrated][disabled],[disabled].sc-calcite-dropdown-h [calcite-hydrated][disabled].sc-calcite-dropdown{opacity:1}/*!@:host .calcite-dropdown-wrapper*/.sc-calcite-dropdown-h .calcite-dropdown-wrapper.sc-calcite-dropdown{display:block;position:absolute;z-index:900;-webkit-transform:scale(0);transform:scale(0);visibility:hidden;pointer-events:none}/*!@.calcite-dropdown-wrapper .calcite-popper-anim*/.calcite-dropdown-wrapper.sc-calcite-dropdown .calcite-popper-anim.sc-calcite-dropdown{position:relative;z-index:1;-webkit-transition:var(--calcite-popper-transition);transition:var(--calcite-popper-transition);visibility:hidden;-webkit-transition-property:visibility, opacity, -webkit-transform;transition-property:visibility, opacity, -webkit-transform;transition-property:transform, visibility, opacity;transition-property:transform, visibility, opacity, -webkit-transform;opacity:0;-webkit-box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);border-radius:0.25rem}/*!@.calcite-dropdown-wrapper[data-popper-placement^=bottom] .calcite-popper-anim*/.calcite-dropdown-wrapper[data-popper-placement^=bottom].sc-calcite-dropdown .calcite-popper-anim.sc-calcite-dropdown{-webkit-transform:translateY(-5px);transform:translateY(-5px)}/*!@.calcite-dropdown-wrapper[data-popper-placement^=top] .calcite-popper-anim*/.calcite-dropdown-wrapper[data-popper-placement^=top].sc-calcite-dropdown .calcite-popper-anim.sc-calcite-dropdown{-webkit-transform:translateY(5px);transform:translateY(5px)}/*!@.calcite-dropdown-wrapper[data-popper-placement^=left] .calcite-popper-anim*/.calcite-dropdown-wrapper[data-popper-placement^=left].sc-calcite-dropdown .calcite-popper-anim.sc-calcite-dropdown{-webkit-transform:translateX(5px);transform:translateX(5px)}/*!@.calcite-dropdown-wrapper[data-popper-placement^=right] .calcite-popper-anim*/.calcite-dropdown-wrapper[data-popper-placement^=right].sc-calcite-dropdown .calcite-popper-anim.sc-calcite-dropdown{-webkit-transform:translateX(-5px);transform:translateX(-5px)}/*!@.calcite-dropdown-wrapper[data-popper-placement] .calcite-popper-anim--active*/.calcite-dropdown-wrapper[data-popper-placement].sc-calcite-dropdown .calcite-popper-anim--active.sc-calcite-dropdown{opacity:1;visibility:visible;-webkit-transform:translate(0);transform:translate(0)}/*!@:host([active]) .calcite-dropdown-wrapper*/[active].sc-calcite-dropdown-h .calcite-dropdown-wrapper.sc-calcite-dropdown{pointer-events:initial;visibility:visible}/*!@:host .calcite-dropdown-content*/.sc-calcite-dropdown-h .calcite-dropdown-content.sc-calcite-dropdown{width:auto;overflow-y:auto;overflow-x:hidden;background-color:var(--calcite-ui-foreground-1);max-height:90vh;width:var(--calcite-dropdown-width)}/*!@.calcite-dropdown-trigger-container*/.calcite-dropdown-trigger-container.sc-calcite-dropdown{position:relative;display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto}/*!@:host([width=s])*/[width=s].sc-calcite-dropdown-h{--calcite-dropdown-width:12rem}/*!@:host([width=m])*/[width=m].sc-calcite-dropdown-h{--calcite-dropdown-width:14rem}/*!@:host([width=l])*/[width=l].sc-calcite-dropdown-h{--calcite-dropdown-width:16rem}";
- /**
- * @slot - A slot for adding `calcite-dropdown-group`s or `calcite-dropdown-item`s.
- * @slot dropdown-trigger - A slot for the element that triggers the dropdown.
- */
- class Dropdown {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteDropdownSelect = createEvent(this, "calciteDropdownSelect", 7);
- this.calciteDropdownOpen = createEvent(this, "calciteDropdownOpen", 7);
- this.calciteDropdownClose = createEvent(this, "calciteDropdownClose", 7);
- //--------------------------------------------------------------------------
- //
- // Public Properties
- //
- //--------------------------------------------------------------------------
- /** Opens or closes the dropdown */
- this.active = false;
- /**
- allow the dropdown to remain open after a selection is made
- if the selection-mode of the selected item's containing group is "none", the dropdown will always close
- */
- this.disableCloseOnSelect = false;
- /** is the dropdown disabled */
- this.disabled = false;
- /**
- specify the maximum number of calcite-dropdown-items to display before showing the scroller, must be greater than 0 -
- this value does not include groupTitles passed to calcite-dropdown-group
- */
- this.maxItems = 0;
- /** Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value. */
- this.overlayPositioning = "absolute";
- /**
- * Determines where the dropdown will be positioned relative to the button.
- * @default "bottom-leading"
- */
- this.placement = defaultMenuPlacement;
- /** specify the scale of dropdown, defaults to m */
- this.scale = "m";
- /**
- * **read-only** The currently selected items
- *
- * @readonly
- */
- this.selectedItems = [];
- /** specify whether the dropdown is opened by hover or click of a trigger element */
- this.type = "click";
- /** specify the width of dropdown, defaults to m */
- this.width = "m";
- this.items = [];
- this.groups = [];
- this.activeTransitionProp = "visibility";
- this.mutationObserver = createObserver();
- this.resizeObserver = createObserver();
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- this.setFilteredPlacements = () => {
- const { el, flipPlacements } = this;
- this.filteredFlipPlacements = flipPlacements
- ? filterComputedPlacements(flipPlacements, el)
- : null;
- };
- this.updateTriggers = (event) => {
- this.triggers = event.target.assignedElements({
- flatten: true
- });
- this.reposition();
- };
- this.updateItems = () => {
- this.items = this.groups
- .map((group) => Array.from(group === null || group === void 0 ? void 0 : group.querySelectorAll("calcite-dropdown-item")))
- .reduce((previousValue, currentValue) => [...previousValue, ...currentValue], []);
- this.updateSelectedItems();
- this.reposition();
- };
- this.updateGroups = (event) => {
- const groups = event.target
- .assignedElements({ flatten: true })
- .filter((el) => el === null || el === void 0 ? void 0 : el.matches("calcite-dropdown-group"));
- this.groups = groups;
- this.updateItems();
- };
- this.setMaxScrollerHeight = () => {
- const { active, scrollerEl } = this;
- if (!scrollerEl || !active) {
- return;
- }
- this.reposition();
- const maxScrollerHeight = this.getMaxScrollerHeight();
- scrollerEl.style.maxHeight = maxScrollerHeight > 0 ? `${maxScrollerHeight}px` : "";
- this.reposition();
- };
- this.setScrollerEl = (scrollerEl) => {
- this.resizeObserver.observe(scrollerEl);
- this.scrollerEl = scrollerEl;
- };
- this.transitionEnd = (event) => {
- if (event.propertyName === this.activeTransitionProp) {
- this.active ? this.calciteDropdownOpen.emit() : this.calciteDropdownClose.emit();
- }
- };
- this.setReferenceEl = (el) => {
- this.referenceEl = el;
- };
- this.setMenuEl = (el) => {
- this.menuEl = el;
- };
- this.keyDownHandler = (e) => {
- const target = e.target;
- if (target !== this.referenceEl) {
- return;
- }
- const key = e.key;
- if (this.active && (key === "Escape" || (e.shiftKey && key === "Tab"))) {
- this.closeCalciteDropdown();
- return;
- }
- switch (key) {
- case " ":
- case "Enter":
- this.openCalciteDropdown();
- break;
- case "Escape":
- this.closeCalciteDropdown();
- break;
- }
- };
- this.focusOnFirstActiveOrFirstItem = () => {
- this.getFocusableElement(this.items.find((item) => item.active) || this.items[0]);
- };
- this.toggleOpenEnd = () => {
- this.focusOnFirstActiveOrFirstItem();
- this.el.removeEventListener("calciteDropdownOpen", this.toggleOpenEnd);
- };
- this.openCalciteDropdown = () => {
- this.active = !this.active;
- if (this.active) {
- this.el.addEventListener("calciteDropdownOpen", this.toggleOpenEnd);
- }
- };
- }
- activeHandler() {
- if (!this.disabled) {
- this.reposition();
- return;
- }
- this.active = false;
- }
- handleDisabledChange(value) {
- if (!value) {
- this.active = false;
- }
- }
- flipPlacementsHandler() {
- this.setFilteredPlacements();
- }
- maxItemsHandler() {
- this.setMaxScrollerHeight();
- }
- placementHandler() {
- this.reposition();
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });
- this.createPopper();
- this.setFilteredPlacements();
- }
- componentDidLoad() {
- this.reposition();
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- disconnectedCallback() {
- var _a, _b;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- (_b = this.resizeObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
- this.destroyPopper();
- }
- render() {
- const { active } = this;
- return (hAsync(Host, null, hAsync("div", { class: "calcite-dropdown-trigger-container", onClick: this.openCalciteDropdown, onKeyDown: this.keyDownHandler, ref: this.setReferenceEl }, hAsync("slot", { "aria-expanded": toAriaBoolean(active), "aria-haspopup": "true", name: SLOTS$h.dropdownTrigger, onSlotchange: this.updateTriggers })), hAsync("div", { "aria-hidden": toAriaBoolean(!active), class: "calcite-dropdown-wrapper", ref: this.setMenuEl }, hAsync("div", { class: {
- ["calcite-dropdown-content"]: true,
- [CSS$D.animation]: true,
- [CSS$D.animationActive]: active
- }, onTransitionEnd: this.transitionEnd, ref: this.setScrollerEl }, hAsync("div", { hidden: !this.active }, hAsync("slot", { onSlotchange: this.updateGroups }))))));
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Updates the position of the component. */
- async reposition() {
- const { popper, menuEl, placement } = this;
- const modifiers = this.getModifiers();
- popper
- ? await updatePopper({
- el: menuEl,
- modifiers,
- placement,
- popper
- })
- : this.createPopper();
- }
- closeCalciteDropdownOnClick(e) {
- if (!this.active || e.composedPath().includes(this.el)) {
- return;
- }
- this.closeCalciteDropdown(false);
- }
- closeCalciteDropdownOnEvent() {
- this.closeCalciteDropdown();
- }
- closeCalciteDropdownOnOpenEvent(e) {
- if (e.composedPath().includes(this.el)) {
- return;
- }
- this.active = false;
- }
- mouseEnterHandler() {
- if (this.type === "hover") {
- this.openCalciteDropdown();
- }
- }
- mouseLeaveHandler() {
- if (this.type === "hover") {
- this.closeCalciteDropdown();
- }
- }
- calciteDropdownItemKeyEvent(e) {
- const { keyboardEvent } = e.detail;
- // handle edge
- const target = keyboardEvent.target;
- const itemToFocus = target.nodeName !== "A" ? target : target.parentNode;
- const isFirstItem = this.itemIndex(itemToFocus) === 0;
- const isLastItem = this.itemIndex(itemToFocus) === this.items.length - 1;
- switch (keyboardEvent.key) {
- case "Tab":
- if (isLastItem && !keyboardEvent.shiftKey) {
- this.closeCalciteDropdown();
- }
- else if (isFirstItem && keyboardEvent.shiftKey) {
- this.closeCalciteDropdown();
- }
- else if (keyboardEvent.shiftKey) {
- this.focusPrevItem(itemToFocus);
- }
- else {
- this.focusNextItem(itemToFocus);
- }
- break;
- case "ArrowDown":
- this.focusNextItem(itemToFocus);
- break;
- case "ArrowUp":
- this.focusPrevItem(itemToFocus);
- break;
- case "Home":
- this.focusFirstItem();
- break;
- case "End":
- this.focusLastItem();
- break;
- }
- e.stopPropagation();
- }
- handleItemSelect(event) {
- this.updateSelectedItems();
- event.stopPropagation();
- this.calciteDropdownSelect.emit();
- if (!this.disableCloseOnSelect ||
- event.detail.requestedDropdownGroup.selectionMode === "none") {
- this.closeCalciteDropdown();
- }
- }
- getModifiers() {
- const flipModifier = {
- name: "flip",
- enabled: true
- };
- flipModifier.options = {
- fallbackPlacements: this.filteredFlipPlacements || popperMenuComputedPlacements
- };
- const eventListenerModifier = {
- name: "eventListeners",
- enabled: this.active
- };
- return [flipModifier, eventListenerModifier];
- }
- createPopper() {
- this.destroyPopper();
- const { menuEl, referenceEl, placement, overlayPositioning } = this;
- const modifiers = this.getModifiers();
- this.popper = createPopper({
- el: menuEl,
- modifiers,
- overlayPositioning,
- placement,
- referenceEl
- });
- }
- destroyPopper() {
- const { popper } = this;
- if (popper) {
- popper.destroy();
- }
- this.popper = null;
- }
- updateSelectedItems() {
- this.selectedItems = this.items.filter((item) => item.active);
- }
- getMaxScrollerHeight() {
- const { maxItems } = this;
- let itemsToProcess = 0;
- let maxScrollerHeight = 0;
- let groupHeaderHeight;
- this.groups.forEach((group) => {
- if (maxItems > 0 && itemsToProcess < maxItems) {
- Array.from(group.children).forEach((item, index) => {
- if (index === 0) {
- if (isNaN(groupHeaderHeight)) {
- groupHeaderHeight = item.offsetTop;
- }
- maxScrollerHeight += groupHeaderHeight;
- }
- if (itemsToProcess < maxItems) {
- maxScrollerHeight += item.offsetHeight;
- itemsToProcess += 1;
- }
- });
- }
- });
- return maxScrollerHeight;
- }
- closeCalciteDropdown(focusTrigger = true) {
- this.active = false;
- if (focusTrigger) {
- focusElement(this.triggers[0]);
- }
- }
- focusFirstItem() {
- const firstItem = this.items[0];
- this.getFocusableElement(firstItem);
- }
- focusLastItem() {
- const lastItem = this.items[this.items.length - 1];
- this.getFocusableElement(lastItem);
- }
- focusNextItem(e) {
- const index = this.itemIndex(e);
- const nextItem = this.items[index + 1] || this.items[0];
- this.getFocusableElement(nextItem);
- }
- focusPrevItem(e) {
- const index = this.itemIndex(e);
- const prevItem = this.items[index - 1] || this.items[this.items.length - 1];
- this.getFocusableElement(prevItem);
- }
- itemIndex(e) {
- return this.items.indexOf(e);
- }
- getFocusableElement(item) {
- if (!item) {
- return;
- }
- const target = item.attributes.isLink
- ? item.shadowRoot.querySelector("a")
- : item;
- focusElement(target);
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "active": ["activeHandler"],
- "disabled": ["handleDisabledChange"],
- "flipPlacements": ["flipPlacementsHandler"],
- "maxItems": ["maxItemsHandler"],
- "placement": ["placementHandler"]
- }; }
- static get style() { return dropdownCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-dropdown",
- "$members$": {
- "active": [1540],
- "disableCloseOnSelect": [516, "disable-close-on-select"],
- "disabled": [516],
- "flipPlacements": [16],
- "maxItems": [2, "max-items"],
- "overlayPositioning": [1, "overlay-positioning"],
- "placement": [513],
- "scale": [513],
- "selectedItems": [1040],
- "type": [513],
- "width": [513],
- "reposition": [64]
- },
- "$listeners$": [[8, "click", "closeCalciteDropdownOnClick"], [0, "calciteDropdownCloseRequest", "closeCalciteDropdownOnEvent"], [8, "calciteDropdownOpen", "closeCalciteDropdownOnOpenEvent"], [1, "mouseenter", "mouseEnterHandler"], [1, "mouseleave", "mouseLeaveHandler"], [0, "calciteDropdownItemKeyEvent", "calciteDropdownItemKeyEvent"], [0, "calciteDropdownItemSelect", "handleItemSelect"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["active", "active"], ["disableCloseOnSelect", "disable-close-on-select"], ["disabled", "disabled"], ["placement", "placement"], ["scale", "scale"], ["type", "type"], ["width", "width"]]
- }; }
- }
- const CSS$A = {
- containerSmall: "container--s",
- containerMedium: "container--m",
- containerLarge: "container--l"
- };
- const dropdownGroupCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-dropdown-group:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-dropdown-group{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-dropdown-group{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-dropdown-group{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-dropdown-group{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-dropdown-group{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-dropdown-group:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-dropdown-group-h{display:none}/*!@:host*/.sc-calcite-dropdown-group-h{display:block}/*!@.container--s*/.container--s.sc-calcite-dropdown-group{font-size:var(--calcite-font-size--2);line-height:1rem}/*!@.container--s .dropdown-title*/.container--s.sc-calcite-dropdown-group .dropdown-title.sc-calcite-dropdown-group{padding:0.5rem}/*!@.container--m*/.container--m.sc-calcite-dropdown-group{font-size:var(--calcite-font-size--1);line-height:1rem}/*!@.container--m .dropdown-title*/.container--m.sc-calcite-dropdown-group .dropdown-title.sc-calcite-dropdown-group{padding:0.75rem}/*!@.container--l*/.container--l.sc-calcite-dropdown-group{font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@.container--l .dropdown-title*/.container--l.sc-calcite-dropdown-group .dropdown-title.sc-calcite-dropdown-group{padding:1rem}/*!@.dropdown-title*/.dropdown-title.sc-calcite-dropdown-group{margin-bottom:-1px;display:block;cursor:default;overflow-wrap:break-word;border-width:0px;border-bottom-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3);font-weight:var(--calcite-font-weight-bold);color:var(--calcite-ui-text-2)}/*!@.dropdown-separator*/.dropdown-separator.sc-calcite-dropdown-group{display:block;height:1px;background-color:var(--calcite-ui-border-3)}";
- /**
- * @slot - A slot for adding `calcite-dropdown-item`s.
- */
- class DropdownGroup {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteDropdownItemChange = createEvent(this, "calciteDropdownItemChange", 7);
- /** specify the selection mode - multi (allow any number of (or no) active items), single (allow and require one active item),
- none (no active items), defaults to single */
- this.selectionMode = "single";
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentWillLoad() {
- this.groupPosition = this.getGroupPosition();
- }
- render() {
- const scale = this.scale || getElementProp(this.el, "scale", "m");
- const groupTitle = this.groupTitle ? (hAsync("span", { "aria-hidden": "true", class: "dropdown-title" }, this.groupTitle)) : null;
- const dropdownSeparator = this.groupPosition > 0 ? hAsync("div", { class: "dropdown-separator", role: "separator" }) : null;
- return (hAsync(Host, { role: "menu" }, hAsync("div", { class: {
- container: true,
- [CSS$A.containerSmall]: scale === "s",
- [CSS$A.containerMedium]: scale === "m",
- [CSS$A.containerLarge]: scale === "l"
- }, title: this.groupTitle }, dropdownSeparator, groupTitle, hAsync("slot", null))));
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- updateActiveItemOnChange(event) {
- this.requestedDropdownGroup = event.detail.requestedDropdownGroup;
- this.requestedDropdownItem = event.detail.requestedDropdownItem;
- this.calciteDropdownItemChange.emit({
- requestedDropdownGroup: this.requestedDropdownGroup,
- requestedDropdownItem: this.requestedDropdownItem
- });
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- getGroupPosition() {
- return Array.prototype.indexOf.call(this.el.parentElement.querySelectorAll("calcite-dropdown-group"), this.el);
- }
- get el() { return getElement(this); }
- static get style() { return dropdownGroupCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-dropdown-group",
- "$members$": {
- "groupTitle": [513, "group-title"],
- "selectionMode": [513, "selection-mode"],
- "scale": [513]
- },
- "$listeners$": [[0, "calciteDropdownItemSelect", "updateActiveItemOnChange"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["groupTitle", "group-title"], ["selectionMode", "selection-mode"], ["scale", "scale"]]
- }; }
- }
- const CSS$z = {
- containerLink: "container--link",
- containerSmall: "container--s",
- containerMedium: "container--m",
- containerLarge: "container--l",
- containerMulti: "container--multi-selection",
- containerSingle: "container--single-selection",
- containerNone: "container--none-selection"
- };
- const dropdownItemCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-dropdown-item:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-dropdown-item{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-dropdown-item{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-dropdown-item{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-dropdown-item{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-dropdown-item{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-dropdown-item:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-dropdown-item-h{display:none}/*!@.container--s*/.container--s.sc-calcite-dropdown-item{padding-top:0.25rem;padding-bottom:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem;-webkit-padding-end:0.5rem;padding-inline-end:0.5rem;-webkit-padding-start:1.5rem;padding-inline-start:1.5rem}/*!@.container--m*/.container--m.sc-calcite-dropdown-item{padding-top:0.5rem;padding-bottom:0.5rem;font-size:var(--calcite-font-size--1);line-height:1rem;-webkit-padding-end:0.75rem;padding-inline-end:0.75rem;-webkit-padding-start:2rem;padding-inline-start:2rem}/*!@.container--l*/.container--l.sc-calcite-dropdown-item{padding-top:0.75rem;padding-bottom:0.75rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;-webkit-padding-end:1rem;padding-inline-end:1rem;-webkit-padding-start:2.5rem;padding-inline-start:2.5rem}/*!@.container--s.container--none-selection*/.container--s.container--none-selection.sc-calcite-dropdown-item{-webkit-padding-start:0.25rem;padding-inline-start:0.25rem}/*!@.container--s.container--none-selection .dropdown-link*/.container--s.container--none-selection.sc-calcite-dropdown-item .dropdown-link.sc-calcite-dropdown-item{-webkit-padding-start:0px;padding-inline-start:0px}/*!@.container--m.container--none-selection*/.container--m.container--none-selection.sc-calcite-dropdown-item{-webkit-padding-start:0.5rem;padding-inline-start:0.5rem}/*!@.container--m.container--none-selection .dropdown-link*/.container--m.container--none-selection.sc-calcite-dropdown-item .dropdown-link.sc-calcite-dropdown-item{-webkit-padding-start:0px;padding-inline-start:0px}/*!@.container--l.container--none-selection*/.container--l.container--none-selection.sc-calcite-dropdown-item{-webkit-padding-start:0.75rem;padding-inline-start:0.75rem}/*!@.container--l.container--none-selection .dropdown-link*/.container--l.container--none-selection.sc-calcite-dropdown-item .dropdown-link.sc-calcite-dropdown-item{-webkit-padding-start:0px;padding-inline-start:0px}/*!@:host*/.sc-calcite-dropdown-item-h{position:relative;display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center}/*!@.container*/.container.sc-calcite-dropdown-item{position:relative;display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;cursor:pointer;-ms-flex-align:center;align-items:center;color:var(--calcite-ui-text-3);-webkit-text-decoration-line:none;text-decoration-line:none;outline:2px solid transparent;outline-offset:2px;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}/*!@.dropdown-item-content*/.dropdown-item-content.sc-calcite-dropdown-item{-ms-flex:1 1 auto;flex:1 1 auto;-webkit-padding-end:auto;padding-inline-end:auto;-webkit-padding-start:0.25rem;padding-inline-start:0.25rem}/*!@:host, .container--link a*/.sc-calcite-dropdown-item-h,.container--link.sc-calcite-dropdown-item a.sc-calcite-dropdown-item{outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@:host(:focus)*/.sc-calcite-dropdown-item-h:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@.container--link*/.container--link.sc-calcite-dropdown-item{padding:0px}/*!@.container--link a*/.container--link.sc-calcite-dropdown-item a.sc-calcite-dropdown-item{position:relative;display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;cursor:pointer;-ms-flex-align:center;align-items:center;color:var(--calcite-ui-text-3);-webkit-text-decoration-line:none;text-decoration-line:none;outline:2px solid transparent;outline-offset:2px;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}/*!@.container--s .dropdown-link*/.container--s.sc-calcite-dropdown-item .dropdown-link.sc-calcite-dropdown-item{padding-top:0.25rem;padding-bottom:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem;-webkit-padding-end:0.5rem;padding-inline-end:0.5rem;-webkit-padding-start:1.5rem;padding-inline-start:1.5rem}/*!@.container--m .dropdown-link*/.container--m.sc-calcite-dropdown-item .dropdown-link.sc-calcite-dropdown-item{padding-top:0.5rem;padding-bottom:0.5rem;font-size:var(--calcite-font-size--1);line-height:1rem;-webkit-padding-end:0.75rem;padding-inline-end:0.75rem;-webkit-padding-start:2rem;padding-inline-start:2rem}/*!@.container--l .dropdown-link*/.container--l.sc-calcite-dropdown-item .dropdown-link.sc-calcite-dropdown-item{padding-top:0.75rem;padding-bottom:0.75rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;-webkit-padding-end:1rem;padding-inline-end:1rem;-webkit-padding-start:2.5rem;padding-inline-start:2.5rem}/*!@:host(:hover) .container, :host(:active) .container*/.sc-calcite-dropdown-item-h:hover .container.sc-calcite-dropdown-item,.sc-calcite-dropdown-item-h:active .container.sc-calcite-dropdown-item{background-color:var(--calcite-ui-foreground-2);color:var(--calcite-ui-text-1);-webkit-text-decoration-line:none;text-decoration-line:none}/*!@:host(:hover) .container--link .dropdown-link, :host(:active) .container--link .dropdown-link*/.sc-calcite-dropdown-item-h:hover .container--link.sc-calcite-dropdown-item .dropdown-link.sc-calcite-dropdown-item,.sc-calcite-dropdown-item-h:active .container--link.sc-calcite-dropdown-item .dropdown-link.sc-calcite-dropdown-item{color:var(--calcite-ui-text-1)}/*!@:host(:focus) .container*/.sc-calcite-dropdown-item-h:focus .container.sc-calcite-dropdown-item{color:var(--calcite-ui-text-1);-webkit-text-decoration-line:none;text-decoration-line:none}/*!@:host(:active) .container*/.sc-calcite-dropdown-item-h:active .container.sc-calcite-dropdown-item{background-color:var(--calcite-ui-foreground-3)}/*!@:host(:hover) .container:before, :host(:active) .container:before, :host(:focus) .container:before*/.sc-calcite-dropdown-item-h:hover .container.sc-calcite-dropdown-item:before,.sc-calcite-dropdown-item-h:active .container.sc-calcite-dropdown-item:before,.sc-calcite-dropdown-item-h:focus .container.sc-calcite-dropdown-item:before{opacity:1}/*!@:host([active]) .container:not(.container--none-selection), :host([active]) .container--link .dropdown-link*/[active].sc-calcite-dropdown-item-h .container.sc-calcite-dropdown-item:not(.container--none-selection),[active].sc-calcite-dropdown-item-h .container--link.sc-calcite-dropdown-item .dropdown-link.sc-calcite-dropdown-item{font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1)}/*!@:host([active]) .container:not(.container--none-selection):before, :host([active]) .container--link .dropdown-link:before*/[active].sc-calcite-dropdown-item-h .container.sc-calcite-dropdown-item:not(.container--none-selection):before,[active].sc-calcite-dropdown-item-h .container--link.sc-calcite-dropdown-item .dropdown-link.sc-calcite-dropdown-item:before{opacity:1;color:var(--calcite-ui-brand)}/*!@:host([active]) .container:not(.container--none-selection) calcite-icon,\n:host([active]) .container--link .dropdown-link calcite-icon*/[active].sc-calcite-dropdown-item-h .container.sc-calcite-dropdown-item:not(.container--none-selection) calcite-icon.sc-calcite-dropdown-item,[active].sc-calcite-dropdown-item-h .container--link.sc-calcite-dropdown-item .dropdown-link.sc-calcite-dropdown-item calcite-icon.sc-calcite-dropdown-item{color:var(--calcite-ui-brand)}/*!@.container--multi-selection:before, .container--none-selection:before*/.container--multi-selection.sc-calcite-dropdown-item:before,.container--none-selection.sc-calcite-dropdown-item:before{display:none}/*!@.container--s:before*/.container--s.sc-calcite-dropdown-item:before{inset-inline-start:0.5rem}/*!@.container--m:before*/.container--m.sc-calcite-dropdown-item:before{inset-inline-start:0.75rem}/*!@.container--l:before*/.container--l.sc-calcite-dropdown-item:before{inset-inline-start:1rem}/*!@.dropdown-item-icon*/.dropdown-item-icon.sc-calcite-dropdown-item{position:absolute;opacity:0;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:scale(0.9);transform:scale(0.9)}/*!@.container--s .dropdown-item-icon*/.container--s.sc-calcite-dropdown-item .dropdown-item-icon.sc-calcite-dropdown-item{inset-inline-start:0.25rem}/*!@.container--m .dropdown-item-icon*/.container--m.sc-calcite-dropdown-item .dropdown-item-icon.sc-calcite-dropdown-item{inset-inline-start:0.5rem}/*!@.container--l .dropdown-item-icon*/.container--l.sc-calcite-dropdown-item .dropdown-item-icon.sc-calcite-dropdown-item{inset-inline-start:0.75rem}/*!@:host(:hover) .dropdown-item-icon*/.sc-calcite-dropdown-item-h:hover .dropdown-item-icon.sc-calcite-dropdown-item{color:var(--calcite-ui-border-1);opacity:1}/*!@:host([active]) .dropdown-item-icon*/[active].sc-calcite-dropdown-item-h .dropdown-item-icon.sc-calcite-dropdown-item{color:var(--calcite-ui-brand);opacity:1}/*!@.container--s .dropdown-item-icon-start*/.container--s.sc-calcite-dropdown-item .dropdown-item-icon-start.sc-calcite-dropdown-item{-webkit-margin-end:0.5rem;margin-inline-end:0.5rem;-webkit-margin-start:0.25rem;margin-inline-start:0.25rem}/*!@.container--s .dropdown-item-icon-end*/.container--s.sc-calcite-dropdown-item .dropdown-item-icon-end.sc-calcite-dropdown-item{-webkit-margin-start:0.5rem;margin-inline-start:0.5rem}/*!@.container--m .dropdown-item-icon-start*/.container--m.sc-calcite-dropdown-item .dropdown-item-icon-start.sc-calcite-dropdown-item{-webkit-margin-end:0.75rem;margin-inline-end:0.75rem;-webkit-margin-start:0.25rem;margin-inline-start:0.25rem}/*!@.container--m .dropdown-item-icon-end*/.container--m.sc-calcite-dropdown-item .dropdown-item-icon-end.sc-calcite-dropdown-item{-webkit-margin-start:0.75rem;margin-inline-start:0.75rem}/*!@.container--l .dropdown-item-icon-start*/.container--l.sc-calcite-dropdown-item .dropdown-item-icon-start.sc-calcite-dropdown-item{-webkit-margin-end:1rem;margin-inline-end:1rem;-webkit-margin-start:0.25rem;margin-inline-start:0.25rem}/*!@.container--l .dropdown-item-icon-end*/.container--l.sc-calcite-dropdown-item .dropdown-item-icon-end.sc-calcite-dropdown-item{-webkit-margin-start:1rem;margin-inline-start:1rem}";
- /**
- * @slot - A slot for adding text.
- */
- class DropdownItem {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteDropdownItemSelect = createEvent(this, "calciteDropdownItemSelect", 7);
- this.calciteDropdownItemKeyEvent = createEvent(this, "calciteDropdownItemKeyEvent", 7);
- this.calciteDropdownCloseRequest = createEvent(this, "calciteDropdownCloseRequest", 7);
- //--------------------------------------------------------------------------
- //
- // Public Properties
- //
- //--------------------------------------------------------------------------
- /** Indicates whether the item is active. */
- this.active = false;
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- this.el.focus();
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentWillLoad() {
- this.initialize();
- }
- connectedCallback() {
- this.initialize();
- }
- render() {
- const scale = getElementProp(this.el, "scale", "m");
- const iconStartEl = (hAsync("calcite-icon", { class: "dropdown-item-icon-start", flipRtl: this.iconFlipRtl === "start" || this.iconFlipRtl === "both", icon: this.iconStart, scale: "s" }));
- const contentNode = (hAsync("span", { class: "dropdown-item-content" }, hAsync("slot", null)));
- const iconEndEl = (hAsync("calcite-icon", { class: "dropdown-item-icon-end", flipRtl: this.iconFlipRtl === "end" || this.iconFlipRtl === "both", icon: this.iconEnd, scale: "s" }));
- const slottedContent = this.iconStart && this.iconEnd
- ? [iconStartEl, contentNode, iconEndEl]
- : this.iconStart
- ? [iconStartEl, hAsync("slot", null)]
- : this.iconEnd
- ? [contentNode, iconEndEl]
- : contentNode;
- const contentEl = !this.href ? (slottedContent) : (hAsync("a", { "aria-label": this.label, class: "dropdown-link", href: this.href, ref: (el) => (this.childLink = el), rel: this.rel, target: this.target }, slottedContent));
- const itemRole = this.href
- ? null
- : this.selectionMode === "single"
- ? "menuitemradio"
- : this.selectionMode === "multi"
- ? "menuitemcheckbox"
- : "menuitem";
- const itemAria = this.selectionMode !== "none" ? toAriaBoolean(this.active) : null;
- return (hAsync(Host, { "aria-checked": itemAria, role: itemRole, tabindex: "0" }, hAsync("div", { class: {
- container: true,
- [CSS$z.containerLink]: !!this.href,
- [CSS$z.containerSmall]: scale === "s",
- [CSS$z.containerMedium]: scale === "m",
- [CSS$z.containerLarge]: scale === "l",
- [CSS$z.containerMulti]: this.selectionMode === "multi",
- [CSS$z.containerSingle]: this.selectionMode === "single",
- [CSS$z.containerNone]: this.selectionMode === "none"
- } }, this.selectionMode !== "none" ? (hAsync("calcite-icon", { class: "dropdown-item-icon", icon: this.selectionMode === "multi" ? "check" : "bullet-point", scale: "s" })) : null, contentEl)));
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- onClick() {
- this.emitRequestedItem();
- }
- keyDownHandler(e) {
- switch (e.key) {
- case " ":
- this.emitRequestedItem();
- if (this.href) {
- e.preventDefault();
- this.childLink.click();
- }
- break;
- case "Enter":
- this.emitRequestedItem();
- if (this.href) {
- this.childLink.click();
- }
- break;
- case "Escape":
- this.calciteDropdownCloseRequest.emit();
- break;
- case "Tab":
- case "ArrowUp":
- case "ArrowDown":
- case "Home":
- case "End":
- this.calciteDropdownItemKeyEvent.emit({ keyboardEvent: e });
- break;
- }
- e.preventDefault();
- }
- updateActiveItemOnChange(event) {
- const parentEmittedChange = event.composedPath().includes(this.parentDropdownGroupEl);
- if (parentEmittedChange) {
- this.requestedDropdownGroup = event.detail.requestedDropdownGroup;
- this.requestedDropdownItem = event.detail.requestedDropdownItem;
- this.determineActiveItem();
- }
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- initialize() {
- this.selectionMode = getElementProp(this.el, "selection-mode", "single");
- this.parentDropdownGroupEl = this.el.closest("calcite-dropdown-group");
- if (this.selectionMode === "none") {
- this.active = false;
- }
- }
- determineActiveItem() {
- switch (this.selectionMode) {
- case "multi":
- if (this.el === this.requestedDropdownItem) {
- this.active = !this.active;
- }
- break;
- case "single":
- if (this.el === this.requestedDropdownItem) {
- this.active = true;
- }
- else if (this.requestedDropdownGroup === this.parentDropdownGroupEl) {
- this.active = false;
- }
- break;
- case "none":
- this.active = false;
- break;
- }
- }
- emitRequestedItem() {
- this.calciteDropdownItemSelect.emit({
- requestedDropdownItem: this.el,
- requestedDropdownGroup: this.parentDropdownGroupEl
- });
- }
- get el() { return getElement(this); }
- static get style() { return dropdownItemCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-dropdown-item",
- "$members$": {
- "active": [1540],
- "iconFlipRtl": [513, "icon-flip-rtl"],
- "iconStart": [513, "icon-start"],
- "iconEnd": [513, "icon-end"],
- "href": [513],
- "label": [1],
- "rel": [1],
- "target": [1],
- "setFocus": [64]
- },
- "$listeners$": [[0, "click", "onClick"], [0, "keydown", "keyDownHandler"], [16, "calciteDropdownItemChange", "updateActiveItemOnChange"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["active", "active"], ["iconFlipRtl", "icon-flip-rtl"], ["iconStart", "icon-start"], ["iconEnd", "icon-end"], ["href", "href"]]
- }; }
- }
- const CSS$y = {
- button: "button"
- };
- const ICONS$9 = {
- plus: "plus"
- };
- const fabCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-fab:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-fab{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-fab{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-fab{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-fab{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-fab{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-fab:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-fab-h{display:none}/*!@:host*/.sc-calcite-fab-h{display:-ms-flexbox;display:flex;background-color:transparent}/*!@:host([disabled])*/[disabled].sc-calcite-fab-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-fab-h[disabled] .sc-calcite-fab-s>[calcite-hydrated][disabled],[disabled].sc-calcite-fab-h [calcite-hydrated][disabled].sc-calcite-fab{opacity:1}/*!@calcite-button*/calcite-button.sc-calcite-fab{--tw-shadow:0 6px 20px -4px rgba(0, 0, 0, 0.1), 0 4px 12px -2px rgba(0, 0, 0, 0.08);--tw-shadow-colored:0 6px 20px -4px var(--tw-shadow-color), 0 4px 12px -2px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@calcite-button:hover*/calcite-button.sc-calcite-fab:hover{--tw-shadow:0 12px 32px -2px rgba(0, 0, 0, 0.1), 0 4px 20px 0 rgba(0, 0, 0, 0.08);--tw-shadow-colored:0 12px 32px -2px var(--tw-shadow-color), 0 4px 20px 0 var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@calcite-button:active*/calcite-button.sc-calcite-fab:active{--tw-shadow:0 2px 12px -4px rgba(0, 0, 0, 0.2), 0 2px 4px -2px rgba(0, 0, 0, 0.16);--tw-shadow-colored:0 2px 12px -4px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}";
- class Fab {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * Used to set the button's appearance. Default is outline.
- */
- this.appearance = "outline";
- /**
- * Used to set the button's color. Default is light.
- */
- this.color = "neutral";
- /**
- * When true, disabled prevents interaction. This state shows items with lower opacity/grayed.
- */
- this.disabled = false;
- /**
- * The name of the icon to display. The value of this property must match the icon name from https://esri.github.io/calcite-ui-icons/.
- * @default "plus"
- */
- this.icon = ICONS$9.plus;
- /**
- * When true, content is waiting to be loaded. This state shows a busy indicator.
- */
- this.loading = false;
- /**
- * Specifies the size of the fab.
- */
- this.scale = "m";
- /**
- * Indicates whether the text is displayed.
- */
- this.textEnabled = false;
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentDidRender() {
- updateHostInteraction(this);
- }
- // --------------------------------------------------------------------------
- //
- // Methods
- //
- // --------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- focusElement(this.buttonEl);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- const { appearance, color, disabled, loading, scale, textEnabled, icon, label, text } = this;
- const title = !textEnabled ? label || text || null : null;
- return (hAsync("calcite-button", { appearance: appearance === "solid" ? "solid" : "outline", class: CSS$y.button, color: color, disabled: disabled, iconStart: icon, label: label, loading: loading, ref: (buttonEl) => {
- this.buttonEl = buttonEl;
- }, round: true, scale: scale, title: title, type: "button", width: "auto" }, this.textEnabled ? this.text : null));
- }
- get el() { return getElement(this); }
- static get style() { return fabCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-fab",
- "$members$": {
- "appearance": [513],
- "color": [513],
- "disabled": [516],
- "icon": [1],
- "label": [1],
- "loading": [516],
- "scale": [513],
- "text": [1],
- "textEnabled": [516, "text-enabled"],
- "setFocus": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["appearance", "appearance"], ["color", "color"], ["disabled", "disabled"], ["loading", "loading"], ["scale", "scale"], ["textEnabled", "text-enabled"]]
- }; }
- }
- const CSS$x = {
- container: "container",
- searchIcon: "search-icon"
- };
- const TEXT$e = {
- filterLabel: "Filter",
- clear: "Clear filter"
- };
- const ICONS$8 = {
- search: "search",
- close: "x"
- };
- const DEBOUNCE_TIMEOUT = 250;
- const filterCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-filter:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-filter{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-filter{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-filter{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-filter{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-filter{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:host*/.sc-calcite-filter-h{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}/*!@:host **/.sc-calcite-filter-h *.sc-calcite-filter{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:root*/.sc-calcite-filter:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-filter-h{display:none}/*!@:host*/.sc-calcite-filter-h{display:-ms-flexbox;display:flex;width:100%}/*!@:host([disabled])*/[disabled].sc-calcite-filter-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-filter-h[disabled] .sc-calcite-filter-s>[calcite-hydrated][disabled],[disabled].sc-calcite-filter-h [calcite-hydrated][disabled].sc-calcite-filter{opacity:1}/*!@.container*/.container.sc-calcite-filter{display:-ms-flexbox;display:flex;width:100%;padding:0.5rem}/*!@label*/label.sc-calcite-filter{position:relative;margin-left:0.25rem;margin-right:0.25rem;margin-top:0px;margin-bottom:0px;display:-ms-flexbox;display:flex;width:100%;-ms-flex-align:center;align-items:center;overflow:hidden}/*!@input[type=text]*/input[type=text].sc-calcite-filter{margin-bottom:0.25rem;width:100%;border-style:none;background-color:transparent;padding-top:0.25rem;padding-bottom:0.25rem;padding-right:0.25rem;padding-left:1.5rem;font-family:inherit;font-size:var(--calcite-font-size--2);line-height:1rem;color:var(--calcite-ui-text-1);-webkit-transition:padding var(--calcite-animation-timing), -webkit-box-shadow var(--calcite-animation-timing);transition:padding var(--calcite-animation-timing), -webkit-box-shadow var(--calcite-animation-timing);transition:padding var(--calcite-animation-timing), box-shadow var(--calcite-animation-timing);transition:padding var(--calcite-animation-timing), box-shadow var(--calcite-animation-timing), -webkit-box-shadow var(--calcite-animation-timing)}/*!@input[type=text]::-ms-clear*/input[type=text].sc-calcite-filter::-ms-clear{display:none}/*!@calcite-input*/calcite-input.sc-calcite-filter{width:100%}/*!@.search-icon*/.search-icon.sc-calcite-filter{position:absolute;display:-ms-flexbox;display:flex;color:var(--calcite-ui-text-2);inset-inline-start:0;-webkit-transition:left var(--calcite-animation-timing), right var(--calcite-animation-timing), opacity var(--calcite-animation-timing);transition:left var(--calcite-animation-timing), right var(--calcite-animation-timing), opacity var(--calcite-animation-timing)}/*!@input[type=text]:focus*/input[type=text].sc-calcite-filter:focus{border-color:var(--calcite-ui-brand);outline:2px solid transparent;outline-offset:2px;padding-inline:0.25rem}/*!@input[type=text]:focus ~ .search-icon*/input[type=text].sc-calcite-filter:focus~.search-icon.sc-calcite-filter{inset-inline-start:calc(1rem * -1);opacity:0}/*!@.clear-button*/.clear-button.sc-calcite-filter{display:-ms-flexbox;display:flex;cursor:pointer;-ms-flex-align:center;align-items:center;border-width:0px;background-color:transparent;color:var(--calcite-ui-text-2)}/*!@.clear-button:hover, .clear-button:focus*/.clear-button.sc-calcite-filter:hover,.clear-button.sc-calcite-filter:focus{color:var(--calcite-ui-text-1)}";
- class Filter {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteFilterChange = createEvent(this, "calciteFilterChange", 7);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * The items to filter through. The filter uses this as the starting point, and returns items
- * that contain the string entered in the input, using a partial match and recursive search.
- *
- * This property is required.
- */
- this.items = [];
- /**
- * When true, disabled prevents interaction. This state shows items with lower opacity/grayed.
- */
- this.disabled = false;
- /**
- * The resulting items after filtering.
- *
- * @readonly
- */
- this.filteredItems = [];
- /** specify the scale of filter, defaults to m */
- this.scale = "m";
- /**
- * Filter value.
- */
- this.value = "";
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.filter = debounce$1((value, emit = false) => {
- const regex = new RegExp(value, "i");
- if (this.items.length === 0) {
- this.updateFiltered([], emit);
- return;
- }
- const find = (input, RE) => {
- let found = false;
- forIn(input, (val) => {
- if (typeof val === "function" || val == null /* intentional == to catch undefined */) {
- return;
- }
- if (Array.isArray(val) || (typeof val === "object" && val !== null)) {
- if (find(val, RE)) {
- found = true;
- }
- }
- else if (RE.test(val)) {
- found = true;
- }
- });
- return found;
- };
- const result = this.items.filter((item) => {
- return find(item, regex);
- });
- this.updateFiltered(result, emit);
- }, DEBOUNCE_TIMEOUT);
- this.inputHandler = (event) => {
- const target = event.target;
- this.value = target.value;
- this.filter(target.value, true);
- };
- this.keyDownHandler = (event) => {
- if (event.key === "Escape") {
- this.clear();
- }
- if (event.key === "Enter") {
- event.preventDefault();
- }
- };
- this.clear = () => {
- this.value = "";
- this.filter("", true);
- this.setFocus();
- };
- }
- watchItemsHandler() {
- this.filter(this.value);
- }
- valueHandler(value) {
- this.filter(value);
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentDidRender() {
- updateHostInteraction(this);
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentWillLoad() {
- this.filter(this.value);
- }
- // --------------------------------------------------------------------------
- //
- // Public Methods
- //
- // --------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- focusElement(this.textInput);
- }
- updateFiltered(filtered, emit = false) {
- this.filteredItems.length = 0;
- this.filteredItems = this.filteredItems.concat(filtered);
- if (emit) {
- this.calciteFilterChange.emit();
- }
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- const { disabled, scale } = this;
- return (hAsync(Fragment, null, hAsync("div", { class: CSS$x.container }, hAsync("label", null, hAsync("calcite-input", { "aria-label": this.intlLabel || TEXT$e.filterLabel, clearable: true, disabled: disabled, icon: ICONS$8.search, intlClear: this.intlClear || TEXT$e.clear, onCalciteInputInput: this.inputHandler, onKeyDown: this.keyDownHandler, placeholder: this.placeholder, ref: (el) => {
- this.textInput = el;
- }, scale: scale, type: "text", value: this.value })))));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "items": ["watchItemsHandler"],
- "value": ["valueHandler"]
- }; }
- static get style() { return filterCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-filter",
- "$members$": {
- "items": [1040],
- "disabled": [516],
- "filteredItems": [1040],
- "intlClear": [1, "intl-clear"],
- "intlLabel": [1, "intl-label"],
- "placeholder": [1],
- "scale": [513],
- "value": [1025],
- "setFocus": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"], ["scale", "scale"]]
- }; }
- }
- const CSS$w = {
- frame: "frame",
- frameAdvancing: "frame--advancing",
- frameRetreating: "frame--retreating"
- };
- const flowCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-flow:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-flow{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-flow{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-flow{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-flow{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-flow{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:host*/.sc-calcite-flow-h{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}/*!@:host **/.sc-calcite-flow-h *.sc-calcite-flow{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:root*/.sc-calcite-flow:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-flow-h{display:none}/*!@:host*/.sc-calcite-flow-h{position:relative;display:-ms-flexbox;display:flex;width:100%;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-align:stretch;align-items:stretch;overflow:hidden;background-color:transparent}/*!@:host .frame*/.sc-calcite-flow-h .frame.sc-calcite-flow{position:relative;margin:0px;display:-ms-flexbox;display:flex;width:100%;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:stretch;align-items:stretch;padding:0px}/*!@:host ::slotted(calcite-panel)*/.sc-calcite-flow-h .sc-calcite-flow-s>calcite-panel{height:100%}/*!@:host ::slotted(.calcite-match-height:last-child)*/.sc-calcite-flow-h .sc-calcite-flow-s>.calcite-match-height:last-child{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;overflow:hidden}/*!@:host .frame--advancing*/.sc-calcite-flow-h .frame--advancing.sc-calcite-flow{-webkit-animation:calcite-frame-advance var(--calcite-animation-timing);animation:calcite-frame-advance var(--calcite-animation-timing)}/*!@:host .frame--retreating*/.sc-calcite-flow-h .frame--retreating.sc-calcite-flow{-webkit-animation:calcite-frame-retreat var(--calcite-animation-timing);animation:calcite-frame-retreat var(--calcite-animation-timing)}@-webkit-keyframes calcite-frame-advance{0%{--tw-bg-opacity:0.5;-webkit-transform:translate3d(50px, 0, 0);transform:translate3d(50px, 0, 0)}100%{--tw-bg-opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}@keyframes calcite-frame-advance{0%{--tw-bg-opacity:0.5;-webkit-transform:translate3d(50px, 0, 0);transform:translate3d(50px, 0, 0)}100%{--tw-bg-opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}@-webkit-keyframes calcite-frame-retreat{0%{--tw-bg-opacity:0.5;-webkit-transform:translate3d(-50px, 0, 0);transform:translate3d(-50px, 0, 0)}100%{--tw-bg-opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}@keyframes calcite-frame-retreat{0%{--tw-bg-opacity:0.5;-webkit-transform:translate3d(-50px, 0, 0);transform:translate3d(-50px, 0, 0)}100%{--tw-bg-opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}";
- /**
- * @slot - A slot for adding `calcite-panel`s to the flow.
- */
- class Flow {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.panelCount = 0;
- this.flowDirection = null;
- this.panels = [];
- this.getFlowDirection = (oldPanelCount, newPanelCount) => {
- const allowRetreatingDirection = oldPanelCount > 1;
- const allowAdvancingDirection = oldPanelCount && newPanelCount > 1;
- if (!allowAdvancingDirection && !allowRetreatingDirection) {
- return null;
- }
- return newPanelCount < oldPanelCount ? "retreating" : "advancing";
- };
- this.updateFlowProps = () => {
- const { panels } = this;
- const newPanels = Array.from(this.el.querySelectorAll("calcite-panel"));
- const oldPanelCount = panels.length;
- const newPanelCount = newPanels.length;
- const activePanel = newPanels[newPanelCount - 1];
- const previousPanel = newPanels[newPanelCount - 2];
- if (newPanelCount && activePanel) {
- newPanels.forEach((panelNode) => {
- panelNode.showBackButton = newPanelCount > 1;
- panelNode.hidden = panelNode !== activePanel;
- });
- }
- if (previousPanel) {
- previousPanel.menuOpen = false;
- }
- this.panels = newPanels;
- if (oldPanelCount !== newPanelCount) {
- const flowDirection = this.getFlowDirection(oldPanelCount, newPanelCount);
- this.panelCount = newPanelCount;
- this.flowDirection = flowDirection;
- }
- };
- this.panelItemMutationObserver = createObserver();
- }
- // --------------------------------------------------------------------------
- //
- // Public Methods
- //
- // --------------------------------------------------------------------------
- /**
- * Removes the currently active `calcite-panel`.
- */
- async back() {
- const lastItem = this.el.querySelector("calcite-panel:last-child");
- if (!lastItem) {
- return;
- }
- const beforeBack = lastItem.beforeBack
- ? lastItem.beforeBack
- : () => Promise.resolve();
- return beforeBack.call(lastItem).then(() => {
- lastItem.remove();
- return lastItem;
- });
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- var _a;
- (_a = this.panelItemMutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });
- this.updateFlowProps();
- }
- disconnectedCallback() {
- var _a;
- (_a = this.panelItemMutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- }
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- handleCalcitePanelBackClick() {
- this.back();
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- const { flowDirection, panelCount } = this;
- const frameDirectionClasses = {
- [CSS$w.frame]: true,
- [CSS$w.frameAdvancing]: flowDirection === "advancing",
- [CSS$w.frameRetreating]: flowDirection === "retreating"
- };
- return (hAsync("div", { class: frameDirectionClasses, key: panelCount }, hAsync("slot", null)));
- }
- get el() { return getElement(this); }
- static get style() { return flowCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-flow",
- "$members$": {
- "panelCount": [32],
- "flowDirection": [32],
- "panels": [32],
- "back": [64]
- },
- "$listeners$": [[0, "calcitePanelBackClick", "handleCalcitePanelBackClick"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": []
- }; }
- }
- /**
- * Calculate slope of the tangents
- * uses Steffen interpolation as it's monotonic
- * http://jrwalsh1.github.io/posts/interpolations/
- */
- function slope(p0, p1, p2) {
- const dx = p1[0] - p0[0];
- const dx1 = p2[0] - p1[0];
- const dy = p1[1] - p0[1];
- const dy1 = p2[1] - p1[1];
- const m = dy / (dx || (dx1 < 0 && 0));
- const m1 = dy1 / (dx1 || (dx < 0 && 0));
- const p = (m * dx1 + m1 * dx) / (dx + dx1);
- return (Math.sign(m) + Math.sign(m1)) * Math.min(Math.abs(m), Math.abs(m1), 0.5 * Math.abs(p)) || 0;
- }
- /**
- * Calculate slope for just one tangent (single-sided)
- */
- function slopeSingle(p0, p1, m) {
- const dx = p1[0] - p0[0];
- const dy = p1[1] - p0[1];
- return dx ? ((3 * dy) / dx - m) / 2 : m;
- }
- /**
- * Given two points and their tangent slopes,
- * calculate the bezier handle coordinates and return draw command.
- *
- * Translates Hermite Spline to Beziér curve:
- * stackoverflow.com/questions/42574940/
- */
- function bezier(p0, p1, m0, m1, t) {
- const [x0, y0] = p0;
- const [x1, y1] = p1;
- const dx = (x1 - x0) / 3;
- const h1 = t([x0 + dx, y0 + dx * m0]).join(",");
- const h2 = t([x1 - dx, y1 - dx * m1]).join(",");
- const p = t([x1, y1]).join(",");
- return `C ${h1} ${h2} ${p}`;
- }
- /**
- * Generate a function which will translate a point
- * from the data coordinate space to svg viewbox oriented pixels
- */
- function translate({ width, height, min, max }) {
- const rangeX = max[0] - min[0];
- const rangeY = max[1] - min[1];
- return (point) => {
- const x = ((point[0] - min[0]) / rangeX) * width;
- const y = height - (point[1] / rangeY) * height;
- return [x, y];
- };
- }
- /**
- * Get the min and max values from the dataset
- */
- function range(data) {
- const [startX, startY] = data[0];
- const min = [startX, startY];
- const max = [startX, startY];
- return data.reduce(({ min, max }, [x, y]) => ({
- min: [Math.min(min[0], x), Math.min(min[1], y)],
- max: [Math.max(max[0], x), Math.max(max[1], y)]
- }), { min, max });
- }
- /**
- * Generate drawing commands for an area graph
- * returns a string can can be passed directly to a path element's `d` attribute
- */
- function area({ data, min, max, t }) {
- if (data.length === 0) {
- return "";
- }
- // important points for beginning and ending the path
- const [startX, startY] = t(data[0]);
- const [minX, minY] = t(min);
- const [maxX] = t(max);
- // keep track of previous slope/points
- let m;
- let p0;
- let p1;
- // iterate over data points, calculating command for each
- const commands = data.reduce((acc, point, i) => {
- p0 = data[i - 2];
- p1 = data[i - 1];
- if (i > 1) {
- const m1 = slope(p0, p1, point);
- const m0 = m === undefined ? slopeSingle(p0, p1, m1) : m;
- const command = bezier(p0, p1, m0, m1, t);
- m = m1;
- return `${acc} ${command}`;
- }
- return acc;
- }, `M ${minX},${minY} L ${minX},${startY} L ${startX},${startY}`);
- // close the path
- const last = data[data.length - 1];
- const end = bezier(p1, last, m, slopeSingle(p1, last, m), t);
- return `${commands} ${end} L ${maxX},${minY} Z`;
- }
- const graphCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-graph:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-graph{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-graph{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-graph{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-graph{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-graph{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-graph:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-graph-h{display:none}/*!@:host*/.sc-calcite-graph-h{display:block}/*!@.svg*/.svg.sc-calcite-graph{fill:currentColor;stroke:transparent;margin:0px;display:block;height:100%;width:100%;padding:0px}/*!@.svg .graph-path--highlight*/.svg.sc-calcite-graph .graph-path--highlight.sc-calcite-graph{fill:var(--calcite-ui-brand);opacity:0.5}";
- class Graph {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /**
- * Array of tuples describing a single data point ([x, y])
- * These data points should be sorted by x-axis value
- */
- this.data = [];
- //--------------------------------------------------------------------------
- //
- // Private State/Props
- //
- //--------------------------------------------------------------------------
- this.graphId = `calcite-graph-${guid()}`;
- this.resizeObserver = createObserver();
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- var _a;
- (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el);
- }
- disconnectedCallback() {
- var _a;
- (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- }
- render() {
- const { data, colorStops, el, highlightMax, highlightMin, min, max } = this;
- const id = this.graphId;
- const { clientHeight: height, clientWidth: width } = el;
- // if we have no data, return empty svg
- if (!data || data.length === 0) {
- return (hAsync("svg", { class: "svg", height: height, preserveAspectRatio: "none", viewBox: `0 0 ${width} ${height}`, width: width }));
- }
- const { min: rangeMin, max: rangeMax } = range(data);
- let currentMin = rangeMin;
- let currentMax = rangeMax;
- if (min < rangeMin[0] || min > rangeMin[0]) {
- currentMin = [min, 0];
- }
- if (max > rangeMax[0] || max < rangeMax[0]) {
- currentMax = [max, rangeMax[1]];
- }
- const t = translate({ min: currentMin, max: currentMax, width, height });
- const [hMinX] = t([highlightMin, currentMax[1]]);
- const [hMaxX] = t([highlightMax, currentMax[1]]);
- const areaPath = area({ data, min: rangeMin, max: rangeMax, t });
- const fill = colorStops ? `url(#linear-gradient-${id})` : undefined;
- return (hAsync("svg", { class: "svg", height: height, preserveAspectRatio: "none", viewBox: `0 0 ${width} ${height}`, width: width }, colorStops ? (hAsync("defs", null, hAsync("linearGradient", { id: `linear-gradient-${id}`, x1: "0", x2: "1", y1: "0", y2: "0" }, colorStops.map(({ offset, color, opacity }) => (hAsync("stop", { offset: `${offset * 100}%`, "stop-color": color, "stop-opacity": opacity })))))) : null, highlightMin !== undefined ? ([
- hAsync("mask", { height: "100%", id: `${id}1`, width: "100%", x: "0%", y: "0%" }, hAsync("path", { d: `
- M 0,0
- L ${hMinX - 1},0
- L ${hMinX - 1},${height}
- L 0,${height}
- Z
- `, fill: "white" })),
- hAsync("mask", { height: "100%", id: `${id}2`, width: "100%", x: "0%", y: "0%" }, hAsync("path", { d: `
- M ${hMinX + 1},0
- L ${hMaxX - 1},0
- L ${hMaxX - 1},${height}
- L ${hMinX + 1}, ${height}
- Z
- `, fill: "white" })),
- hAsync("mask", { height: "100%", id: `${id}3`, width: "100%", x: "0%", y: "0%" }, hAsync("path", { d: `
- M ${hMaxX + 1},0
- L ${width},0
- L ${width},${height}
- L ${hMaxX + 1}, ${height}
- Z
- `, fill: "white" })),
- hAsync("path", { class: "graph-path", d: areaPath, fill: fill, mask: `url(#${id}1)` }),
- hAsync("path", { class: "graph-path--highlight", d: areaPath, fill: fill, mask: `url(#${id}2)` }),
- hAsync("path", { class: "graph-path", d: areaPath, fill: fill, mask: `url(#${id}3)` })
- ]) : (hAsync("path", { class: "graph-path", d: areaPath, fill: fill }))));
- }
- get el() { return getElement(this); }
- static get style() { return graphCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-graph",
- "$members$": {
- "data": [16],
- "colorStops": [16],
- "highlightMin": [2, "highlight-min"],
- "highlightMax": [2, "highlight-max"],
- "min": [2],
- "max": [2]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": []
- }; }
- }
- const CSS$v = {
- handle: "handle",
- handleActivated: "handle--activated"
- };
- const ICONS$7 = {
- drag: "drag"
- };
- const handleCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-handle:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-handle{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-handle{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-handle{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-handle{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-handle{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-handle:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-handle-h{display:none}/*!@:host*/.sc-calcite-handle-h{display:-ms-flexbox;display:flex}/*!@.handle*/.handle.sc-calcite-handle{display:-ms-flexbox;display:flex;cursor:move;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-ms-flex-item-align:stretch;align-self:stretch;border-style:none;background-color:transparent;outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;color:var(--calcite-ui-border-3);padding:0.75rem 0.25rem;line-height:0}/*!@.handle:hover*/.handle.sc-calcite-handle:hover{background-color:var(--calcite-ui-foreground-2);color:var(--calcite-ui-text-1)}/*!@.handle:focus*/.handle.sc-calcite-handle:focus{color:var(--calcite-ui-text-1);outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@.handle--activated*/.handle--activated.sc-calcite-handle{background-color:var(--calcite-ui-foreground-3);color:var(--calcite-ui-text-1)}/*!@.handle calcite-icon*/.handle.sc-calcite-handle calcite-icon.sc-calcite-handle{color:inherit}";
- class Handle {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteHandleNudge = createEvent(this, "calciteHandleNudge", 7);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * @internal - stores the activated state of the drag handle.
- */
- this.activated = false;
- /**
- * Value for the button title attribute
- */
- this.textTitle = "handle";
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.handleKeyDown = (event) => {
- switch (event.key) {
- case " ":
- this.activated = !this.activated;
- break;
- case "ArrowUp":
- case "ArrowDown":
- if (!this.activated) {
- return;
- }
- const direction = event.key.toLowerCase().replace("arrow", "");
- this.calciteHandleNudge.emit({ handle: this.el, direction });
- break;
- }
- };
- this.handleBlur = () => {
- this.activated = false;
- };
- }
- // --------------------------------------------------------------------------
- //
- // Methods
- //
- // --------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- this.handleButton.focus();
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- return (
- // Needs to be a span because of https://github.com/SortableJS/Sortable/issues/1486
- hAsync("span", { "aria-pressed": toAriaBoolean(this.activated), class: { [CSS$v.handle]: true, [CSS$v.handleActivated]: this.activated }, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, ref: (el) => {
- this.handleButton = el;
- }, role: "button", tabindex: "0", title: this.textTitle }, hAsync("calcite-icon", { icon: ICONS$7.drag, scale: "s" })));
- }
- get el() { return getElement(this); }
- static get style() { return handleCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-handle",
- "$members$": {
- "activated": [1540],
- "textTitle": [513, "text-title"],
- "setFocus": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["activated", "activated"], ["textTitle", "text-title"]]
- }; }
- }
- const CSS$u = {
- icon: "icon",
- flipRtl: "flip-rtl"
- };
- const scaleToPx = {
- s: 16,
- m: 24,
- l: 32
- };
- const iconCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-icon:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-icon{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-icon{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-icon{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-icon{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-icon{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-icon:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-icon-h{display:none}/*!@:host*/.sc-calcite-icon-h{display:-ms-inline-flexbox;display:inline-flex;color:var(--calcite-ui-icon-color)}/*!@:host([scale=s])*/[scale=s].sc-calcite-icon-h{height:1rem;width:1rem;min-width:1rem;min-height:1rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-icon-h{height:1.5rem;width:1.5rem;min-width:1.5rem;min-height:1.5rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-icon-h{height:2rem;width:2rem;min-width:2rem;min-height:2rem}/*!@.flip-rtl*/.flip-rtl.sc-calcite-icon{-webkit-transform:scaleX(-1);transform:scaleX(-1)}/*!@.svg*/.svg.sc-calcite-icon{display:block}";
- class Icon {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /**
- * The name of the icon to display. The value of this property must match the icon name from https://esri.github.io/calcite-ui-icons/.
- */
- this.icon = null;
- /**
- * When true, the icon will be flipped when the element direction is 'rtl'.
- */
- this.flipRtl = false;
- /**
- * Icon scale.
- */
- this.scale = "m";
- this.visible = false;
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- this.waitUntilVisible(() => {
- this.visible = true;
- this.loadIconPathData();
- });
- }
- disconnectedCallback() {
- var _a;
- (_a = this.intersectionObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- this.intersectionObserver = null;
- }
- async componentWillLoad() {
- this.loadIconPathData();
- }
- render() {
- const { el, flipRtl, pathData, scale, textLabel } = this;
- const dir = getElementDir(el);
- const size = scaleToPx[scale];
- const semantic = !!textLabel;
- const paths = [].concat(pathData || "");
- return (hAsync(Host, { "aria-hidden": toAriaBoolean(!semantic), "aria-label": semantic ? textLabel : null, role: semantic ? "img" : null }, hAsync("svg", { class: {
- [CSS$u.flipRtl]: dir === "rtl" && flipRtl,
- svg: true
- }, fill: "currentColor", height: "100%", viewBox: `0 0 ${size} ${size}`, width: "100%", xmlns: "http://www.w3.org/2000/svg" }, paths.map((path) => typeof path === "string" ? (hAsync("path", { d: path })) : (hAsync("path", { d: path.d, opacity: "opacity" in path ? path.opacity : 1 }))))));
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- async loadIconPathData() {
- {
- return;
- }
- }
- waitUntilVisible(callback) {
- this.intersectionObserver = createObserver();
- if (!this.intersectionObserver) {
- callback();
- return;
- }
- this.intersectionObserver.observe(this.el);
- }
- static get assetsDirs() { return ["assets"]; }
- get el() { return getElement(this); }
- static get watchers() { return {
- "icon": ["loadIconPathData"],
- "scale": ["loadIconPathData"]
- }; }
- static get style() { return iconCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-icon",
- "$members$": {
- "icon": [513],
- "flipRtl": [516, "flip-rtl"],
- "scale": [513],
- "textLabel": [1, "text-label"],
- "pathData": [32],
- "visible": [32]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["icon", "icon"], ["flipRtl", "flip-rtl"], ["scale", "scale"]]
- }; }
- }
- const CSS$t = {
- wrapper: "wrapper",
- confirmChangesButton: "confirm-changes-button",
- cancelEditingButton: "cancel-editing-button",
- inputWrapper: "input-wrapper",
- cancelEditingButtonWrapper: "cancel-editing-button-wrapper",
- enableEditingButton: "enable-editing-button",
- controlsWrapper: "controls-wrapper"
- };
- const TEXT$d = {
- intlEnablingEditing: "Click to edit",
- intlCancelEditing: "Cancel",
- intlConfirmChanges: "Save"
- };
- const inlineEditableCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-inline-editable:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-inline-editable{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-inline-editable{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-inline-editable{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-inline-editable{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-inline-editable{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-inline-editable:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-inline-editable-h{display:none}/*!@:host*/.sc-calcite-inline-editable-h{display:block}/*!@:host([scale=s]) .controls-wrapper*/[scale=s].sc-calcite-inline-editable-h .controls-wrapper.sc-calcite-inline-editable{height:1.5rem}/*!@:host([scale=m]) .controls-wrapper*/[scale=m].sc-calcite-inline-editable-h .controls-wrapper.sc-calcite-inline-editable{height:2rem}/*!@:host([scale=l]) .controls-wrapper*/[scale=l].sc-calcite-inline-editable-h .controls-wrapper.sc-calcite-inline-editable{height:2.75rem}/*!@:host(:not([editing-enabled]):not([disabled])) .wrapper:hover*/.sc-calcite-inline-editable-h:not([editing-enabled]):not([disabled]) .wrapper.sc-calcite-inline-editable:hover{background-color:var(--calcite-ui-foreground-2)}/*!@.wrapper*/.wrapper.sc-calcite-inline-editable{-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;background-color:var(--calcite-ui-foreground-1);-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s}/*!@.wrapper .input-wrapper*/.wrapper.sc-calcite-inline-editable .input-wrapper.sc-calcite-inline-editable{-ms-flex:1 1 0%;flex:1 1 0%}/*!@.controls-wrapper*/.controls-wrapper.sc-calcite-inline-editable{display:-ms-flexbox;display:flex}/*!@:host([disabled])*/[disabled].sc-calcite-inline-editable-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) .cancel-editing-button-wrapper*/[disabled].sc-calcite-inline-editable-h .cancel-editing-button-wrapper.sc-calcite-inline-editable{border-color:var(--calcite-ui-border-2)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-inline-editable-h[disabled] .sc-calcite-inline-editable-s>[calcite-hydrated][disabled],[disabled].sc-calcite-inline-editable-h [calcite-hydrated][disabled].sc-calcite-inline-editable{opacity:1}";
- /**
- * @slot - A slot for adding a `calcite-input`.
- */
- class InlineEditable {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteInlineEditableEditCancel = createEvent(this, "calciteInlineEditableEditCancel", 7);
- this.calciteInlineEditableEditConfirm = createEvent(this, "calciteInlineEditableEditConfirm", 7);
- this.calciteInlineEditableEnableEditingChange = createEvent(this, "calciteInlineEditableEnableEditingChange", 7);
- //--------------------------------------------------------------------------
- //
- // Props
- //
- //--------------------------------------------------------------------------
- /** specify whether editing can be enabled */
- this.disabled = false;
- /** specify whether the wrapped input element is editable, defaults to false */
- this.editingEnabled = false;
- /** specify whether the confirm button should display a loading state, defaults to false */
- this.loading = false;
- /** specify whether save/cancel controls should be displayed when editingEnabled is true, defaults to false */
- this.controls = false;
- /** specify text to be user for the enable editing button's aria-label, defaults to `Click to edit`
- * @default "Click to edit"
- */
- this.intlEnableEditing = TEXT$d.intlEnablingEditing;
- /** specify text to be user for the cancel editing button's aria-label, defaults to `Cancel`
- * @default "Cancel"
- */
- this.intlCancelEditing = TEXT$d.intlCancelEditing;
- /** specify text to be user for the confirm changes button's aria-label, defaults to `Save`
- * @default "Save"
- */
- this.intlConfirmChanges = TEXT$d.intlConfirmChanges;
- this.mutationObserver = createObserver();
- this.enableEditing = () => {
- var _a, _b;
- this.valuePriorToEditing = (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.value;
- this.editingEnabled = true;
- (_b = this.inputElement) === null || _b === void 0 ? void 0 : _b.setFocus();
- this.calciteInlineEditableEnableEditingChange.emit();
- };
- this.disableEditing = () => {
- this.editingEnabled = false;
- };
- this.cancelEditing = () => {
- if (this.inputElement) {
- this.inputElement.value = this.valuePriorToEditing;
- }
- this.disableEditing();
- this.enableEditingButton.setFocus();
- if (!this.editingEnabled && !!this.shouldEmitCancel) {
- this.calciteInlineEditableEditCancel.emit();
- }
- };
- this.escapeKeyHandler = async (e) => {
- var _a;
- if (e.key !== "Escape") {
- if (e.key === "Tab" && this.shouldShowControls) {
- if (!e.shiftKey && e.target === this.inputElement) {
- e.preventDefault();
- this.cancelEditingButton.setFocus();
- }
- if (!!e.shiftKey && e.target === this.cancelEditingButton) {
- e.preventDefault();
- (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.setFocus();
- }
- }
- return;
- }
- this.cancelEditing();
- };
- this.cancelEditingHandler = async (e) => {
- e.preventDefault();
- this.cancelEditing();
- };
- this.enableEditingHandler = async (e) => {
- if (this.disabled ||
- e.target === this.cancelEditingButton ||
- e.target === this.confirmEditingButton) {
- return;
- }
- e.preventDefault();
- if (!this.editingEnabled) {
- this.enableEditing();
- }
- };
- this.confirmChangesHandler = async (e) => {
- e.preventDefault();
- this.calciteInlineEditableEditConfirm.emit();
- try {
- if (this.afterConfirm) {
- this.loading = true;
- await this.afterConfirm();
- this.disableEditing();
- this.enableEditingButton.setFocus();
- }
- }
- catch (e) {
- }
- finally {
- this.loading = false;
- }
- };
- }
- disabledWatcher(disabled) {
- if (this.inputElement) {
- this.inputElement.disabled = disabled;
- }
- }
- editingEnabledWatcher(newValue, oldValue) {
- if (this.inputElement) {
- this.inputElement.editingEnabled = newValue;
- }
- if (!newValue && !!oldValue) {
- this.shouldEmitCancel = true;
- }
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- var _a;
- connectLabel(this);
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true });
- this.mutationObserverCallback();
- }
- disconnectedCallback() {
- var _a;
- disconnectLabel(this);
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- render() {
- return (hAsync("div", { class: CSS$t.wrapper, onClick: this.enableEditingHandler, onKeyDown: this.escapeKeyHandler }, hAsync("div", { class: CSS$t.inputWrapper }, hAsync("slot", null)), hAsync("div", { class: CSS$t.controlsWrapper }, hAsync("calcite-button", { appearance: "transparent", class: CSS$t.enableEditingButton, color: "neutral", disabled: this.disabled, iconStart: "pencil", label: this.intlEnableEditing, onClick: this.enableEditingHandler, ref: (el) => (this.enableEditingButton = el), scale: this.scale, style: {
- opacity: this.editingEnabled ? "0" : "1",
- width: this.editingEnabled ? "0" : "inherit"
- }, type: "button" }), this.shouldShowControls && [
- hAsync("div", { class: CSS$t.cancelEditingButtonWrapper }, hAsync("calcite-button", { appearance: "transparent", class: CSS$t.cancelEditingButton, color: "neutral", disabled: this.disabled, iconStart: "x", label: this.intlCancelEditing, onClick: this.cancelEditingHandler, ref: (el) => (this.cancelEditingButton = el), scale: this.scale, type: "button" })),
- hAsync("calcite-button", { appearance: "solid", class: CSS$t.confirmChangesButton, color: "blue", disabled: this.disabled, iconStart: "check", label: this.intlConfirmChanges, loading: this.loading, onClick: this.confirmChangesHandler, ref: (el) => (this.confirmEditingButton = el), scale: this.scale, type: "button" })
- ])));
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- blurHandler() {
- if (!this.controls) {
- this.disableEditing();
- }
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- async setFocus() {
- var _a, _b;
- if (this.editingEnabled) {
- (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.setFocus();
- }
- else {
- (_b = this.enableEditingButton) === null || _b === void 0 ? void 0 : _b.setFocus();
- }
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- mutationObserverCallback() {
- var _a;
- this.updateSlottedInput();
- this.scale =
- this.scale || ((_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.scale) || getElementProp(this.el, "scale", undefined);
- }
- onLabelClick() {
- this.setFocus();
- }
- updateSlottedInput() {
- const inputElement = getSlotted(this.el, {
- matches: "calcite-input"
- });
- this.inputElement = inputElement;
- if (!inputElement) {
- return;
- }
- this.inputElement.disabled = this.disabled;
- this.inputElement.label = this.inputElement.label || getLabelText(this);
- }
- get shouldShowControls() {
- return this.editingEnabled && this.controls;
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "disabled": ["disabledWatcher"],
- "editingEnabled": ["editingEnabledWatcher"]
- }; }
- static get style() { return inlineEditableCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-inline-editable",
- "$members$": {
- "disabled": [516],
- "editingEnabled": [1540, "editing-enabled"],
- "loading": [1540],
- "controls": [516],
- "intlEnableEditing": [513, "intl-enable-editing"],
- "intlCancelEditing": [513, "intl-cancel-editing"],
- "intlConfirmChanges": [513, "intl-confirm-changes"],
- "scale": [1537],
- "afterConfirm": [16],
- "setFocus": [64]
- },
- "$listeners$": [[0, "calciteInputBlur", "blurHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"], ["editingEnabled", "editing-enabled"], ["loading", "loading"], ["controls", "controls"], ["intlEnableEditing", "intl-enable-editing"], ["intlCancelEditing", "intl-cancel-editing"], ["intlConfirmChanges", "intl-confirm-changes"], ["scale", "scale"]]
- }; }
- }
- const CSS$s = {
- loader: "loader",
- clearButton: "clear-button",
- editingEnabled: "editing-enabled",
- inlineChild: "inline-child",
- inputIcon: "icon",
- prefix: "prefix",
- suffix: "suffix",
- numberButtonWrapper: "number-button-wrapper",
- buttonItemHorizontal: "number-button-item--horizontal",
- wrapper: "element-wrapper",
- inputWrapper: "wrapper",
- actionWrapper: "action-wrapper",
- resizeIconWrapper: "resize-icon-wrapper",
- numberButtonItem: "number-button-item"
- };
- const INPUT_TYPE_ICONS = {
- tel: "phone",
- password: "lock",
- email: "email-address",
- date: "calendar",
- time: "clock",
- search: "search"
- };
- const SLOTS$g = {
- action: "action"
- };
- const TEXT$c = {
- clear: "Clear value"
- };
- const inputCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-input:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-input{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-input{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-input{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-input{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-input{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-input:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-input-h{display:none}/*!@:host*/.sc-calcite-input-h{display:block}/*!@:host([scale=s]) input, :host([scale=s]) .prefix, :host([scale=s]) .suffix*/[scale=s].sc-calcite-input-h input.sc-calcite-input,[scale=s].sc-calcite-input-h .prefix.sc-calcite-input,[scale=s].sc-calcite-input-h .suffix.sc-calcite-input{height:1.5rem;padding:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=s]) textarea*/[scale=s].sc-calcite-input-h textarea.sc-calcite-input{height:1.5rem;min-height:1.5rem}/*!@:host([scale=s]) .number-button-wrapper, :host([scale=s]) .action-wrapper calcite-button, :host([scale=s]) .action-wrapper calcite-button button*/[scale=s].sc-calcite-input-h .number-button-wrapper.sc-calcite-input,[scale=s].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input,[scale=s].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input button.sc-calcite-input{height:1.5rem}/*!@:host([scale=s]) input[type=file]*/[scale=s].sc-calcite-input-h input[type=file].sc-calcite-input{height:1.5rem}/*!@:host([scale=s]) .clear-button*/[scale=s].sc-calcite-input-h .clear-button.sc-calcite-input{min-height:1.5rem;min-width:1.5rem}/*!@:host([scale=s]) textarea*/[scale=s].sc-calcite-input-h textarea.sc-calcite-input{height:auto;padding-top:0.25rem;padding-bottom:0.25rem;padding-left:0.5rem;padding-right:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=m]) input, :host([scale=m]) .prefix, :host([scale=m]) .suffix*/[scale=m].sc-calcite-input-h input.sc-calcite-input,[scale=m].sc-calcite-input-h .prefix.sc-calcite-input,[scale=m].sc-calcite-input-h .suffix.sc-calcite-input{height:2rem;padding:0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=m]) textarea*/[scale=m].sc-calcite-input-h textarea.sc-calcite-input{min-height:2rem}/*!@:host([scale=m]) .number-button-wrapper, :host([scale=m]) .action-wrapper calcite-button, :host([scale=m]) .action-wrapper calcite-button button*/[scale=m].sc-calcite-input-h .number-button-wrapper.sc-calcite-input,[scale=m].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input,[scale=m].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input button.sc-calcite-input{height:2rem}/*!@:host([scale=m]) input[type=file]*/[scale=m].sc-calcite-input-h input[type=file].sc-calcite-input{height:2rem}/*!@:host([scale=m]) .clear-button*/[scale=m].sc-calcite-input-h .clear-button.sc-calcite-input{min-height:2rem;min-width:2rem}/*!@:host([scale=m]) textarea*/[scale=m].sc-calcite-input-h textarea.sc-calcite-input{height:auto;padding-top:0.5rem;padding-bottom:0.5rem;padding-left:0.75rem;padding-right:0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=l]) input, :host([scale=l]) .prefix, :host([scale=l]) .suffix*/[scale=l].sc-calcite-input-h input.sc-calcite-input,[scale=l].sc-calcite-input-h .prefix.sc-calcite-input,[scale=l].sc-calcite-input-h .suffix.sc-calcite-input{height:2.75rem;padding:1rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host([scale=l]) textarea*/[scale=l].sc-calcite-input-h textarea.sc-calcite-input{min-height:2.75rem}/*!@:host([scale=l]) .number-button-wrapper, :host([scale=l]) .action-wrapper calcite-button, :host([scale=l]) .action-wrapper calcite-button button*/[scale=l].sc-calcite-input-h .number-button-wrapper.sc-calcite-input,[scale=l].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input,[scale=l].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input button.sc-calcite-input{height:2.75rem}/*!@:host([scale=l]) input[type=file]*/[scale=l].sc-calcite-input-h input[type=file].sc-calcite-input{height:2.75rem}/*!@:host([scale=l]) .clear-button*/[scale=l].sc-calcite-input-h .clear-button.sc-calcite-input{min-height:2.75rem;min-width:2.75rem}/*!@:host([scale=l]) textarea*/[scale=l].sc-calcite-input-h textarea.sc-calcite-input{height:auto;padding-top:0.75rem;padding-bottom:0.75rem;padding-left:1rem;padding-right:1rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host([disabled])*/[disabled].sc-calcite-input-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) textarea*/[disabled].sc-calcite-input-h textarea.sc-calcite-input{resize:none}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-input-h[disabled] .sc-calcite-input-s>[calcite-hydrated][disabled],[disabled].sc-calcite-input-h [calcite-hydrated][disabled].sc-calcite-input{opacity:1}/*!@:host textarea,\n:host input*/.sc-calcite-input-h textarea.sc-calcite-input,.sc-calcite-input-h input.sc-calcite-input{-webkit-transition:var(--calcite-animation-timing), height 0s;transition:var(--calcite-animation-timing), height 0s;-webkit-appearance:none;position:relative;margin:0px;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;max-height:100%;width:100%;max-width:100%;-ms-flex:1 1 0%;flex:1 1 0%;border-radius:0px;background-color:var(--calcite-ui-foreground-1);font-family:inherit;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-1)}/*!@:host input[type=search]::-webkit-search-decoration*/.sc-calcite-input-h input[type=search].sc-calcite-input::-webkit-search-decoration{-webkit-appearance:none}/*!@:host input, :host textarea*/.sc-calcite-input-h input.sc-calcite-input,.sc-calcite-input-h textarea.sc-calcite-input{border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-input);color:var(--calcite-ui-text-1)}/*!@:host input::placeholder, :host input:-ms-input-placeholder, :host input::-ms-input-placeholder, :host textarea::placeholder, :host textarea:-ms-input-placeholder, :host textarea::-ms-input-placeholder*/.sc-calcite-input-h input.sc-calcite-input:-ms-input-placeholder,.sc-calcite-input-h textarea.sc-calcite-input:-ms-input-placeholder{font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-3)}.sc-calcite-input-h input.sc-calcite-input::-ms-input-placeholder,.sc-calcite-input-h textarea.sc-calcite-input::-ms-input-placeholder{font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-3)}.sc-calcite-input-h input.sc-calcite-input::placeholder,.sc-calcite-input-h input.sc-calcite-input:-ms-input-placeholder,.sc-calcite-input-h input.sc-calcite-input::-ms-input-placeholder,.sc-calcite-input-h textarea.sc-calcite-input::placeholder,.sc-calcite-input-h textarea.sc-calcite-input:-ms-input-placeholder,.sc-calcite-input-h textarea.sc-calcite-input::-ms-input-placeholder{font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-3)}/*!@:host input:focus, :host textarea:focus*/.sc-calcite-input-h input.sc-calcite-input:focus,.sc-calcite-input-h textarea.sc-calcite-input:focus{border-color:var(--calcite-ui-brand);color:var(--calcite-ui-text-1)}/*!@:host input[readonly], :host textarea[readonly]*/.sc-calcite-input-h input[readonly].sc-calcite-input,.sc-calcite-input-h textarea[readonly].sc-calcite-input{background-color:var(--calcite-ui-background);font-weight:var(--calcite-font-weight-medium)}/*!@:host input[readonly]:focus, :host textarea[readonly]:focus*/.sc-calcite-input-h input[readonly].sc-calcite-input:focus,.sc-calcite-input-h textarea[readonly].sc-calcite-input:focus{color:var(--calcite-ui-text-1)}/*!@:host calcite-icon*/.sc-calcite-input-h calcite-icon.sc-calcite-input{color:var(--calcite-ui-text-3)}/*!@:host textarea, :host input*/.sc-calcite-input-h textarea.sc-calcite-input,.sc-calcite-input-h input.sc-calcite-input{outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@:host textarea:focus, :host input:focus*/.sc-calcite-input-h textarea.sc-calcite-input:focus,.sc-calcite-input-h input.sc-calcite-input:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@:host([status=invalid]) input, :host([status=invalid]) textarea*/[status=invalid].sc-calcite-input-h input.sc-calcite-input,[status=invalid].sc-calcite-input-h textarea.sc-calcite-input{border-color:var(--calcite-ui-danger)}/*!@:host([status=invalid]) input:focus, :host([status=invalid]) textarea:focus*/[status=invalid].sc-calcite-input-h input.sc-calcite-input:focus,[status=invalid].sc-calcite-input-h textarea.sc-calcite-input:focus{outline:2px solid var(--calcite-ui-danger);outline-offset:-2px}/*!@:host([scale=s]) .icon*/[scale=s].sc-calcite-input-h .icon.sc-calcite-input{inset-inline-start:0.5rem}/*!@:host([scale=m]) .icon*/[scale=m].sc-calcite-input-h .icon.sc-calcite-input{inset-inline-start:0.75rem}/*!@:host([scale=l]) .icon*/[scale=l].sc-calcite-input-h .icon.sc-calcite-input{inset-inline-start:1rem}/*!@:host([icon][scale=s]) input*/[icon][scale=s].sc-calcite-input-h input.sc-calcite-input{-webkit-padding-start:2rem;padding-inline-start:2rem}/*!@:host([icon][scale=m]) input*/[icon][scale=m].sc-calcite-input-h input.sc-calcite-input{-webkit-padding-start:2.5rem;padding-inline-start:2.5rem}/*!@:host([icon][scale=l]) input*/[icon][scale=l].sc-calcite-input-h input.sc-calcite-input{-webkit-padding-start:3rem;padding-inline-start:3rem}/*!@.element-wrapper*/.element-wrapper.sc-calcite-input{position:relative;-ms-flex-order:3;order:3;display:-ms-inline-flexbox;display:inline-flex;-ms-flex:1 1 0%;flex:1 1 0%;-ms-flex-align:center;align-items:center}/*!@.icon*/.icon.sc-calcite-input{pointer-events:none;position:absolute;z-index:10;display:block;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s}/*!@input[type=text]::-ms-clear, input[type=text]::-ms-reveal*/input[type=text].sc-calcite-input::-ms-clear,input[type=text].sc-calcite-input::-ms-reveal{display:none;height:0px;width:0px}/*!@input[type=search]::-webkit-search-decoration, input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-results-button, input[type=search]::-webkit-search-results-decoration, input[type=date]::-webkit-clear-button, input[type=time]::-webkit-clear-button*/input[type=search].sc-calcite-input::-webkit-search-decoration,input[type=search].sc-calcite-input::-webkit-search-cancel-button,input[type=search].sc-calcite-input::-webkit-search-results-button,input[type=search].sc-calcite-input::-webkit-search-results-decoration,input[type=date].sc-calcite-input::-webkit-clear-button,input[type=time].sc-calcite-input::-webkit-clear-button{display:none}/*!@.clear-button*/.clear-button.sc-calcite-input{pointer-events:initial;-ms-flex-order:4;order:4;margin:0px;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;min-height:100%;cursor:pointer;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-ms-flex-item-align:stretch;align-self:stretch;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-input);background-color:var(--calcite-ui-foreground-1);outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;border-inline-start-width:0px}/*!@.clear-button:hover*/.clear-button.sc-calcite-input:hover{background-color:var(--calcite-ui-foreground-2);-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s}/*!@.clear-button:hover calcite-icon*/.clear-button.sc-calcite-input:hover calcite-icon.sc-calcite-input{color:var(--calcite-ui-text-1);-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s}/*!@.clear-button:active*/.clear-button.sc-calcite-input:active{background-color:var(--calcite-ui-foreground-3)}/*!@.clear-button:active calcite-icon*/.clear-button.sc-calcite-input:active calcite-icon.sc-calcite-input{color:var(--calcite-ui-text-1)}/*!@.clear-button:focus*/.clear-button.sc-calcite-input:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@.clear-button:disabled*/.clear-button.sc-calcite-input:disabled{opacity:var(--calcite-ui-opacity-disabled)}/*!@.loader*/.loader.sc-calcite-input{top:1px;left:1px;right:1px;pointer-events:none;position:absolute;display:block}/*!@.action-wrapper*/.action-wrapper.sc-calcite-input{-ms-flex-order:7;order:7;display:-ms-flexbox;display:flex}/*!@.prefix, .suffix*/.prefix.sc-calcite-input,.suffix.sc-calcite-input{-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;height:auto;min-height:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-ms-flex-line-pack:center;align-content:center;-ms-flex-align:center;align-items:center;overflow-wrap:break-word;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-input);background-color:var(--calcite-ui-background);font-weight:var(--calcite-font-weight-medium);line-height:1;color:var(--calcite-ui-text-2)}/*!@.prefix*/.prefix.sc-calcite-input{-ms-flex-order:2;order:2;border-inline-end-width:0px}/*!@.suffix*/.suffix.sc-calcite-input{-ms-flex-order:5;order:5;border-inline-start-width:0px}/*!@:host([alignment=start]) textarea, :host([alignment=start]) input*/[alignment=start].sc-calcite-input-h textarea.sc-calcite-input,[alignment=start].sc-calcite-input-h input.sc-calcite-input{text-align:start}/*!@:host([alignment=end]) textarea, :host([alignment=end]) input*/[alignment=end].sc-calcite-input-h textarea.sc-calcite-input,[alignment=end].sc-calcite-input-h input.sc-calcite-input{text-align:end}/*!@:host input[type=number]*/.sc-calcite-input-h input[type=number].sc-calcite-input{-moz-appearance:textfield}/*!@:host input[type=number]::-webkit-inner-spin-button, :host input[type=number]::-webkit-outer-spin-button*/.sc-calcite-input-h input[type=number].sc-calcite-input::-webkit-inner-spin-button,.sc-calcite-input-h input[type=number].sc-calcite-input::-webkit-outer-spin-button{-webkit-appearance:none;-moz-appearance:textfield;margin:0px}/*!@.number-button-wrapper*/.number-button-wrapper.sc-calcite-input{pointer-events:none;-ms-flex-order:6;order:6;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s}/*!@:host([number-button-type=vertical]) .wrapper*/[number-button-type=vertical].sc-calcite-input-h .wrapper.sc-calcite-input{-ms-flex-direction:row;flex-direction:row;display:-ms-flexbox;display:flex}/*!@:host([number-button-type=vertical]) input, :host([number-button-type=vertical]) textarea*/[number-button-type=vertical].sc-calcite-input-h input.sc-calcite-input,[number-button-type=vertical].sc-calcite-input-h textarea.sc-calcite-input{-ms-flex-order:2;order:2}/*!@:host([number-button-type=horizontal]) .calcite--rtl .number-button-item[data-adjustment=down] calcite-icon*/[number-button-type=horizontal].sc-calcite-input-h .calcite--rtl.sc-calcite-input .number-button-item[data-adjustment=down].sc-calcite-input calcite-icon.sc-calcite-input{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}/*!@:host([number-button-type=horizontal]) .calcite--rtl .number-button-item[data-adjustment=up] calcite-icon*/[number-button-type=horizontal].sc-calcite-input-h .calcite--rtl.sc-calcite-input .number-button-item[data-adjustment=up].sc-calcite-input calcite-icon.sc-calcite-input{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down], .number-button-item.number-button-item--horizontal[data-adjustment=up]*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input,.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input{-ms-flex-order:1;order:1;max-height:100%;min-height:100%;-ms-flex-item-align:stretch;align-self:stretch}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down] calcite-icon, .number-button-item.number-button-item--horizontal[data-adjustment=up] calcite-icon*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input calcite-icon.sc-calcite-input,.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input calcite-icon.sc-calcite-input{-webkit-transform:rotate(90deg);transform:rotate(90deg)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down]*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input{border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-input);border-inline-end-width:0px}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down]:hover*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input:hover{background-color:var(--calcite-ui-foreground-2)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down]:hover calcite-icon*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input:hover calcite-icon.sc-calcite-input{color:var(--calcite-ui-text-1)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=up]*/.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input{-ms-flex-order:5;order:5}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=up]:hover*/.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input:hover{background-color:var(--calcite-ui-foreground-2)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=up]:hover calcite-icon*/.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input:hover calcite-icon.sc-calcite-input{color:var(--calcite-ui-text-1)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]:hover*/[number-button-type=vertical].sc-calcite-input-h .number-button-item[data-adjustment=down].sc-calcite-input:hover{background-color:var(--calcite-ui-foreground-2)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]:hover calcite-icon*/[number-button-type=vertical].sc-calcite-input-h .number-button-item[data-adjustment=down].sc-calcite-input:hover calcite-icon.sc-calcite-input{color:var(--calcite-ui-text-1)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=up]:hover*/[number-button-type=vertical].sc-calcite-input-h .number-button-item[data-adjustment=up].sc-calcite-input:hover{background-color:var(--calcite-ui-foreground-2)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=up]:hover calcite-icon*/[number-button-type=vertical].sc-calcite-input-h .number-button-item[data-adjustment=up].sc-calcite-input:hover calcite-icon.sc-calcite-input{color:var(--calcite-ui-text-1)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]*/[number-button-type=vertical].sc-calcite-input-h .number-button-item[data-adjustment=down].sc-calcite-input{border-top-width:0px}/*!@.number-button-item*/.number-button-item.sc-calcite-input{max-height:50%;min-height:50%;pointer-events:initial;margin:0px;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;cursor:pointer;-ms-flex-align:center;align-items:center;-ms-flex-item-align:center;align-self:center;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-input);background-color:var(--calcite-ui-foreground-1);padding-top:0px;padding-bottom:0px;padding-left:0.5rem;padding-right:0.5rem;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;border-inline-start-width:0px}/*!@.number-button-item calcite-icon*/.number-button-item.sc-calcite-input calcite-icon.sc-calcite-input{pointer-events:none;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s}/*!@.number-button-item:focus*/.number-button-item.sc-calcite-input:focus{background-color:var(--calcite-ui-foreground-2)}/*!@.number-button-item:focus calcite-icon*/.number-button-item.sc-calcite-input:focus calcite-icon.sc-calcite-input{color:var(--calcite-ui-text-1)}/*!@.number-button-item:active*/.number-button-item.sc-calcite-input:active{background-color:var(--calcite-ui-foreground-3)}/*!@.wrapper*/.wrapper.sc-calcite-input{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}/*!@:host input::-webkit-calendar-picker-indicator*/.sc-calcite-input-h input.sc-calcite-input::-webkit-calendar-picker-indicator{display:none}/*!@:host input[type=date]::-webkit-input-placeholder*/.sc-calcite-input-h input[type=date].sc-calcite-input::-webkit-input-placeholder{visibility:hidden !important}/*!@:host textarea::-webkit-resizer*/.sc-calcite-input-h textarea.sc-calcite-input::-webkit-resizer{position:absolute;bottom:0px;-webkit-box-sizing:border-box;box-sizing:border-box;padding-top:0px;padding-bottom:0px;padding-left:0.25rem;padding-right:0.25rem;inset-inline-end:0}/*!@.resize-icon-wrapper*/.resize-icon-wrapper.sc-calcite-input{bottom:2px;inset-inline-end:2px;pointer-events:none;position:absolute;z-index:10;height:0.75rem;width:0.75rem;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-3)}/*!@.resize-icon-wrapper calcite-icon*/.resize-icon-wrapper.sc-calcite-input calcite-icon.sc-calcite-input{bottom:0.25rem;inset-inline-end:0.25rem;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}/*!@.calcite--rtl .resize-icon-wrapper calcite-icon*/.calcite--rtl.sc-calcite-input .resize-icon-wrapper.sc-calcite-input calcite-icon.sc-calcite-input{-webkit-transform:rotate(45deg);transform:rotate(45deg)}/*!@:host([type=color]) input*/[type=color].sc-calcite-input-h input.sc-calcite-input{padding:0.25rem}/*!@:host([type=file]) input*/[type=file].sc-calcite-input-h input.sc-calcite-input{cursor:pointer;border-width:1px;border-style:dashed;border-color:var(--calcite-ui-border-input);background-color:var(--calcite-ui-foreground-1);text-align:center}/*!@:host([type=file][scale=s]) input*/[type=file][scale=s].sc-calcite-input-h input.sc-calcite-input{padding-top:1px;padding-bottom:1px;padding-left:0.5rem;padding-right:0.5rem}/*!@:host([type=file][scale=m]) input*/[type=file][scale=m].sc-calcite-input-h input.sc-calcite-input{padding-top:0.25rem;padding-bottom:0.25rem;padding-left:0.75rem;padding-right:0.75rem}/*!@:host([type=file][scale=l]) input*/[type=file][scale=l].sc-calcite-input-h input.sc-calcite-input{padding-top:0.5rem;padding-bottom:0.5rem;padding-left:1rem;padding-right:1rem}/*!@:host(.no-bottom-border) input*/.no-bottom-border.sc-calcite-input-h input.sc-calcite-input{border-bottom-width:0px}/*!@:host(.border-top-color-one) input*/.border-top-color-one.sc-calcite-input-h input.sc-calcite-input{border-top-color:var(--calcite-ui-border-1)}/*!@:host .inline-child*/.sc-calcite-input-h .inline-child.sc-calcite-input{background-color:transparent;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s}/*!@:host .inline-child .editing-enabled*/.sc-calcite-input-h .inline-child.sc-calcite-input .editing-enabled.sc-calcite-input{background-color:inherit}/*!@:host .inline-child:not(.editing-enabled)*/.sc-calcite-input-h .inline-child.sc-calcite-input:not(.editing-enabled){display:-ms-flexbox;display:flex;cursor:pointer;border-color:transparent;-webkit-padding-start:0;padding-inline-start:0}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-input-s>input[slot=hidden-form-input]{bottom:0 !important;left:0 !important;margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;right:0 !important;top:0 !important;-webkit-transform:none !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}";
- /**
- * @slot action - A slot for positioning a button next to an input
- */
- class Input {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteInputFocus = createEvent(this, "calciteInputFocus", 7);
- this.calciteInputBlur = createEvent(this, "calciteInputBlur", 7);
- this.calciteInputInput = createEvent(this, "calciteInputInput", 7);
- this.calciteInputChange = createEvent(this, "calciteInputChange", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** specify the alignment of the value of the input */
- this.alignment = "start";
- /** should the input autofocus */
- this.autofocus = false;
- /** optionally display a clear button that displays when field has a value
- * shows by default for search, time, date
- * will not display for type="textarea" */
- this.clearable = false;
- /** is the input disabled */
- this.disabled = false;
- /** for number values, displays the locale's group separator */
- this.groupSeparator = false;
- /** when true, the component will not be visible */
- this.hidden = false;
- /**
- * string to override English loading text
- * @default "Loading"
- */
- this.intlLoading = TEXT$s.loading;
- /** flip the icon in rtl */
- this.iconFlipRtl = false;
- /** specify if the input is in loading state */
- this.loading = false;
- /** BCP 47 language tag for desired language and country format */
- this.locale = document.documentElement.lang || "en";
- /**
- * Toggles locale formatting for numbers.
- * @internal
- */
- this.localeFormat = false;
- /** specify the placement of the number buttons */
- this.numberButtonType = "vertical";
- /** When true, a field cannot be modified. */
- this.readOnly = false;
- /** is the input required */
- this.required = false;
- /** specify the scale of the input, defaults to m */
- this.scale = "m";
- /** specify the status of the input field, determines message and icons */
- this.status = "idle";
- /** @internal adds inline styles for text input when slotted in calcite-inline-editable */
- this.editingEnabled = false;
- /**
- * specify the input type
- *
- * Note that the following types add type-specific icons by default: `date`, `email`, `password`, `search`, `tel`, `time`
- */
- this.type = "text";
- /** input value */
- this.value = "";
- /** keep track of the rendered child type */
- this.childElType = "input";
- this.previousValueOrigin = "initial";
- this.mutationObserver = createObserver();
- this.userChangedValue = false;
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- this.keyDownHandler = (event) => {
- if (this.readOnly || this.disabled) {
- return;
- }
- if (this.isClearable && event.key === "Escape") {
- this.clearInputValue(event);
- event.preventDefault();
- }
- if (event.key === "Enter" && !event.defaultPrevented) {
- submitForm(this);
- }
- };
- this.clearInputValue = (nativeEvent) => {
- this.setValue({
- committing: true,
- nativeEvent,
- origin: "user",
- value: ""
- });
- };
- this.emitChangeIfUserModified = () => {
- if (this.previousValueOrigin === "user" && this.value !== this.previousEmittedValue) {
- this.calciteInputChange.emit();
- }
- this.previousEmittedValue = this.value;
- };
- this.inputBlurHandler = () => {
- this.calciteInputBlur.emit({
- element: this.childEl,
- value: this.value
- });
- this.emitChangeIfUserModified();
- };
- this.inputFocusHandler = (event) => {
- const slottedActionEl = getSlotted(this.el, "action");
- if (event.target !== slottedActionEl) {
- this.setFocus();
- }
- this.calciteInputFocus.emit({
- element: this.childEl,
- value: this.value
- });
- };
- this.inputInputHandler = (nativeEvent) => {
- if (this.disabled || this.readOnly) {
- return;
- }
- this.setValue({
- nativeEvent,
- origin: "user",
- value: nativeEvent.target.value
- });
- };
- this.inputKeyDownHandler = (event) => {
- if (this.disabled || this.readOnly) {
- return;
- }
- if (event.key === "Enter") {
- this.emitChangeIfUserModified();
- }
- };
- this.inputNumberInputHandler = (nativeEvent) => {
- if (this.disabled || this.readOnly) {
- return;
- }
- const value = nativeEvent.target.value;
- const delocalizedValue = delocalizeNumberString(value, this.locale);
- if (nativeEvent.inputType === "insertFromPaste") {
- if (!isValidNumber(delocalizedValue)) {
- nativeEvent.preventDefault();
- }
- this.setValue({
- nativeEvent,
- origin: "user",
- value: parseNumberString(delocalizedValue)
- });
- this.childNumberEl.value = this.localizedValue;
- }
- else {
- this.setValue({
- nativeEvent,
- origin: "user",
- value: delocalizedValue
- });
- }
- };
- this.inputNumberKeyDownHandler = (event) => {
- if (this.type !== "number" || this.disabled || this.readOnly) {
- return;
- }
- if (event.key === "ArrowUp") {
- /* prevent default behavior of moving cursor to the beginning of the input when holding down ArrowUp */
- event.preventDefault();
- this.nudgeNumberValue("up", event);
- return;
- }
- if (event.key === "ArrowDown") {
- this.nudgeNumberValue("down", event);
- return;
- }
- const supportedKeys = [
- ...numberKeys,
- "ArrowLeft",
- "ArrowRight",
- "Backspace",
- "Delete",
- "Enter",
- "Escape",
- "Tab"
- ];
- if (event.altKey || event.ctrlKey || event.metaKey) {
- return;
- }
- const isShiftTabEvent = event.shiftKey && event.key === "Tab";
- if (supportedKeys.includes(event.key) && (!event.shiftKey || isShiftTabEvent)) {
- if (event.key === "Enter") {
- this.emitChangeIfUserModified();
- }
- return;
- }
- const decimalSeparator = getDecimalSeparator(this.locale);
- if (event.key === decimalSeparator) {
- if (!this.value && !this.childNumberEl.value) {
- return;
- }
- if (this.value && this.childNumberEl.value.indexOf(decimalSeparator) === -1) {
- return;
- }
- }
- if (/[eE]/.test(event.key)) {
- if (!this.value && !this.childNumberEl.value) {
- return;
- }
- if (this.value && !/[eE]/.test(this.childNumberEl.value)) {
- return;
- }
- }
- if (event.key === "-") {
- if (!this.value && !this.childNumberEl.value) {
- return;
- }
- if (this.value && this.childNumberEl.value.split("-").length <= 2) {
- return;
- }
- }
- event.preventDefault();
- };
- this.nudgeNumberValue = (direction, nativeEvent) => {
- if ((nativeEvent instanceof KeyboardEvent && nativeEvent.repeat) || this.type !== "number") {
- return;
- }
- const inputMax = this.maxString ? parseFloat(this.maxString) : null;
- const inputMin = this.minString ? parseFloat(this.minString) : null;
- const valueNudgeDelayInMs = 100;
- this.incrementOrDecrementNumberValue(direction, inputMax, inputMin, nativeEvent);
- if (this.nudgeNumberValueIntervalId) {
- window.clearInterval(this.nudgeNumberValueIntervalId);
- }
- let firstValueNudge = true;
- this.nudgeNumberValueIntervalId = window.setInterval(() => {
- if (firstValueNudge) {
- firstValueNudge = false;
- return;
- }
- this.incrementOrDecrementNumberValue(direction, inputMax, inputMin, nativeEvent);
- }, valueNudgeDelayInMs);
- };
- this.numberButtonMouseUpAndMouseOutHandler = () => {
- window.clearInterval(this.nudgeNumberValueIntervalId);
- };
- this.numberButtonMouseDownHandler = (event) => {
- event.preventDefault();
- const direction = event.target.dataset.adjustment;
- this.nudgeNumberValue(direction, event);
- };
- this.setChildElRef = (el) => {
- this.childEl = el;
- };
- this.setChildNumberElRef = (el) => {
- this.childNumberEl = el;
- };
- this.setInputValue = (newInputValue) => {
- if (this.type === "text" && !this.childEl) {
- return;
- }
- if (this.type === "number" && !this.childNumberEl) {
- return;
- }
- this[`child${this.type === "number" ? "Number" : ""}El`].value = newInputValue;
- };
- this.setPreviousEmittedValue = (newPreviousEmittedValue) => {
- this.previousEmittedValue =
- this.type === "number"
- ? isValidNumber(newPreviousEmittedValue)
- ? newPreviousEmittedValue
- : ""
- : newPreviousEmittedValue;
- };
- this.setPreviousValue = (newPreviousValue) => {
- this.previousValue =
- this.type === "number"
- ? isValidNumber(newPreviousValue)
- ? newPreviousValue
- : ""
- : newPreviousValue;
- };
- this.setValue = ({ committing = false, nativeEvent, origin, previousValue, value }) => {
- const previousLocalizedValue = this.type === "number"
- ? localizeNumberString(this.previousValue, this.locale, this.groupSeparator)
- : "";
- const sanitizedValue = this.type === "number" ? sanitizeNumberString(value) : value;
- const newValue = this.type === "number" && value && !sanitizedValue
- ? isValidNumber(this.previousValue)
- ? this.previousValue
- : ""
- : sanitizedValue;
- const newLocalizedValue = this.type === "number"
- ? localizeNumberString(newValue, this.locale, this.groupSeparator)
- : "";
- this.setPreviousValue(previousValue || this.value);
- this.previousValueOrigin = origin;
- this.userChangedValue = origin === "user" && this.value !== newValue;
- this.value = newValue;
- if (this.type === "number") {
- this.localizedValue = newLocalizedValue;
- }
- if (origin === "direct") {
- this.setInputValue(this.type === "number" ? newLocalizedValue : newValue);
- }
- if (nativeEvent) {
- const calciteInputInputEvent = this.calciteInputInput.emit({
- element: this.childEl,
- nativeEvent,
- value: this.value
- });
- if (calciteInputInputEvent.defaultPrevented) {
- this.value = this.previousValue;
- this.localizedValue = previousLocalizedValue;
- }
- else if (committing) {
- this.emitChangeIfUserModified();
- }
- }
- };
- this.inputKeyUpHandler = () => {
- window.clearInterval(this.nudgeNumberValueIntervalId);
- };
- }
- disabledWatcher() {
- this.setDisabledAction();
- }
- /** watcher to update number-to-string for max */
- maxWatcher() {
- var _a;
- this.maxString = ((_a = this.max) === null || _a === void 0 ? void 0 : _a.toString()) || null;
- }
- /** watcher to update number-to-string for min */
- minWatcher() {
- var _a;
- this.minString = ((_a = this.min) === null || _a === void 0 ? void 0 : _a.toString()) || null;
- }
- valueWatcher(newValue, previousValue) {
- if (!this.userChangedValue) {
- this.setValue({
- origin: "direct",
- previousValue,
- value: newValue == null || newValue == ""
- ? ""
- : this.type === "number"
- ? isValidNumber(newValue)
- ? newValue
- : this.previousValue || ""
- : newValue
- });
- this.warnAboutInvalidNumberValue(newValue);
- }
- this.userChangedValue = false;
- }
- updateRequestedIcon() {
- this.requestedIcon = setRequestedIcon(INPUT_TYPE_ICONS, this.icon, this.type);
- }
- get isClearable() {
- return !this.isTextarea && (this.clearable || this.type === "search") && this.value.length > 0;
- }
- get isTextarea() {
- return this.childElType === "textarea";
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- var _a;
- this.scale = getElementProp(this.el, "scale", this.scale);
- this.status = getElementProp(this.el, "status", this.status);
- this.inlineEditableEl = this.el.closest("calcite-inline-editable");
- if (this.inlineEditableEl) {
- this.editingEnabled = this.inlineEditableEl.editingEnabled || false;
- }
- this.setPreviousEmittedValue(this.value);
- this.setPreviousValue(this.value);
- if (this.type === "number") {
- this.warnAboutInvalidNumberValue(this.value);
- this.setValue({
- origin: "connected",
- value: isValidNumber(this.value) ? this.value : ""
- });
- }
- connectLabel(this);
- connectForm(this);
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true });
- this.setDisabledAction();
- }
- disconnectedCallback() {
- var _a;
- disconnectLabel(this);
- disconnectForm(this);
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- }
- componentWillLoad() {
- var _a, _b;
- this.childElType = this.type === "textarea" ? "textarea" : "input";
- this.maxString = (_a = this.max) === null || _a === void 0 ? void 0 : _a.toString();
- this.minString = (_b = this.min) === null || _b === void 0 ? void 0 : _b.toString();
- this.requestedIcon = setRequestedIcon(INPUT_TYPE_ICONS, this.icon, this.type);
- }
- componentShouldUpdate(newValue, oldValue, property) {
- if (this.type === "number" && property === "value" && newValue && !isValidNumber(newValue)) {
- this.setValue({
- origin: "reset",
- value: oldValue
- });
- return false;
- }
- return true;
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- var _a, _b;
- if (this.type === "number") {
- (_a = this.childNumberEl) === null || _a === void 0 ? void 0 : _a.focus();
- }
- else {
- (_b = this.childEl) === null || _b === void 0 ? void 0 : _b.focus();
- }
- }
- onLabelClick() {
- this.setFocus();
- }
- incrementOrDecrementNumberValue(direction, inputMax, inputMin, nativeEvent) {
- const { value } = this;
- const inputStep = this.step === "any" ? 1 : Math.abs(this.step || 1);
- const inputVal = value && value !== "" ? parseFloat(value) : 0;
- const adjustment = direction === "up" ? 1 : -1;
- const nudgedValue = inputVal + inputStep * adjustment;
- const finalValue = (typeof inputMin === "number" && !isNaN(inputMin) && nudgedValue < inputMin) ||
- (typeof inputMax === "number" && !isNaN(inputMax) && nudgedValue > inputMax)
- ? inputVal
- : nudgedValue;
- const inputValPlaces = decimalPlaces(inputVal);
- const inputStepPlaces = decimalPlaces(inputStep);
- this.setValue({
- committing: true,
- nativeEvent,
- origin: "user",
- value: finalValue.toFixed(Math.max(inputValPlaces, inputStepPlaces))
- });
- }
- onFormReset() {
- this.setValue({
- origin: "reset",
- value: this.defaultValue
- });
- }
- syncHiddenFormInput(input) {
- var _a, _b, _c, _d;
- if (this.type === "number") {
- input.type = "number";
- input.min = (_b = (_a = this.min) === null || _a === void 0 ? void 0 : _a.toString(10)) !== null && _b !== void 0 ? _b : "";
- input.max = (_d = (_c = this.max) === null || _c === void 0 ? void 0 : _c.toString(10)) !== null && _d !== void 0 ? _d : "";
- }
- else if (this.type === "text") {
- input.type = "text";
- if (this.minLength != null) {
- input.minLength = this.minLength;
- }
- if (this.maxLength != null) {
- input.maxLength = this.maxLength;
- }
- }
- else if (this.type === "password") {
- input.type = "password";
- }
- }
- setDisabledAction() {
- const slottedActionEl = getSlotted(this.el, "action");
- if (!slottedActionEl) {
- return;
- }
- this.disabled
- ? slottedActionEl.setAttribute("disabled", "")
- : slottedActionEl.removeAttribute("disabled");
- }
- warnAboutInvalidNumberValue(value) {
- if (this.type === "number" && value && !isValidNumber(value)) {
- console.warn(`The specified value "${value}" cannot be parsed, or is out of range.`);
- }
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- const dir = getElementDir(this.el);
- const loader = (hAsync("div", { class: CSS$s.loader }, hAsync("calcite-progress", { label: this.intlLoading, type: "indeterminate" })));
- const inputClearButton = (hAsync("button", { "aria-label": this.intlClear || TEXT$c.clear, class: CSS$s.clearButton, disabled: this.disabled || this.readOnly, onClick: this.clearInputValue, tabIndex: this.disabled ? -1 : 0, type: "button" }, hAsync("calcite-icon", { icon: "x", scale: "s" })));
- const iconEl = (hAsync("calcite-icon", { class: CSS$s.inputIcon, flipRtl: this.iconFlipRtl, icon: this.requestedIcon, scale: "s" }));
- const isHorizontalNumberButton = this.numberButtonType === "horizontal";
- const numberButtonsHorizontalUp = (hAsync("button", { class: {
- [CSS$s.numberButtonItem]: true,
- [CSS$s.buttonItemHorizontal]: isHorizontalNumberButton
- }, "data-adjustment": "up", disabled: this.disabled || this.readOnly, onMouseDown: this.numberButtonMouseDownHandler, onMouseOut: this.numberButtonMouseUpAndMouseOutHandler, onMouseUp: this.numberButtonMouseUpAndMouseOutHandler, tabIndex: -1, type: "button" }, hAsync("calcite-icon", { icon: "chevron-up", scale: "s" })));
- const numberButtonsHorizontalDown = (hAsync("button", { class: {
- [CSS$s.numberButtonItem]: true,
- [CSS$s.buttonItemHorizontal]: isHorizontalNumberButton
- }, "data-adjustment": "down", disabled: this.disabled || this.readOnly, onMouseDown: this.numberButtonMouseDownHandler, onMouseOut: this.numberButtonMouseUpAndMouseOutHandler, onMouseUp: this.numberButtonMouseUpAndMouseOutHandler, tabIndex: -1, type: "button" }, hAsync("calcite-icon", { icon: "chevron-down", scale: "s" })));
- const numberButtonsVertical = (hAsync("div", { class: CSS$s.numberButtonWrapper }, numberButtonsHorizontalUp, numberButtonsHorizontalDown));
- const prefixText = hAsync("div", { class: CSS$s.prefix }, this.prefixText);
- const suffixText = hAsync("div", { class: CSS$s.suffix }, this.suffixText);
- const localeNumberInput = this.type === "number" ? (hAsync("input", { "aria-label": getLabelText(this), autofocus: this.autofocus ? true : null, defaultValue: this.defaultValue, disabled: this.disabled ? true : null, enterKeyHint: this.el.enterKeyHint, inputMode: this.el.inputMode, key: "localized-input", maxLength: this.maxLength, minLength: this.minLength, name: undefined, onBlur: this.inputBlurHandler, onFocus: this.inputFocusHandler, onInput: this.inputNumberInputHandler, onKeyDown: this.inputNumberKeyDownHandler, onKeyUp: this.inputKeyUpHandler, placeholder: this.placeholder || "", readOnly: this.readOnly, ref: this.setChildNumberElRef, type: "text", value: this.localizedValue })) : null;
- const childEl = this.type !== "number"
- ? [
- hAsync(this.childElType, { "aria-label": getLabelText(this), autofocus: this.autofocus ? true : null, class: {
- [CSS$s.editingEnabled]: this.editingEnabled,
- [CSS$s.inlineChild]: !!this.inlineEditableEl
- }, defaultValue: this.defaultValue, disabled: this.disabled ? true : null, enterKeyHint: this.el.enterKeyHint, inputMode: this.el.inputMode, max: this.maxString, maxLength: this.maxLength, min: this.minString, minLength: this.minLength, name: this.name, onBlur: this.inputBlurHandler, onFocus: this.inputFocusHandler, onInput: this.inputInputHandler, onKeyDown: this.inputKeyDownHandler, onKeyUp: this.inputKeyUpHandler, placeholder: this.placeholder || "", readOnly: this.readOnly, ref: this.setChildElRef, required: this.required ? true : null, step: this.step, tabIndex: this.disabled || (this.inlineEditableEl && !this.editingEnabled) ? -1 : null, type: this.type, value: this.value }),
- this.isTextarea ? (hAsync("div", { class: CSS$s.resizeIconWrapper }, hAsync("calcite-icon", { icon: "chevron-down", scale: "s" }))) : null
- ]
- : null;
- return (hAsync(Host, { onClick: this.inputFocusHandler, onKeyDown: this.keyDownHandler }, hAsync("div", { class: { [CSS$s.inputWrapper]: true, [CSS_UTILITY.rtl]: dir === "rtl" } }, this.type === "number" && this.numberButtonType === "horizontal" && !this.readOnly
- ? numberButtonsHorizontalDown
- : null, this.prefixText ? prefixText : null, hAsync("div", { class: CSS$s.wrapper }, localeNumberInput, childEl, this.isClearable ? inputClearButton : null, this.requestedIcon ? iconEl : null, this.loading ? loader : null), hAsync("div", { class: CSS$s.actionWrapper }, hAsync("slot", { name: SLOTS$g.action })), this.type === "number" && this.numberButtonType === "vertical" && !this.readOnly
- ? numberButtonsVertical
- : null, this.suffixText ? suffixText : null, this.type === "number" && this.numberButtonType === "horizontal" && !this.readOnly
- ? numberButtonsHorizontalUp
- : null, hAsync(HiddenFormInputSlot, { component: this }))));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "disabled": ["disabledWatcher"],
- "max": ["maxWatcher"],
- "min": ["minWatcher"],
- "value": ["valueWatcher"],
- "icon": ["updateRequestedIcon"],
- "type": ["updateRequestedIcon"]
- }; }
- static get style() { return inputCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-input",
- "$members$": {
- "alignment": [513],
- "autofocus": [4],
- "clearable": [516],
- "disabled": [516],
- "groupSeparator": [4, "group-separator"],
- "hidden": [4],
- "icon": [520],
- "intlClear": [1, "intl-clear"],
- "intlLoading": [1, "intl-loading"],
- "iconFlipRtl": [516, "icon-flip-rtl"],
- "label": [1],
- "loading": [516],
- "locale": [1],
- "localeFormat": [4, "locale-format"],
- "max": [514],
- "min": [514],
- "maxlength": [514],
- "maxLength": [514, "max-length"],
- "minLength": [514, "min-length"],
- "name": [513],
- "numberButtonType": [513, "number-button-type"],
- "placeholder": [1],
- "prefixText": [1, "prefix-text"],
- "readOnly": [4, "read-only"],
- "required": [4],
- "scale": [1537],
- "status": [1537],
- "step": [520],
- "suffixText": [1, "suffix-text"],
- "editingEnabled": [1540, "editing-enabled"],
- "type": [513],
- "value": [1025],
- "localizedValue": [32],
- "setFocus": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["alignment", "alignment"], ["clearable", "clearable"], ["disabled", "disabled"], ["icon", "icon"], ["iconFlipRtl", "icon-flip-rtl"], ["loading", "loading"], ["max", "max"], ["min", "min"], ["maxlength", "maxlength"], ["maxLength", "max-length"], ["minLength", "min-length"], ["name", "name"], ["numberButtonType", "number-button-type"], ["scale", "scale"], ["status", "status"], ["step", "step"], ["editingEnabled", "editing-enabled"], ["type", "type"]]
- }; }
- }
- const inputDatePickerCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-input-date-picker:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-input-date-picker{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-input-date-picker{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-input-date-picker{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-input-date-picker{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-input-date-picker{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:host*/.sc-calcite-input-date-picker-h{--calcite-icon-size:1rem;--calcite-spacing-eighth:0.125rem;--calcite-spacing-quarter:0.25rem;--calcite-spacing-half:0.5rem;--calcite-spacing-three-quarters:0.75rem;--calcite-spacing:1rem;--calcite-spacing-plus-quarter:1.25rem;--calcite-spacing-plus-half:1.5rem;--calcite-spacing-double:2rem;--calcite-menu-min-width:10rem;--calcite-header-min-height:3rem;--calcite-footer-min-height:3rem}/*!@:root*/.sc-calcite-input-date-picker:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-input-date-picker-h{display:none}/*!@:host*/.sc-calcite-input-date-picker-h{position:relative;display:inline-block;width:100%;overflow:visible;vertical-align:top;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@:host([disabled])*/[disabled].sc-calcite-input-date-picker-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-input-date-picker-h[disabled] .sc-calcite-input-date-picker-s>[calcite-hydrated][disabled],[disabled].sc-calcite-input-date-picker-h [calcite-hydrated][disabled].sc-calcite-input-date-picker{opacity:1}/*!@.calendar-picker-wrapper*/.calendar-picker-wrapper.sc-calcite-input-date-picker{position:static;width:100%;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}/*!@.input-wrapper*/.input-wrapper.sc-calcite-input-date-picker{position:relative}/*!@:host([range]) .input-container*/[range].sc-calcite-input-date-picker-h .input-container.sc-calcite-input-date-picker{display:-ms-flexbox;display:flex}/*!@:host([range]) .input-wrapper*/[range].sc-calcite-input-date-picker-h .input-wrapper.sc-calcite-input-date-picker{-ms-flex:1 1 auto;flex:1 1 auto}/*!@:host([range]) .horizontal-arrow-container*/[range].sc-calcite-input-date-picker-h .horizontal-arrow-container.sc-calcite-input-date-picker{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;border-width:1px;border-left-width:0px;border-right-width:0px;border-style:solid;border-color:var(--calcite-ui-border-input);background-color:var(--calcite-ui-background);padding-top:0px;padding-bottom:0px;padding-left:0.25rem;padding-right:0.25rem}/*!@:host([range][layout=vertical]) .input-wrapper*/[range][layout=vertical].sc-calcite-input-date-picker-h .input-wrapper.sc-calcite-input-date-picker{width:100%}/*!@:host([range][layout=vertical]) .input-container*/[range][layout=vertical].sc-calcite-input-date-picker-h .input-container.sc-calcite-input-date-picker{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:flex-start}/*!@:host([range][layout=vertical]) .calendar-picker-wrapper--end*/[range][layout=vertical].sc-calcite-input-date-picker-h .calendar-picker-wrapper--end.sc-calcite-input-date-picker{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}/*!@:host([range][layout=vertical]) .vertical-arrow-container*/[range][layout=vertical].sc-calcite-input-date-picker-h .vertical-arrow-container.sc-calcite-input-date-picker{top:1.5rem;position:absolute;left:0px;z-index:10;margin-left:1px;margin-right:1px;background-color:var(--calcite-ui-foreground-1);padding-left:0.625rem;padding-right:0.625rem}/*!@:host([scale=s][range]:not([layout=vertical])) .calendar-picker-wrapper*/[scale=s][range].sc-calcite-input-date-picker-h:not([layout=vertical]) .calendar-picker-wrapper.sc-calcite-input-date-picker{width:216px}/*!@:host([scale=m][range]:not([layout=vertical])) .calendar-picker-wrapper*/[scale=m][range].sc-calcite-input-date-picker-h:not([layout=vertical]) .calendar-picker-wrapper.sc-calcite-input-date-picker{width:286px}/*!@:host([scale=l][range]:not([layout=vertical])) .calendar-picker-wrapper*/[scale=l][range].sc-calcite-input-date-picker-h:not([layout=vertical]) .calendar-picker-wrapper.sc-calcite-input-date-picker{width:398px}/*!@.menu-container*/.menu-container.sc-calcite-input-date-picker{display:block;position:absolute;z-index:900;-webkit-transform:scale(0);transform:scale(0);visibility:hidden;pointer-events:none}/*!@.menu-container .calcite-popper-anim*/.menu-container.sc-calcite-input-date-picker .calcite-popper-anim.sc-calcite-input-date-picker{position:relative;z-index:1;-webkit-transition:var(--calcite-popper-transition);transition:var(--calcite-popper-transition);visibility:hidden;-webkit-transition-property:visibility, opacity, -webkit-transform;transition-property:visibility, opacity, -webkit-transform;transition-property:transform, visibility, opacity;transition-property:transform, visibility, opacity, -webkit-transform;opacity:0;-webkit-box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);border-radius:0.25rem}/*!@.menu-container[data-popper-placement^=bottom] .calcite-popper-anim*/.menu-container[data-popper-placement^=bottom].sc-calcite-input-date-picker .calcite-popper-anim.sc-calcite-input-date-picker{-webkit-transform:translateY(-5px);transform:translateY(-5px)}/*!@.menu-container[data-popper-placement^=top] .calcite-popper-anim*/.menu-container[data-popper-placement^=top].sc-calcite-input-date-picker .calcite-popper-anim.sc-calcite-input-date-picker{-webkit-transform:translateY(5px);transform:translateY(5px)}/*!@.menu-container[data-popper-placement^=left] .calcite-popper-anim*/.menu-container[data-popper-placement^=left].sc-calcite-input-date-picker .calcite-popper-anim.sc-calcite-input-date-picker{-webkit-transform:translateX(5px);transform:translateX(5px)}/*!@.menu-container[data-popper-placement^=right] .calcite-popper-anim*/.menu-container[data-popper-placement^=right].sc-calcite-input-date-picker .calcite-popper-anim.sc-calcite-input-date-picker{-webkit-transform:translateX(-5px);transform:translateX(-5px)}/*!@.menu-container[data-popper-placement] .calcite-popper-anim--active*/.menu-container[data-popper-placement].sc-calcite-input-date-picker .calcite-popper-anim--active.sc-calcite-input-date-picker{opacity:1;visibility:visible;-webkit-transform:translate(0);transform:translate(0)}/*!@:host([active]) .menu-container*/[active].sc-calcite-input-date-picker-h .menu-container.sc-calcite-input-date-picker{pointer-events:initial;visibility:visible}/*!@.menu-container--active .menu-container .calcite-popper-anim*/.menu-container--active.sc-calcite-input-date-picker .menu-container.sc-calcite-input-date-picker .calcite-popper-anim.sc-calcite-input-date-picker{position:relative;z-index:1;-webkit-transition:var(--calcite-popper-transition);transition:var(--calcite-popper-transition);visibility:hidden;-webkit-transition-property:visibility, opacity, -webkit-transform;transition-property:visibility, opacity, -webkit-transform;transition-property:transform, visibility, opacity;transition-property:transform, visibility, opacity, -webkit-transform;opacity:0;-webkit-box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);border-radius:0.25rem}/*!@.menu-container--active .menu-container[data-popper-placement^=bottom] .calcite-popper-anim*/.menu-container--active.sc-calcite-input-date-picker .menu-container[data-popper-placement^=bottom].sc-calcite-input-date-picker .calcite-popper-anim.sc-calcite-input-date-picker{-webkit-transform:translateY(-5px);transform:translateY(-5px)}/*!@.menu-container--active .menu-container[data-popper-placement^=top] .calcite-popper-anim*/.menu-container--active.sc-calcite-input-date-picker .menu-container[data-popper-placement^=top].sc-calcite-input-date-picker .calcite-popper-anim.sc-calcite-input-date-picker{-webkit-transform:translateY(5px);transform:translateY(5px)}/*!@.menu-container--active .menu-container[data-popper-placement^=left] .calcite-popper-anim*/.menu-container--active.sc-calcite-input-date-picker .menu-container[data-popper-placement^=left].sc-calcite-input-date-picker .calcite-popper-anim.sc-calcite-input-date-picker{-webkit-transform:translateX(5px);transform:translateX(5px)}/*!@.menu-container--active .menu-container[data-popper-placement^=right] .calcite-popper-anim*/.menu-container--active.sc-calcite-input-date-picker .menu-container[data-popper-placement^=right].sc-calcite-input-date-picker .calcite-popper-anim.sc-calcite-input-date-picker{-webkit-transform:translateX(-5px);transform:translateX(-5px)}/*!@.menu-container--active .menu-container[data-popper-placement] .calcite-popper-anim--active*/.menu-container--active.sc-calcite-input-date-picker .menu-container[data-popper-placement].sc-calcite-input-date-picker .calcite-popper-anim--active.sc-calcite-input-date-picker{opacity:1;visibility:visible;-webkit-transform:translate(0);transform:translate(0)}/*!@.input .calcite-input__wrapper*/.input.sc-calcite-input-date-picker .calcite-input__wrapper.sc-calcite-input-date-picker{margin-top:0px}/*!@:host([range][layout=vertical][scale=m]) .vertical-arrow-container*/[range][layout=vertical][scale=m].sc-calcite-input-date-picker-h .vertical-arrow-container.sc-calcite-input-date-picker{top:1.5rem;padding-left:0.75rem}/*!@:host([range][layout=vertical][scale=m]) .vertical-arrow-container calcite-icon*/[range][layout=vertical][scale=m].sc-calcite-input-date-picker-h .vertical-arrow-container.sc-calcite-input-date-picker calcite-icon.sc-calcite-input-date-picker{height:0.75rem;width:0.75rem;min-width:0px}/*!@:host([range][layout=vertical][scale=l]) .vertical-arrow-container*/[range][layout=vertical][scale=l].sc-calcite-input-date-picker-h .vertical-arrow-container.sc-calcite-input-date-picker{top:2.25rem;padding-left:0.875rem;padding-right:0.875rem}/*!@:host([range][layout=vertical][active]) .vertical-arrow-container*/[range][layout=vertical][active].sc-calcite-input-date-picker-h .vertical-arrow-container.sc-calcite-input-date-picker{display:none}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-input-date-picker-s>input[slot=hidden-form-input]{bottom:0 !important;left:0 !important;margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;right:0 !important;top:0 !important;-webkit-transform:none !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}";
- class InputDatePicker {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteDatePickerChange = createEvent(this, "calciteDatePickerChange", 7);
- this.calciteDatePickerRangeChange = createEvent(this, "calciteDatePickerRangeChange", 7);
- this.calciteInputDatePickerChange = createEvent(this, "calciteInputDatePickerChange", 7);
- this.calciteInputDatePickerOpen = createEvent(this, "calciteInputDatePickerOpen", 7);
- this.calciteInputDatePickerClose = createEvent(this, "calciteInputDatePickerClose", 7);
- //--------------------------------------------------------------------------
- //
- // Public Properties
- //
- //--------------------------------------------------------------------------
- /**
- * When false, the component won't be interactive.
- */
- this.disabled = false;
- /** Expand or collapse when calendar does not have input */
- this.active = false;
- /** Localized string for "previous month" (used for aria label)
- * @default "Previous month"
- */
- this.intlPrevMonth = TEXT$f.prevMonth;
- /** Localized string for "next month" (used for aria label)
- * @default "Next month"
- */
- this.intlNextMonth = TEXT$f.nextMonth;
- /** Localized string for "year" (used for aria label)
- * @default "Year"
- */
- this.intlYear = TEXT$f.year;
- /** BCP 47 language tag for desired language and country format */
- this.locale = document.documentElement.lang || "en";
- /** specify the scale of the date picker */
- this.scale = "m";
- /**
- * Determines where the date-picker component will be positioned relative to the input.
- * @default "bottom-leading"
- */
- this.placement = defaultMenuPlacement;
- /** Range mode activation */
- this.range = false;
- /**
- * When true, makes the component required for form-submission.
- *
- * @internal
- */
- this.required = false;
- /** Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value. */
- this.overlayPositioning = "absolute";
- /** Disables the default behaviour on the third click of narrowing or extending the range and instead starts a new range. */
- this.proximitySelectionDisabled = false;
- /** Layout */
- this.layout = "horizontal";
- this.focusedInput = "start";
- this.activeTransitionProp = "opacity";
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- this.setFilteredPlacements = () => {
- const { el, flipPlacements } = this;
- this.filteredFlipPlacements = flipPlacements
- ? filterComputedPlacements(flipPlacements, el)
- : null;
- };
- this.transitionEnd = (event) => {
- if (event.propertyName === this.activeTransitionProp) {
- this.active
- ? this.calciteInputDatePickerOpen.emit()
- : this.calciteInputDatePickerClose.emit();
- }
- };
- this.setStartInput = (el) => {
- this.startInput = el;
- };
- this.setEndInput = (el) => {
- this.endInput = el;
- };
- this.deactivate = () => {
- this.active = false;
- };
- this.keyDownHandler = (event) => {
- if (event.key === "Enter" && !event.defaultPrevented) {
- submitForm(this);
- }
- };
- this.keyUpHandler = (e) => {
- if (e.key === "Escape") {
- this.active = false;
- }
- };
- this.inputBlur = (e) => {
- this.blur(e.detail);
- };
- this.startInputFocus = () => {
- this.active = true;
- this.focusedInput = "start";
- };
- this.endInputFocus = () => {
- this.active = true;
- this.focusedInput = "end";
- };
- this.inputInput = (e) => {
- this.input(e.detail.value);
- };
- this.setMenuEl = (el) => {
- if (el) {
- this.menuEl = el;
- this.createPopper();
- }
- };
- this.setStartWrapper = (el) => {
- this.startWrapper = el;
- this.setReferenceEl();
- };
- this.setEndWrapper = (el) => {
- this.endWrapper = el;
- this.setReferenceEl();
- };
- /**
- * Event handler for when the selected date changes
- */
- this.handleDateChange = (event) => {
- if (this.range) {
- return;
- }
- this.value = dateToISO(event.detail);
- };
- this.handleDateRangeChange = (event) => {
- var _a, _b;
- if (!this.range || !event.detail) {
- return;
- }
- const { startDate, endDate } = event.detail;
- this.start = dateToISO(startDate);
- this.end = dateToISO(endDate);
- this.value = [this.start, this.end];
- if (this.shouldFocusRangeEnd()) {
- (_a = this.endInput) === null || _a === void 0 ? void 0 : _a.setFocus();
- }
- else if (this.shouldFocusRangeStart()) {
- (_b = this.startInput) === null || _b === void 0 ? void 0 : _b.setFocus();
- }
- };
- }
- handleDisabledChange(value) {
- if (!value) {
- this.active = false;
- }
- }
- valueHandler(value) {
- if (Array.isArray(value)) {
- this.valueAsDate = value.map((v) => dateFromISO(v));
- this.start = value[0];
- this.end = value[1];
- }
- else if (value) {
- this.valueAsDate = dateFromISO(value);
- this.start = "";
- this.end = "";
- }
- else {
- this.valueAsDate = undefined;
- this.start = undefined;
- this.end = undefined;
- }
- }
- flipPlacementsHandler() {
- this.setFilteredPlacements();
- }
- onMinChanged(min) {
- if (min) {
- this.minAsDate = dateFromISO(min);
- }
- }
- onMaxChanged(max) {
- if (max) {
- this.maxAsDate = dateFromISO(max);
- }
- }
- activeHandler() {
- if (!this.disabled) {
- this.reposition();
- return;
- }
- this.active = false;
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- handleDateOrRangeChange() {
- this.calciteInputDatePickerChange.emit();
- }
- calciteDaySelectHandler() {
- if (this.shouldFocusRangeStart() || this.shouldFocusRangeEnd()) {
- return;
- }
- this.active = false;
- }
- // --------------------------------------------------------------------------
- //
- // Public Methods
- //
- // --------------------------------------------------------------------------
- /** Updates the position of the component. */
- async setFocus() {
- var _a;
- (_a = this.startInput) === null || _a === void 0 ? void 0 : _a.setFocus();
- }
- /** Updates the position of the component. */
- async reposition() {
- const { placement, popper, menuEl } = this;
- const modifiers = this.getModifiers();
- popper
- ? await updatePopper({
- el: menuEl,
- modifiers,
- placement,
- popper
- })
- : this.createPopper();
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- if (Array.isArray(this.value)) {
- this.valueAsDate = this.value.map((v) => dateFromISO(v));
- this.start = this.value[0];
- this.end = this.value[1];
- }
- else if (this.value) {
- this.valueAsDate = dateFromISO(this.value);
- this.start = "";
- this.end = "";
- }
- if (this.start) {
- this.startAsDate = dateFromISO(this.start);
- }
- if (this.end) {
- this.endAsDate = dateFromISO(this.end);
- }
- if (this.min) {
- this.minAsDate = dateFromISO(this.min);
- }
- if (this.max) {
- this.maxAsDate = dateFromISO(this.max);
- }
- this.createPopper();
- connectLabel(this);
- connectForm(this);
- this.setFilteredPlacements();
- }
- async componentWillLoad() {
- await this.loadLocaleData();
- this.onMinChanged(this.min);
- this.onMaxChanged(this.max);
- }
- disconnectedCallback() {
- this.destroyPopper();
- disconnectLabel(this);
- disconnectForm(this);
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- render() {
- var _a, _b;
- const { disabled } = this;
- const date = dateFromRange(this.range ? this.startAsDate : this.valueAsDate, this.minAsDate, this.maxAsDate);
- const endDate = this.range
- ? dateFromRange(this.endAsDate, this.minAsDate, this.maxAsDate)
- : null;
- const formattedEndDate = endDate ? endDate.toLocaleDateString(this.locale) : "";
- const formattedDate = date ? date.toLocaleDateString(this.locale) : "";
- return (hAsync(Host, { onBlur: this.deactivate, onKeyDown: this.keyDownHandler, onKeyUp: this.keyUpHandler, role: "application" }, this.localeData && (hAsync("div", { "aria-expanded": toAriaBoolean(this.active), class: "input-container", role: "application" }, hAsync("div", { class: "input-wrapper", ref: this.setStartWrapper }, hAsync("calcite-input", { class: `input ${this.layout === "vertical" && this.range ? `no-bottom-border` : ``}`, disabled: disabled, icon: "calendar", label: getLabelText(this), "number-button-type": "none", onCalciteInputBlur: this.inputBlur, onCalciteInputFocus: this.startInputFocus, onCalciteInputInput: this.inputInput, placeholder: (_a = this.localeData) === null || _a === void 0 ? void 0 : _a.placeholder, ref: this.setStartInput, scale: this.scale, type: "text", value: formattedDate })), hAsync("div", { "aria-hidden": toAriaBoolean(!this.active), class: {
- "menu-container": true,
- "menu-container--active": this.active
- }, ref: this.setMenuEl }, hAsync("div", { class: {
- ["calendar-picker-wrapper"]: true,
- ["calendar-picker-wrapper--end"]: this.focusedInput === "end",
- [CSS$D.animation]: true,
- [CSS$D.animationActive]: this.active
- }, onTransitionEnd: this.transitionEnd }, hAsync("calcite-date-picker", { activeRange: this.focusedInput, endAsDate: this.endAsDate, headingLevel: this.headingLevel, intlNextMonth: this.intlNextMonth, intlPrevMonth: this.intlPrevMonth, intlYear: this.intlYear, locale: this.locale, max: this.max, maxAsDate: this.maxAsDate, min: this.min, minAsDate: this.minAsDate, onCalciteDatePickerChange: this.handleDateChange, onCalciteDatePickerRangeChange: this.handleDateRangeChange, proximitySelectionDisabled: this.proximitySelectionDisabled, range: this.range, scale: this.scale, startAsDate: this.startAsDate, tabIndex: 0, valueAsDate: this.valueAsDate }))), this.range && this.layout === "horizontal" && (hAsync("div", { class: "horizontal-arrow-container" }, hAsync("calcite-icon", { flipRtl: true, icon: "arrow-right", scale: "s" }))), this.range && this.layout === "vertical" && this.scale !== "s" && (hAsync("div", { class: "vertical-arrow-container" }, hAsync("calcite-icon", { icon: "arrow-down", scale: "s" }))), this.range && (hAsync("div", { class: "input-wrapper", ref: this.setEndWrapper }, hAsync("calcite-input", { class: {
- input: true,
- "border-top-color-one": this.layout === "vertical" && this.range
- }, disabled: disabled, icon: "calendar", "number-button-type": "none", onCalciteInputBlur: this.inputBlur, onCalciteInputFocus: this.endInputFocus, onCalciteInputInput: this.inputInput, placeholder: (_b = this.localeData) === null || _b === void 0 ? void 0 : _b.placeholder, ref: this.setEndInput, scale: this.scale, type: "text", value: formattedEndDate }))))), hAsync(HiddenFormInputSlot, { component: this })));
- }
- setReferenceEl() {
- const { focusedInput, layout, endWrapper, startWrapper } = this;
- this.referenceEl =
- focusedInput === "end" || layout === "vertical"
- ? endWrapper || startWrapper
- : startWrapper || endWrapper;
- this.createPopper();
- }
- onLabelClick() {
- this.setFocus();
- }
- getModifiers() {
- const flipModifier = {
- name: "flip",
- enabled: true
- };
- flipModifier.options = {
- fallbackPlacements: this.filteredFlipPlacements || popperMenuComputedPlacements
- };
- const eventListenerModifier = {
- name: "eventListeners",
- enabled: this.active
- };
- return [flipModifier, eventListenerModifier];
- }
- createPopper() {
- this.destroyPopper();
- const { menuEl, placement, referenceEl, overlayPositioning } = this;
- if (!menuEl || !referenceEl) {
- return;
- }
- const modifiers = this.getModifiers();
- this.popper = createPopper({
- el: menuEl,
- modifiers,
- overlayPositioning,
- placement,
- referenceEl
- });
- }
- destroyPopper() {
- const { popper } = this;
- if (popper) {
- popper.destroy();
- }
- this.popper = null;
- }
- startWatcher(start) {
- this.startAsDate = dateFromISO(start);
- }
- endWatcher(end) {
- this.endAsDate = dateFromISO(end);
- }
- async loadLocaleData() {
- {
- return;
- }
- }
- clearCurrentValue() {
- if (!this.range) {
- if (typeof this.value === "string" && this.value) {
- this.calciteDatePickerChange.emit();
- }
- this.value = "";
- return;
- }
- const { focusedInput } = this;
- if (focusedInput === "start") {
- if (this.start) {
- this.calciteDatePickerRangeChange.emit();
- }
- this.value = Array.isArray(this.value) ? ["", this.value[1] || ""] : [""];
- this.start = undefined;
- }
- else if (focusedInput === "end") {
- if (this.end) {
- this.calciteDatePickerRangeChange.emit();
- }
- this.value = Array.isArray(this.value) ? [this.value[0] || "", ""] : ["", ""];
- this.end = undefined;
- }
- }
- /**
- * If inputted string is a valid date, update value/active
- */
- input(value) {
- const date = this.getDateFromInput(value);
- if (!date) {
- this.clearCurrentValue();
- return;
- }
- if (!this.range) {
- this.value = dateToISO(date);
- this.calciteDatePickerChange.emit(date);
- return;
- }
- const { focusedInput } = this;
- if (focusedInput === "start") {
- if (!this.startAsDate || !sameDate(date, this.startAsDate)) {
- const startDateISO = dateToISO(date);
- this.value = Array.isArray(this.value)
- ? [startDateISO, this.value[1] || ""]
- : [startDateISO];
- this.start = startDateISO;
- this.calciteDatePickerRangeChange.emit({
- startDate: date,
- endDate: this.endAsDate
- });
- }
- }
- else if (focusedInput === "end") {
- if (!this.endAsDate || !sameDate(date, this.endAsDate)) {
- const endDateISO = dateToISO(date);
- this.value = Array.isArray(this.value)
- ? [this.value[0] || "", endDateISO]
- : ["", endDateISO];
- this.end = endDateISO;
- this.calciteDatePickerRangeChange.emit({
- startDate: this.startAsDate,
- endDate: date
- });
- }
- }
- }
- /**
- * Clean up invalid date from input on blur
- */
- blur(target) {
- const { locale, focusedInput, endAsDate, range, startAsDate, valueAsDate } = this;
- const date = this.getDateFromInput(target.value);
- if (!date) {
- if (!range && valueAsDate) {
- target.value = Array.isArray(valueAsDate)
- ? valueAsDate[focusedInput === "end" ? 1 : 0].toLocaleDateString(locale)
- : valueAsDate.toLocaleDateString(locale);
- }
- else if (focusedInput === "start" && startAsDate) {
- target.value = startAsDate.toLocaleDateString(locale);
- }
- else if (focusedInput === "end" && endAsDate) {
- target.value = endAsDate.toLocaleDateString(locale);
- }
- }
- }
- shouldFocusRangeStart() {
- return !!(this.endAsDate &&
- !this.startAsDate &&
- this.focusedInput === "end" &&
- this.startInput);
- }
- shouldFocusRangeEnd() {
- return !!(this.startAsDate &&
- !this.endAsDate &&
- this.focusedInput === "start" &&
- this.endInput);
- }
- /**
- * Find a date from input string
- * return false if date is invalid, or out of range
- */
- getDateFromInput(value) {
- if (!this.localeData) {
- return false;
- }
- const { separator } = this.localeData;
- const { day, month, year } = parseDateString(value, this.localeData);
- const validDay = day > 0;
- const validMonth = month > -1;
- const date = new Date(year, month, day);
- date.setFullYear(year);
- const validDate = !isNaN(date.getTime());
- const validLength = value.split(separator).filter((c) => c).length > 2;
- const validYear = year.toString().length > 0;
- if (validDay &&
- validMonth &&
- validDate &&
- validLength &&
- validYear &&
- inRange(date, this.min, this.max)) {
- return date;
- }
- return false;
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "disabled": ["handleDisabledChange"],
- "value": ["valueHandler"],
- "flipPlacements": ["flipPlacementsHandler"],
- "min": ["onMinChanged"],
- "max": ["onMaxChanged"],
- "active": ["activeHandler"],
- "layout": ["setReferenceEl"],
- "focusedInput": ["setReferenceEl"],
- "start": ["startWatcher"],
- "end": ["endWatcher"],
- "locale": ["loadLocaleData"]
- }; }
- static get style() { return inputDatePickerCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-input-date-picker",
- "$members$": {
- "disabled": [516],
- "value": [1025],
- "flipPlacements": [16],
- "headingLevel": [2, "heading-level"],
- "valueAsDate": [1040],
- "startAsDate": [1040],
- "endAsDate": [1040],
- "minAsDate": [1040],
- "maxAsDate": [1040],
- "min": [1025],
- "max": [1025],
- "active": [1540],
- "name": [1],
- "intlPrevMonth": [1, "intl-prev-month"],
- "intlNextMonth": [1, "intl-next-month"],
- "intlYear": [1, "intl-year"],
- "locale": [1],
- "scale": [513],
- "placement": [513],
- "range": [516],
- "required": [516],
- "start": [1025],
- "end": [1025],
- "overlayPositioning": [1, "overlay-positioning"],
- "proximitySelectionDisabled": [4, "proximity-selection-disabled"],
- "layout": [513],
- "focusedInput": [32],
- "localeData": [32],
- "setFocus": [64],
- "reposition": [64]
- },
- "$listeners$": [[0, "calciteDatePickerChange", "handleDateOrRangeChange"], [0, "calciteDatePickerRangeChange", "handleDateOrRangeChange"], [0, "calciteDaySelect", "calciteDaySelectHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"], ["active", "active"], ["scale", "scale"], ["placement", "placement"], ["range", "range"], ["required", "required"], ["layout", "layout"]]
- }; }
- }
- var StatusIconDefaults;
- (function (StatusIconDefaults) {
- StatusIconDefaults["valid"] = "check-circle";
- StatusIconDefaults["invalid"] = "exclamation-mark-triangle";
- StatusIconDefaults["idle"] = "information";
- })(StatusIconDefaults || (StatusIconDefaults = {}));
- const inputMessageCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-input-message:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-input-message{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-input-message{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-input-message{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-input-message{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-input-message{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-input-message:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-input-message-h{display:none}/*!@:host([active][scale=m]),\n:host([active][scale=l])*/[active][scale=m].sc-calcite-input-message-h,[active][scale=l].sc-calcite-input-message-h{--calcite-input-message-spacing-value:0.25rem}/*!@:host*/.sc-calcite-input-message-h{visibility:hidden;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;height:0px;width:100%;-ms-flex-align:center;align-items:center;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1);opacity:0;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s}/*!@:host([active])*/[active].sc-calcite-input-message-h{visibility:visible;height:auto;opacity:1;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s}/*!@:host([active][scale=m]),\n:host([active][scale=l])*/[active][scale=m].sc-calcite-input-message-h,[active][scale=l].sc-calcite-input-message-h{margin-top:var(--calcite-input-message-spacing-value)}/*!@.calcite-input-message-icon*/.calcite-input-message-icon.sc-calcite-input-message{pointer-events:none;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-negative:0;flex-shrink:0;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;-webkit-margin-end:0.5rem;margin-inline-end:0.5rem}/*!@:host([status=invalid]) .calcite-input-message-icon*/[status=invalid].sc-calcite-input-message-h .calcite-input-message-icon.sc-calcite-input-message{color:var(--calcite-ui-danger)}/*!@:host([status=warning]) .calcite-input-message-icon*/[status=warning].sc-calcite-input-message-h .calcite-input-message-icon.sc-calcite-input-message{color:var(--calcite-ui-warning)}/*!@:host([status=valid]) .calcite-input-message-icon*/[status=valid].sc-calcite-input-message-h .calcite-input-message-icon.sc-calcite-input-message{color:var(--calcite-ui-success)}/*!@:host([status=idle]) .calcite-input-message-icon*/[status=idle].sc-calcite-input-message-h .calcite-input-message-icon.sc-calcite-input-message{color:var(--calcite-ui-brand)}/*!@:host([status][active])*/[status][active].sc-calcite-input-message-h{font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1)}/*!@:host([status][active][scale=s])*/[status][active][scale=s].sc-calcite-input-message-h{font-size:var(--calcite-font-size--3);line-height:0.75rem}/*!@:host([status][active][scale=m])*/[status][active][scale=m].sc-calcite-input-message-h{margin-top:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([status][active][scale=l])*/[status][active][scale=l].sc-calcite-input-message-h{margin-top:0.25rem;font-size:var(--calcite-font-size--1);line-height:1rem}";
- /**
- * @slot - A slot for adding text.
- */
- class InputMessage {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** Indicates whether the message is displayed. */
- this.active = false;
- /** specify the scale of the input, defaults to m */
- this.scale = "m";
- /** specify the status of the input field, determines message and icons */
- this.status = "idle";
- }
- handleIconEl() {
- this.requestedIcon = setRequestedIcon(StatusIconDefaults, this.icon, this.status);
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- this.status = getElementProp(this.el, "status", this.status);
- this.scale = getElementProp(this.el, "scale", this.scale);
- this.requestedIcon = setRequestedIcon(StatusIconDefaults, this.icon, this.status);
- }
- render() {
- const hidden = !this.active;
- return (hAsync(Host, { "calcite-hydrated-hidden": hidden }, this.renderIcon(this.requestedIcon), hAsync("slot", null)));
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- renderIcon(iconName) {
- if (iconName) {
- return hAsync("calcite-icon", { class: "calcite-input-message-icon", icon: iconName, scale: "s" });
- }
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "status": ["handleIconEl"],
- "icon": ["handleIconEl"]
- }; }
- static get style() { return inputMessageCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-input-message",
- "$members$": {
- "active": [516],
- "icon": [520],
- "scale": [1537],
- "status": [1537],
- "type": [513]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["active", "active"], ["icon", "icon"], ["scale", "scale"], ["status", "status"], ["type", "type"]]
- }; }
- }
- const maxTenthForMinuteAndSecond = 5;
- function createLocaleDateTimeFormatter(locale, includeSeconds = true) {
- try {
- const options = {
- hour: "2-digit",
- minute: "2-digit",
- timeZone: "UTC"
- };
- if (includeSeconds) {
- options.second = "2-digit";
- }
- return new Intl.DateTimeFormat(locale, options);
- }
- catch (e) {
- throw new Error(`Invalid locale supplied while attempting to create a DateTime formatter: ${locale}`);
- }
- }
- function formatTimePart(number) {
- const numberAsString = number.toString();
- return number >= 0 && number <= 9 ? numberAsString.padStart(2, "0") : numberAsString;
- }
- function formatTimeString(value) {
- if (!isValidTime(value)) {
- return null;
- }
- const [hourString, minuteString, secondString] = value.split(":");
- const hour = formatTimePart(parseInt(hourString));
- const minute = formatTimePart(parseInt(minuteString));
- if (secondString) {
- const second = formatTimePart(parseInt(secondString));
- return `${hour}:${minute}:${second}`;
- }
- return `${hour}:${minute}`;
- }
- function getLocaleHourCycle(locale) {
- const formatter = createLocaleDateTimeFormatter(locale);
- const parts = formatter.formatToParts(new Date(Date.UTC(0, 0, 0, 0, 0, 0)));
- return getLocalizedTimePart("meridiem", parts) ? "12" : "24";
- }
- function getLocalizedTimePart(part, parts) {
- var _a, _b, _c, _d;
- if (!part || !parts) {
- return null;
- }
- if (part === "hourSuffix") {
- const hourIndex = parts.indexOf(parts.find(({ type }) => type === "hour"));
- const minuteIndex = parts.indexOf(parts.find(({ type }) => type === "minute"));
- const hourSuffix = parts[hourIndex + 1];
- return hourSuffix && hourSuffix.type === "literal" && minuteIndex - hourIndex === 2
- ? ((_a = hourSuffix.value) === null || _a === void 0 ? void 0 : _a.trim()) || null
- : null;
- }
- if (part === "minuteSuffix") {
- const minuteIndex = parts.indexOf(parts.find(({ type }) => type === "minute"));
- const secondIndex = parts.indexOf(parts.find(({ type }) => type === "second"));
- const minuteSuffix = parts[minuteIndex + 1];
- return minuteSuffix && minuteSuffix.type === "literal" && secondIndex - minuteIndex === 2
- ? ((_b = minuteSuffix.value) === null || _b === void 0 ? void 0 : _b.trim()) || null
- : null;
- }
- if (part === "secondSuffix") {
- const secondIndex = parts.indexOf(parts.find(({ type }) => type === "second"));
- const secondSuffix = parts[secondIndex + 1];
- return secondSuffix && secondSuffix.type === "literal" ? ((_c = secondSuffix.value) === null || _c === void 0 ? void 0 : _c.trim()) || null : null;
- }
- return ((_d = parts.find(({ type }) => (part == "meridiem" ? type === "dayPeriod" : type === part))) === null || _d === void 0 ? void 0 : _d.value) || null;
- }
- function getMeridiem(hour) {
- if (!isValidNumber(hour)) {
- return null;
- }
- const hourAsNumber = parseInt(hour);
- return hourAsNumber >= 0 && hourAsNumber <= 11 ? "AM" : "PM";
- }
- function isValidTime(value) {
- if (!value || value.startsWith(":") || value.endsWith(":")) {
- return false;
- }
- const splitValue = value.split(":");
- const validLength = splitValue.length > 1 && splitValue.length < 4;
- if (!validLength) {
- return false;
- }
- const [hour, minute, second] = splitValue;
- const hourAsNumber = parseInt(splitValue[0]);
- const minuteAsNumber = parseInt(splitValue[1]);
- const secondAsNumber = parseInt(splitValue[2]);
- const hourValid = isValidNumber(hour) && hourAsNumber >= 0 && hourAsNumber < 24;
- const minuteValid = isValidNumber(minute) && minuteAsNumber >= 0 && minuteAsNumber < 60;
- const secondValid = isValidNumber(second) && secondAsNumber >= 0 && secondAsNumber < 60;
- if ((hourValid && minuteValid && !second) || (hourValid && minuteValid && secondValid)) {
- return true;
- }
- }
- function isValidTimePart(value, part) {
- if (part === "meridiem") {
- return value === "AM" || value === "PM";
- }
- if (!isValidNumber(value)) {
- return false;
- }
- const valueAsNumber = Number(value);
- return part === "hour" ? valueAsNumber >= 0 && valueAsNumber < 24 : valueAsNumber >= 0 && valueAsNumber < 60;
- }
- function localizeTimePart(value, part, locale) {
- if (!isValidTimePart(value, part)) {
- return;
- }
- const valueAsNumber = parseInt(value);
- const date = new Date(Date.UTC(0, 0, 0, part === "hour" ? valueAsNumber : part === "meridiem" ? (value === "AM" ? 0 : 12) : 0, part === "minute" ? valueAsNumber : 0, part === "second" ? valueAsNumber : 0));
- if (!date) {
- return;
- }
- const formatter = createLocaleDateTimeFormatter(locale);
- const parts = formatter.formatToParts(date);
- return getLocalizedTimePart(part, parts);
- }
- function localizeTimeString(value, locale = "en", includeSeconds = true) {
- if (!isValidTime(value)) {
- return null;
- }
- const { hour, minute, second = "0" } = parseTimeString(value);
- const dateFromTimeString = new Date(Date.UTC(0, 0, 0, parseInt(hour), parseInt(minute), parseInt(second)));
- const formatter = createLocaleDateTimeFormatter(locale, includeSeconds);
- return (formatter === null || formatter === void 0 ? void 0 : formatter.format(dateFromTimeString)) || null;
- }
- function localizeTimeStringToParts(value, locale = "en") {
- if (!isValidTime(value)) {
- return null;
- }
- const { hour, minute, second = "0" } = parseTimeString(value);
- const dateFromTimeString = new Date(Date.UTC(0, 0, 0, parseInt(hour), parseInt(minute), parseInt(second)));
- if (dateFromTimeString) {
- const formatter = createLocaleDateTimeFormatter(locale);
- const parts = formatter.formatToParts(dateFromTimeString);
- return {
- localizedHour: getLocalizedTimePart("hour", parts),
- localizedHourSuffix: getLocalizedTimePart("hourSuffix", parts),
- localizedMinute: getLocalizedTimePart("minute", parts),
- localizedMinuteSuffix: getLocalizedTimePart("minuteSuffix", parts),
- localizedSecond: getLocalizedTimePart("second", parts),
- localizedSecondSuffix: getLocalizedTimePart("secondSuffix", parts),
- localizedMeridiem: getLocalizedTimePart("meridiem", parts)
- };
- }
- return null;
- }
- function getTimeParts(value, locale = "en") {
- if (!isValidTime(value)) {
- return null;
- }
- const { hour, minute, second = "0" } = parseTimeString(value);
- const dateFromTimeString = new Date(Date.UTC(0, 0, 0, parseInt(hour), parseInt(minute), parseInt(second)));
- if (dateFromTimeString) {
- const formatter = createLocaleDateTimeFormatter(locale);
- const parts = formatter.formatToParts(dateFromTimeString);
- return parts;
- }
- return null;
- }
- function parseTimeString(value) {
- if (isValidTime(value)) {
- const [hour, minute, second] = value.split(":");
- return {
- hour,
- minute,
- second
- };
- }
- return {
- hour: null,
- minute: null,
- second: null
- };
- }
- const inputTimePickerCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-input-time-picker:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-input-time-picker{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-input-time-picker{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-input-time-picker{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-input-time-picker{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-input-time-picker{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-input-time-picker:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-input-time-picker-h{display:none}/*!@:host*/.sc-calcite-input-time-picker-h{display:inline-block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}/*!@:host([disabled])*/[disabled].sc-calcite-input-time-picker-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-input-time-picker-h[disabled] .sc-calcite-input-time-picker-s>[calcite-hydrated][disabled],[disabled].sc-calcite-input-time-picker-h [calcite-hydrated][disabled].sc-calcite-input-time-picker{opacity:1}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-input-time-picker-s>input[slot=hidden-form-input]{bottom:0 !important;left:0 !important;margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;right:0 !important;top:0 !important;-webkit-transform:none !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}";
- class InputTimePicker {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteInputTimePickerChange = createEvent(this, "calciteInputTimePickerChange", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** The active state of the time input */
- this.active = false;
- /** The disabled state of the time input */
- this.disabled = false;
- /**
- * BCP 47 language tag for desired language and country format
- * @internal
- */
- this.locale = document.documentElement.lang || navigator.language || "en";
- /**
- * When true, makes the component required for form-submission.
- *
- * @internal
- */
- this.required = false;
- /** The scale (size) of the time input */
- this.scale = "m";
- /**
- * Determines where the popover will be positioned relative to the input.
- * @see [PopperPlacement](https://github.com/Esri/calcite-components/blob/master/src/utils/popper.ts#L25)
- */
- this.placement = "auto";
- /** number (seconds) that specifies the granularity that the value must adhere to */
- this.step = 60;
- /** The selected time in UTC (always 24-hour format) */
- this.value = null;
- /** whether the value of the input was changed as a result of user typing or not */
- this.internalValueChange = false;
- this.previousValidValue = null;
- this.referenceElementId = `input-time-picker-${guid()}`;
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- this.calciteInputBlurHandler = () => {
- this.active = false;
- const shouldIncludeSeconds = this.shouldIncludeSeconds();
- const localizedInputValue = localizeTimeString(this.calciteInputEl.value, this.locale, shouldIncludeSeconds);
- this.setInputValue(localizedInputValue || localizeTimeString(this.value, this.locale, shouldIncludeSeconds));
- };
- this.calciteInputFocusHandler = () => {
- this.active = true;
- };
- this.calciteInputInputHandler = (event) => {
- const target = event.target;
- this.setValue({ value: target.value });
- };
- this.timePickerChangeHandler = (event) => {
- event.stopPropagation();
- const target = event.target;
- const value = target.value;
- this.setValue({ value, origin: "time-picker" });
- };
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.keyDownHandler = (event) => {
- if (event.key === "Enter" && !event.defaultPrevented) {
- submitForm(this);
- }
- };
- this.setCalcitePopoverEl = (el) => {
- this.popoverEl = el;
- };
- this.setCalciteInputEl = (el) => {
- this.calciteInputEl = el;
- };
- this.setCalciteTimePickerEl = (el) => {
- this.calciteTimePickerEl = el;
- };
- this.setInputValue = (newInputValue) => {
- if (!this.calciteInputEl) {
- return;
- }
- this.calciteInputEl.value = newInputValue;
- };
- this.setValue = ({ value, origin = "input" }) => {
- const previousValue = this.value;
- const newValue = formatTimeString(value);
- const newLocalizedValue = localizeTimeString(newValue, this.locale, this.shouldIncludeSeconds());
- this.internalValueChange = origin !== "external" && origin !== "loading";
- const shouldEmit = origin !== "loading" &&
- origin !== "external" &&
- ((value !== this.previousValidValue && !value) ||
- !!(!this.previousValidValue && newValue) ||
- (newValue !== this.previousValidValue && newValue));
- if (value) {
- if (shouldEmit) {
- this.previousValidValue = newValue;
- }
- if (newValue && newValue !== this.value) {
- this.value = newValue;
- }
- this.localizedValue = newLocalizedValue;
- }
- else {
- this.value = value;
- this.localizedValue = null;
- }
- if (origin === "time-picker" || origin === "external") {
- this.setInputValue(newLocalizedValue);
- }
- if (shouldEmit) {
- const changeEvent = this.calciteInputTimePickerChange.emit();
- if (changeEvent.defaultPrevented) {
- this.internalValueChange = false;
- this.value = previousValue;
- this.setInputValue(previousValue);
- this.previousValidValue = previousValue;
- }
- else {
- this.previousValidValue = newValue;
- }
- }
- };
- }
- activeHandler() {
- if (this.disabled) {
- this.active = false;
- return;
- }
- this.reposition();
- }
- handleDisabledChange(value) {
- if (!value) {
- this.active = false;
- }
- }
- localeWatcher(newLocale) {
- this.setInputValue(localizeTimeString(this.value, newLocale, this.shouldIncludeSeconds()));
- }
- valueWatcher(newValue) {
- if (!this.internalValueChange) {
- this.setValue({ value: newValue, origin: "external" });
- }
- this.internalValueChange = false;
- }
- clickHandler(event) {
- if (event.composedPath().includes(this.calciteTimePickerEl)) {
- return;
- }
- this.setFocus();
- }
- keyUpHandler(event) {
- if (event.key === "Escape" && this.active) {
- this.active = false;
- }
- }
- timePickerBlurHandler(event) {
- event.preventDefault();
- event.stopPropagation();
- this.active = false;
- }
- timePickerFocusHandler(event) {
- event.preventDefault();
- event.stopPropagation();
- this.active = true;
- }
- // --------------------------------------------------------------------------
- //
- // Public Methods
- //
- // --------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- this.calciteInputEl.setFocus();
- }
- /** Updates the position of the component. */
- async reposition() {
- var _a;
- (_a = this.popoverEl) === null || _a === void 0 ? void 0 : _a.reposition();
- }
- onLabelClick() {
- this.setFocus();
- }
- shouldIncludeSeconds() {
- return this.step < 60;
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- if (this.value) {
- this.setValue({ value: isValidTime(this.value) ? this.value : undefined, origin: "loading" });
- }
- connectLabel(this);
- connectForm(this);
- }
- componentDidLoad() {
- this.setInputValue(this.localizedValue);
- }
- disconnectedCallback() {
- disconnectLabel(this);
- disconnectForm(this);
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- const popoverId = `${this.referenceElementId}-popover`;
- return (hAsync(Host, { onKeyDown: this.keyDownHandler }, hAsync("div", { "aria-controls": popoverId, "aria-haspopup": "dialog", "aria-label": this.name, "aria-owns": popoverId, id: this.referenceElementId, role: "combobox" }, hAsync("calcite-input", { disabled: this.disabled, icon: "clock", label: getLabelText(this), onCalciteInputBlur: this.calciteInputBlurHandler, onCalciteInputFocus: this.calciteInputFocusHandler, onCalciteInputInput: this.calciteInputInputHandler, ref: this.setCalciteInputEl, scale: this.scale, step: this.step })), hAsync("calcite-popover", { id: popoverId, label: "Time Picker", open: this.active, placement: this.placement, ref: this.setCalcitePopoverEl, referenceElement: this.referenceElementId }, hAsync("calcite-time-picker", { intlHour: this.intlHour, intlHourDown: this.intlHourDown, intlHourUp: this.intlHourUp, intlMeridiem: this.intlMeridiem, intlMeridiemDown: this.intlMeridiemDown, intlMeridiemUp: this.intlMeridiemUp, intlMinute: this.intlMinute, intlMinuteDown: this.intlMinuteDown, intlMinuteUp: this.intlMinuteUp, intlSecond: this.intlSecond, intlSecondDown: this.intlSecondDown, intlSecondUp: this.intlSecondUp, lang: this.locale, onCalciteTimePickerChange: this.timePickerChangeHandler, ref: this.setCalciteTimePickerEl, scale: this.scale, step: this.step, value: this.value })), hAsync(HiddenFormInputSlot, { component: this })));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "active": ["activeHandler"],
- "disabled": ["handleDisabledChange"],
- "locale": ["localeWatcher"],
- "value": ["valueWatcher"]
- }; }
- static get style() { return inputTimePickerCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-input-time-picker",
- "$members$": {
- "active": [1540],
- "disabled": [516],
- "intlHour": [1, "intl-hour"],
- "intlHourDown": [1, "intl-hour-down"],
- "intlHourUp": [1, "intl-hour-up"],
- "intlMeridiem": [1, "intl-meridiem"],
- "intlMeridiemDown": [1, "intl-meridiem-down"],
- "intlMeridiemUp": [1, "intl-meridiem-up"],
- "intlMinute": [1, "intl-minute"],
- "intlMinuteDown": [1, "intl-minute-down"],
- "intlMinuteUp": [1, "intl-minute-up"],
- "intlSecond": [1, "intl-second"],
- "intlSecondDown": [1, "intl-second-down"],
- "intlSecondUp": [1, "intl-second-up"],
- "locale": [1025, "lang"],
- "name": [1],
- "required": [516],
- "scale": [513],
- "placement": [513],
- "step": [2],
- "value": [1025],
- "localizedValue": [32],
- "setFocus": [64],
- "reposition": [64]
- },
- "$listeners$": [[0, "click", "clickHandler"], [0, "keyup", "keyUpHandler"], [0, "calciteTimePickerBlur", "timePickerBlurHandler"], [0, "calciteTimePickerFocus", "timePickerFocusHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["active", "active"], ["disabled", "disabled"], ["required", "required"], ["scale", "scale"], ["placement", "placement"]]
- }; }
- }
- const CSS$r = {
- container: "container"
- };
- const labelCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-label:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-label{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-label{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-label{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-label{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-label{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-label:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-label-h{display:none}/*!@:host*/.sc-calcite-label-h{display:inline}/*!@:host([alignment=start])*/[alignment=start].sc-calcite-label-h{text-align:start}/*!@:host([alignment=end])*/[alignment=end].sc-calcite-label-h{text-align:end}/*!@:host([alignment=center])*/[alignment=center].sc-calcite-label-h{text-align:center}/*!@:host([scale=s]) .container*/[scale=s].sc-calcite-label-h .container.sc-calcite-label{margin-bottom:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=m]) .container*/[scale=m].sc-calcite-label-h .container.sc-calcite-label{margin-bottom:0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=l]) .container*/[scale=l].sc-calcite-label-h .container.sc-calcite-label{margin-bottom:1rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host .container*/.sc-calcite-label-h .container.sc-calcite-label{margin-top:0px;margin-right:0px;margin-left:0px;width:100%;line-height:1.375;color:var(--calcite-ui-text-1)}/*!@:host([layout=default]) .container*/[layout=default].sc-calcite-label-h .container.sc-calcite-label{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:0.25rem}/*!@:host([layout=inline]) .container, :host([layout=inline-space-between]) .container*/[layout=inline].sc-calcite-label-h .container.sc-calcite-label,[layout=inline-space-between].sc-calcite-label-h .container.sc-calcite-label{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;gap:0.5rem}/*!@:host([layout=inline][scale=l]) .container*/[layout=inline][scale=l].sc-calcite-label-h .container.sc-calcite-label{gap:0.75rem}/*!@:host([layout=inline-space-between]) .container*/[layout=inline-space-between].sc-calcite-label-h .container.sc-calcite-label{-ms-flex-pack:justify;justify-content:space-between}/*!@:host([disabled])*/[disabled].sc-calcite-label-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) > .container*/[disabled].sc-calcite-label-h>.container.sc-calcite-label{pointer-events:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted(*)*/.sc-calcite-label-h[disabled] .sc-calcite-label-s>*{pointer-events:none}/*!@:host([disabled]) ::slotted(*[disabled]), :host([disabled]) ::slotted(*[disabled] *)*/.sc-calcite-label-h[disabled] .sc-calcite-label-s>*[disabled],.sc-calcite-label-h[disabled] .sc-calcite-label-s>*[disabled] *{--tw-bg-opacity:1}/*!@:host([disabled]) ::slotted(calcite-input-message:not([active]))*/.sc-calcite-label-h[disabled] .sc-calcite-label-s>calcite-input-message:not([active]){--tw-bg-opacity:0}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-label-h[disabled] .sc-calcite-label-s>[calcite-hydrated][disabled],[disabled].sc-calcite-label-h [calcite-hydrated][disabled].sc-calcite-label{opacity:1}/*!@:host([disable-spacing]) .container*/[disable-spacing].sc-calcite-label-h .container.sc-calcite-label{margin:0px;gap:0px}";
- /**
- * @slot - A slot for adding text and a component that can be labeled.
- */
- class Label {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteInternalLabelClick = createEvent(this, "calciteInternalLabelClick", 3);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** specify the text alignment of the label */
- this.alignment = "start";
- /**
- * specify the status of the label and any child input / input messages
- * @deprecated set directly on child element instead
- */
- this.status = "idle";
- /** specify the scale of the label, defaults to m */
- this.scale = "m";
- /** is the wrapped element positioned inline with the label slotted text */
- this.layout = "default";
- /** eliminates any space around the label */
- this.disableSpacing = false;
- /**
- * is the label disabled
- *
- * @deprecated use the `disabled` property on the interactive components instead
- */
- this.disabled = false;
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- this.labelClickHandler = (event) => {
- this.calciteInternalLabelClick.emit({
- sourceEvent: event
- });
- };
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- document.dispatchEvent(new CustomEvent(labelConnectedEvent));
- }
- disconnectedCallback() {
- document.dispatchEvent(new CustomEvent(labelDisconnectedEvent));
- }
- render() {
- return (hAsync(Host, { onClick: this.labelClickHandler }, hAsync("div", { class: CSS$r.container }, hAsync("slot", null))));
- }
- get el() { return getElement(this); }
- static get style() { return labelCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-label",
- "$members$": {
- "alignment": [513],
- "status": [513],
- "for": [513],
- "scale": [513],
- "layout": [513],
- "disableSpacing": [4, "disable-spacing"],
- "disabled": [516]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["alignment", "alignment"], ["status", "status"], ["for", "for"], ["scale", "scale"], ["layout", "layout"], ["disabled", "disabled"]]
- }; }
- }
- const linkCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-link:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-link{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-link{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-link{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-link{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-link{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-link:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-link-h{display:none}/*!@:host*/.sc-calcite-link-h{display:inline}/*!@:host a, :host span*/.sc-calcite-link-h a.sc-calcite-link,.sc-calcite-link-h span.sc-calcite-link{position:relative;display:-ms-flexbox;display:flex;cursor:pointer;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border-radius:0px;border-style:none;font-family:inherit;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;text-decoration:none;line-height:inherit;font-size:inherit;-webkit-appearance:none}/*!@:host a:hover,\n:host span:hover*/.sc-calcite-link-h a.sc-calcite-link:hover,.sc-calcite-link-h span.sc-calcite-link:hover{text-decoration:none}/*!@:host a, :host span*/.sc-calcite-link-h a.sc-calcite-link,.sc-calcite-link-h span.sc-calcite-link{outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@:host a:focus, :host span:focus*/.sc-calcite-link-h a.sc-calcite-link:focus,.sc-calcite-link-h span.sc-calcite-link:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@calcite-icon*/calcite-icon.sc-calcite-link{width:1em;height:1em;min-width:unset;min-height:unset}/*!@.calcite-link--icon*/.calcite-link--icon.sc-calcite-link{vertical-align:text-top;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;margin-top:0.125rem}/*!@:host .calcite-link--icon.icon-start*/.sc-calcite-link-h .calcite-link--icon.icon-start.sc-calcite-link{-webkit-margin-end:0.5rem;margin-inline-end:0.5rem}/*!@:host .calcite-link--icon.icon-end*/.sc-calcite-link-h .calcite-link--icon.icon-end.sc-calcite-link{-webkit-margin-start:0.5rem;margin-inline-start:0.5rem}/*!@:host span, :host a*/.sc-calcite-link-h span.sc-calcite-link,.sc-calcite-link-h a.sc-calcite-link{position:relative;display:inline;border-style:none;background-color:transparent;padding:0px;color:var(--calcite-ui-text-link);-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;line-height:inherit;white-space:initial;background-image:-webkit-gradient(linear, left top, left bottom, from(currentColor), to(currentColor)), -webkit-gradient(linear, left top, left bottom, from(var(--calcite-link-blue-underline)), to(var(--calcite-link-blue-underline)));background-image:linear-gradient(currentColor, currentColor), linear-gradient(var(--calcite-link-blue-underline), var(--calcite-link-blue-underline));background-position:0% 100%, 100% 100%;background-repeat:no-repeat, no-repeat;background-size:0% 1px, 100% 1px}/*!@:host span:hover, :host span:focus,\n:host a:hover,\n:host a:focus*/.sc-calcite-link-h span.sc-calcite-link:hover,.sc-calcite-link-h span.sc-calcite-link:focus,.sc-calcite-link-h a.sc-calcite-link:hover,.sc-calcite-link-h a.sc-calcite-link:focus{background-size:100% 1px, 100% 1px}/*!@:host span:active,\n:host a:active*/.sc-calcite-link-h span.sc-calcite-link:active,.sc-calcite-link-h a.sc-calcite-link:active{background-size:100% 2px, 100% 2px}/*!@:host span.calcite--rtl,\n:host a.calcite--rtl*/.sc-calcite-link-h span.calcite--rtl.sc-calcite-link,.sc-calcite-link-h a.calcite--rtl.sc-calcite-link{background-position:100% 100%, 100% 100%}/*!@:host([disabled])*/[disabled].sc-calcite-link-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-link-h[disabled] .sc-calcite-link-s>[calcite-hydrated][disabled],[disabled].sc-calcite-link-h [calcite-hydrated][disabled].sc-calcite-link{opacity:1}";
- /** Any attributes placed on <calcite-link> component will propagate to the rendered child */
- /** Passing a 'href' will render an anchor link, instead of a span. Role will be set to link, or link, depending on this. */
- /** It is the consumers responsibility to add aria information, rel, target, for links, and any link attributes for form submission */
- /** @slot - A slot for adding text. */
- class Link {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** is the link disabled */
- this.disabled = false;
- /** Prompts the user to save the linked URL instead of navigating to it. Can be used with or without a value:
- * Without a value, the browser will suggest a filename/extension
- * See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-download
- */
- this.download = false;
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- this.storeTagRef = (el) => {
- this.childEl = el;
- };
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentDidRender() {
- updateHostInteraction(this);
- }
- render() {
- const { download, el } = this;
- const dir = getElementDir(el);
- const childElType = this.href ? "a" : "span";
- const iconStartEl = (hAsync("calcite-icon", { class: "calcite-link--icon icon-start", flipRtl: this.iconFlipRtl === "start" || this.iconFlipRtl === "both", icon: this.iconStart, scale: "s" }));
- const iconEndEl = (hAsync("calcite-icon", { class: "calcite-link--icon icon-end", flipRtl: this.iconFlipRtl === "end" || this.iconFlipRtl === "both", icon: this.iconEnd, scale: "s" }));
- const Tag = childElType;
- const role = childElType === "span" ? "link" : null;
- const tabIndex = childElType === "span" ? 0 : null;
- return (hAsync(Host, { role: "presentation" }, hAsync(Tag, { class: { [CSS_UTILITY.rtl]: dir === "rtl" },
- /*
- When the 'download' property of type 'boolean | string' is set to true, the value is "".
- This works around that issue for now.
- */
- download: Tag === "a" && (download === "" || download) ? download : null, href: Tag === "a" && this.href, ref: this.storeTagRef, rel: Tag === "a" && this.rel, role: role, tabIndex: tabIndex, target: Tag === "a" && this.target }, this.iconStart ? iconStartEl : null, hAsync("slot", null), this.iconEnd ? iconEndEl : null)));
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- focusElement(this.childEl);
- }
- get el() { return getElement(this); }
- static get style() { return linkCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-link",
- "$members$": {
- "disabled": [516],
- "download": [520],
- "href": [513],
- "iconEnd": [513, "icon-end"],
- "iconFlipRtl": [513, "icon-flip-rtl"],
- "iconStart": [513, "icon-start"],
- "rel": [1],
- "target": [1],
- "setFocus": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"], ["download", "download"], ["href", "href"], ["iconEnd", "icon-end"], ["iconFlipRtl", "icon-flip-rtl"], ["iconStart", "icon-start"]]
- }; }
- }
- const CSS$q = {
- container: "container"
- };
- const listCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-list:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-list{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-list{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-list{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-list{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-list{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-list:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-list-h{display:none}/*!@:host*/.sc-calcite-list-h{display:block}/*!@:host([disabled])*/[disabled].sc-calcite-list-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-list-h[disabled] .sc-calcite-list-s>[calcite-hydrated][disabled],[disabled].sc-calcite-list-h [calcite-hydrated][disabled].sc-calcite-list{opacity:1}/*!@.container*/.container.sc-calcite-list{-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;width:100%;-ms-flex-direction:column;flex-direction:column;background-color:transparent}/*!@.container **/.container.sc-calcite-list *.sc-calcite-list{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@::slotted(calcite-list-item)*/.sc-calcite-list-s>calcite-list-item{margin-bottom:1px;--tw-shadow:0 1px 0 var(--calcite-ui-border-3);--tw-shadow-colored:0 1px 0 var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@::slotted(calcite-list-item:last-child)*/.sc-calcite-list-s>calcite-list-item:last-child{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}";
- /**
- * A general purpose list that enables users to construct list items that conform to Calcite styling.
- * @slot - A slot for adding `calcite-list-item` elements.
- */
- class List$1 {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * When true, disabled prevents user interaction.
- */
- this.disabled = false;
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentDidRender() {
- updateHostInteraction(this);
- }
- // --------------------------------------------------------------------------
- //
- // Public Methods
- //
- // --------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- const firstListItem = this.el.querySelector(`calcite-list-item:not([non-interactive])`);
- firstListItem === null || firstListItem === void 0 ? void 0 : firstListItem.setFocus();
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- return (hAsync(Host, { role: "list" }, hAsync("div", { class: CSS$q.container }, hAsync("slot", null))));
- }
- get el() { return getElement(this); }
- static get style() { return listCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-list",
- "$members$": {
- "disabled": [516],
- "headingLevel": [2, "heading-level"],
- "setFocus": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"]]
- }; }
- }
- const CSS$p = {
- container: "container",
- contentContainer: "content-container",
- nestedContainer: "nested-container",
- contentContainerButton: "content-container--button",
- content: "content",
- actionsStart: "actions-start",
- contentStart: "content-start",
- label: "label",
- description: "description",
- contentEnd: "content-end",
- actionsEnd: "actions-end",
- hasCenterContent: "has-center-content"
- };
- const SLOTS$f = {
- actionsStart: "actions-start",
- contentStart: "content-start",
- contentEnd: "content-end",
- actionsEnd: "actions-end"
- };
- const listItemCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-list-item:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-list-item{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-list-item{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-list-item{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-list-item{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-list-item{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-list-item:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-list-item-h{display:none}/*!@:host*/.sc-calcite-list-item-h{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}/*!@:host([disabled])*/[disabled].sc-calcite-list-item-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-list-item-h[disabled] .sc-calcite-list-item-s>[calcite-hydrated][disabled],[disabled].sc-calcite-list-item-h [calcite-hydrated][disabled].sc-calcite-list-item{opacity:1}/*!@.container*/.container.sc-calcite-list-item{-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex:1 1 0%;flex:1 1 0%;background-color:var(--calcite-ui-foreground-1);font-family:var(--calcite-sans-family)}/*!@.container **/.container.sc-calcite-list-item *.sc-calcite-list-item{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@.nested-container*/.nested-container.sc-calcite-list-item{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;background-color:var(--calcite-ui-foreground-1)}/*!@.content-container*/.content-container.sc-calcite-list-item{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-align:stretch;align-items:stretch;padding:0px;font-family:var(--calcite-sans-family);font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-2);outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@.content-container--button*/.content-container--button.sc-calcite-list-item{cursor:pointer;border-style:none;background-color:var(--calcite-ui-foreground-1);outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;text-align:initial}/*!@.content-container--button:hover*/.content-container--button.sc-calcite-list-item:hover{background-color:var(--calcite-ui-foreground-2)}/*!@.content-container--button:hover .label, .content-container--button:hover .description*/.content-container--button.sc-calcite-list-item:hover .label.sc-calcite-list-item,.content-container--button.sc-calcite-list-item:hover .description.sc-calcite-list-item{color:var(--calcite-ui-text-1)}/*!@.content-container--button:focus*/.content-container--button.sc-calcite-list-item:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@.content-container--button .content-start, .content-container--button .content-end*/.content-container--button.sc-calcite-list-item .content-start.sc-calcite-list-item,.content-container--button.sc-calcite-list-item .content-end.sc-calcite-list-item{pointer-events:none}/*!@.content*/.content.sc-calcite-list-item{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;padding-left:0.75rem;padding-right:0.75rem;padding-top:0.5rem;padding-bottom:0.5rem;font-size:var(--calcite-font-size--2);line-height:1.375}/*!@.label, .description*/.label.sc-calcite-list-item,.description.sc-calcite-list-item{font-family:var(--calcite-sans-family);font-size:var(--calcite-font-size--2);font-weight:var(--calcite-font-weight-normal);word-wrap:break-word;word-break:break-word}/*!@.label:only-child, .description:only-child*/.label.sc-calcite-list-item:only-child,.description.sc-calcite-list-item:only-child{margin:0px;padding-top:0.25rem;padding-bottom:0.25rem}/*!@.label*/.label.sc-calcite-list-item{color:var(--calcite-ui-text-1)}/*!@.description*/.description.sc-calcite-list-item{margin-top:0.125rem;color:var(--calcite-ui-text-3)}/*!@.content-start*/.content-start.sc-calcite-list-item{-ms-flex-pack:start;justify-content:flex-start}/*!@.content-end*/.content-end.sc-calcite-list-item{-ms-flex-pack:end;justify-content:flex-end}/*!@.content-start, .content-end*/.content-start.sc-calcite-list-item,.content-end.sc-calcite-list-item{-ms-flex:1 1 auto;flex:1 1 auto}/*!@.has-center-content .content-start, .has-center-content .content-end*/.has-center-content.sc-calcite-list-item .content-start.sc-calcite-list-item,.has-center-content.sc-calcite-list-item .content-end.sc-calcite-list-item{-ms-flex:0 1 auto;flex:0 1 auto}/*!@.actions-start, .actions-end, .content-start, .content-end*/.actions-start.sc-calcite-list-item,.actions-end.sc-calcite-list-item,.content-start.sc-calcite-list-item,.content-end.sc-calcite-list-item{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}/*!@.content-start ::slotted(calcite-icon), .content-end ::slotted(calcite-icon)*/.content-start .sc-calcite-list-item-s>calcite-icon,.content-end.sc-calcite-list-item-s>calcite-icon,.content-end .sc-calcite-list-item-s>calcite-icon{-ms-flex-item-align:center;align-self:center;padding-left:0.75rem;padding-right:0.75rem}/*!@.actions-start ::slotted(calcite-action), .actions-end ::slotted(calcite-action)*/.actions-start .sc-calcite-list-item-s>calcite-action,.actions-end.sc-calcite-list-item-s>calcite-action,.actions-end .sc-calcite-list-item-s>calcite-action{-ms-flex-item-align:stretch;align-self:stretch;color:inherit}/*!@::slotted(calcite-list-item-group), ::slotted(calcite-list-item)*/.sc-calcite-list-item-s>calcite-list-item-group,.sc-calcite-list-item-s>calcite-list-item{padding-left:0.5rem}";
- /**
- * @slot - A slot for adding `calcite-list-item` and `calcite-list-item-group` elements.
- * @slot actions-start - A slot for adding actionable `calcite-action` elements before the content of the list item.
- * @slot content-start - A slot for adding non-actionable elements before the label and description of the list item.
- * @slot content-end - A slot for adding non-actionable elements after the label and description of the list item.
- * @slot actions-end - A slot for adding actionable `calcite-action` elements after the content of the list item.
- */
- class ListItem {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * When true, prevents the content of the list item from user interaction.
- */
- this.nonInteractive = false;
- /**
- * When true, disabled prevents interaction.
- */
- this.disabled = false;
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentDidRender() {
- updateHostInteraction(this);
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- disconnectConditionalSlotComponent(this);
- }
- // --------------------------------------------------------------------------
- //
- // Public Methods
- //
- // --------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- var _a;
- (_a = this.focusEl) === null || _a === void 0 ? void 0 : _a.focus();
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- renderActionsStart() {
- const { el } = this;
- return getSlotted(el, SLOTS$f.actionsStart) ? (hAsync("div", { class: CSS$p.actionsStart }, hAsync("slot", { name: SLOTS$f.actionsStart }))) : null;
- }
- renderActionsEnd() {
- const { el } = this;
- return getSlotted(el, SLOTS$f.actionsEnd) ? (hAsync("div", { class: CSS$p.actionsEnd }, hAsync("slot", { name: SLOTS$f.actionsEnd }))) : null;
- }
- renderContentStart() {
- const { el } = this;
- return getSlotted(el, SLOTS$f.contentStart) ? (hAsync("div", { class: CSS$p.contentStart }, hAsync("slot", { name: SLOTS$f.contentStart }))) : null;
- }
- renderContentEnd() {
- const { el } = this;
- return getSlotted(el, SLOTS$f.contentEnd) ? (hAsync("div", { class: CSS$p.contentEnd }, hAsync("slot", { name: SLOTS$f.contentEnd }))) : null;
- }
- renderContent() {
- const { label, description } = this;
- return !!label || !!description ? (hAsync("div", { class: CSS$p.content }, label ? hAsync("div", { class: CSS$p.label }, label) : null, description ? hAsync("div", { class: CSS$p.description }, description) : null)) : null;
- }
- renderContentContainer() {
- const { description, disabled, label, nonInteractive } = this;
- const hasCenterContent = !!label || !!description;
- const content = [this.renderContentStart(), this.renderContent(), this.renderContentEnd()];
- return !nonInteractive ? (hAsync("button", { class: {
- [CSS$p.contentContainer]: true,
- [CSS$p.contentContainerButton]: true,
- [CSS$p.hasCenterContent]: hasCenterContent
- }, disabled: disabled, ref: (focusEl) => (this.focusEl = focusEl) }, content)) : (hAsync("div", { class: { [CSS$p.contentContainer]: true, [CSS$p.hasCenterContent]: hasCenterContent }, ref: () => (this.focusEl = null) }, content));
- }
- render() {
- return (hAsync(Host, { role: "listitem" }, hAsync("div", { class: CSS$p.container }, this.renderActionsStart(), this.renderContentContainer(), this.renderActionsEnd()), hAsync("div", { class: CSS$p.nestedContainer }, hAsync("slot", null))));
- }
- get el() { return getElement(this); }
- static get style() { return listItemCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-list-item",
- "$members$": {
- "nonInteractive": [516, "non-interactive"],
- "description": [1],
- "disabled": [516],
- "label": [1],
- "setFocus": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["nonInteractive", "non-interactive"], ["disabled", "disabled"]]
- }; }
- }
- const CSS$o = {
- heading: "heading",
- container: "container"
- };
- const HEADING_LEVEL$5 = 3;
- const listItemGroupCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-list-item-group:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-list-item-group{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-list-item-group{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-list-item-group{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-list-item-group{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-list-item-group{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-list-item-group:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-list-item-group-h{display:none}/*!@:host*/.sc-calcite-list-item-group-h{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}/*!@.heading*/.heading.sc-calcite-list-item-group{margin:0px;display:-ms-flexbox;display:flex;-ms-flex:1 1 0%;flex:1 1 0%;background-color:var(--calcite-ui-foreground-2);padding:0.75rem;font-family:var(--calcite-sans-family);font-size:var(--calcite-font-size--1);font-weight:var(--calcite-font-weight-bold);color:var(--calcite-ui-text-2)}/*!@.container*/.container.sc-calcite-list-item-group{display:-ms-flexbox;display:flex;width:100%;-ms-flex-direction:column;flex-direction:column;background-color:var(--calcite-ui-foreground-1)}/*!@::slotted(calcite-list-item-group)*/.sc-calcite-list-item-group-s>calcite-list-item-group{padding-left:0.5rem}";
- /**
- * @slot - A slot for adding `calcite-list-item` and `calcite-list-item-group` elements.
- */
- class ListItemGroup {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- var _a;
- const { el, heading, headingLevel } = this;
- const parentLevel = (_a = el.closest("calcite-list, calcite-list-item-group")) === null || _a === void 0 ? void 0 : _a.headingLevel;
- const relativeLevel = parentLevel ? constrainHeadingLevel(parentLevel + 1) : null;
- const level = headingLevel || relativeLevel || HEADING_LEVEL$5;
- return (hAsync(Host, null, heading ? (hAsync(Heading, { class: CSS$o.heading, level: level }, heading)) : null, hAsync("div", { class: CSS$o.container, role: "group" }, hAsync("slot", null))));
- }
- get el() { return getElement(this); }
- static get style() { return listItemGroupCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-list-item-group",
- "$members$": {
- "heading": [513],
- "headingLevel": [2, "heading-level"]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["heading", "heading"]]
- }; }
- }
- const loaderCss = "@charset \"UTF-8\";@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-loader:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-loader{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-loader{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-loader{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-loader{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-loader{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-loader:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-loader-h{display:none}/*!@:host*/.sc-calcite-loader-h{position:relative;margin-left:auto;margin-right:auto;display:none;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding-top:4rem;padding-bottom:4rem;opacity:1;min-height:var(--calcite-loader-size);font-size:var(--calcite-loader-font-size);stroke:var(--calcite-ui-brand);stroke-width:3;fill:none;-webkit-transform:scale(1, 1);transform:scale(1, 1);animation:loader-color-shift 6s alternate-reverse infinite linear}/*!@:host([scale=s])*/[scale=s].sc-calcite-loader-h{--calcite-loader-font-size:var(--calcite-font-size--2);--calcite-loader-size:2rem;--calcite-loader-size-inline:0.75rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-loader-h{--calcite-loader-font-size:var(--calcite-font-size-0);--calcite-loader-size:4rem;--calcite-loader-size-inline:1rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-loader-h{--calcite-loader-font-size:var(--calcite-font-size-2);--calcite-loader-size:6rem;--calcite-loader-size-inline:1.5rem}/*!@:host([no-padding])*/[no-padding].sc-calcite-loader-h{padding-top:0px;padding-bottom:0px}/*!@:host*/.sc-calcite-loader-h{display:none}/*!@:host([active])*/[active].sc-calcite-loader-h{display:-ms-flexbox;display:flex}/*!@.loader__text*/.loader__text.sc-calcite-loader{display:block;text-align:center;font-size:var(--calcite-font-size--2);line-height:1rem;color:var(--calcite-ui-text-1);margin-top:calc(var(--calcite-loader-size) + 1.5rem)}/*!@.loader__percentage*/.loader__percentage.sc-calcite-loader{position:absolute;display:block;text-align:center;color:var(--calcite-ui-text-1);font-size:var(--calcite-loader-font-size);width:var(--calcite-loader-size);left:50%;margin-left:calc(var(--calcite-loader-size) / 2 * -1);line-height:0.25;-webkit-transform:scale(1, 1);transform:scale(1, 1)}/*!@.loader__svgs*/.loader__svgs.sc-calcite-loader{position:absolute;overflow:visible;opacity:1;width:var(--calcite-loader-size);height:var(--calcite-loader-size);left:50%;margin-left:calc(var(--calcite-loader-size) / 2 * -1);-webkit-transform:scale(1, 1);transform:scale(1, 1)}/*!@.loader__svg*/.loader__svg.sc-calcite-loader{position:absolute;top:0px;left:0px;-webkit-transform-origin:center;transform-origin:center;overflow:visible;width:var(--calcite-loader-size);height:var(--calcite-loader-size);-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-name:loader-clockwise;animation-name:loader-clockwise}@supports (display: grid){/*!@.loader__svg--1*/.loader__svg--1.sc-calcite-loader{-webkit-animation-name:loader-offset-1;animation-name:loader-offset-1}/*!@.loader__svg--2*/.loader__svg--2.sc-calcite-loader{-webkit-animation-name:loader-offset-2;animation-name:loader-offset-2}/*!@.loader__svg--3*/.loader__svg--3.sc-calcite-loader{-webkit-animation-name:loader-offset-3;animation-name:loader-offset-3}}/*!@:host([type=determinate])*/[type=determinate].sc-calcite-loader-h{-webkit-animation:none;animation:none;stroke:var(--calcite-ui-border-3)}/*!@:host([type=determinate]) .loader__svg--3*/[type=determinate].sc-calcite-loader-h .loader__svg--3.sc-calcite-loader{-webkit-animation:none;animation:none;stroke:var(--calcite-ui-brand);stroke-dasharray:150.79632;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);-webkit-transition:all var(--calcite-internal-animation-timing-fast) linear;transition:all var(--calcite-internal-animation-timing-fast) linear}/*!@:host([inline])*/[inline].sc-calcite-loader-h{position:relative;margin:0px;-webkit-animation:none;animation:none;stroke:currentColor;stroke-width:2;padding-top:0px;padding-bottom:0px;height:var(--calcite-loader-size-inline);min-height:var(--calcite-loader-size-inline);width:var(--calcite-loader-size-inline);-webkit-margin-end:calc(var(--calcite-loader-size-inline) * 0.5);margin-inline-end:calc(var(--calcite-loader-size-inline) * 0.5);vertical-align:calc(var(--calcite-loader-size-inline) * -1 * 0.2)}/*!@:host([active][inline])*/[active][inline].sc-calcite-loader-h{display:inline-block}/*!@:host([inline]) .loader__svgs*/[inline].sc-calcite-loader-h .loader__svgs.sc-calcite-loader{top:0px;left:0px;margin:0px;width:var(--calcite-loader-size-inline);height:var(--calcite-loader-size-inline)}/*!@:host([inline]) .loader__svg*/[inline].sc-calcite-loader-h .loader__svg.sc-calcite-loader{width:var(--calcite-loader-size-inline);height:var(--calcite-loader-size-inline)}/*!@:host([complete])*/[complete].sc-calcite-loader-h{opacity:0;-webkit-transform:scale(0.75, 0.75);transform:scale(0.75, 0.75);-webkit-transform-origin:center;transform-origin:center;-webkit-transition:opacity var(--calcite-internal-animation-timing-medium) linear 1000ms, -webkit-transform var(--calcite-internal-animation-timing-medium) linear 1000ms;transition:opacity var(--calcite-internal-animation-timing-medium) linear 1000ms, -webkit-transform var(--calcite-internal-animation-timing-medium) linear 1000ms;transition:opacity var(--calcite-internal-animation-timing-medium) linear 1000ms, transform var(--calcite-internal-animation-timing-medium) linear 1000ms;transition:opacity var(--calcite-internal-animation-timing-medium) linear 1000ms, transform var(--calcite-internal-animation-timing-medium) linear 1000ms, -webkit-transform var(--calcite-internal-animation-timing-medium) linear 1000ms}/*!@:host([complete]) .loader__svgs*/[complete].sc-calcite-loader-h .loader__svgs.sc-calcite-loader{opacity:0;-webkit-transform:scale(0.75, 0.75);transform:scale(0.75, 0.75);-webkit-transform-origin:center;transform-origin:center;-webkit-transition:opacity calc(180ms * var(--calcite-internal-duration-factor)) linear 800ms, -webkit-transform calc(180ms * var(--calcite-internal-duration-factor)) linear 800ms;transition:opacity calc(180ms * var(--calcite-internal-duration-factor)) linear 800ms, -webkit-transform calc(180ms * var(--calcite-internal-duration-factor)) linear 800ms;transition:opacity calc(180ms * var(--calcite-internal-duration-factor)) linear 800ms, transform calc(180ms * var(--calcite-internal-duration-factor)) linear 800ms;transition:opacity calc(180ms * var(--calcite-internal-duration-factor)) linear 800ms, transform calc(180ms * var(--calcite-internal-duration-factor)) linear 800ms, -webkit-transform calc(180ms * var(--calcite-internal-duration-factor)) linear 800ms}/*!@:host([complete]) .loader__percentage*/[complete].sc-calcite-loader-h .loader__percentage.sc-calcite-loader{color:var(--calcite-ui-brand);-webkit-transform:scale(1.05, 1.05);transform:scale(1.05, 1.05);-webkit-transform-origin:center;transform-origin:center;-webkit-transition:color var(--calcite-internal-animation-timing-medium) linear, -webkit-transform var(--calcite-internal-animation-timing-medium) linear;transition:color var(--calcite-internal-animation-timing-medium) linear, -webkit-transform var(--calcite-internal-animation-timing-medium) linear;transition:color var(--calcite-internal-animation-timing-medium) linear, transform var(--calcite-internal-animation-timing-medium) linear;transition:color var(--calcite-internal-animation-timing-medium) linear, transform var(--calcite-internal-animation-timing-medium) linear, -webkit-transform var(--calcite-internal-animation-timing-medium) linear}/*!@.loader__svg--1*/.loader__svg--1.sc-calcite-loader{stroke-dasharray:27.9252444444% 139.6262222222%;-webkit-animation-duration:0.72s;animation-duration:0.72s}@-webkit-keyframes loader-offset-1{0%{stroke-dasharray:27.9252444444% 251.3272%;stroke-dashoffset:0}50%{stroke-dasharray:139.6262222222% 139.6262222222%;stroke-dashoffset:-83.7757333333%}100%{stroke-dasharray:27.9252444444% 251.3272%;stroke-dashoffset:-279.2524444444%}}@keyframes loader-offset-1{0%{stroke-dasharray:27.9252444444% 251.3272%;stroke-dashoffset:0}50%{stroke-dasharray:139.6262222222% 139.6262222222%;stroke-dashoffset:-83.7757333333%}100%{stroke-dasharray:27.9252444444% 251.3272%;stroke-dashoffset:-279.2524444444%}}/*!@.loader__svg--2*/.loader__svg--2.sc-calcite-loader{stroke-dasharray:55.8504888889% 139.6262222222%;-webkit-animation-duration:0.96s;animation-duration:0.96s}@-webkit-keyframes loader-offset-2{0%{stroke-dasharray:55.8504888889% 223.4019555556%;stroke-dashoffset:0}50%{stroke-dasharray:139.6262222222% 139.6262222222%;stroke-dashoffset:-97.7383555556%}100%{stroke-dasharray:55.8504888889% 223.4019555556%;stroke-dashoffset:-279.2524444444%}}@keyframes loader-offset-2{0%{stroke-dasharray:55.8504888889% 223.4019555556%;stroke-dashoffset:0}50%{stroke-dasharray:139.6262222222% 139.6262222222%;stroke-dashoffset:-97.7383555556%}100%{stroke-dasharray:55.8504888889% 223.4019555556%;stroke-dashoffset:-279.2524444444%}}/*!@.loader__svg--3*/.loader__svg--3.sc-calcite-loader{stroke-dasharray:13.9626222222% 139.6262222222%;-webkit-animation-duration:1.16s;animation-duration:1.16s}@-webkit-keyframes loader-offset-3{0%{stroke-dasharray:13.9626222222% 265.2898222222%;stroke-dashoffset:0}50%{stroke-dasharray:139.6262222222% 139.6262222222%;stroke-dashoffset:-76.7944222222%}100%{stroke-dasharray:13.9626222222% 265.2898222222%;stroke-dashoffset:-279.2524444444%}}@keyframes loader-offset-3{0%{stroke-dasharray:13.9626222222% 265.2898222222%;stroke-dashoffset:0}50%{stroke-dasharray:139.6262222222% 139.6262222222%;stroke-dashoffset:-76.7944222222%}100%{stroke-dasharray:13.9626222222% 265.2898222222%;stroke-dashoffset:-279.2524444444%}}@-webkit-keyframes loader-color-shift{0%{stroke:var(--calcite-ui-brand)}33%{stroke:var(--calcite-ui-brand-press)}66%{stroke:var(--calcite-ui-brand-hover)}100%{stroke:var(--calcite-ui-brand)}}@keyframes loader-color-shift{0%{stroke:var(--calcite-ui-brand)}33%{stroke:var(--calcite-ui-brand-press)}66%{stroke:var(--calcite-ui-brand-hover)}100%{stroke:var(--calcite-ui-brand)}}@-webkit-keyframes loader-clockwise{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes loader-clockwise{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}";
- class Loader {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** Show the loader */
- this.active = false;
- /** Inline loaders are smaller and will appear to the left of the text */
- this.inline = false;
- /** Speficy the scale of the loader. Defaults to "m" */
- this.scale = "m";
- /** Percent complete of 100, only valid for determinate indicators */
- this.value = 0;
- /** Text which should appear under the loading indicator (optional) */
- this.text = "";
- /** Turn off spacing around the loader */
- this.noPadding = false;
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- render() {
- const { el, inline, label, scale, text, type, value } = this;
- const id = el.id || guid();
- const radiusRatio = 0.45;
- const size = inline ? this.getInlineSize(scale) : this.getSize(scale);
- const radius = size * radiusRatio;
- const viewbox = `0 0 ${size} ${size}`;
- const isDeterminate = type === "determinate";
- const circumference = 2 * radius * Math.PI;
- const progress = (value / 100) * circumference;
- const remaining = circumference - progress;
- const valueNow = Math.floor(value);
- const hostAttributes = {
- "aria-valuenow": valueNow,
- "aria-valuemin": 0,
- "aria-valuemax": 100,
- complete: valueNow === 100
- };
- const svgAttributes = { r: radius, cx: size / 2, cy: size / 2 };
- const determinateStyle = { "stroke-dasharray": `${progress} ${remaining}` };
- return (hAsync(Host, Object.assign({ "aria-label": label, id: id, role: "progressbar" }, (isDeterminate ? hostAttributes : {})), hAsync("div", { class: "loader__svgs" }, hAsync("svg", { class: "loader__svg loader__svg--1", viewBox: viewbox }, hAsync("circle", Object.assign({}, svgAttributes))), hAsync("svg", { class: "loader__svg loader__svg--2", viewBox: viewbox }, hAsync("circle", Object.assign({}, svgAttributes))), hAsync("svg", Object.assign({ class: "loader__svg loader__svg--3", viewBox: viewbox }, (isDeterminate ? { style: determinateStyle } : {})), hAsync("circle", Object.assign({}, svgAttributes)))), text && hAsync("div", { class: "loader__text" }, text), isDeterminate && hAsync("div", { class: "loader__percentage" }, value)));
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- /**
- * Return the proper sizes based on the scale property
- */
- getSize(scale) {
- return {
- s: 32,
- m: 56,
- l: 80
- }[scale];
- }
- getInlineSize(scale) {
- return {
- s: 12,
- m: 16,
- l: 20
- }[scale];
- }
- get el() { return getElement(this); }
- static get style() { return loaderCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-loader",
- "$members$": {
- "active": [516],
- "inline": [516],
- "label": [1],
- "scale": [513],
- "type": [513],
- "value": [2],
- "text": [1],
- "noPadding": [4, "no-padding"]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["active", "active"], ["inline", "inline"], ["scale", "scale"], ["type", "type"]]
- }; }
- }
- /**
- * Traverses the slots of the open shadowroots and returns all children matching the query.
- * @param {ShadowRoot | HTMLElement} root
- * @param skipNode
- * @param isMatch
- * @param {number} maxDepth
- * @param {number} depth
- * @returns {HTMLElement[]}
- */
- function queryShadowRoot(root, skipNode, isMatch, maxDepth = 20, depth = 0) {
- let matches = [];
- // If the depth is above the max depth, abort the searching here.
- if (depth >= maxDepth) {
- return matches;
- }
- // Traverses a slot element
- const traverseSlot = ($slot) => {
- // Only check nodes that are of the type Node.ELEMENT_NODE
- // Read more here https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType
- const assignedNodes = $slot.assignedNodes().filter(node => node.nodeType === 1);
- if (assignedNodes.length > 0) {
- return queryShadowRoot(assignedNodes[0].parentElement, skipNode, isMatch, maxDepth, depth + 1);
- }
- return [];
- };
- // Go through each child and continue the traversing if necessary
- // Even though the typing says that children can't be undefined, Edge 15 sometimes gives an undefined value.
- // Therefore we fallback to an empty array if it is undefined.
- const children = Array.from(root.children || []);
- for (const $child of children) {
- // Check if the node and its descendants should be skipped
- if (skipNode($child)) {
- continue;
- }
- // If the child matches we always add it
- if (isMatch($child)) {
- matches.push($child);
- }
- if ($child.shadowRoot != null) {
- matches.push(...queryShadowRoot($child.shadowRoot, skipNode, isMatch, maxDepth, depth + 1));
- }
- else if ($child.tagName === "SLOT") {
- matches.push(...traverseSlot($child));
- }
- else {
- matches.push(...queryShadowRoot($child, skipNode, isMatch, maxDepth, depth + 1));
- }
- }
- return matches;
- }
- /**
- * Returns whether the element is hidden.
- * @param $elem
- */
- function isHidden($elem) {
- return $elem.hasAttribute("hidden")
- || ($elem.hasAttribute("aria-hidden") && $elem.getAttribute("aria-hidden") !== "false")
- // A quick and dirty way to check whether the element is hidden.
- // For a more fine-grained check we could use "window.getComputedStyle" but we don't because of bad performance.
- // If the element has visibility set to "hidden" or "collapse", display set to "none" or opacity set to "0" through CSS
- // we won't be able to catch it here. We accept it due to the huge performance benefits.
- || $elem.style.display === `none`
- || $elem.style.opacity === `0`
- || $elem.style.visibility === `hidden`
- || $elem.style.visibility === `collapse`;
- // If offsetParent is null we can assume that the element is hidden
- // https://stackoverflow.com/questions/306305/what-would-make-offsetparent-null
- //|| $elem.offsetParent == null;
- }
- /**
- * Returns whether the element is disabled.
- * @param $elem
- */
- function isDisabled($elem) {
- return $elem.hasAttribute("disabled")
- || ($elem.hasAttribute("aria-disabled") && $elem.getAttribute("aria-disabled") !== "false");
- }
- /**
- * Determines whether an element is focusable.
- * Read more here: https://stackoverflow.com/questions/1599660/which-html-elements-can-receive-focus/1600194#1600194
- * Or here: https://stackoverflow.com/questions/18261595/how-to-check-if-a-dom-element-is-focusable
- * @param $elem
- */
- function isFocusable($elem) {
- // Discard elements that are removed from the tab order.
- if ($elem.getAttribute("tabindex") === "-1" || isHidden($elem) || isDisabled($elem)) {
- return false;
- }
- return (
- // At this point we know that the element can have focus (eg. won't be -1) if the tabindex attribute exists
- $elem.hasAttribute("tabindex")
- // Anchor tags or area tags with a href set
- || ($elem instanceof HTMLAnchorElement || $elem instanceof HTMLAreaElement) && $elem.hasAttribute("href")
- // Form elements which are not disabled
- || ($elem instanceof HTMLButtonElement
- || $elem instanceof HTMLInputElement
- || $elem instanceof HTMLTextAreaElement
- || $elem instanceof HTMLSelectElement)
- // IFrames
- || $elem instanceof HTMLIFrameElement);
- }
- const CSS$n = {
- title: "title",
- header: "header",
- footer: "footer",
- scrim: "scrim",
- back: "back",
- close: "close",
- secondary: "secondary",
- primary: "primary",
- overflowHidden: "overflow-hidden"
- };
- const ICONS$6 = {
- close: "x"
- };
- const SLOTS$e = {
- content: "content",
- header: "header",
- back: "back",
- secondary: "secondary",
- primary: "primary"
- };
- const TEXT$b = {
- close: "Close"
- };
- const modalCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-modal:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-modal{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-modal{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-modal{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-modal{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-modal{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-modal:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-modal-h{display:none}/*!@:host*/.sc-calcite-modal-h{position:fixed;top:0px;right:0px;bottom:0px;left:0px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;overflow-y:hidden;color:var(--calcite-ui-text-2);opacity:0;visibility:hidden !important;-webkit-transition:visibility 0ms linear 300ms, opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);transition:visibility 0ms linear 300ms, opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);z-index:101}/*!@:host([scale=s])*/[scale=s].sc-calcite-modal-h{--calcite-modal-padding:0.75rem;--calcite-modal-padding-large:1rem;--calcite-modal-title-text:var(--calcite-font-size-1);--calcite-modal-content-text:var(--calcite-font-size--1)}/*!@:host([scale=m])*/[scale=m].sc-calcite-modal-h{--calcite-modal-padding:1rem;--calcite-modal-padding-large:1.25rem;--calcite-modal-title-text:var(--calcite-font-size-2);--calcite-modal-content-text:var(--calcite-font-size-0)}/*!@:host([scale=l])*/[scale=l].sc-calcite-modal-h{--calcite-modal-padding:1.25rem;--calcite-modal-padding-large:1.5rem;--calcite-modal-title-text:var(--calcite-font-size-3);--calcite-modal-content-text:var(--calcite-font-size-1)}/*!@.scrim*/.scrim.sc-calcite-modal{--calcite-scrim-background:rgba(0, 0, 0, 0.75);position:fixed;top:0px;right:0px;bottom:0px;left:0px;display:-ms-flexbox;display:flex;overflow-y:hidden}/*!@.modal*/.modal.sc-calcite-modal{pointer-events:none;float:none;margin:1.5rem;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;width:100%;-ms-flex-direction:column;flex-direction:column;overflow:hidden;border-radius:0.25rem;background-color:var(--calcite-ui-foreground-1);opacity:0;--tw-shadow:0 2px 12px -4px rgba(0, 0, 0, 0.2), 0 2px 4px -2px rgba(0, 0, 0, 0.16);--tw-shadow-colored:0 2px 12px -4px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);z-index:102;-webkit-overflow-scrolling:touch;visibility:hidden;-webkit-transition:visibility 0ms linear 300ms, opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), -webkit-transform var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);transition:visibility 0ms linear 300ms, opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), -webkit-transform var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);transition:transform var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), visibility 0ms linear 300ms, opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);transition:transform var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), visibility 0ms linear 300ms, opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), -webkit-transform var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);-webkit-transform:translate3d(0, 20px, 0);transform:translate3d(0, 20px, 0)}/*!@:host([active])*/[active].sc-calcite-modal-h{opacity:1;visibility:visible !important;-webkit-transition-delay:0ms;transition-delay:0ms}/*!@:host([active]) .modal*/[active].sc-calcite-modal-h .modal.sc-calcite-modal{pointer-events:auto;visibility:visible;opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);-webkit-transition:visibility 0ms linear, opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), max-width var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), max-height var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), -webkit-transform var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);transition:visibility 0ms linear, opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), max-width var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), max-height var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), -webkit-transform var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);transition:transform var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), visibility 0ms linear, opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), max-width var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), max-height var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);transition:transform var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), visibility 0ms linear, opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), max-width var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), max-height var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88), -webkit-transform var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);-webkit-transition-delay:0ms;transition-delay:0ms}/*!@.header*/.header.sc-calcite-modal{display:-ms-flexbox;display:flex;min-width:0px;max-width:100%;border-top-left-radius:0.25rem;border-top-right-radius:0.25rem;border-width:0px;border-bottom-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3);background-color:var(--calcite-ui-foreground-1);-ms-flex:0 0 auto;flex:0 0 auto;z-index:2}/*!@.close*/.close.sc-calcite-modal{-ms-flex-order:2;order:2;margin:0px;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-style:none;background-color:transparent;color:var(--calcite-ui-text-3);outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;border-start-end-radius:0.25rem;padding:var(--calcite-modal-padding);-ms-flex:0 0 auto;flex:0 0 auto}/*!@.close calcite-icon*/.close.sc-calcite-modal calcite-icon.sc-calcite-modal{pointer-events:none;vertical-align:-2px}/*!@.close:focus*/.close.sc-calcite-modal:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@.close:hover, .close:focus, .close:active*/.close.sc-calcite-modal:hover,.close.sc-calcite-modal:focus,.close.sc-calcite-modal:active{background-color:var(--calcite-ui-foreground-2);color:var(--calcite-ui-text-1)}/*!@.title*/.title.sc-calcite-modal{-ms-flex-order:1;order:1;display:-ms-flexbox;display:flex;min-width:0px;-ms-flex-align:center;align-items:center;-ms-flex:1 1 auto;flex:1 1 auto;padding:var(--calcite-modal-padding) var(--calcite-modal-padding-large)}/*!@slot[name=header]::slotted(*), *::slotted([slot=header])*/slot[name=header].sc-calcite-modal-s>*,*.sc-calcite-modal-s>[slot=header]{margin:0px;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-1);font-size:var(--calcite-modal-title-text)}/*!@.content*/.content.sc-calcite-modal{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;display:block;height:100%;overflow:auto;background-color:var(--calcite-ui-foreground-1);padding:0px;max-height:calc(100vh - 12rem);z-index:1}/*!@.content--spaced*/.content--spaced.sc-calcite-modal{padding:var(--calcite-modal-padding) var(--calcite-modal-padding-large)}/*!@.content--no-footer*/.content--no-footer.sc-calcite-modal{border-bottom-right-radius:0.25rem;border-bottom-left-radius:0.25rem}/*!@slot[name=content]::slotted(*),\n*::slotted([slot=content])*/slot[name=content].sc-calcite-modal-s>*,*.sc-calcite-modal-s>[slot=content]{font-size:var(--calcite-modal-content-text)}/*!@:host([background-color=grey]) .content*/[background-color=grey].sc-calcite-modal-h .content.sc-calcite-modal{background-color:var(--calcite-ui-background)}/*!@.footer*/.footer.sc-calcite-modal{margin-top:auto;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;width:100%;-ms-flex-pack:justify;justify-content:space-between;border-bottom-right-radius:0.25rem;border-bottom-left-radius:0.25rem;border-width:0px;border-top-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3);background-color:var(--calcite-ui-foreground-1);-ms-flex:0 0 auto;flex:0 0 auto;padding:var(--calcite-modal-padding) var(--calcite-modal-padding-large);z-index:2}/*!@.footer--hide-back .back, .footer--hide-secondary .secondary*/.footer--hide-back.sc-calcite-modal .back.sc-calcite-modal,.footer--hide-secondary.sc-calcite-modal .secondary.sc-calcite-modal{display:none}/*!@.back*/.back.sc-calcite-modal{display:block;-webkit-margin-end:auto;margin-inline-end:auto}/*!@.secondary*/.secondary.sc-calcite-modal{margin-left:0.25rem;margin-right:0.25rem;display:block}/*!@slot[name=primary]*/slot[name=primary].sc-calcite-modal{display:block}/*!@:host([width=small]) .modal*/[width=small].sc-calcite-modal-h .modal.sc-calcite-modal{width:auto}/*!@:host([width=s]) .modal*/[width=s].sc-calcite-modal-h .modal.sc-calcite-modal{max-width:32rem}@media screen and (max-width: 35rem){/*!@:host([width=s]) .modal*/[width=s].sc-calcite-modal-h .modal.sc-calcite-modal{margin:0px;height:100%;max-height:100%;width:100%;max-width:100%;border-radius:0px}/*!@:host([width=s]) .content*/[width=s].sc-calcite-modal-h .content.sc-calcite-modal{-ms-flex:1 1 auto;flex:1 1 auto;max-height:unset}/*!@:host([width=s][docked])*/[width=s][docked].sc-calcite-modal-h{-ms-flex-align:end;align-items:flex-end}}/*!@:host([width=m]) .modal*/[width=m].sc-calcite-modal-h .modal.sc-calcite-modal{max-width:48rem}@media screen and (max-width: 51rem){/*!@:host([width=m]) .modal*/[width=m].sc-calcite-modal-h .modal.sc-calcite-modal{margin:0px;height:100%;max-height:100%;width:100%;max-width:100%;border-radius:0px}/*!@:host([width=m]) .content*/[width=m].sc-calcite-modal-h .content.sc-calcite-modal{-ms-flex:1 1 auto;flex:1 1 auto;max-height:unset}/*!@:host([width=m][docked])*/[width=m][docked].sc-calcite-modal-h{-ms-flex-align:end;align-items:flex-end}}/*!@:host([width=l]) .modal*/[width=l].sc-calcite-modal-h .modal.sc-calcite-modal{max-width:94rem}@media screen and (max-width: 97rem){/*!@:host([width=l]) .modal*/[width=l].sc-calcite-modal-h .modal.sc-calcite-modal{margin:0px;height:100%;max-height:100%;width:100%;max-width:100%;border-radius:0px}/*!@:host([width=l]) .content*/[width=l].sc-calcite-modal-h .content.sc-calcite-modal{-ms-flex:1 1 auto;flex:1 1 auto;max-height:unset}/*!@:host([width=l][docked])*/[width=l][docked].sc-calcite-modal-h{-ms-flex-align:end;align-items:flex-end}}/*!@:host([fullscreen])*/[fullscreen].sc-calcite-modal-h{background-color:transparent}/*!@:host([fullscreen]) .modal*/[fullscreen].sc-calcite-modal-h .modal.sc-calcite-modal{margin:0px;height:100%;max-height:100%;width:100%;max-width:100%;-webkit-transform:translate3D(0, 20px, 0) scale(0.95);transform:translate3D(0, 20px, 0) scale(0.95)}/*!@:host([fullscreen]) .content*/[fullscreen].sc-calcite-modal-h .content.sc-calcite-modal{max-height:100%;-ms-flex:1 1 auto;flex:1 1 auto}/*!@:host([active][fullscreen]) .modal*/[active][fullscreen].sc-calcite-modal-h .modal.sc-calcite-modal{-webkit-transform:translate3D(0, 0, 0) scale(1);transform:translate3D(0, 0, 0) scale(1)}/*!@:host([active][fullscreen]) .header*/[active][fullscreen].sc-calcite-modal-h .header.sc-calcite-modal{border-radius:0}/*!@:host([active][fullscreen]) .footer*/[active][fullscreen].sc-calcite-modal-h .footer.sc-calcite-modal{border-radius:0}/*!@:host([docked]) .modal*/[docked].sc-calcite-modal-h .modal.sc-calcite-modal{height:auto}/*!@:host([docked]) .content*/[docked].sc-calcite-modal-h .content.sc-calcite-modal{height:auto;-ms-flex:1 1 auto;flex:1 1 auto}@media screen and (max-width: 860px){/*!@:host([docked]) .modal*/[docked].sc-calcite-modal-h .modal.sc-calcite-modal{border-radius:var(--calcite-border-radius) var(--calcite-border-radius) 0 0}/*!@:host([docked]) .close*/[docked].sc-calcite-modal-h .close.sc-calcite-modal{border-start-end-radius:var(--calcite-border-radius)}}/*!@:host([color=red]) .modal*/[color=red].sc-calcite-modal-h .modal.sc-calcite-modal{border-color:var(--calcite-ui-danger)}/*!@:host([color=blue]) .modal*/[color=blue].sc-calcite-modal-h .modal.sc-calcite-modal{border-color:var(--calcite-ui-info)}/*!@:host([color=red]) .modal, :host([color=blue]) .modal*/[color=red].sc-calcite-modal-h .modal.sc-calcite-modal,[color=blue].sc-calcite-modal-h .modal.sc-calcite-modal{border-width:0px;border-top-width:4px;border-style:solid}/*!@:host([color=red]) .header, :host([color=blue]) .header*/[color=red].sc-calcite-modal-h .header.sc-calcite-modal,[color=blue].sc-calcite-modal-h .header.sc-calcite-modal{border-radius:0.25rem;border-bottom-right-radius:0px;border-bottom-left-radius:0px}@media screen and (max-width: 860px){/*!@slot[name=header]::slotted(*), *::slotted([slot=header])*/slot[name=header].sc-calcite-modal-s>*,*.sc-calcite-modal-s>[slot=header]{font-size:var(--calcite-font-size-1)}/*!@.footer*/.footer.sc-calcite-modal{position:-webkit-sticky;position:sticky;bottom:0px}}@media screen and (max-width: 480px){/*!@.footer*/.footer.sc-calcite-modal{-ms-flex-direction:column;flex-direction:column}/*!@.back, .secondary*/.back.sc-calcite-modal,.secondary.sc-calcite-modal{margin:0px;margin-bottom:0.25rem}}";
- const isFocusableExtended = (el) => {
- return isCalciteFocusable(el) || isFocusable(el);
- };
- const getFocusableElements = (el) => {
- return queryShadowRoot(el, isHidden, isFocusableExtended);
- };
- /**
- * @slot header - a slot for adding a modal header
- * @slot content - a slot for adding modal content
- * @slot primary - a slot for adding a primary button
- * @slot secondary - a slot for adding a secondary button
- * @slot back - a slot for adding a back button
- */
- class Modal {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteModalOpen = createEvent(this, "calciteModalOpen", 7);
- this.calciteModalClose = createEvent(this, "calciteModalClose", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** Add the active attribute to open the modal */
- this.active = false;
- /** Optionally pass a function to run before close */
- this.beforeClose = () => Promise.resolve();
- /** Disables the display a close button within the Modal */
- this.disableCloseButton = false;
- /** Disables the closing of the Modal when clicked outside. */
- this.disableOutsideClose = false;
- /** Aria label for the close button */
- this.intlClose = TEXT$b.close;
- /** Flag to disable the default close on escape behavior */
- this.disableEscape = false;
- /** specify the scale of modal, defaults to m */
- this.scale = "m";
- /** Set the width of the modal. Can use stock sizes or pass a number (in pixels) */
- this.width = "m";
- /** Background color of modal content */
- this.backgroundColor = "white";
- /** Turn off spacing around the content area slot */
- this.noPadding = false;
- //--------------------------------------------------------------------------
- //
- // Variables
- //
- //--------------------------------------------------------------------------
- this.hasFooter = true;
- this.mutationObserver = createObserver();
- this.activeTransitionProp = "opacity";
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- this.transitionEnd = (event) => {
- if (event.propertyName === this.activeTransitionProp) {
- this.active ? this.calciteModalOpen.emit() : this.calciteModalClose.emit();
- }
- };
- this.openEnd = () => {
- this.setFocus();
- this.el.removeEventListener("calciteModalOpen", this.openEnd);
- };
- this.handleOutsideClose = () => {
- if (this.disableOutsideClose) {
- return;
- }
- this.close();
- };
- /** Close the modal, first running the `beforeClose` method */
- this.close = () => {
- return this.beforeClose(this.el).then(() => {
- this.active = false;
- focusElement(this.previousActiveElement);
- this.removeOverflowHiddenClass();
- });
- };
- this.focusFirstElement = () => {
- focusElement(this.disableCloseButton ? getFocusableElements(this.el)[0] : this.closeButtonEl);
- };
- this.focusLastElement = () => {
- const focusableElements = getFocusableElements(this.el).filter((el) => !el.getAttribute("data-focus-fence"));
- if (focusableElements.length > 0) {
- focusElement(focusableElements[focusableElements.length - 1]);
- }
- else {
- focusElement(this.closeButtonEl);
- }
- };
- this.updateFooterVisibility = () => {
- this.hasFooter = !!getSlotted(this.el, [SLOTS$e.back, SLOTS$e.primary, SLOTS$e.secondary]);
- };
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentWillLoad() {
- // when modal initially renders, if active was set we need to open as watcher doesn't fire
- if (this.active) {
- this.open();
- }
- }
- connectedCallback() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });
- this.updateFooterVisibility();
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- var _a;
- this.removeOverflowHiddenClass();
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- disconnectConditionalSlotComponent(this);
- }
- render() {
- return (hAsync(Host, { "aria-describedby": this.contentId, "aria-labelledby": this.titleId, "aria-modal": "true", role: "dialog" }, hAsync("calcite-scrim", { class: CSS$n.scrim, onClick: this.handleOutsideClose }), this.renderStyle(), hAsync("div", { class: "modal", onTransitionEnd: this.transitionEnd }, hAsync("div", { "data-focus-fence": true, onFocus: this.focusLastElement, tabindex: "0" }), hAsync("div", { class: CSS$n.header }, this.renderCloseButton(), hAsync("header", { class: CSS$n.title }, hAsync("slot", { name: CSS$n.header }))), hAsync("div", { class: {
- content: true,
- "content--spaced": !this.noPadding,
- "content--no-footer": !this.hasFooter
- }, ref: (el) => (this.modalContent = el) }, hAsync("slot", { name: SLOTS$e.content })), this.renderFooter(), hAsync("div", { "data-focus-fence": true, onFocus: this.focusFirstElement, tabindex: "0" }))));
- }
- renderFooter() {
- return this.hasFooter ? (hAsync("div", { class: CSS$n.footer, key: "footer" }, hAsync("span", { class: CSS$n.back }, hAsync("slot", { name: SLOTS$e.back })), hAsync("span", { class: CSS$n.secondary }, hAsync("slot", { name: SLOTS$e.secondary })), hAsync("span", { class: CSS$n.primary }, hAsync("slot", { name: SLOTS$e.primary })))) : null;
- }
- renderCloseButton() {
- return !this.disableCloseButton ? (hAsync("button", { "aria-label": this.intlClose, class: CSS$n.close, key: "button", onClick: this.close, ref: (el) => (this.closeButtonEl = el), title: this.intlClose }, hAsync("calcite-icon", { icon: ICONS$6.close, scale: this.scale === "s" ? "s" : this.scale === "m" ? "m" : this.scale === "l" ? "l" : null }))) : null;
- }
- renderStyle() {
- const hasCustomWidth = !isNaN(parseInt(`${this.width}`));
- return hasCustomWidth ? (hAsync("style", null, `
- .modal {
- max-width: ${this.width}px !important;
- }
- @media screen and (max-width: ${this.width}px) {
- .modal {
- height: 100% !important;
- max-height: 100% !important;
- width: 100% !important;
- max-width: 100% !important;
- margin: 0 !important;
- border-radius: 0 !important;
- }
- .content {
- flex: 1 1 auto !important;
- max-height: unset !important;
- }
- }
- `)) : null;
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- handleEscape(e) {
- if (this.active && !this.disableEscape && e.key === "Escape") {
- this.close();
- }
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /**
- * Focus first interactive element
- * @deprecated use `setFocus` instead.
- */
- async focusElement(el) {
- if (el) {
- el.focus();
- }
- return this.setFocus();
- }
- /**
- * Sets focus on the component.
- *
- * By default, will try to focus on any focusable content. If there is none, it will focus on the close button.
- * If you want to focus on the close button, you can use the `close-button` focus ID.
- */
- async setFocus(focusId) {
- const closeButton = this.closeButtonEl;
- return focusElement(focusId === "close-button" ? closeButton : getFocusableElements(this.el)[0] || closeButton);
- }
- /** Set the scroll top of the modal content */
- async scrollContent(top = 0, left = 0) {
- if (this.modalContent) {
- if (this.modalContent.scrollTo) {
- this.modalContent.scrollTo({ top, left, behavior: "smooth" });
- }
- else {
- this.modalContent.scrollTop = top;
- this.modalContent.scrollLeft = left;
- }
- }
- }
- async toggleModal(value, oldValue) {
- if (value !== oldValue) {
- if (value) {
- this.open();
- }
- else if (!value) {
- this.close();
- }
- }
- }
- /** Open the modal */
- open() {
- this.previousActiveElement = document.activeElement;
- this.el.addEventListener("calciteModalOpen", this.openEnd);
- this.active = true;
- const titleEl = getSlotted(this.el, SLOTS$e.header);
- const contentEl = getSlotted(this.el, SLOTS$e.content);
- this.titleId = ensureId(titleEl);
- this.contentId = ensureId(contentEl);
- document.documentElement.classList.add(CSS$n.overflowHidden);
- }
- removeOverflowHiddenClass() {
- document.documentElement.classList.remove(CSS$n.overflowHidden);
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "active": ["toggleModal"]
- }; }
- static get style() { return modalCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-modal",
- "$members$": {
- "active": [1540],
- "beforeClose": [16],
- "disableCloseButton": [4, "disable-close-button"],
- "disableOutsideClose": [4, "disable-outside-close"],
- "intlClose": [1, "intl-close"],
- "docked": [516],
- "firstFocus": [16],
- "disableEscape": [4, "disable-escape"],
- "scale": [513],
- "width": [520],
- "fullscreen": [516],
- "color": [513],
- "backgroundColor": [513, "background-color"],
- "noPadding": [4, "no-padding"],
- "hasFooter": [32],
- "focusElement": [64],
- "setFocus": [64],
- "scrollContent": [64]
- },
- "$listeners$": [[8, "keyup", "handleEscape"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["active", "active"], ["docked", "docked"], ["scale", "scale"], ["width", "width"], ["fullscreen", "fullscreen"], ["color", "color"], ["backgroundColor", "background-color"]]
- }; }
- }
- const TEXT$a = {
- close: "Close"
- };
- const SLOTS$d = {
- title: "title",
- message: "message",
- link: "link",
- actionsEnd: "actions-end"
- };
- const CSS$m = {
- actionsEnd: "actions-end",
- close: "notice-close",
- container: "container",
- content: "notice-content",
- icon: "notice-icon"
- };
- const noticeCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-notice:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-notice{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-notice{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-notice{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-notice{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-notice{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-notice:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-notice-h{display:none}/*!@:host([scale=s])*/[scale=s].sc-calcite-notice-h{--calcite-notice-spacing-token-small:0.5rem;--calcite-notice-spacing-token-large:0.75rem}/*!@:host([scale=s]) .container slot[name=title]::slotted(*), :host([scale=s]) .container *::slotted([slot=title])*/.sc-calcite-notice-h[scale=s] .container slot[name=title].sc-calcite-notice-s>*,.sc-calcite-notice-h[scale=s] .container *.sc-calcite-notice-s>[slot=title]{margin-top:0.125rem;margin-bottom:0.125rem;font-size:var(--calcite-font-size--1);line-height:1.375}/*!@:host([scale=s]) .container slot[name=message]::slotted(*), :host([scale=s]) .container *::slotted([slot=message])*/.sc-calcite-notice-h[scale=s] .container slot[name=message].sc-calcite-notice-s>*,.sc-calcite-notice-h[scale=s] .container *.sc-calcite-notice-s>[slot=message]{margin-top:0.125rem;margin-bottom:0.125rem;font-size:var(--calcite-font-size--2);line-height:1.375}/*!@:host([scale=s]) ::slotted(calcite-link)*/.sc-calcite-notice-h[scale=s] .sc-calcite-notice-s>calcite-link{margin-top:0.125rem;margin-bottom:0.125rem;font-size:var(--calcite-font-size--2);line-height:1.375}/*!@:host([scale=s]) .notice-close*/[scale=s].sc-calcite-notice-h .notice-close.sc-calcite-notice{padding:0.5rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-notice-h{--calcite-notice-spacing-token-small:0.75rem;--calcite-notice-spacing-token-large:1rem}/*!@:host([scale=m]) .container slot[name=title]::slotted(*), :host([scale=m]) .container *::slotted([slot=title])*/.sc-calcite-notice-h[scale=m] .container slot[name=title].sc-calcite-notice-s>*,.sc-calcite-notice-h[scale=m] .container *.sc-calcite-notice-s>[slot=title]{margin-top:0.125rem;margin-bottom:0.125rem;font-size:var(--calcite-font-size-0);line-height:1.375}/*!@:host([scale=m]) .container slot[name=message]::slotted(*), :host([scale=m]) .container *::slotted([slot=message])*/.sc-calcite-notice-h[scale=m] .container slot[name=message].sc-calcite-notice-s>*,.sc-calcite-notice-h[scale=m] .container *.sc-calcite-notice-s>[slot=message]{margin-top:0.125rem;margin-bottom:0.125rem;font-size:var(--calcite-font-size--1);line-height:1.375}/*!@:host([scale=m]) ::slotted(calcite-link)*/.sc-calcite-notice-h[scale=m] .sc-calcite-notice-s>calcite-link{margin-top:0.125rem;margin-bottom:0.125rem;font-size:var(--calcite-font-size--1);line-height:1.375}/*!@:host([scale=l])*/[scale=l].sc-calcite-notice-h{--calcite-notice-spacing-token-small:1rem;--calcite-notice-spacing-token-large:1.25rem}/*!@:host([scale=l]) .container slot[name=title]::slotted(*), :host([scale=l]) .container *::slotted([slot=title])*/.sc-calcite-notice-h[scale=l] .container slot[name=title].sc-calcite-notice-s>*,.sc-calcite-notice-h[scale=l] .container *.sc-calcite-notice-s>[slot=title]{margin-top:0.125rem;margin-bottom:0.125rem;font-size:var(--calcite-font-size-1);line-height:1.375}/*!@:host([scale=l]) .container slot[name=message]::slotted(*), :host([scale=l]) .container *::slotted([slot=message])*/.sc-calcite-notice-h[scale=l] .container slot[name=message].sc-calcite-notice-s>*,.sc-calcite-notice-h[scale=l] .container *.sc-calcite-notice-s>[slot=message]{margin-top:0.125rem;margin-bottom:0.125rem;font-size:var(--calcite-font-size-0);line-height:1.375}/*!@:host([scale=l]) ::slotted(calcite-link)*/.sc-calcite-notice-h[scale=l] .sc-calcite-notice-s>calcite-link{margin-top:0.125rem;margin-bottom:0.125rem;font-size:var(--calcite-font-size-0);line-height:1.375}/*!@:host([width=auto])*/[width=auto].sc-calcite-notice-h{--calcite-notice-width:auto}/*!@:host([width=half])*/[width=half].sc-calcite-notice-h{--calcite-notice-width:50%}/*!@:host([width=full])*/[width=full].sc-calcite-notice-h{--calcite-notice-width:100%}/*!@:host*/.sc-calcite-notice-h{margin-left:auto;margin-right:auto;display:none;max-width:100%;-ms-flex-align:center;align-items:center;width:var(--calcite-notice-width)}/*!@.container*/.container.sc-calcite-notice{pointer-events:none;margin-top:0px;margin-bottom:0px;-webkit-box-sizing:border-box;box-sizing:border-box;display:none;width:100%;background-color:var(--calcite-ui-foreground-1);opacity:0;max-height:0;text-align:start;-webkit-transition:var(--calcite-animation-timing);transition:var(--calcite-animation-timing);-webkit-border-start:0px solid;border-inline-start:0px solid;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent}/*!@.notice-close*/.notice-close.sc-calcite-notice{outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@.notice-close:focus*/.notice-close.sc-calcite-notice:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@:host*/.sc-calcite-notice-h{display:-ms-flexbox;display:flex}/*!@:host([active]) .container*/[active].sc-calcite-notice-h .container.sc-calcite-notice{pointer-events:auto;display:-ms-flexbox;display:flex;max-height:100%;-ms-flex-align:center;align-items:center;border-width:2px;opacity:1;--tw-shadow:0 4px 8px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.04);--tw-shadow-colored:0 4px 8px -1px var(--tw-shadow-color), 0 2px 4px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@.container slot[name=title]::slotted(*), .container *::slotted([slot=title])*/.container slot[name=title].sc-calcite-notice-s>*,.container *.sc-calcite-notice-s>[slot=title]{margin:0px;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1)}/*!@.container slot[name=message]::slotted(*), .container *::slotted([slot=message])*/.container slot[name=message].sc-calcite-notice-s>*,.container *.sc-calcite-notice-s>[slot=message]{margin:0px;display:inline;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-2);-webkit-margin-end:var(--calcite-notice-spacing-token-small);margin-inline-end:var(--calcite-notice-spacing-token-small)}/*!@.notice-content*/.notice-content.sc-calcite-notice{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;padding:var(--calcite-notice-spacing-token-small) var(--calcite-notice-spacing-token-large);-ms-flex:0 0 auto;flex:0 0 auto;display:-ms-flexbox;display:flex;min-width:0px;-ms-flex-direction:column;flex-direction:column;overflow-wrap:break-word;-ms-flex:1 1 0px;flex:1 1 0;padding-block:var(--calcite-notice-spacing-token-small);padding-inline:0 var(--calcite-notice-spacing-token-small)}/*!@.notice-content:first-of-type:not(:only-child)*/.notice-content.sc-calcite-notice:first-of-type:not(:only-child){-webkit-padding-start:var(--calcite-notice-spacing-token-large);padding-inline-start:var(--calcite-notice-spacing-token-large)}/*!@.notice-content:only-of-type*/.notice-content.sc-calcite-notice:only-of-type{padding:var(--calcite-notice-spacing-token-small) var(--calcite-notice-spacing-token-large)}/*!@.notice-icon*/.notice-icon.sc-calcite-notice{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;padding:var(--calcite-notice-spacing-token-small) var(--calcite-notice-spacing-token-large);-ms-flex:0 0 auto;flex:0 0 auto}/*!@.notice-close*/.notice-close.sc-calcite-notice{display:-ms-flexbox;display:flex;cursor:pointer;-ms-flex-align:center;align-items:center;-ms-flex-item-align:stretch;align-self:stretch;border-style:none;background-color:transparent;color:var(--calcite-ui-text-3);outline:2px solid transparent;outline-offset:2px;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;padding:var(--calcite-notice-spacing-token-small) var(--calcite-notice-spacing-token-large);-ms-flex:0 0 auto;flex:0 0 auto;-webkit-appearance:none}/*!@.notice-close:hover, .notice-close:focus*/.notice-close.sc-calcite-notice:hover,.notice-close.sc-calcite-notice:focus{background-color:var(--calcite-ui-foreground-2);color:var(--calcite-ui-text-1)}/*!@.notice-close:active*/.notice-close.sc-calcite-notice:active{background-color:var(--calcite-ui-foreground-3)}/*!@.actions-end*/.actions-end.sc-calcite-notice{display:-ms-flexbox;display:flex;-ms-flex-item-align:stretch;align-self:stretch}/*!@:host([color=blue]) .container*/[color=blue].sc-calcite-notice-h .container.sc-calcite-notice{border-color:var(--calcite-ui-brand)}/*!@:host([color=blue]) .container .notice-icon*/[color=blue].sc-calcite-notice-h .container.sc-calcite-notice .notice-icon.sc-calcite-notice{color:var(--calcite-ui-brand)}/*!@:host([color=red]) .container*/[color=red].sc-calcite-notice-h .container.sc-calcite-notice{border-color:var(--calcite-ui-danger)}/*!@:host([color=red]) .container .notice-icon*/[color=red].sc-calcite-notice-h .container.sc-calcite-notice .notice-icon.sc-calcite-notice{color:var(--calcite-ui-danger)}/*!@:host([color=yellow]) .container*/[color=yellow].sc-calcite-notice-h .container.sc-calcite-notice{border-color:var(--calcite-ui-warning)}/*!@:host([color=yellow]) .container .notice-icon*/[color=yellow].sc-calcite-notice-h .container.sc-calcite-notice .notice-icon.sc-calcite-notice{color:var(--calcite-ui-warning)}/*!@:host([color=green]) .container*/[color=green].sc-calcite-notice-h .container.sc-calcite-notice{border-color:var(--calcite-ui-success)}/*!@:host([color=green]) .container .notice-icon*/[color=green].sc-calcite-notice-h .container.sc-calcite-notice .notice-icon.sc-calcite-notice{color:var(--calcite-ui-success)}";
- /** Notices are intended to be used to present users with important-but-not-crucial contextual tips or copy. Because
- * notices are displayed inline, a common use case is displaying them on page-load to present users with short hints or contextual copy.
- * They are optionally dismissible - useful for keeping track of whether or not a user has dismissed the notice. You can also choose not
- * to display a notice on page load and set the "active" attribute as needed to contextually provide inline messaging to users.
- */
- /**
- * @slot title - Title of the notice (optional)
- * @slot message - Main text of the notice
- * @slot link - Optional action to take from the notice (undo, try again, link to page, etc.)
- * @slot actions-end - Allows adding a `calcite-action` at the end of the notice. It is recommended to use 2 or less actions.
- */
- class Notice {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteNoticeClose = createEvent(this, "calciteNoticeClose", 7);
- this.calciteNoticeOpen = createEvent(this, "calciteNoticeOpen", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //---------------------------------------------------------------------------
- /** Is the notice currently active or not */
- this.active = false;
- /** Color for the notice (will apply to top border and icon) */
- this.color = "blue";
- /** Optionally show a button the user can click to dismiss the notice */
- this.dismissible = false;
- /** String for the close button.
- * @default "Close"
- */
- this.intlClose = TEXT$a.close;
- /** specify the scale of the notice, defaults to m */
- this.scale = "m";
- /** specify the width of the notice, defaults to auto */
- this.width = "auto";
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- this.close = () => {
- this.active = false;
- this.calciteNoticeClose.emit();
- };
- }
- updateRequestedIcon() {
- this.requestedIcon = setRequestedIcon(StatusIcons, this.icon, this.color);
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- disconnectConditionalSlotComponent(this);
- }
- componentWillLoad() {
- this.requestedIcon = setRequestedIcon(StatusIcons, this.icon, this.color);
- }
- render() {
- const { el } = this;
- const closeButton = (hAsync("button", { "aria-label": this.intlClose, class: CSS$m.close, onClick: this.close, ref: (el) => (this.closeButton = el) }, hAsync("calcite-icon", { icon: "x", scale: this.scale === "l" ? "m" : "s" })));
- const hasActionEnd = getSlotted(el, SLOTS$d.actionsEnd);
- return (hAsync("div", { class: CSS$m.container }, this.requestedIcon ? (hAsync("div", { class: CSS$m.icon }, hAsync("calcite-icon", { icon: this.requestedIcon, scale: this.scale === "l" ? "m" : "s" }))) : null, hAsync("div", { class: CSS$m.content }, hAsync("slot", { name: SLOTS$d.title }), hAsync("slot", { name: SLOTS$d.message }), hAsync("slot", { name: SLOTS$d.link })), hasActionEnd ? (hAsync("div", { class: CSS$m.actionsEnd }, hAsync("slot", { name: SLOTS$d.actionsEnd }))) : null, this.dismissible ? closeButton : null));
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- const noticeLinkEl = this.el.querySelector("calcite-link");
- if (!this.closeButton && !noticeLinkEl) {
- return;
- }
- if (noticeLinkEl) {
- noticeLinkEl.setFocus();
- }
- else if (this.closeButton) {
- this.closeButton.focus();
- }
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "icon": ["updateRequestedIcon"],
- "color": ["updateRequestedIcon"]
- }; }
- static get style() { return noticeCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-notice",
- "$members$": {
- "active": [1540],
- "color": [513],
- "dismissible": [516],
- "icon": [520],
- "intlClose": [1, "intl-close"],
- "scale": [513],
- "width": [513],
- "setFocus": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["active", "active"], ["color", "color"], ["dismissible", "dismissible"], ["icon", "icon"], ["scale", "scale"], ["width", "width"]]
- }; }
- }
- const optionCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-option:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-option{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-option{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-option{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-option{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-option{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-option:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-option-h{display:none}/*!@:host*/.sc-calcite-option-h{display:block}";
- class Option {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteOptionChange = createEvent(this, "calciteOptionChange", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /**
- * When true, it prevents the option from being selected.
- */
- this.disabled = false;
- this.mutationObserver = createObserver();
- }
- handlePropChange(_newValue, _oldValue, propName) {
- if (propName === "label" || propName === "value") {
- this.ensureTextContentDependentProps();
- }
- this.calciteOptionChange.emit();
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- ensureTextContentDependentProps() {
- const { el: { textContent } } = this;
- if (!this.label || this.label === this.internallySetLabel) {
- this.label = textContent;
- this.internallySetLabel = textContent;
- }
- if (!this.value || this.value === this.internallySetValue) {
- this.value = textContent;
- this.internallySetValue = textContent;
- }
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- var _a;
- this.ensureTextContentDependentProps();
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, {
- attributeFilter: ["label", "value"],
- characterData: true,
- childList: true,
- subtree: true
- });
- }
- disconnectedCallback() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- }
- //--------------------------------------------------------------------------
- //
- // Render Methods
- //
- //--------------------------------------------------------------------------
- render() {
- return hAsync("slot", null, this.label);
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "disabled": ["handlePropChange"],
- "label": ["handlePropChange"],
- "selected": ["handlePropChange"],
- "value": ["handlePropChange"]
- }; }
- static get style() { return optionCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-option",
- "$members$": {
- "disabled": [516],
- "label": [1025],
- "selected": [516],
- "value": [1032]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"], ["selected", "selected"]]
- }; }
- }
- const optionGroupCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-option-group:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-option-group{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-option-group{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-option-group{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-option-group{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-option-group{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-option-group:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-option-group-h{display:none}/*!@:host*/.sc-calcite-option-group-h{display:block}";
- /**
- * @slot - A slot for adding `calcite-option`s.
- */
- class OptionGroup {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteOptionGroupChange = createEvent(this, "calciteOptionGroupChange", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /**
- * When true, it prevents selection from any of its associated options.
- */
- this.disabled = false;
- }
- handlePropChange() {
- this.calciteOptionGroupChange.emit();
- }
- //--------------------------------------------------------------------------
- //
- // Render Methods
- //
- //--------------------------------------------------------------------------
- render() {
- return (hAsync(Fragment, null, hAsync("div", null, this.label), hAsync("slot", null)));
- }
- static get watchers() { return {
- "disabled": ["handlePropChange"],
- "label": ["handlePropChange"]
- }; }
- static get style() { return optionGroupCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-option-group",
- "$members$": {
- "disabled": [516],
- "label": [1]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"]]
- }; }
- }
- const CSS$l = {
- page: "page",
- selected: "is-selected",
- previous: "previous",
- next: "next",
- disabled: "is-disabled",
- ellipsis: "ellipsis",
- ellipsisStart: "ellipsis--start",
- ellipsisEnd: "ellipsis--end"
- };
- const TEXT$9 = {
- nextLabel: "Next",
- previousLabel: "Previous"
- };
- const paginationCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-pagination:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-pagination{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-pagination{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-pagination{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-pagination{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-pagination{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-pagination:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-pagination-h{display:none}/*!@:host([scale=s])*/[scale=s].sc-calcite-pagination-h{--calcite-pagination-spacing:0.25rem 0.5rem}/*!@:host([scale=s]) .previous, :host([scale=s]) .next, :host([scale=s]) .page*/[scale=s].sc-calcite-pagination-h .previous.sc-calcite-pagination,[scale=s].sc-calcite-pagination-h .next.sc-calcite-pagination,[scale=s].sc-calcite-pagination-h .page.sc-calcite-pagination{height:1.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=s]) .previous, :host([scale=s]) .next*/[scale=s].sc-calcite-pagination-h .previous.sc-calcite-pagination,[scale=s].sc-calcite-pagination-h .next.sc-calcite-pagination{padding-left:0.25rem;padding-right:0.25rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-pagination-h{--calcite-pagination-spacing:0.5rem 0.75rem}/*!@:host([scale=m]) .previous, :host([scale=m]) .next, :host([scale=m]) .page*/[scale=m].sc-calcite-pagination-h .previous.sc-calcite-pagination,[scale=m].sc-calcite-pagination-h .next.sc-calcite-pagination,[scale=m].sc-calcite-pagination-h .page.sc-calcite-pagination{height:2rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=m]) .previous, :host([scale=m]) .next*/[scale=m].sc-calcite-pagination-h .previous.sc-calcite-pagination,[scale=m].sc-calcite-pagination-h .next.sc-calcite-pagination{padding-left:0.5rem;padding-right:0.5rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-pagination-h{--calcite-pagination-spacing:0.75rem 1rem}/*!@:host([scale=l]) .previous, :host([scale=l]) .next, :host([scale=l]) .page*/[scale=l].sc-calcite-pagination-h .previous.sc-calcite-pagination,[scale=l].sc-calcite-pagination-h .next.sc-calcite-pagination,[scale=l].sc-calcite-pagination-h .page.sc-calcite-pagination{height:2.75rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host([scale=l]) .previous, :host([scale=l]) .next*/[scale=l].sc-calcite-pagination-h .previous.sc-calcite-pagination,[scale=l].sc-calcite-pagination-h .next.sc-calcite-pagination{padding-left:1rem;padding-right:1rem}/*!@:host*/.sc-calcite-pagination-h{display:-ms-flexbox;display:flex;-webkit-writing-mode:horizontal-tb;-ms-writing-mode:lr-tb;writing-mode:horizontal-tb}/*!@:host button*/.sc-calcite-pagination-h button.sc-calcite-pagination{outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@:host button:focus*/.sc-calcite-pagination-h button.sc-calcite-pagination:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@.previous, .next, .page*/.previous.sc-calcite-pagination,.next.sc-calcite-pagination,.page.sc-calcite-pagination{-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;cursor:pointer;-ms-flex-align:center;align-items:center;border-style:none;--tw-border-opacity:0;background-color:transparent;font-family:inherit;font-size:var(--calcite-font-size-0);line-height:1.25rem;color:var(--calcite-ui-text-3);border-top:2px solid transparent;border-bottom:2px solid transparent}/*!@.previous:hover, .next:hover, .page:hover*/.previous.sc-calcite-pagination:hover,.next.sc-calcite-pagination:hover,.page.sc-calcite-pagination:hover{color:var(--calcite-ui-text-1);-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s}/*!@.page:hover*/.page.sc-calcite-pagination:hover{border-bottom-color:var(--calcite-ui-border-2)}/*!@.page.is-selected*/.page.is-selected.sc-calcite-pagination{font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1);border-bottom-color:var(--calcite-ui-brand)}/*!@.previous:hover, .next:hover*/.previous.sc-calcite-pagination:hover,.next.sc-calcite-pagination:hover{background-color:var(--calcite-ui-foreground-2);color:var(--calcite-ui-brand)}/*!@.previous:active, .next:active*/.previous.sc-calcite-pagination:active,.next.sc-calcite-pagination:active{background-color:var(--calcite-ui-foreground-3)}/*!@.previous.is-disabled, .next.is-disabled*/.previous.is-disabled.sc-calcite-pagination,.next.is-disabled.sc-calcite-pagination{pointer-events:none;background-color:transparent}/*!@.previous.is-disabled > calcite-icon, .next.is-disabled > calcite-icon*/.previous.is-disabled.sc-calcite-pagination>calcite-icon.sc-calcite-pagination,.next.is-disabled.sc-calcite-pagination>calcite-icon.sc-calcite-pagination{opacity:var(--calcite-ui-opacity-disabled)}/*!@.next*/.next.sc-calcite-pagination{margin-right:0px}/*!@.page,\n.ellipsis*/.page.sc-calcite-pagination,.ellipsis.sc-calcite-pagination{padding:var(--calcite-pagination-spacing)}/*!@.ellipsis*/.ellipsis.sc-calcite-pagination{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;color:var(--calcite-ui-text-3)}";
- const maxPagesDisplayed = 5;
- class Pagination {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calcitePaginationUpdate = createEvent(this, "calcitePaginationUpdate", 7);
- this.calcitePaginationChange = createEvent(this, "calcitePaginationChange", 7);
- //--------------------------------------------------------------------------
- //
- // Public Properties
- //
- //--------------------------------------------------------------------------
- /** number of items per page */
- this.num = 20;
- /** index of item that should begin the page */
- this.start = 1;
- /** total number of items */
- this.total = 0;
- /** Used as an accessible label (aria-label) for the next button
- * @default "Next"
- */
- this.textLabelNext = TEXT$9.nextLabel;
- /** Used as an accessible label (aria-label) of the previous button
- * @default "Previous"
- */
- this.textLabelPrevious = TEXT$9.previousLabel;
- /** The scale of the pagination */
- this.scale = "m";
- this.previousClicked = () => {
- this.previousPage().then();
- this.emitUpdate();
- };
- this.nextClicked = () => {
- this.nextPage();
- this.emitUpdate();
- };
- }
- // --------------------------------------------------------------------------
- //
- // Public Methods
- //
- // --------------------------------------------------------------------------
- /** Go to the next page of results */
- async nextPage() {
- this.start = Math.min(this.getLastStart(), this.start + this.num);
- }
- /** Go to the previous page of results */
- async previousPage() {
- this.start = Math.max(1, this.start - this.num);
- }
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- getLastStart() {
- const { total, num } = this;
- const lastStart = total % num === 0 ? total - num : Math.floor(total / num) * num;
- return lastStart + 1;
- }
- showLeftEllipsis() {
- return Math.floor(this.start / this.num) > 3;
- }
- showRightEllipsis() {
- return (this.total - this.start) / this.num > 3;
- }
- emitUpdate() {
- const changePayload = {
- start: this.start,
- total: this.total,
- num: this.num
- };
- this.calcitePaginationChange.emit(changePayload);
- this.calcitePaginationUpdate.emit(changePayload);
- }
- //--------------------------------------------------------------------------
- //
- // Render Methods
- //
- //--------------------------------------------------------------------------
- renderPages() {
- const lastStart = this.getLastStart();
- let end;
- let nextStart;
- // if we don't need ellipses render the whole set
- if (this.total / this.num <= maxPagesDisplayed) {
- nextStart = 1 + this.num;
- end = lastStart - this.num;
- }
- else {
- // if we're within max pages of page 1
- if (this.start / this.num < maxPagesDisplayed - 1) {
- nextStart = 1 + this.num;
- end = 1 + 4 * this.num;
- }
- else {
- // if we're within max pages of last page
- if (this.start + 3 * this.num >= this.total) {
- nextStart = lastStart - 4 * this.num;
- end = lastStart - this.num;
- }
- else {
- nextStart = this.start - this.num;
- end = this.start + this.num;
- }
- }
- }
- const pages = [];
- while (nextStart <= end) {
- pages.push(nextStart);
- nextStart = nextStart + this.num;
- }
- return pages.map((page) => this.renderPage(page));
- }
- renderPage(start) {
- const page = Math.floor(start / this.num) + (this.num === 1 ? 0 : 1);
- return (hAsync("button", { class: {
- [CSS$l.page]: true,
- [CSS$l.selected]: start === this.start
- }, onClick: () => {
- this.start = start;
- this.emitUpdate();
- } }, page));
- }
- renderLeftEllipsis() {
- if (this.total / this.num > maxPagesDisplayed && this.showLeftEllipsis()) {
- return hAsync("span", { class: `${CSS$l.ellipsis} ${CSS$l.ellipsisStart}` }, "\u2026");
- }
- }
- renderRightEllipsis() {
- if (this.total / this.num > maxPagesDisplayed && this.showRightEllipsis()) {
- return hAsync("span", { class: `${CSS$l.ellipsis} ${CSS$l.ellipsisEnd}` }, "\u2026");
- }
- }
- render() {
- const { total, num, start } = this;
- const prevDisabled = num === 1 ? start <= num : start < num;
- const nextDisabled = num === 1 ? start + num > total : start + num > total;
- return (hAsync(Fragment, null, hAsync("button", { "aria-label": this.textLabelPrevious, class: {
- [CSS$l.previous]: true,
- [CSS$l.disabled]: prevDisabled
- }, disabled: prevDisabled, onClick: this.previousClicked }, hAsync("calcite-icon", { flipRtl: true, icon: "chevronLeft", scale: "s" })), total > num ? this.renderPage(1) : null, this.renderLeftEllipsis(), this.renderPages(), this.renderRightEllipsis(), this.renderPage(this.getLastStart()), hAsync("button", { "aria-label": this.textLabelNext, class: {
- [CSS$l.next]: true,
- [CSS$l.disabled]: nextDisabled
- }, disabled: nextDisabled, onClick: this.nextClicked }, hAsync("calcite-icon", { flipRtl: true, icon: "chevronRight", scale: "s" }))));
- }
- get el() { return getElement(this); }
- static get style() { return paginationCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-pagination",
- "$members$": {
- "num": [2],
- "start": [1026],
- "total": [2],
- "textLabelNext": [1, "text-label-next"],
- "textLabelPrevious": [1, "text-label-previous"],
- "scale": [513],
- "nextPage": [64],
- "previousPage": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["scale", "scale"]]
- }; }
- }
- const CSS$k = {
- backButton: "back-button",
- container: "container",
- header: "header",
- heading: "heading",
- summary: "summary",
- headerContent: "header-content",
- headerActions: "header-actions",
- headerActionsEnd: "header-actions--end",
- headerActionsStart: "header-actions--start",
- contentWrapper: "content-wrapper",
- contentContainer: "content-container",
- contentHeight: "content-height",
- fabContainer: "fab-container",
- footer: "footer",
- menuContainer: "menu-container",
- menuButton: "menu-button",
- menu: "menu",
- menuOpen: "menu--open"
- };
- const ICONS$5 = {
- close: "x",
- menu: "ellipsis",
- backLeft: "chevron-left",
- backRight: "chevron-right"
- };
- const SLOTS$c = {
- headerActionsStart: "header-actions-start",
- headerActionsEnd: "header-actions-end",
- headerMenuActions: "header-menu-actions",
- headerContent: "header-content",
- fab: "fab",
- footer: "footer",
- footerActions: "footer-actions"
- };
- const TEXT$8 = {
- back: "Back",
- close: "Close",
- open: "Open",
- options: "Options"
- };
- const HEADING_LEVEL$4 = 3;
- const panelCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-panel:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-panel{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-panel{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-panel{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-panel{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-panel{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:host*/.sc-calcite-panel-h{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}/*!@:host **/.sc-calcite-panel-h *.sc-calcite-panel{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:root*/.sc-calcite-panel:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-panel-h{display:none}/*!@:host*/.sc-calcite-panel-h{position:relative;display:-ms-flexbox;display:flex;width:100%;-ms-flex:1 1 auto;flex:1 1 auto;overflow:hidden;--calcite-min-header-height:calc(var(--calcite-icon-size) * 3);--calcite-panel-max-height:unset;--calcite-panel-width:100%;--calcite-panel-min-width:unset;--calcite-panel-max-width:unset}/*!@:host([disabled])*/[disabled].sc-calcite-panel-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-panel-h[disabled] .sc-calcite-panel-s>[calcite-hydrated][disabled],[disabled].sc-calcite-panel-h [calcite-hydrated][disabled].sc-calcite-panel{opacity:1}/*!@.header*/.header.sc-calcite-panel{margin:0px;display:-ms-flexbox;display:flex;-ms-flex-line-pack:justify;align-content:space-between;-ms-flex-align:center;align-items:center;fill:var(--calcite-ui-text-2);color:var(--calcite-ui-text-2)}/*!@.heading*/.heading.sc-calcite-panel{margin:0px;padding:0px;font-weight:var(--calcite-font-weight-medium)}/*!@.header .heading*/.header.sc-calcite-panel .heading.sc-calcite-panel{-ms-flex:1 1 auto;flex:1 1 auto;padding:0.5rem}/*!@h1.heading*/h1.heading.sc-calcite-panel{font-size:var(--calcite-font-size-2);line-height:1.5rem}/*!@h2.heading*/h2.heading.sc-calcite-panel{font-size:var(--calcite-font-size-1);line-height:1.5rem}/*!@h3.heading*/h3.heading.sc-calcite-panel{font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@h4.heading, h5.heading*/h4.heading.sc-calcite-panel,h5.heading.sc-calcite-panel{font-size:var(--calcite-font-size--1);line-height:1rem}/*!@.container*/.container.sc-calcite-panel{margin:0px;display:-ms-flexbox;display:flex;width:100%;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:stretch;align-items:stretch;background-color:var(--calcite-ui-background);padding:0px;max-height:var(--calcite-panel-max-height);width:var(--calcite-panel-width);max-width:var(--calcite-panel-max-width);min-width:var(--calcite-panel-min-width);-webkit-transition:max-height var(--calcite-animation-timing), width var(--calcite-animation-timing);transition:max-height var(--calcite-animation-timing), width var(--calcite-animation-timing)}/*!@:host([height-scale=s])*/[height-scale=s].sc-calcite-panel-h{--calcite-panel-max-height:40vh}/*!@:host([height-scale=m])*/[height-scale=m].sc-calcite-panel-h{--calcite-panel-max-height:60vh}/*!@:host([height-scale=l])*/[height-scale=l].sc-calcite-panel-h{--calcite-panel-max-height:80vh}/*!@:host([width-scale=s])*/[width-scale=s].sc-calcite-panel-h{--calcite-panel-width:calc(var(--calcite-panel-width-multiplier) * 12vw);--calcite-panel-max-width:calc(var(--calcite-panel-width-multiplier) * 300px);--calcite-panel-min-width:calc(var(--calcite-panel-width-multiplier) * 150px)}/*!@:host([width-scale=m])*/[width-scale=m].sc-calcite-panel-h{--calcite-panel-width:calc(var(--calcite-panel-width-multiplier) * 20vw);--calcite-panel-max-width:calc(var(--calcite-panel-width-multiplier) * 420px);--calcite-panel-min-width:calc(var(--calcite-panel-width-multiplier) * 240px)}/*!@:host([width-scale=l])*/[width-scale=l].sc-calcite-panel-h{--calcite-panel-width:calc(var(--calcite-panel-width-multiplier) * 45vw);--calcite-panel-max-width:calc(var(--calcite-panel-width-multiplier) * 680px);--calcite-panel-min-width:calc(var(--calcite-panel-width-multiplier) * 340px)}/*!@.container[hidden]*/.container[hidden].sc-calcite-panel{display:none}/*!@:host([loading]) .container, :host([disabled]) .container*/[loading].sc-calcite-panel-h .container.sc-calcite-panel,[disabled].sc-calcite-panel-h .container.sc-calcite-panel{position:relative}/*!@.header*/.header.sc-calcite-panel{border-bottom:1px solid;position:-webkit-sticky;position:sticky;top:0px;width:100%;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:start;justify-content:flex-start;background-color:var(--calcite-ui-foreground-1);border-bottom-color:var(--calcite-ui-border-3);-ms-flex:0 0 auto;flex:0 0 auto}/*!@.header-content*/.header-content.sc-calcite-panel{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;overflow:hidden;padding-left:0.75rem;padding-right:0.75rem;padding-top:0.875rem;padding-bottom:0.875rem;-webkit-margin-end:auto;margin-inline-end:auto}/*!@.header-content .heading, .header-content .summary*/.header-content.sc-calcite-panel .heading.sc-calcite-panel,.header-content.sc-calcite-panel .summary.sc-calcite-panel{display:block;overflow-wrap:break-word;padding:0px}/*!@.header-content .heading*/.header-content.sc-calcite-panel .heading.sc-calcite-panel{margin-left:0px;margin-right:0px;margin-top:0px;margin-bottom:0.25rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;font-weight:var(--calcite-font-weight-medium)}/*!@.header-content .heading:only-child*/.header-content.sc-calcite-panel .heading.sc-calcite-panel:only-child{margin-bottom:0px}/*!@.header-content .summary*/.header-content.sc-calcite-panel .summary.sc-calcite-panel{font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-ui-text-2)}/*!@.back-button*/.back-button.sc-calcite-panel{border-width:0px;border-style:solid;border-color:var(--calcite-ui-border-3);border-inline-end-width:1px}/*!@.header-actions*/.header-actions.sc-calcite-panel{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-align:stretch;align-items:stretch}/*!@.header-actions--end,\n.menu-container:only-child*/.header-actions--end.sc-calcite-panel,.menu-container.sc-calcite-panel:only-child{-webkit-margin-start:auto;margin-inline-start:auto}/*!@.menu-button*/.menu-button.sc-calcite-panel{position:relative;height:100%;-ms-flex:0 1 auto;flex:0 1 auto;-ms-flex-item-align:stretch;align-self:stretch}/*!@.menu*/.menu.sc-calcite-panel{min-width:10rem;-ms-flex-flow:column nowrap;flex-flow:column nowrap}/*!@.content-wrapper*/.content-wrapper.sc-calcite-panel{overflow:auto}/*!@.content-height*/.content-height.sc-calcite-panel{height:100%}/*!@.content-container*/.content-container.sc-calcite-panel{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-align:stretch;align-items:stretch;background-color:var(--calcite-ui-background)}/*!@.footer*/.footer.sc-calcite-panel{border-top:1px solid;position:-webkit-sticky;position:sticky;bottom:0px;display:-ms-flexbox;display:flex;width:100%;-ms-flex-pack:space-evenly;justify-content:space-evenly;background-color:var(--calcite-ui-foreground-1);border-top-color:var(--calcite-ui-border-3);-ms-flex:0 0 auto;flex:0 0 auto;min-height:3rem;padding:0.5rem}/*!@.fab-container*/.fab-container.sc-calcite-panel{position:-webkit-sticky;position:sticky;bottom:0px;left:0px;right:0px;margin-top:0px;margin-bottom:0px;margin-left:auto;margin-right:auto;display:block;padding:0.5rem;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}";
- /**
- * @slot - A slot for adding custom content.
- * @slot header-actions-start - A slot for adding actions or content to the start side of the panel header.
- * @slot header-actions-end - A slot for adding actions or content to the end side of the panel header.
- * @slot header-content - A slot for adding custom content to the header.
- * @slot header-menu-actions - A slot for adding an overflow menu with actions inside a dropdown.
- * @slot fab - A slot for adding a `calcite-fab` (floating action button) to perform an action.
- * @slot footer-actions - A slot for adding buttons to the footer.
- * @slot footer - A slot for adding custom content to the footer.
- */
- class Panel {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calcitePanelDismiss = createEvent(this, "calcitePanelDismiss", 7);
- this.calcitePanelDismissedChange = createEvent(this, "calcitePanelDismissedChange", 7);
- this.calcitePanelScroll = createEvent(this, "calcitePanelScroll", 7);
- this.calcitePanelBackClick = createEvent(this, "calcitePanelBackClick", 7);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * Hides the panel.
- */
- this.dismissed = false;
- /**
- * When true, disabled prevents interaction. This state shows items with lower opacity/grayed.
- */
- this.disabled = false;
- /**
- * Displays a close button in the trailing side of the header.
- */
- this.dismissible = false;
- /**
- * Shows a back button in the header.
- */
- this.showBackButton = false;
- /**
- * When true, content is waiting to be loaded. This state shows a busy indicator.
- */
- this.loading = false;
- /**
- * Opens the action menu.
- */
- this.menuOpen = false;
- this.resizeObserver = createObserver();
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.resizeHandler = () => {
- const { panelScrollEl } = this;
- if (!panelScrollEl ||
- typeof panelScrollEl.scrollHeight !== "number" ||
- typeof panelScrollEl.offsetHeight !== "number") {
- return;
- }
- panelScrollEl.tabIndex = panelScrollEl.scrollHeight > panelScrollEl.offsetHeight ? 0 : -1;
- };
- this.setContainerRef = (node) => {
- this.containerEl = node;
- };
- this.setDismissRef = (node) => {
- this.dismissButtonEl = node;
- };
- this.setBackRef = (node) => {
- this.backButtonEl = node;
- };
- this.panelKeyDownHandler = (event) => {
- if (event.key === "Escape") {
- this.dismiss();
- }
- };
- this.dismiss = () => {
- this.dismissed = true;
- this.calcitePanelDismiss.emit();
- };
- this.panelScrollHandler = () => {
- this.calcitePanelScroll.emit();
- };
- this.backButtonClick = () => {
- this.calcitePanelBackClick.emit();
- };
- this.setPanelScrollEl = (el) => {
- var _a, _b;
- this.panelScrollEl = el;
- (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- if (el) {
- (_b = this.resizeObserver) === null || _b === void 0 ? void 0 : _b.observe(el);
- this.resizeHandler();
- }
- };
- }
- dismissedHandler() {
- this.calcitePanelDismissedChange.emit();
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentDidRender() {
- updateHostInteraction(this);
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- var _a;
- disconnectConditionalSlotComponent(this);
- (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- }
- // --------------------------------------------------------------------------
- //
- // Methods
- //
- // --------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus(focusId) {
- var _a, _b, _c;
- if (focusId === "dismiss-button") {
- (_a = this.dismissButtonEl) === null || _a === void 0 ? void 0 : _a.setFocus();
- return;
- }
- if (focusId === "back-button") {
- (_b = this.backButtonEl) === null || _b === void 0 ? void 0 : _b.setFocus();
- return;
- }
- (_c = this.containerEl) === null || _c === void 0 ? void 0 : _c.focus();
- }
- /** Scrolls panel content to a particular set of coordinates.
- *
- * ```
- * myCalcitePanel.scrollContentTo({
- * left: 0, // Specifies the number of pixels along the X axis to scroll the window or element.
- * top: 0, // Specifies the number of pixels along the Y axis to scroll the window or element
- * behavior: "auto" // Specifies whether the scrolling should animate smoothly (smooth), or happen instantly in a single jump (auto, the default value).
- * });
- * ```
- */
- async scrollContentTo(options) {
- var _a;
- (_a = this.panelScrollEl) === null || _a === void 0 ? void 0 : _a.scrollTo(options);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- renderBackButton() {
- const { el } = this;
- const rtl = getElementDir(el) === "rtl";
- const { showBackButton, intlBack, backButtonClick } = this;
- const label = intlBack || TEXT$8.back;
- const icon = rtl ? ICONS$5.backRight : ICONS$5.backLeft;
- return showBackButton ? (hAsync("calcite-action", { "aria-label": label, class: CSS$k.backButton, icon: icon, key: "back-button", onClick: backButtonClick, ref: this.setBackRef, scale: "s", slot: SLOTS$c.headerActionsStart, text: label })) : null;
- }
- renderHeaderContent() {
- const { heading, headingLevel, summary } = this;
- const headingNode = heading ? (hAsync(Heading, { class: CSS$k.heading, level: headingLevel || HEADING_LEVEL$4 }, heading)) : null;
- const summaryNode = summary ? hAsync("span", { class: CSS$k.summary }, summary) : null;
- return headingNode || summaryNode ? (hAsync("div", { class: CSS$k.headerContent, key: "header-content" }, headingNode, summaryNode)) : null;
- }
- /**
- * Allows user to override the entire header-content node.
- */
- renderHeaderSlottedContent() {
- return (hAsync("div", { class: CSS$k.headerContent, key: "slotted-header-content" }, hAsync("slot", { name: SLOTS$c.headerContent })));
- }
- renderHeaderStartActions() {
- const { el } = this;
- const hasStartActions = getSlotted(el, SLOTS$c.headerActionsStart);
- return hasStartActions ? (hAsync("div", { class: { [CSS$k.headerActionsStart]: true, [CSS$k.headerActions]: true }, key: "header-actions-start" }, hAsync("slot", { name: SLOTS$c.headerActionsStart }))) : null;
- }
- renderHeaderActionsEnd() {
- const { dismiss, dismissible, el, intlClose } = this;
- const text = intlClose || TEXT$8.close;
- const dismissibleNode = dismissible ? (hAsync("calcite-action", { "aria-label": text, icon: ICONS$5.close, onClick: dismiss, ref: this.setDismissRef, text: text })) : null;
- const slotNode = hAsync("slot", { name: SLOTS$c.headerActionsEnd });
- const hasEndActions = getSlotted(el, SLOTS$c.headerActionsEnd);
- return hasEndActions || dismissibleNode ? (hAsync("div", { class: { [CSS$k.headerActionsEnd]: true, [CSS$k.headerActions]: true }, key: "header-actions-end" }, slotNode, dismissibleNode)) : null;
- }
- renderMenu() {
- const { el, intlOptions, menuOpen } = this;
- const hasMenuItems = getSlotted(el, SLOTS$c.headerMenuActions);
- return hasMenuItems ? (hAsync("calcite-action-menu", { flipPlacements: ["top", "bottom"], key: "menu", label: intlOptions || TEXT$8.options, open: menuOpen, placement: "bottom-end" }, hAsync("calcite-action", { icon: ICONS$5.menu, slot: SLOTS$p.trigger, text: intlOptions || TEXT$8.options }), hAsync("slot", { name: SLOTS$c.headerMenuActions }))) : null;
- }
- renderHeaderNode() {
- const { el, showBackButton } = this;
- const backButtonNode = this.renderBackButton();
- const hasHeaderSlottedContent = getSlotted(el, SLOTS$c.headerContent);
- const headerContentNode = hasHeaderSlottedContent
- ? this.renderHeaderSlottedContent()
- : this.renderHeaderContent();
- const actionsNodeStart = this.renderHeaderStartActions();
- const actionsNodeEnd = this.renderHeaderActionsEnd();
- const headerMenuNode = this.renderMenu();
- return actionsNodeStart ||
- headerContentNode ||
- actionsNodeEnd ||
- headerMenuNode ||
- showBackButton ? (hAsync("header", { class: CSS$k.header }, backButtonNode, actionsNodeStart, headerContentNode, actionsNodeEnd, headerMenuNode)) : null;
- }
- renderFooterNode() {
- const { el } = this;
- const hasFooterSlottedContent = getSlotted(el, SLOTS$c.footer);
- const hasFooterActions = getSlotted(el, SLOTS$c.footerActions);
- return hasFooterSlottedContent || hasFooterActions ? (hAsync("footer", { class: CSS$k.footer, key: "footer" }, hasFooterSlottedContent ? hAsync("slot", { key: "footer-slot", name: SLOTS$c.footer }) : null, hasFooterActions ? hAsync("slot", { key: "footer-actions-slot", name: SLOTS$c.footerActions }) : null)) : null;
- }
- renderContent() {
- const { el } = this;
- const hasFab = getSlotted(el, SLOTS$c.fab);
- const defaultSlotNode = hAsync("slot", { key: "default-slot" });
- const contentWrapperKey = "content-wrapper";
- return hasFab ? (hAsync("div", { class: { [CSS$k.contentWrapper]: true, [CSS$k.contentHeight]: true }, key: contentWrapperKey, onScroll: this.panelScrollHandler, ref: this.setPanelScrollEl }, hAsync("section", { class: CSS$k.contentContainer }, defaultSlotNode), this.renderFab())) : (hAsync("section", { class: { [CSS$k.contentWrapper]: true, [CSS$k.contentContainer]: true }, key: contentWrapperKey, onScroll: this.panelScrollHandler, ref: this.setPanelScrollEl }, defaultSlotNode));
- }
- renderFab() {
- return (hAsync("div", { class: CSS$k.fabContainer }, hAsync("slot", { name: SLOTS$c.fab })));
- }
- render() {
- const { dismissed, dismissible, loading, panelKeyDownHandler } = this;
- const panelNode = (hAsync("article", { "aria-busy": toAriaBoolean(loading), class: CSS$k.container, hidden: dismissible && dismissed, onKeyDown: panelKeyDownHandler, ref: this.setContainerRef, tabIndex: dismissible ? 0 : -1 }, this.renderHeaderNode(), this.renderContent(), this.renderFooterNode()));
- return (hAsync(Fragment, null, loading ? hAsync("calcite-scrim", { loading: loading }) : null, panelNode));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "dismissed": ["dismissedHandler"]
- }; }
- static get style() { return panelCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-panel",
- "$members$": {
- "dismissed": [1540],
- "beforeBack": [16],
- "disabled": [516],
- "dismissible": [516],
- "headingLevel": [2, "heading-level"],
- "showBackButton": [516, "show-back-button"],
- "intlBack": [1, "intl-back"],
- "heightScale": [513, "height-scale"],
- "widthScale": [513, "width-scale"],
- "loading": [516],
- "intlClose": [1, "intl-close"],
- "intlOptions": [1, "intl-options"],
- "heading": [1],
- "summary": [1],
- "menuOpen": [516, "menu-open"],
- "setFocus": [64],
- "scrollContentTo": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["dismissed", "dismissed"], ["disabled", "disabled"], ["dismissible", "dismissible"], ["showBackButton", "show-back-button"], ["heightScale", "height-scale"], ["widthScale", "width-scale"], ["loading", "loading"], ["menuOpen", "menu-open"]]
- }; }
- }
- const CSS$j = {
- sticky: "sticky-pos"
- };
- var ICON_TYPES$1;
- (function (ICON_TYPES) {
- ICON_TYPES["circle"] = "circle";
- ICON_TYPES["square"] = "square";
- ICON_TYPES["grip"] = "grip";
- })(ICON_TYPES$1 || (ICON_TYPES$1 = {}));
- const SLOTS$b = {
- menuActions: "menu-actions"
- };
- const CSS$i = {
- heading: "heading",
- container: "container",
- indented: "container--indented"
- };
- const SLOTS$a = {
- parentItem: "parent-item"
- };
- const HEADING_LEVEL$3 = 3;
- function mutationObserverCallback() {
- this.setUpItems();
- this.setUpFilter();
- this.deselectRemovedItems();
- }
- const SUPPORTED_ARROW_KEYS = ["ArrowUp", "ArrowDown"];
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- function initialize() {
- this.setUpItems();
- this.setUpFilter();
- this.emitCalciteListChange = debounce$1(internalCalciteListChangeEvent.bind(this), 0);
- }
- function initializeObserver() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });
- }
- function cleanUpObserver() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- }
- // --------------------------------------------------------------------------
- //
- // Listeners
- //
- // --------------------------------------------------------------------------
- function calciteListItemChangeHandler(event) {
- const { selectedValues } = this;
- const { item, value, selected, shiftPressed } = event.detail;
- if (selected) {
- if (this.multiple && shiftPressed) {
- this.selectSiblings(item);
- }
- if (!this.multiple) {
- this.deselectSiblingItems(item);
- }
- selectedValues.set(value, item);
- }
- else {
- selectedValues.delete(value);
- if (this.multiple && shiftPressed) {
- this.selectSiblings(item, true);
- }
- }
- if (!this.multiple) {
- toggleSingleSelectItemTabbing(item, selected);
- if (selected) {
- focusElement(item);
- }
- }
- this.lastSelectedItem = item;
- this.emitCalciteListChange();
- }
- function calciteListItemValueChangeHandler(event) {
- event.stopPropagation();
- const oldValue = event.detail.oldValue;
- const selectedValues = this.selectedValues;
- if (selectedValues.has(oldValue)) {
- const item = selectedValues.get(oldValue);
- selectedValues.delete(oldValue);
- selectedValues.set(event.detail.newValue, item);
- }
- }
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- function isValidNavigationKey(key) {
- return !!SUPPORTED_ARROW_KEYS.find((k) => k === key);
- }
- function calciteListFocusOutHandler(event) {
- const { el, items, multiple, selectedValues } = this;
- if (multiple) {
- return;
- }
- const focusedInside = el.contains(event.relatedTarget);
- if (focusedInside) {
- return;
- }
- filterOutDisabled(items).forEach((item) => {
- toggleSingleSelectItemTabbing(item, selectedValues.size === 0 ? item.contains(event.target) || event.target === item : item.selected);
- });
- }
- function keyDownHandler(event) {
- const { key, target } = event;
- if (!isValidNavigationKey(key)) {
- return;
- }
- const { items, multiple, selectionFollowsFocus } = this;
- const { length: totalItems } = items;
- const currentIndex = items.indexOf(target);
- if (!totalItems || currentIndex === -1) {
- return;
- }
- event.preventDefault();
- const index = moveItemIndex(this, target, key === "ArrowUp" ? "up" : "down");
- const item = items[index];
- items.forEach((i) => toggleSingleSelectItemTabbing(i, i === item));
- if (!multiple && selectionFollowsFocus) {
- item.selected = true;
- }
- focusElement(item);
- }
- function moveItemIndex(list, item, direction) {
- const { items } = list;
- const { length: totalItems } = items;
- const currentIndex = items.indexOf(item);
- const directionFactor = direction === "up" ? -1 : 1;
- let moveOffset = 1;
- let index = getRoundRobinIndex(currentIndex + directionFactor * moveOffset++, totalItems);
- const firstMovedIndex = index;
- while (items[index].disabled) {
- index = getRoundRobinIndex(currentIndex + directionFactor * moveOffset++, totalItems);
- if (index === firstMovedIndex) {
- break;
- }
- }
- return index;
- }
- function filterOutDisabled(items) {
- return items.filter((item) => !item.disabled);
- }
- function internalCalciteListChangeEvent() {
- this.calciteListChange.emit(this.selectedValues);
- }
- function removeItem(event) {
- if (event.defaultPrevented) {
- return;
- }
- const item = event.target;
- const selectedValues = this.selectedValues;
- if (item.parentElement.tagName === "CALCITE-PICK-LIST-GROUP" && item.slot === SLOTS$a.parentItem) {
- item.parentElement.remove();
- Array.from(item.parentElement.children).forEach((item) => selectedValues.delete(item.value));
- }
- else {
- item.remove();
- selectedValues.delete(item.value);
- }
- this.emitCalciteListChange();
- }
- function toggleSingleSelectItemTabbing(item, selectable) {
- if (item.disabled) {
- return;
- }
- // using attribute intentionally
- if (selectable) {
- item.removeAttribute("tabindex");
- }
- else {
- item.setAttribute("tabindex", "-1");
- }
- }
- async function setFocus(focusId) {
- var _a;
- if (this.filterEnabled && focusId === "filter") {
- await focusElement(this.filterEl);
- return;
- }
- const { items, multiple, selectionFollowsFocus } = this;
- if (items.length === 0) {
- return;
- }
- if (multiple) {
- return (_a = filterOutDisabled(items)[0]) === null || _a === void 0 ? void 0 : _a.setFocus();
- }
- const filtered = filterOutDisabled(items);
- const focusTarget = filtered.find((item) => item.selected) || filtered[0];
- if (selectionFollowsFocus && focusTarget) {
- focusTarget.selected = true;
- }
- return focusTarget.setFocus();
- }
- function setUpItems(tagName) {
- this.items = Array.from(this.el.querySelectorAll(tagName));
- let hasSelected = false;
- const { items } = this;
- items.forEach((item) => {
- item.icon = this.getIconType();
- if (!this.multiple) {
- item.disableDeselect = true;
- toggleSingleSelectItemTabbing(item, false);
- }
- if (item.selected) {
- hasSelected = true;
- toggleSingleSelectItemTabbing(item, true);
- this.selectedValues.set(item.value, item);
- }
- });
- const [first] = items;
- if (!hasSelected && first && !first.disabled) {
- toggleSingleSelectItemTabbing(first, true);
- }
- }
- function deselectRemovedItems() {
- const selectedValues = this.selectedValues;
- const itemValues = this.items.map(({ value }) => value);
- selectedValues.forEach((selectedItem) => {
- if (!itemValues.includes(selectedItem.value)) {
- this.selectedValues.delete(selectedItem.value);
- }
- });
- }
- function deselectSiblingItems(item) {
- this.items.forEach((currentItem) => {
- if (currentItem.value !== item.value) {
- currentItem.toggleSelected(false);
- if (this.selectedValues.has(currentItem.value)) {
- this.selectedValues.delete(currentItem.value);
- }
- }
- });
- }
- function selectSiblings(item, deselect = false) {
- if (!this.lastSelectedItem) {
- return;
- }
- const { items } = this;
- const start = items.findIndex((currentItem) => {
- return currentItem.value === this.lastSelectedItem.value;
- });
- const end = items.findIndex((currentItem) => {
- return currentItem.value === item.value;
- });
- items.slice(Math.min(start, end), Math.max(start, end)).forEach((currentItem) => {
- currentItem.toggleSelected(!deselect);
- if (!deselect) {
- this.selectedValues.set(currentItem.value, currentItem);
- }
- else {
- this.selectedValues.delete(currentItem.value);
- }
- });
- }
- let groups;
- function handleFilter(event) {
- const { filteredItems } = event.currentTarget;
- const values = filteredItems.map((item) => item.value);
- let hasSelectedMatch = false;
- if (!groups) {
- groups = new Set();
- }
- const matchedItems = this.items.filter((item) => {
- const parent = item.parentElement;
- const grouped = parent.matches("calcite-pick-list-group");
- if (grouped) {
- groups.add(parent);
- }
- const matches = values.includes(item.value);
- item.hidden = !matches;
- if (!hasSelectedMatch) {
- hasSelectedMatch = matches && item.selected;
- }
- return matches;
- });
- groups.forEach((group) => {
- const hasAtLeastOneMatch = matchedItems.some((item) => group.contains(item));
- group.hidden = !hasAtLeastOneMatch;
- if (!hasAtLeastOneMatch) {
- return;
- }
- const parentItem = getSlotted(group, "parent-item");
- if (parentItem) {
- parentItem.hidden = false;
- if (matchedItems.includes(parentItem)) {
- Array.from(group.children).forEach((child) => (child.hidden = false));
- }
- }
- });
- groups.clear();
- if (matchedItems.length > 0 && !hasSelectedMatch && !this.multiple) {
- toggleSingleSelectItemTabbing(matchedItems[0], true);
- }
- }
- function getItemData() {
- return this.items.map((item) => ({
- label: item.label,
- description: item.description,
- metadata: item.metadata,
- value: item.value
- }));
- }
- var __rest = (undefined && undefined.__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;
- };
- const List = (_a) => {
- var { props: { disabled, loading, filterEnabled, dataForFilter, handleFilter, filterPlaceholder, setFilterEl } } = _a, rest = __rest(_a, ["props"]);
- const defaultSlot = hAsync("slot", null);
- return (hAsync(Host, Object.assign({ "aria-busy": toAriaBoolean(loading), role: "menu" }, rest),
- hAsync("section", null,
- hAsync("header", { class: { [CSS$j.sticky]: true } },
- filterEnabled ? (hAsync("calcite-filter", { "aria-label": filterPlaceholder, disabled: loading || disabled, items: dataForFilter, onCalciteFilterChange: handleFilter, placeholder: filterPlaceholder, ref: setFilterEl })) : null,
- hAsync("slot", { name: SLOTS$b.menuActions })),
- loading ? hAsync("calcite-scrim", { loading: loading }) : null,
- defaultSlot)));
- };
- const pickListCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-pick-list:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-pick-list{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-pick-list{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-pick-list{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-pick-list{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-pick-list{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-pick-list:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-pick-list-h{display:none}/*!@:host*/.sc-calcite-pick-list-h{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;-ms-flex-positive:1;flex-grow:1;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:stretch;align-items:stretch;background-color:transparent;font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-ui-text-2)}/*!@:host **/.sc-calcite-pick-list-h *.sc-calcite-pick-list{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:host([disabled])*/[disabled].sc-calcite-pick-list-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-pick-list-h[disabled] .sc-calcite-pick-list-s>[calcite-hydrated][disabled],[disabled].sc-calcite-pick-list-h [calcite-hydrated][disabled].sc-calcite-pick-list{opacity:1}/*!@:host([filter-enabled]) header*/[filter-enabled].sc-calcite-pick-list-h header.sc-calcite-pick-list{margin-bottom:0.25rem;display:-ms-flexbox;display:flex;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:end;justify-content:flex-end;background-color:var(--calcite-ui-foreground-1);--tw-shadow:0 1px 0 var(--calcite-ui-border-3);--tw-shadow-colored:0 1px 0 var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@:host([filter-enabled]) header.sticky-pos*/[filter-enabled].sc-calcite-pick-list-h header.sticky-pos.sc-calcite-pick-list{position:-webkit-sticky;position:sticky;top:0px;z-index:1}/*!@calcite-filter*/calcite-filter.sc-calcite-pick-list{margin-bottom:0px}/*!@:host([loading][disabled])*/[loading][disabled].sc-calcite-pick-list-h{min-height:2rem}";
- /**
- * @slot - A slot for adding `calcite-pick-list-item` elements or `calcite-pick-list-group` elements. Items are displayed as a vertical list.
- * @slot menu-actions - A slot for adding a button + menu combo for performing actions like sorting.
- */
- class PickList {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteListChange = createEvent(this, "calciteListChange", 7);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * When true, disabled prevents interaction. This state shows items with lower opacity/grayed.
- */
- this.disabled = false;
- /**
- * When true, an input appears at the top of the list that can be used by end users to filter items in the list.
- */
- this.filterEnabled = false;
- /**
- * When true, content is waiting to be loaded. This state shows a busy indicator.
- */
- this.loading = false;
- /**
- * Multiple works similar to standard radio buttons and checkboxes.
- * When true, a user can select multiple items at a time.
- * When false, only a single item can be selected at a time
- * and selecting a new item will deselect any other selected items.
- */
- this.multiple = false;
- /**
- * When true and single-selection is enabled, the selection will change when navigating items via the keyboard.
- */
- this.selectionFollowsFocus = false;
- // --------------------------------------------------------------------------
- //
- // Private Properties
- //
- // --------------------------------------------------------------------------
- this.selectedValues = new Map();
- this.dataForFilter = [];
- this.lastSelectedItem = null;
- this.mutationObserver = createObserver("mutation", mutationObserverCallback.bind(this));
- this.setFilterEl = (el) => {
- this.filterEl = el;
- };
- this.deselectRemovedItems = deselectRemovedItems.bind(this);
- this.deselectSiblingItems = deselectSiblingItems.bind(this);
- this.selectSiblings = selectSiblings.bind(this);
- this.handleFilter = handleFilter.bind(this);
- this.getItemData = getItemData.bind(this);
- this.keyDownHandler = keyDownHandler.bind(this);
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- initialize.call(this);
- initializeObserver.call(this);
- }
- disconnectedCallback() {
- cleanUpObserver.call(this);
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- calciteListItemRemoveHandler(event) {
- removeItem.call(this, event);
- }
- calciteListItemChangeHandler(event) {
- calciteListItemChangeHandler.call(this, event);
- }
- calciteListItemPropsChangeHandler(event) {
- event.stopPropagation();
- this.setUpFilter();
- }
- calciteListItemValueChangeHandler(event) {
- calciteListItemValueChangeHandler.call(this, event);
- }
- calciteListFocusOutHandler(event) {
- calciteListFocusOutHandler.call(this, event);
- }
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- setUpItems() {
- setUpItems.call(this, "calcite-pick-list-item");
- }
- setUpFilter() {
- if (this.filterEnabled) {
- this.dataForFilter = this.getItemData();
- }
- }
- // --------------------------------------------------------------------------
- //
- // Public Methods
- //
- // --------------------------------------------------------------------------
- /** Returns the currently selected items */
- async getSelectedItems() {
- return this.selectedValues;
- }
- /** Sets focus on the component. */
- async setFocus(focusId) {
- return setFocus.call(this, focusId);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- getIconType() {
- return this.multiple ? ICON_TYPES$1.square : ICON_TYPES$1.circle;
- }
- render() {
- return hAsync(List, { onKeyDown: this.keyDownHandler, props: this });
- }
- get el() { return getElement(this); }
- static get style() { return pickListCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-pick-list",
- "$members$": {
- "disabled": [516],
- "filterEnabled": [516, "filter-enabled"],
- "filterPlaceholder": [513, "filter-placeholder"],
- "headingLevel": [2, "heading-level"],
- "loading": [516],
- "multiple": [516],
- "selectionFollowsFocus": [4, "selection-follows-focus"],
- "selectedValues": [32],
- "dataForFilter": [32],
- "getSelectedItems": [64],
- "setFocus": [64]
- },
- "$listeners$": [[0, "calciteListItemRemove", "calciteListItemRemoveHandler"], [0, "calciteListItemChange", "calciteListItemChangeHandler"], [0, "calciteListItemPropsChange", "calciteListItemPropsChangeHandler"], [0, "calciteListItemValueChange", "calciteListItemValueChangeHandler"], [0, "focusout", "calciteListFocusOutHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"], ["filterEnabled", "filter-enabled"], ["filterPlaceholder", "filter-placeholder"], ["loading", "loading"], ["multiple", "multiple"]]
- }; }
- }
- const pickListGroupCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-pick-list-group:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-pick-list-group{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-pick-list-group{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-pick-list-group{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-pick-list-group{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-pick-list-group{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-pick-list-group:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-pick-list-group-h{display:none}/*!@:host*/.sc-calcite-pick-list-group-h{margin-bottom:0.25rem;-webkit-box-sizing:border-box;box-sizing:border-box;display:block;background-color:transparent;font-size:var(--calcite-font-size--1);color:var(--calcite-ui-text-2)}/*!@:host **/.sc-calcite-pick-list-group-h *.sc-calcite-pick-list-group{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:host(:last-child)*/.sc-calcite-pick-list-group-h:last-child{margin-bottom:0px}/*!@.header*/.header.sc-calcite-pick-list-group{margin:0px;display:-ms-flexbox;display:flex;-ms-flex-line-pack:justify;align-content:space-between;-ms-flex-align:center;align-items:center;fill:var(--calcite-ui-text-2);color:var(--calcite-ui-text-2)}/*!@.heading*/.heading.sc-calcite-pick-list-group{margin:0px;padding:0px;font-weight:var(--calcite-font-weight-medium)}/*!@.header .heading*/.header.sc-calcite-pick-list-group .heading.sc-calcite-pick-list-group{-ms-flex:1 1 auto;flex:1 1 auto;padding:0.5rem}/*!@h1.heading*/h1.heading.sc-calcite-pick-list-group{font-size:var(--calcite-font-size-2);line-height:1.5rem}/*!@h2.heading*/h2.heading.sc-calcite-pick-list-group{font-size:var(--calcite-font-size-1);line-height:1.5rem}/*!@h3.heading*/h3.heading.sc-calcite-pick-list-group{font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@h4.heading, h5.heading*/h4.heading.sc-calcite-pick-list-group,h5.heading.sc-calcite-pick-list-group{font-size:var(--calcite-font-size--1);line-height:1rem}/*!@h3.heading*/h3.heading.sc-calcite-pick-list-group{margin-top:0.5rem;margin-bottom:0.5rem;margin-left:1rem;margin-right:1rem;font-size:var(--calcite-font-size--1);line-height:1.375;color:var(--calcite-ui-text-3)}/*!@.container--indented*/.container--indented.sc-calcite-pick-list-group{-webkit-margin-start:1.5rem;margin-inline-start:1.5rem}";
- /**
- * @slot - A slot for adding `calcite-pick-list-item` elements.
- */
- class PickListGroup {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- disconnectConditionalSlotComponent(this);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- var _a;
- const { el, groupTitle, headingLevel } = this;
- const hasParentItem = getSlotted(el, SLOTS$a.parentItem) !== null;
- const sectionClasses = {
- [CSS$i.container]: true,
- [CSS$i.indented]: hasParentItem
- };
- const title = groupTitle;
- const parentLevel = (_a = el.closest("calcite-pick-list")) === null || _a === void 0 ? void 0 : _a.headingLevel;
- const relativeLevel = parentLevel ? constrainHeadingLevel(parentLevel + 1) : null;
- const level = headingLevel || relativeLevel || HEADING_LEVEL$3;
- return (hAsync(Fragment, null, title ? (hAsync(Heading, { class: CSS$i.heading, level: level }, title)) : null, hAsync("slot", { name: SLOTS$a.parentItem }), hAsync("section", { class: sectionClasses }, hAsync("slot", null))));
- }
- get el() { return getElement(this); }
- static get style() { return pickListGroupCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-pick-list-group",
- "$members$": {
- "groupTitle": [513, "group-title"],
- "headingLevel": [2, "heading-level"]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["groupTitle", "group-title"]]
- }; }
- }
- const CSS$h = {
- actions: "actions",
- actionsEnd: "actions--end",
- actionsStart: "actions--start",
- description: "description",
- handle: "handle",
- handleActivated: "handle--activated",
- highlight: "highlight",
- icon: "icon",
- iconDot: "icon-dot",
- label: "label",
- remove: "remove",
- title: "title",
- textContainer: "text-container"
- };
- const ICONS$4 = {
- checked: "check",
- remove: "x"
- };
- const SLOTS$9 = {
- actionsEnd: "actions-end",
- actionsStart: "actions-start"
- };
- const TEXT$7 = {
- remove: "Remove"
- };
- const pickListItemCss = "@charset \"UTF-8\";@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-pick-list-item:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-pick-list-item{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-pick-list-item{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-pick-list-item{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-pick-list-item{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-pick-list-item{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-pick-list-item:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-pick-list-item-h{display:none}/*!@:host*/.sc-calcite-pick-list-item-h{margin:0px;margin-bottom:1px;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-align:stretch;align-items:stretch;background-color:var(--calcite-ui-foreground-1);font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-ui-text-1);--tw-shadow:0 1px 0 var(--calcite-ui-border-3);--tw-shadow-colored:0 1px 0 var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);-webkit-transition:background-color var(--calcite-animation-timing);transition:background-color var(--calcite-animation-timing);-webkit-animation:calcite-fade-in var(--calcite-animation-timing);animation:calcite-fade-in var(--calcite-animation-timing)}/*!@:host **/.sc-calcite-pick-list-item-h *.sc-calcite-pick-list-item{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@.label*/.label.sc-calcite-pick-list-item{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;cursor:pointer;-ms-flex-align:center;align-items:center;background-color:transparent;outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@.label:focus*/.label.sc-calcite-pick-list-item:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@.label:hover*/.label.sc-calcite-pick-list-item:hover{background-color:var(--calcite-ui-foreground-2)}/*!@:host([non-interactive]:hover)*/[non-interactive].sc-calcite-pick-list-item-h:hover{background-color:var(--calcite-ui-foreground-1)}/*!@:host([non-interactive]) .label, :host([non-interactive]) .icon*/[non-interactive].sc-calcite-pick-list-item-h .label.sc-calcite-pick-list-item,[non-interactive].sc-calcite-pick-list-item-h .icon.sc-calcite-pick-list-item{pointer-events:none}/*!@.icon*/.icon.sc-calcite-pick-list-item{margin-top:0px;margin-bottom:0px;display:-ms-flexbox;display:flex;cursor:pointer;-ms-flex-align:center;align-items:center;padding:0.25rem;color:var(--calcite-ui-brand);-ms-flex:0 0 auto;flex:0 0 auto;line-height:0}/*!@.icon:hover*/.icon.sc-calcite-pick-list-item:hover{background-color:var(--calcite-ui-foreground-2)}/*!@.icon-dot*/.icon-dot.sc-calcite-pick-list-item{display:-ms-flexbox;display:flex;width:1.5rem;-ms-flex-align:center;align-items:center;padding:0.5rem}/*!@.icon-dot:before*/.icon-dot.sc-calcite-pick-list-item:before{opacity:0;content:\"•\"}/*!@.icon calcite-icon*/.icon.sc-calcite-pick-list-item calcite-icon.sc-calcite-pick-list-item{opacity:0}/*!@:host([selected]) .icon-dot:before,\n:host([selected]) .icon calcite-icon*/[selected].sc-calcite-pick-list-item-h .icon-dot.sc-calcite-pick-list-item:before,[selected].sc-calcite-pick-list-item-h .icon.sc-calcite-pick-list-item calcite-icon.sc-calcite-pick-list-item{-webkit-transition:opacity var(--calcite-animation-timing);transition:opacity var(--calcite-animation-timing);opacity:1}/*!@.text-container*/.text-container.sc-calcite-pick-list-item{pointer-events:none;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow:hidden;padding-top:0.5rem;padding-bottom:0.5rem;padding-left:0.75rem;padding-right:0.75rem;font-size:var(--calcite-font-size--2);line-height:1.375;word-wrap:break-word;word-break:break-word}/*!@.title*/.title.sc-calcite-pick-list-item{font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-1)}/*!@.description*/.description.sc-calcite-pick-list-item{margin-top:0.125rem;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-3)}/*!@.actions*/.actions.sc-calcite-pick-list-item{margin:0px;display:-ms-flexbox;display:flex;-ms-flex:0 1 auto;flex:0 1 auto;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:end;justify-content:flex-end}/*!@.actions--start ~ .label*/.actions--start.sc-calcite-pick-list-item~.label.sc-calcite-pick-list-item{-webkit-padding-start:0.25rem;padding-inline-start:0.25rem}/*!@:host([disabled])*/[disabled].sc-calcite-pick-list-item-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-pick-list-item-h[disabled] .sc-calcite-pick-list-item-s>[calcite-hydrated][disabled],[disabled].sc-calcite-pick-list-item-h [calcite-hydrated][disabled].sc-calcite-pick-list-item{opacity:1}";
- /**
- * @slot actions-end - a slot for adding actions or content to the end side of the item.
- * @slot actions-start - a slot for adding actions or content to the start side of the item.
- */
- class PickListItem {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteListItemChange = createEvent(this, "calciteListItemChange", 7);
- this.calciteListItemRemove = createEvent(this, "calciteListItemRemove", 7);
- this.calciteListItemPropsChange = createEvent(this, "calciteListItemPropsChange", 7);
- this.calciteListItemValueChange = createEvent(this, "calciteListItemValueChange", 7);
- /**
- * When true, the item cannot be clicked and is visually muted.
- */
- this.disabled = false;
- /**
- * When false, the item cannot be deselected by user interaction.
- */
- this.disableDeselect = false;
- /**
- * @internal When true, the item cannot be selected by user interaction.
- */
- this.nonInteractive = false;
- /**
- * Determines the icon SVG symbol that will be shown. Options are circle, square, grip or null.
- * @see [ICON_TYPES](https://github.com/Esri/calcite-components/blob/master/src/components/pick-list/resources.ts#L5)
- */
- this.icon = null;
- /**
- * Set this to true to display a remove action that removes the item from the list.
- */
- this.removable = false;
- /**
- * Set this to true to pre-select an item. Toggles when an item is checked/unchecked.
- */
- this.selected = false;
- /**
- * Used as an accessible label (aria-label) for the "remove item" action. Only applicable if removable is true.
- * @default "Remove"
- */
- this.intlRemove = TEXT$7.remove;
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.pickListClickHandler = (event) => {
- if (this.disabled || (this.disableDeselect && this.selected) || this.nonInteractive) {
- return;
- }
- this.shiftPressed = event.shiftKey;
- this.selected = !this.selected;
- };
- this.pickListKeyDownHandler = (event) => {
- if (event.key === " ") {
- event.preventDefault();
- if ((this.disableDeselect && this.selected) || this.nonInteractive) {
- return;
- }
- this.selected = !this.selected;
- }
- };
- this.removeClickHandler = () => {
- this.calciteListItemRemove.emit();
- };
- }
- descriptionWatchHandler() {
- this.calciteListItemPropsChange.emit();
- }
- labelWatchHandler() {
- this.calciteListItemPropsChange.emit();
- }
- metadataWatchHandler() {
- this.calciteListItemPropsChange.emit();
- }
- selectedWatchHandler() {
- this.calciteListItemChange.emit({
- item: this.el,
- value: this.value,
- selected: this.selected,
- shiftPressed: this.shiftPressed
- });
- this.shiftPressed = false;
- }
- valueWatchHandler(newValue, oldValue) {
- this.calciteListItemValueChange.emit({ oldValue, newValue });
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- disconnectConditionalSlotComponent(this);
- }
- componentDidRender() {
- updateHostInteraction(this, this.el.closest("calcite-pick-list") ? "managed" : false);
- }
- // --------------------------------------------------------------------------
- //
- // Public Methods
- //
- // --------------------------------------------------------------------------
- /**
- * Used to toggle the selection state. By default this won't trigger an event.
- * The first argument allows the value to be coerced, rather than swapping values.
- */
- async toggleSelected(coerce) {
- this.selected = typeof coerce === "boolean" ? coerce : !this.selected;
- }
- /** Sets focus on the component. */
- async setFocus() {
- var _a;
- (_a = this.focusEl) === null || _a === void 0 ? void 0 : _a.focus();
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- renderIcon() {
- const { icon } = this;
- if (!icon) {
- return null;
- }
- return (hAsync("span", { class: {
- [CSS$h.icon]: true,
- [CSS$h.iconDot]: icon === ICON_TYPES$1.circle
- }, onClick: this.pickListClickHandler }, icon === ICON_TYPES$1.square ? hAsync("calcite-icon", { icon: ICONS$4.checked, scale: "s" }) : null));
- }
- renderRemoveAction() {
- return this.removable ? (hAsync("calcite-action", { class: CSS$h.remove, icon: ICONS$4.remove, onCalciteActionClick: this.removeClickHandler, slot: SLOTS$9.actionsEnd, text: this.intlRemove })) : null;
- }
- renderActionsStart() {
- const { el } = this;
- const hasActionsStart = getSlotted(el, SLOTS$9.actionsStart);
- return hasActionsStart ? (hAsync("div", { class: { [CSS$h.actions]: true, [CSS$h.actionsStart]: true } }, hAsync("slot", { name: SLOTS$9.actionsStart }))) : null;
- }
- renderActionsEnd() {
- const { el, removable } = this;
- const hasActionsEnd = getSlotted(el, SLOTS$9.actionsEnd);
- return hasActionsEnd || removable ? (hAsync("div", { class: { [CSS$h.actions]: true, [CSS$h.actionsEnd]: true } }, hAsync("slot", { name: SLOTS$9.actionsEnd }), this.renderRemoveAction())) : null;
- }
- render() {
- const { description, label } = this;
- return (hAsync(Fragment, null, this.renderIcon(), this.renderActionsStart(), hAsync("label", { "aria-label": label, class: CSS$h.label, onClick: this.pickListClickHandler, onKeyDown: this.pickListKeyDownHandler, ref: (focusEl) => (this.focusEl = focusEl), tabIndex: 0 }, hAsync("div", { "aria-checked": toAriaBoolean(this.selected), class: CSS$h.textContainer, role: "menuitemcheckbox" }, hAsync("span", { class: CSS$h.title }, label), description ? hAsync("span", { class: CSS$h.description }, description) : null)), this.renderActionsEnd()));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "description": ["descriptionWatchHandler"],
- "label": ["labelWatchHandler"],
- "metadata": ["metadataWatchHandler"],
- "selected": ["selectedWatchHandler"],
- "value": ["valueWatchHandler"]
- }; }
- static get style() { return pickListItemCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-pick-list-item",
- "$members$": {
- "description": [513],
- "disabled": [516],
- "disableDeselect": [4, "disable-deselect"],
- "nonInteractive": [516, "non-interactive"],
- "icon": [513],
- "label": [513],
- "metadata": [16],
- "removable": [516],
- "selected": [1540],
- "intlRemove": [513, "intl-remove"],
- "value": [8],
- "toggleSelected": [64],
- "setFocus": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["description", "description"], ["disabled", "disabled"], ["nonInteractive", "non-interactive"], ["icon", "icon"], ["label", "label"], ["removable", "removable"], ["selected", "selected"], ["intlRemove", "intl-remove"]]
- }; }
- }
- const CSS$g = {
- container: "container",
- arrow: "arrow",
- imageContainer: "image-container",
- closeButtonContainer: "close-button-container",
- closeButton: "close-button",
- content: "content",
- hasHeader: "has-header",
- header: "header",
- headerContent: "header-content",
- heading: "heading"
- };
- const TEXT$6 = {
- close: "Close"
- };
- const defaultPopoverPlacement = "auto";
- const ARIA_CONTROLS = "aria-controls";
- const ARIA_EXPANDED = "aria-expanded";
- const HEADING_LEVEL$2 = 2;
- class PopoverManager$1 {
- constructor() {
- // --------------------------------------------------------------------------
- //
- // Private Properties
- //
- // --------------------------------------------------------------------------
- this.registeredElements = new WeakMap();
- this.registeredElementCount = 0;
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.queryPopover = (composedPath) => {
- const { registeredElements } = this;
- const registeredElement = composedPath.find((pathEl) => registeredElements.has(pathEl));
- return registeredElements.get(registeredElement);
- };
- this.clickHandler = (event) => {
- const composedPath = event.composedPath();
- const popover = this.queryPopover(composedPath);
- if (popover) {
- popover.toggle();
- return;
- }
- queryElementsRoots(event.target, "calcite-popover")
- .filter((popover) => popover.autoClose && popover.open && !composedPath.includes(popover))
- .forEach((popover) => popover.toggle(false));
- };
- }
- // --------------------------------------------------------------------------
- //
- // Public Methods
- //
- // --------------------------------------------------------------------------
- registerElement(referenceEl, popover) {
- this.registeredElementCount++;
- this.registeredElements.set(referenceEl, popover);
- if (this.registeredElementCount === 1) {
- this.addListeners();
- }
- }
- unregisterElement(referenceEl) {
- if (this.registeredElements.delete(referenceEl)) {
- this.registeredElementCount--;
- }
- if (this.registeredElementCount === 0) {
- this.removeListeners();
- }
- }
- addListeners() {
- document.addEventListener("pointerdown", this.clickHandler, { capture: true });
- }
- removeListeners() {
- document.removeEventListener("pointerdown", this.clickHandler, { capture: true });
- }
- }
- const popoverCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-popover:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-popover{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-popover{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-popover{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-popover{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-popover{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-popover:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-popover-h{display:none}/*!@:host*/.sc-calcite-popover-h{display:block;position:absolute;z-index:900;-webkit-transform:scale(0);transform:scale(0)}/*!@.calcite-popper-anim*/.calcite-popper-anim.sc-calcite-popover{position:relative;z-index:1;-webkit-transition:var(--calcite-popper-transition);transition:var(--calcite-popper-transition);visibility:hidden;-webkit-transition-property:visibility, opacity, -webkit-transform;transition-property:visibility, opacity, -webkit-transform;transition-property:transform, visibility, opacity;transition-property:transform, visibility, opacity, -webkit-transform;opacity:0;-webkit-box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);border-radius:0.25rem}/*!@:host([data-popper-placement^=bottom]) .calcite-popper-anim*/[data-popper-placement^=bottom].sc-calcite-popover-h .calcite-popper-anim.sc-calcite-popover{-webkit-transform:translateY(-5px);transform:translateY(-5px)}/*!@:host([data-popper-placement^=top]) .calcite-popper-anim*/[data-popper-placement^=top].sc-calcite-popover-h .calcite-popper-anim.sc-calcite-popover{-webkit-transform:translateY(5px);transform:translateY(5px)}/*!@:host([data-popper-placement^=left]) .calcite-popper-anim*/[data-popper-placement^=left].sc-calcite-popover-h .calcite-popper-anim.sc-calcite-popover{-webkit-transform:translateX(5px);transform:translateX(5px)}/*!@:host([data-popper-placement^=right]) .calcite-popper-anim*/[data-popper-placement^=right].sc-calcite-popover-h .calcite-popper-anim.sc-calcite-popover{-webkit-transform:translateX(-5px);transform:translateX(-5px)}/*!@:host([data-popper-placement]) .calcite-popper-anim--active*/[data-popper-placement].sc-calcite-popover-h .calcite-popper-anim--active.sc-calcite-popover{opacity:1;visibility:visible;-webkit-transform:translate(0);transform:translate(0)}/*!@:host([data-popper-placement][data-popper-reference-hidden])*/[data-popper-placement][data-popper-reference-hidden].sc-calcite-popover-h{pointer-events:none;opacity:0}/*!@.arrow,\n.arrow::before*/.arrow.sc-calcite-popover,.arrow.sc-calcite-popover::before{position:absolute;width:8px;height:8px;z-index:-1}/*!@.arrow::before*/.arrow.sc-calcite-popover::before{content:\"\";--tw-shadow:0 4px 8px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.04);--tw-shadow-colored:0 4px 8px -1px var(--tw-shadow-color), 0 2px 4px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);-webkit-transform:rotate(45deg);transform:rotate(45deg);background:var(--calcite-ui-foreground-1)}/*!@:host([data-popper-placement^=top]) .arrow*/[data-popper-placement^=top].sc-calcite-popover-h .arrow.sc-calcite-popover{bottom:-4px}/*!@:host([data-popper-placement^=bottom]) .arrow*/[data-popper-placement^=bottom].sc-calcite-popover-h .arrow.sc-calcite-popover{top:-4px}/*!@:host([data-popper-placement^=left]) .arrow*/[data-popper-placement^=left].sc-calcite-popover-h .arrow.sc-calcite-popover{right:-4px}/*!@:host([data-popper-placement^=right]) .arrow*/[data-popper-placement^=right].sc-calcite-popover-h .arrow.sc-calcite-popover{left:-4px}/*!@:host*/.sc-calcite-popover-h{pointer-events:none}/*!@:host([open])*/[open].sc-calcite-popover-h{pointer-events:initial}/*!@.calcite-popper-anim*/.calcite-popper-anim.sc-calcite-popover{border-radius:0.25rem;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3);background-color:var(--calcite-ui-foreground-1)}/*!@.arrow::before*/.arrow.sc-calcite-popover::before{outline:1px solid var(--calcite-ui-border-3)}/*!@.header*/.header.sc-calcite-popover{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:start;justify-content:flex-start;border-width:0px;border-bottom-width:1px;border-style:solid;background-color:var(--calcite-ui-foreground-1);border-bottom-color:var(--calcite-ui-border-3)}/*!@.heading*/.heading.sc-calcite-popover{margin:0px;display:block;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-item-align:center;align-self:center;white-space:normal;padding-left:1rem;padding-right:1rem;padding-top:0.75rem;padding-bottom:0.75rem;font-size:var(--calcite-font-size-0);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1);word-wrap:break-word;word-break:break-word}/*!@.container*/.container.sc-calcite-popover{position:relative;display:-ms-flexbox;display:flex;height:100%;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:nowrap;flex-wrap:nowrap;border-radius:0.25rem;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-1)}/*!@.container.has-header*/.container.has-header.sc-calcite-popover{-ms-flex-direction:column;flex-direction:column}/*!@.content*/.content.sc-calcite-popover{display:-ms-flexbox;display:flex;height:100%;width:100%;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-item-align:center;align-self:center;word-wrap:break-word;word-break:break-word}/*!@.close-button-container*/.close-button-container.sc-calcite-popover{display:-ms-flexbox;display:flex;overflow:hidden;-ms-flex:0 0 auto;flex:0 0 auto;border-start-end-radius:0.25rem;border-end-end-radius:0.25rem}/*!@::slotted(calcite-panel), ::slotted(calcite-flow)*/.sc-calcite-popover-s>calcite-panel,.sc-calcite-popover-s>calcite-flow{height:100%}";
- const manager$1 = new PopoverManager$1();
- /**
- * @slot - A slot for adding custom content.
- */
- class Popover {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calcitePopoverClose = createEvent(this, "calcitePopoverClose", 7);
- this.calcitePopoverOpen = createEvent(this, "calcitePopoverOpen", 7);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * Automatically closes any currently open popovers when clicking outside of a popover.
- */
- this.autoClose = false;
- /**
- * Display a close button within the Popover.
- * @deprecated use dismissible instead.
- */
- this.closeButton = false;
- /**
- * Display a close button within the Popover.
- */
- this.dismissible = false;
- /**
- * Prevents flipping the popover's placement when it starts to overlap its reference element.
- */
- this.disableFlip = false;
- /**
- * Removes the caret pointer.
- */
- this.disablePointer = false;
- /**
- * Offset the position of the popover away from the reference element.
- * @default 6
- */
- this.offsetDistance = defaultOffsetDistance;
- /**
- * Offset the position of the popover along the reference element.
- */
- this.offsetSkidding = 0;
- /**
- * Display and position the component.
- */
- this.open = false;
- /** Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value. */
- this.overlayPositioning = "absolute";
- /**
- * Determines where the component will be positioned relative to the referenceElement.
- * @see [PopperPlacement](https://github.com/Esri/calcite-components/blob/master/src/utils/popper.ts#L25)
- */
- this.placement = defaultPopoverPlacement;
- /** Text for close button.
- * @default "Close"
- */
- this.intlClose = TEXT$6.close;
- this.guid = `calcite-popover-${guid()}`;
- this.activeTransitionProp = "opacity";
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.setFilteredPlacements = () => {
- const { el, flipPlacements } = this;
- this.filteredFlipPlacements = flipPlacements
- ? filterComputedPlacements(flipPlacements, el)
- : null;
- };
- this.setUpReferenceElement = () => {
- this.removeReferences();
- this.effectiveReferenceElement = this.getReferenceElement();
- const { el, referenceElement, effectiveReferenceElement } = this;
- if (referenceElement && !effectiveReferenceElement) {
- console.warn(`${el.tagName}: reference-element id "${referenceElement}" was not found.`, {
- el
- });
- }
- this.addReferences();
- this.createPopper();
- };
- this.getId = () => {
- return this.el.id || this.guid;
- };
- this.setExpandedAttr = () => {
- const { effectiveReferenceElement, open } = this;
- if (!effectiveReferenceElement) {
- return;
- }
- effectiveReferenceElement.setAttribute(ARIA_EXPANDED, toAriaBoolean(open));
- };
- this.addReferences = () => {
- const { effectiveReferenceElement } = this;
- if (!effectiveReferenceElement) {
- return;
- }
- const id = this.getId();
- effectiveReferenceElement.setAttribute(ARIA_CONTROLS, id);
- manager$1.registerElement(effectiveReferenceElement, this.el);
- this.setExpandedAttr();
- };
- this.removeReferences = () => {
- const { effectiveReferenceElement } = this;
- if (!effectiveReferenceElement) {
- return;
- }
- effectiveReferenceElement.removeAttribute(ARIA_CONTROLS);
- effectiveReferenceElement.removeAttribute(ARIA_EXPANDED);
- manager$1.unregisterElement(effectiveReferenceElement);
- };
- this.hide = () => {
- this.open = false;
- };
- this.transitionEnd = (event) => {
- if (event.propertyName === this.activeTransitionProp) {
- this.open ? this.calcitePopoverOpen.emit() : this.calcitePopoverClose.emit();
- }
- };
- }
- flipPlacementsHandler() {
- this.setFilteredPlacements();
- }
- offsetDistanceOffsetHandler() {
- this.reposition();
- }
- offsetSkiddingHandler() {
- this.reposition();
- }
- openHandler() {
- this.reposition();
- this.setExpandedAttr();
- }
- placementHandler() {
- this.reposition();
- }
- referenceElementHandler() {
- this.setUpReferenceElement();
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- this.setFilteredPlacements();
- }
- componentWillLoad() {
- this.setUpReferenceElement();
- }
- componentDidLoad() {
- this.reposition();
- }
- disconnectedCallback() {
- this.removeReferences();
- this.destroyPopper();
- }
- // --------------------------------------------------------------------------
- //
- // Public Methods
- //
- // --------------------------------------------------------------------------
- /** Updates the position of the component. */
- async reposition() {
- const { popper, el, placement } = this;
- const modifiers = this.getModifiers();
- popper
- ? await updatePopper({
- el,
- modifiers,
- placement,
- popper
- })
- : this.createPopper();
- }
- /** Sets focus on the component. */
- async setFocus(focusId) {
- var _a;
- const { closeButtonEl } = this;
- if (focusId === "close-button" && closeButtonEl) {
- forceUpdate$1(closeButtonEl);
- closeButtonEl.setFocus();
- return;
- }
- (_a = this.el) === null || _a === void 0 ? void 0 : _a.focus();
- }
- /** Toggles the popover's open property. */
- async toggle(value = !this.open) {
- this.open = value;
- }
- getReferenceElement() {
- const { referenceElement, el } = this;
- return ((typeof referenceElement === "string"
- ? queryElementRoots(el, { id: referenceElement })
- : referenceElement) || null);
- }
- getModifiers() {
- const { arrowEl, disableFlip, disablePointer, offsetDistance, offsetSkidding, filteredFlipPlacements } = this;
- const flipModifier = {
- name: "flip",
- enabled: !disableFlip
- };
- if (filteredFlipPlacements) {
- flipModifier.options = {
- fallbackPlacements: filteredFlipPlacements
- };
- }
- const arrowModifier = {
- name: "arrow",
- enabled: !disablePointer
- };
- if (arrowEl) {
- arrowModifier.options = {
- element: arrowEl
- };
- }
- const offsetModifier = {
- name: "offset",
- enabled: true,
- options: {
- offset: [offsetSkidding, offsetDistance]
- }
- };
- const eventListenerModifier = {
- name: "eventListeners",
- enabled: this.open
- };
- return [arrowModifier, flipModifier, offsetModifier, eventListenerModifier];
- }
- createPopper() {
- this.destroyPopper();
- const { el, placement, effectiveReferenceElement: referenceEl, overlayPositioning } = this;
- const modifiers = this.getModifiers();
- this.popper = createPopper({
- el,
- modifiers,
- overlayPositioning,
- placement,
- referenceEl
- });
- }
- destroyPopper() {
- const { popper } = this;
- if (popper) {
- popper.destroy();
- }
- this.popper = null;
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- renderCloseButton() {
- const { dismissible, closeButton, intlClose } = this;
- return dismissible || closeButton ? (hAsync("div", { class: CSS$g.closeButtonContainer }, hAsync("calcite-action", { class: CSS$g.closeButton, onClick: this.hide, ref: (closeButtonEl) => (this.closeButtonEl = closeButtonEl), text: intlClose }, hAsync("calcite-icon", { icon: "x", scale: "m" })))) : null;
- }
- renderHeader() {
- const { heading, headingLevel } = this;
- const headingNode = heading ? (hAsync(Heading, { class: CSS$g.heading, level: headingLevel || HEADING_LEVEL$2 }, heading)) : null;
- return headingNode ? (hAsync("div", { class: CSS$g.header }, headingNode, this.renderCloseButton())) : null;
- }
- render() {
- const { effectiveReferenceElement, heading, label, open, disablePointer } = this;
- const displayed = effectiveReferenceElement && open;
- const hidden = !displayed;
- const arrowNode = !disablePointer ? (hAsync("div", { class: CSS$g.arrow, ref: (arrowEl) => (this.arrowEl = arrowEl) })) : null;
- return (hAsync(Host, { "aria-hidden": toAriaBoolean(hidden), "aria-label": label, "calcite-hydrated-hidden": hidden, id: this.getId(), role: "dialog" }, hAsync("div", { class: {
- [CSS$D.animation]: true,
- [CSS$D.animationActive]: displayed
- }, onTransitionEnd: this.transitionEnd }, arrowNode, hAsync("div", { class: {
- [CSS$g.hasHeader]: !!heading,
- [CSS$g.container]: true
- } }, this.renderHeader(), hAsync("div", { class: CSS$g.content }, hAsync("slot", null)), !heading ? this.renderCloseButton() : null))));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "flipPlacements": ["flipPlacementsHandler"],
- "offsetDistance": ["offsetDistanceOffsetHandler"],
- "offsetSkidding": ["offsetSkiddingHandler"],
- "open": ["openHandler"],
- "placement": ["placementHandler"],
- "referenceElement": ["referenceElementHandler"]
- }; }
- static get style() { return popoverCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-popover",
- "$members$": {
- "autoClose": [516, "auto-close"],
- "closeButton": [516, "close-button"],
- "dismissible": [516],
- "disableFlip": [516, "disable-flip"],
- "disablePointer": [516, "disable-pointer"],
- "flipPlacements": [16],
- "heading": [1],
- "headingLevel": [2, "heading-level"],
- "label": [1],
- "offsetDistance": [514, "offset-distance"],
- "offsetSkidding": [514, "offset-skidding"],
- "open": [1540],
- "overlayPositioning": [1, "overlay-positioning"],
- "placement": [513],
- "referenceElement": [1, "reference-element"],
- "intlClose": [1, "intl-close"],
- "effectiveReferenceElement": [32],
- "reposition": [64],
- "setFocus": [64],
- "toggle": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["autoClose", "auto-close"], ["closeButton", "close-button"], ["dismissible", "dismissible"], ["disableFlip", "disable-flip"], ["disablePointer", "disable-pointer"], ["offsetDistance", "offset-distance"], ["offsetSkidding", "offset-skidding"], ["open", "open"], ["placement", "placement"]]
- }; }
- }
- const popoverManagerCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-popover-manager:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-popover-manager{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-popover-manager{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-popover-manager{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-popover-manager{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-popover-manager{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-popover-manager:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-popover-manager-h{display:none}/*!@:host*/.sc-calcite-popover-manager-h{position:relative;display:block}";
- /**
- * @slot - A slot for adding elements that reference a 'calcite-popover' by the 'selector' property.
- * @deprecated No longer required for popover usage.
- */
- class PopoverManager {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.mutationObserver = createObserver();
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * CSS Selector to match reference elements for popovers. Reference elements will be identified by this selector in order to open their associated popover.
- * @default `[data-calcite-popover-reference]`
- */
- this.selector = "[data-calcite-popover-reference]";
- /**
- * Automatically closes any currently open popovers when clicking outside of a popover.
- */
- this.autoClose = false;
- }
- autoCloseHandler() {
- this.setAutoClose();
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- var _a;
- this.setAutoClose();
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });
- }
- disconnectedCallback() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- return hAsync("slot", null);
- }
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- setAutoClose() {
- const { autoClose, el } = this;
- el.querySelectorAll("calcite-popover").forEach((popover) => (popover.autoClose = autoClose));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "autoClose": ["autoCloseHandler"]
- }; }
- static get style() { return popoverManagerCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-popover-manager",
- "$members$": {
- "selector": [1],
- "autoClose": [516, "auto-close"]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["autoClose", "auto-close"]]
- }; }
- }
- const progressCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-progress:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-progress{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-progress{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-progress{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-progress{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-progress{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-progress:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-progress-h{display:none}/*!@:host*/.sc-calcite-progress-h{position:relative;display:block;width:100%}/*!@.track, .bar*/.track.sc-calcite-progress,.bar.sc-calcite-progress{position:absolute;top:0px;height:2px}/*!@.track*/.track.sc-calcite-progress{z-index:0;width:100%;overflow:hidden;background:var(--calcite-ui-border-3)}/*!@.bar*/.bar.sc-calcite-progress{z-index:0;background-color:var(--calcite-ui-brand)}@media (forced-colors: active){/*!@.track*/.track.sc-calcite-progress{background-color:highlightText}/*!@.bar*/.bar.sc-calcite-progress{background-color:linkText}}/*!@.indeterminate*/.indeterminate.sc-calcite-progress{width:20%;-webkit-animation:looping-progress-bar-ani 2200ms linear infinite;animation:looping-progress-bar-ani 2200ms linear infinite}/*!@.reversed*/.reversed.sc-calcite-progress{animation-direction:reverse}/*!@.text*/.text.sc-calcite-progress{padding-left:0px;padding-right:0px;padding-top:1rem;padding-bottom:0px;text-align:center;font-size:var(--calcite-font-size--2);line-height:1rem;font-weight:var(--calcite-font-weight-medium)}@-webkit-keyframes looping-progress-bar-ani{0%{-webkit-transform:translate3d(-100%, 0, 0);transform:translate3d(-100%, 0, 0)}50%{width:40%}100%{-webkit-transform:translate3d(600%, 0, 0);transform:translate3d(600%, 0, 0)}}@keyframes looping-progress-bar-ani{0%{-webkit-transform:translate3d(-100%, 0, 0);transform:translate3d(-100%, 0, 0)}50%{width:40%}100%{-webkit-transform:translate3d(600%, 0, 0);transform:translate3d(600%, 0, 0)}}";
- class Progress {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- /** Use indeterminate if finding actual progress value is impossible */
- this.type = "determinate";
- /** Fraction completed, in the range of 0 - 1.0 */
- this.value = 0;
- /** For indeterminate progress bars, reverse the animation direction */
- this.reversed = false;
- }
- render() {
- const isDeterminate = this.type === "determinate";
- const barStyles = isDeterminate ? { width: `${this.value * 100}%` } : {};
- return (hAsync("div", { "aria-label": this.label || this.text, "aria-valuemax": 1, "aria-valuemin": 0, "aria-valuenow": this.value, role: "progressbar" }, hAsync("div", { class: "track" }, hAsync("div", { class: {
- bar: true,
- indeterminate: this.type === "indeterminate",
- reversed: this.reversed
- }, style: barStyles })), this.text ? hAsync("div", { class: "text" }, this.text) : null));
- }
- get el() { return getElement(this); }
- static get style() { return progressCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-progress",
- "$members$": {
- "type": [1],
- "value": [2],
- "label": [1],
- "text": [1],
- "reversed": [4]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": []
- }; }
- }
- const CSS$f = {
- container: "container"
- };
- const radioButtonCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-radio-button:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-radio-button{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-radio-button{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-radio-button{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-radio-button{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-radio-button{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-radio-button:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-radio-button-h{display:none}/*!@:host*/.sc-calcite-radio-button-h{display:block;cursor:pointer}/*!@:host .container*/.sc-calcite-radio-button-h .container.sc-calcite-radio-button{position:relative;outline:2px solid transparent;outline-offset:2px}/*!@:host .radio*/.sc-calcite-radio-button-h .radio.sc-calcite-radio-button{cursor:pointer;border-radius:9999px;background-color:var(--calcite-ui-foreground-1);-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-border-input);box-shadow:inset 0 0 0 1px var(--calcite-ui-border-input)}/*!@:host([hovered]) .radio,\n:host(:not([checked])[focused]:not([disabled])) .radio*/[hovered].sc-calcite-radio-button-h .radio.sc-calcite-radio-button,.sc-calcite-radio-button-h:not([checked])[focused]:not([disabled]) .radio.sc-calcite-radio-button{-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-brand);box-shadow:inset 0 0 0 2px var(--calcite-ui-brand)}/*!@:host([disabled])*/[disabled].sc-calcite-radio-button-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) .radio*/[disabled].sc-calcite-radio-button-h .radio.sc-calcite-radio-button{cursor:default;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-radio-button-h[disabled] .sc-calcite-radio-button-s>[calcite-hydrated][disabled],[disabled].sc-calcite-radio-button-h [calcite-hydrated][disabled].sc-calcite-radio-button{opacity:1}/*!@:host([hovered][disabled]) .radio*/[hovered][disabled].sc-calcite-radio-button-h .radio.sc-calcite-radio-button{-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-border-input);box-shadow:inset 0 0 0 1px var(--calcite-ui-border-input)}/*!@:host([scale=s])*/[scale=s].sc-calcite-radio-button-h{--calcite-radio-size:var(--calcite-font-size--2)}/*!@:host([scale=m])*/[scale=m].sc-calcite-radio-button-h{--calcite-radio-size:var(--calcite-font-size--1)}/*!@:host([scale=l])*/[scale=l].sc-calcite-radio-button-h{--calcite-radio-size:var(--calcite-font-size-0)}/*!@.radio*/.radio.sc-calcite-radio-button{height:var(--calcite-radio-size);max-width:var(--calcite-radio-size);min-width:var(--calcite-radio-size)}/*!@:host([scale=s][checked]) .radio,\n:host([hovered][scale=s][checked][disabled]) .radio*/[scale=s][checked].sc-calcite-radio-button-h .radio.sc-calcite-radio-button,[hovered][scale=s][checked][disabled].sc-calcite-radio-button-h .radio.sc-calcite-radio-button{-webkit-box-shadow:inset 0 0 0 4px var(--calcite-ui-brand);box-shadow:inset 0 0 0 4px var(--calcite-ui-brand)}/*!@:host([scale=s][focused][checked]:not([disabled])) .radio*/[scale=s][focused][checked].sc-calcite-radio-button-h:not([disabled]) .radio.sc-calcite-radio-button{-webkit-box-shadow:inset 0 0 0 4px var(--calcite-ui-brand), 0 0 0 2px var(--calcite-ui-foreground-1), 0 0 0 4px var(--calcite-ui-brand);box-shadow:inset 0 0 0 4px var(--calcite-ui-brand), 0 0 0 2px var(--calcite-ui-foreground-1), 0 0 0 4px var(--calcite-ui-brand)}/*!@:host([scale=m][checked]) .radio,\n:host([hovered][scale=m][checked][disabled]) .radio*/[scale=m][checked].sc-calcite-radio-button-h .radio.sc-calcite-radio-button,[hovered][scale=m][checked][disabled].sc-calcite-radio-button-h .radio.sc-calcite-radio-button{-webkit-box-shadow:inset 0 0 0 5px var(--calcite-ui-brand);box-shadow:inset 0 0 0 5px var(--calcite-ui-brand)}/*!@:host([scale=m][focused][checked]:not([disabled])) .radio*/[scale=m][focused][checked].sc-calcite-radio-button-h:not([disabled]) .radio.sc-calcite-radio-button{-webkit-box-shadow:inset 0 0 0 5px var(--calcite-ui-brand), 0 0 0 2px var(--calcite-ui-foreground-1), 0 0 0 4px var(--calcite-ui-brand);box-shadow:inset 0 0 0 5px var(--calcite-ui-brand), 0 0 0 2px var(--calcite-ui-foreground-1), 0 0 0 4px var(--calcite-ui-brand)}/*!@:host([scale=l][checked]) .radio,\n:host([hovered][scale=l][checked][disabled]) .radio*/[scale=l][checked].sc-calcite-radio-button-h .radio.sc-calcite-radio-button,[hovered][scale=l][checked][disabled].sc-calcite-radio-button-h .radio.sc-calcite-radio-button{-webkit-box-shadow:inset 0 0 0 6px var(--calcite-ui-brand);box-shadow:inset 0 0 0 6px var(--calcite-ui-brand)}/*!@:host([scale=l][focused][checked]:not([disabled])) .radio*/[scale=l][focused][checked].sc-calcite-radio-button-h:not([disabled]) .radio.sc-calcite-radio-button{-webkit-box-shadow:inset 0 0 0 6px var(--calcite-ui-brand), 0 0 0 2px var(--calcite-ui-foreground-1), 0 0 0 4px var(--calcite-ui-brand);box-shadow:inset 0 0 0 6px var(--calcite-ui-brand), 0 0 0 2px var(--calcite-ui-foreground-1), 0 0 0 4px var(--calcite-ui-brand)}@media (forced-colors: active){/*!@:host([checked]) .radio::after,\n:host([checked][disabled]) .radio::after*/[checked].sc-calcite-radio-button-h .radio.sc-calcite-radio-button::after,[checked][disabled].sc-calcite-radio-button-h .radio.sc-calcite-radio-button::after{content:\"\";width:var(--calcite-radio-size);height:var(--calcite-radio-size);background-color:windowText;display:block}}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-radio-button-s>input[slot=hidden-form-input]{bottom:0 !important;left:0 !important;margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;right:0 !important;top:0 !important;-webkit-transform:none !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}";
- class RadioButton {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteInternalRadioButtonBlur = createEvent(this, "calciteInternalRadioButtonBlur", 7);
- this.calciteRadioButtonChange = createEvent(this, "calciteRadioButtonChange", 7);
- this.calciteInternalRadioButtonCheckedChange = createEvent(this, "calciteInternalRadioButtonCheckedChange", 7);
- this.calciteInternalRadioButtonFocus = createEvent(this, "calciteInternalRadioButtonFocus", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** The checked state of the radio button. */
- this.checked = false;
- /** The disabled state of the radio button. */
- this.disabled = false;
- /**
- * The focused state of the radio button.
- * @internal
- */
- this.focused = false;
- /** The radio button's hidden status. When a radio button is hidden it is not focusable or checkable. */
- this.hidden = false;
- /**
- * The hovered state of the radio button.
- * @internal
- */
- this.hovered = false;
- /** Requires that a value is selected for the radio button group before the parent form will submit. */
- this.required = false;
- /** The scale (size) of the radio button. `scale` is passed as a property automatically from `calcite-radio-button-group`. */
- this.scale = "m";
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- this.selectItem = (items, selectedIndex) => {
- items[selectedIndex].click();
- };
- this.queryButtons = () => {
- return Array.from(this.rootNode.querySelectorAll("calcite-radio-button:not([hidden])")).filter((radioButton) => radioButton.name === this.name);
- };
- this.isDefaultSelectable = () => {
- const radioButtons = this.queryButtons();
- return !radioButtons.some((radioButton) => radioButton.checked) && radioButtons[0] === this.el;
- };
- this.check = () => {
- if (this.disabled) {
- return;
- }
- this.uncheckAllRadioButtonsInGroup();
- this.checked = true;
- this.calciteRadioButtonChange.emit();
- this.setFocus();
- };
- this.clickHandler = () => {
- this.check();
- };
- this.setContainerEl = (el) => {
- this.containerEl = el;
- };
- this.handleKeyDown = (event) => {
- const keys = ["ArrowLeft", "ArrowUp", "ArrowRight", "ArrowDown", " "];
- const key = event.key;
- const { el } = this;
- if (keys.indexOf(key) === -1) {
- return;
- }
- if (key === " ") {
- this.check();
- return;
- }
- let adjustedKey = key;
- if (getElementDir(el) === "rtl") {
- if (key === "ArrowRight") {
- adjustedKey = "ArrowLeft";
- }
- if (key === "ArrowLeft") {
- adjustedKey = "ArrowRight";
- }
- }
- const radioButtons = Array.from(this.rootNode.querySelectorAll("calcite-radio-button:not([hidden]")).filter((radioButton) => radioButton.name === this.name);
- let currentIndex = 0;
- const radioButtonsLength = radioButtons.length;
- radioButtons.some((item, index) => {
- if (item.checked) {
- currentIndex = index;
- return true;
- }
- });
- switch (adjustedKey) {
- case "ArrowLeft":
- case "ArrowUp":
- event.preventDefault();
- this.selectItem(radioButtons, getRoundRobinIndex(Math.max(currentIndex - 1, -1), radioButtonsLength));
- return;
- case "ArrowRight":
- case "ArrowDown":
- event.preventDefault();
- this.selectItem(radioButtons, getRoundRobinIndex(currentIndex + 1, radioButtonsLength));
- return;
- default:
- return;
- }
- };
- this.onContainerBlur = () => {
- this.focused = false;
- this.calciteInternalRadioButtonBlur.emit();
- };
- this.onContainerFocus = () => {
- if (!this.disabled) {
- this.focused = true;
- this.calciteInternalRadioButtonFocus.emit();
- }
- };
- }
- checkedChanged(newChecked) {
- if (newChecked) {
- this.uncheckOtherRadioButtonsInGroup();
- }
- this.calciteInternalRadioButtonCheckedChange.emit(newChecked);
- }
- nameChanged() {
- this.checkLastRadioButton();
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- if (!this.disabled) {
- focusElement(this.containerEl);
- }
- }
- onLabelClick(event) {
- if (!this.disabled && !this.hidden) {
- this.uncheckOtherRadioButtonsInGroup();
- const label = event.currentTarget;
- const radioButton = label.for
- ? this.rootNode.querySelector(`calcite-radio-button[id="${label.for}"]`)
- : label.querySelector(`calcite-radio-button[name="${this.name}"]`);
- if (radioButton) {
- radioButton.checked = true;
- radioButton.focused = true;
- }
- this.calciteRadioButtonChange.emit();
- this.setFocus();
- }
- }
- checkLastRadioButton() {
- const radioButtons = this.queryButtons();
- const checkedRadioButtons = radioButtons.filter((radioButton) => radioButton.checked);
- if ((checkedRadioButtons === null || checkedRadioButtons === void 0 ? void 0 : checkedRadioButtons.length) > 1) {
- const lastCheckedRadioButton = checkedRadioButtons[checkedRadioButtons.length - 1];
- checkedRadioButtons
- .filter((checkedRadioButton) => checkedRadioButton !== lastCheckedRadioButton)
- .forEach((checkedRadioButton) => {
- checkedRadioButton.checked = false;
- checkedRadioButton.emitCheckedChange();
- });
- }
- }
- /** @internal */
- async emitCheckedChange() {
- this.calciteInternalRadioButtonCheckedChange.emit();
- }
- uncheckAllRadioButtonsInGroup() {
- const radioButtons = this.queryButtons();
- radioButtons.forEach((radioButton) => {
- if (radioButton.checked) {
- radioButton.checked = false;
- radioButton.focused = false;
- }
- });
- }
- uncheckOtherRadioButtonsInGroup() {
- const radioButtons = this.queryButtons();
- const otherRadioButtons = radioButtons.filter((radioButton) => radioButton.guid !== this.guid);
- otherRadioButtons.forEach((otherRadioButton) => {
- if (otherRadioButton.checked) {
- otherRadioButton.checked = false;
- otherRadioButton.focused = false;
- }
- });
- }
- getTabIndex() {
- if (this.disabled) {
- return undefined;
- }
- return this.checked || this.isDefaultSelectable() ? 0 : -1;
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- mouseenter() {
- this.hovered = true;
- }
- mouseleave() {
- this.hovered = false;
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- this.rootNode = this.el.getRootNode();
- this.guid = this.el.id || `calcite-radio-button-${guid()}`;
- if (this.name) {
- this.checkLastRadioButton();
- }
- connectLabel(this);
- connectForm(this);
- }
- componentDidLoad() {
- if (this.focused && !this.disabled) {
- this.setFocus();
- }
- }
- disconnectedCallback() {
- disconnectLabel(this);
- disconnectForm(this);
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- const tabIndex = this.getTabIndex();
- return (hAsync(Host, { onClick: this.clickHandler, onKeyDown: this.handleKeyDown }, hAsync("div", { "aria-checked": toAriaBoolean(this.checked), "aria-label": getLabelText(this), class: CSS$f.container, onBlur: this.onContainerBlur, onFocus: this.onContainerFocus, ref: this.setContainerEl, role: "radio", tabIndex: tabIndex }, hAsync("div", { class: "radio" })), hAsync(HiddenFormInputSlot, { component: this })));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "checked": ["checkedChanged"],
- "name": ["nameChanged"]
- }; }
- static get style() { return radioButtonCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-radio-button",
- "$members$": {
- "checked": [1540],
- "disabled": [516],
- "focused": [1540],
- "guid": [1537],
- "hidden": [516],
- "hovered": [1540],
- "label": [1],
- "name": [513],
- "required": [516],
- "scale": [513],
- "value": [1032],
- "setFocus": [64],
- "emitCheckedChange": [64]
- },
- "$listeners$": [[1, "mouseenter", "mouseenter"], [1, "mouseleave", "mouseleave"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["checked", "checked"], ["disabled", "disabled"], ["focused", "focused"], ["guid", "guid"], ["hidden", "hidden"], ["hovered", "hovered"], ["name", "name"], ["required", "required"], ["scale", "scale"]]
- }; }
- }
- const radioButtonGroupCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-radio-button-group:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-radio-button-group{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-radio-button-group{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-radio-button-group{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-radio-button-group{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-radio-button-group{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-radio-button-group:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-radio-button-group-h{display:none}/*!@:host*/.sc-calcite-radio-button-group-h{display:-ms-flexbox;display:flex;max-width:100vw}/*!@:host([layout=horizontal])*/[layout=horizontal].sc-calcite-radio-button-group-h{-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap}/*!@:host([layout=horizontal][scale=s])*/[layout=horizontal][scale=s].sc-calcite-radio-button-group-h{gap:1rem}/*!@:host([layout=horizontal][scale=m])*/[layout=horizontal][scale=m].sc-calcite-radio-button-group-h{gap:1.25rem}/*!@:host([layout=horizontal][scale=l])*/[layout=horizontal][scale=l].sc-calcite-radio-button-group-h{gap:1.5rem}/*!@:host([layout=vertical])*/[layout=vertical].sc-calcite-radio-button-group-h{-ms-flex-direction:column;flex-direction:column}";
- /**
- * @slot - A slot for adding `calcite-radio-button`s.
- */
- class RadioButtonGroup {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteRadioButtonGroupChange = createEvent(this, "calciteRadioButtonGroupChange", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** The disabled state of the radio button group. */
- this.disabled = false;
- /** The radio button group's hidden status. When a radio button group is hidden none of its options are focusable or checkable. */
- this.hidden = false;
- /** The layout direction of the radio buttons in a group. */
- this.layout = "horizontal";
- /** Requires that a value is selected for the radio button group before the parent form will submit. */
- this.required = false;
- /** The scale (size) of the radio button group. */
- this.scale = "m";
- // --------------------------------------------------------------------------
- //
- // Private Properties
- //
- // --------------------------------------------------------------------------
- this.mutationObserver = createObserver();
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- this.passPropsToRadioButtons = () => {
- const radioButtons = this.el.querySelectorAll("calcite-radio-button");
- if (radioButtons.length > 0) {
- radioButtons.forEach((radioButton) => {
- radioButton.disabled = this.disabled || radioButton.disabled;
- radioButton.hidden = this.hidden;
- radioButton.name = this.name;
- radioButton.required = this.required;
- radioButton.scale = this.scale;
- });
- }
- };
- }
- onDisabledChange() {
- this.passPropsToRadioButtons();
- }
- onHiddenChange() {
- this.passPropsToRadioButtons();
- }
- onLayoutChange() {
- this.passPropsToRadioButtons();
- }
- onScaleChange() {
- this.passPropsToRadioButtons();
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- var _a;
- this.passPropsToRadioButtons();
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });
- }
- disconnectedCallback() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- radioButtonChangeHandler(event) {
- this.calciteRadioButtonGroupChange.emit(event.target.value);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- return (hAsync(Host, { role: "radiogroup" }, hAsync("slot", null)));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "disabled": ["onDisabledChange"],
- "hidden": ["onHiddenChange"],
- "layout": ["onLayoutChange"],
- "scale": ["onScaleChange"]
- }; }
- static get style() { return radioButtonGroupCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-radio-button-group",
- "$members$": {
- "disabled": [516],
- "hidden": [516],
- "layout": [513],
- "name": [513],
- "required": [516],
- "scale": [513]
- },
- "$listeners$": [[0, "calciteRadioButtonChange", "radioButtonChangeHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"], ["hidden", "hidden"], ["layout", "layout"], ["name", "name"], ["required", "required"], ["scale", "scale"]]
- }; }
- }
- const radioGroupCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-radio-group:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-radio-group{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-radio-group{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-radio-group{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-radio-group{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-radio-group{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-radio-group:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-radio-group-h{display:none}/*!@:host*/.sc-calcite-radio-group-h{display:-ms-flexbox;display:flex;background-color:var(--calcite-ui-foreground-1);width:-moz-fit-content;width:-webkit-fit-content;width:fit-content;outline:1px solid var(--calcite-ui-border-input);outline-offset:-1px}/*!@:host([disabled])*/[disabled].sc-calcite-radio-group-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-radio-group-h[disabled] .sc-calcite-radio-group-s>[calcite-hydrated][disabled],[disabled].sc-calcite-radio-group-h [calcite-hydrated][disabled].sc-calcite-radio-group{opacity:1}/*!@:host([layout=vertical])*/[layout=vertical].sc-calcite-radio-group-h{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:flex-start;-ms-flex-item-align:start;align-self:flex-start}/*!@:host([width=full])*/[width=full].sc-calcite-radio-group-h{width:100%;min-width:-moz-fit-content;min-width:-webkit-fit-content;min-width:fit-content}/*!@:host([width=full]) ::slotted(calcite-radio-group-item)*/.sc-calcite-radio-group-h[width=full] .sc-calcite-radio-group-s>calcite-radio-group-item{-ms-flex:1 1 auto;flex:1 1 auto}/*!@:host([width=full][layout=vertical]) ::slotted(calcite-radio-group-item)*/.sc-calcite-radio-group-h[width=full][layout=vertical] .sc-calcite-radio-group-s>calcite-radio-group-item{-ms-flex-pack:start;justify-content:flex-start}/*!@::slotted(calcite-radio-group-item[checked]), ::slotted(calcite-radio-group-item:focus)*/.sc-calcite-radio-group-s>calcite-radio-group-item[checked],.sc-calcite-radio-group-s>calcite-radio-group-item:focus{z-index:0}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-radio-group-s>input[slot=hidden-form-input]{bottom:0 !important;left:0 !important;margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;right:0 !important;top:0 !important;-webkit-transform:none !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}";
- /**
- * @slot - A slot for adding `calcite-radio-group-item`s.
- */
- class RadioGroup {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteRadioGroupChange = createEvent(this, "calciteRadioGroupChange", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** specify the appearance style of the radio group, defaults to solid. */
- this.appearance = "solid";
- /** is the radio group disabled */
- this.disabled = false;
- /**
- * When true, makes the component required for form-submission.
- *
- * @internal
- */
- this.required = false;
- /** specify the layout of the radio group, defaults to horizontal */
- this.layout = "horizontal";
- /** The scale of the radio group */
- this.scale = "m";
- /** The value of the selectedItem */
- this.value = null;
- /** specify the width of the group, defaults to auto */
- this.width = "auto";
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- this.handleClick = (event) => {
- if (event.target.localName === "calcite-radio-group-item") {
- this.selectItem(event.target, true);
- }
- };
- }
- valueHandler(value) {
- const items = this.getItems();
- items.forEach((item) => (item.checked = item.value === value));
- }
- handleSelectedItemChange(newItem, oldItem) {
- this.value = newItem === null || newItem === void 0 ? void 0 : newItem.value;
- if (newItem === oldItem) {
- return;
- }
- const items = this.getItems();
- const match = Array.from(items)
- .filter((item) => item === newItem)
- .pop();
- if (match) {
- this.selectItem(match);
- }
- else if (items[0]) {
- items[0].tabIndex = 0;
- }
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentWillLoad() {
- const items = this.getItems();
- const lastChecked = Array.from(items)
- .filter((item) => item.checked)
- .pop();
- if (lastChecked) {
- this.selectItem(lastChecked);
- }
- else if (items[0]) {
- items[0].tabIndex = 0;
- }
- }
- connectedCallback() {
- connectLabel(this);
- connectForm(this);
- }
- disconnectedCallback() {
- disconnectLabel(this);
- disconnectForm(this);
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- render() {
- return (hAsync(Host, { onClick: this.handleClick, role: "radiogroup" }, hAsync("slot", null), hAsync(HiddenFormInputSlot, { component: this })));
- }
- handleSelected(event) {
- event.stopPropagation();
- event.preventDefault();
- this.selectItem(event.target);
- }
- handleKeyDown(event) {
- const keys = ["ArrowLeft", "ArrowUp", "ArrowRight", "ArrowDown", " "];
- const key = event.key;
- const { el, selectedItem } = this;
- if (keys.indexOf(key) === -1) {
- return;
- }
- let adjustedKey = key;
- if (getElementDir(el) === "rtl") {
- if (key === "ArrowRight") {
- adjustedKey = "ArrowLeft";
- }
- if (key === "ArrowLeft") {
- adjustedKey = "ArrowRight";
- }
- }
- const items = this.getItems();
- let selectedIndex = -1;
- items.forEach((item, index) => {
- if (item === selectedItem) {
- selectedIndex = index;
- }
- });
- switch (adjustedKey) {
- case "ArrowLeft":
- case "ArrowUp":
- event.preventDefault();
- const previous = selectedIndex < 1 ? items.item(items.length - 1) : items.item(selectedIndex - 1);
- this.selectItem(previous, true);
- return;
- case "ArrowRight":
- case "ArrowDown":
- event.preventDefault();
- const next = selectedIndex === -1 ? items.item(1) : items.item(selectedIndex + 1) || items.item(0);
- this.selectItem(next, true);
- return;
- case " ":
- event.preventDefault();
- this.selectItem(event.target, true);
- return;
- default:
- return;
- }
- }
- // --------------------------------------------------------------------------
- //
- // Methods
- //
- // --------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- var _a;
- (_a = (this.selectedItem || this.getItems()[0])) === null || _a === void 0 ? void 0 : _a.focus();
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- onLabelClick() {
- this.setFocus();
- }
- getItems() {
- return this.el.querySelectorAll("calcite-radio-group-item");
- }
- selectItem(selected, emit = false) {
- if (selected === this.selectedItem) {
- return;
- }
- const items = this.getItems();
- let match = null;
- items.forEach((item) => {
- const matches = item.value === selected.value;
- if ((matches && !item.checked) || (!matches && item.checked)) {
- item.checked = matches;
- }
- item.tabIndex = matches ? 0 : -1;
- if (matches) {
- match = item;
- if (emit) {
- this.calciteRadioGroupChange.emit(match.value);
- }
- }
- });
- this.selectedItem = match;
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "value": ["valueHandler"],
- "selectedItem": ["handleSelectedItemChange"]
- }; }
- static get style() { return radioGroupCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-radio-group",
- "$members$": {
- "appearance": [513],
- "disabled": [516],
- "required": [516],
- "layout": [513],
- "name": [1],
- "scale": [513],
- "value": [1025],
- "selectedItem": [1040],
- "width": [513],
- "setFocus": [64]
- },
- "$listeners$": [[0, "calciteRadioGroupItemChange", "handleSelected"], [0, "keydown", "handleKeyDown"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["appearance", "appearance"], ["disabled", "disabled"], ["required", "required"], ["layout", "layout"], ["scale", "scale"], ["width", "width"]]
- }; }
- }
- const SLOTS$8 = {
- input: "input"
- };
- const CSS$e = {
- radioGroupItemIcon: "radio-group-item-icon"
- };
- const radioGroupItemCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-radio-group-item:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-radio-group-item{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-radio-group-item{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-radio-group-item{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-radio-group-item{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-radio-group-item{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-radio-group-item:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-radio-group-item-h{display:none}/*!@:host*/.sc-calcite-radio-group-item-h{display:-ms-flexbox;display:flex;cursor:pointer;-ms-flex-item-align:stretch;align-self:stretch;font-weight:var(--calcite-font-weight-normal);-webkit-transition:background-color var(--calcite-internal-animation-timing-fast) ease-in-out, border-color var(--calcite-animation-timing) ease-in-out;transition:background-color var(--calcite-internal-animation-timing-fast) ease-in-out, border-color var(--calcite-animation-timing) ease-in-out}/*!@:host label*/.sc-calcite-radio-group-item-h label.sc-calcite-radio-group-item{pointer-events:none;margin:0.125rem;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex:1 1 0%;flex:1 1 0%;-ms-flex-align:center;align-items:center;color:var(--calcite-ui-text-3);-webkit-transition:background-color var(--calcite-internal-animation-timing-fast) ease-in-out, border-color var(--calcite-internal-animation-timing-fast) ease-in-out, color var(--calcite-internal-animation-timing-fast) ease-in-out;transition:background-color var(--calcite-internal-animation-timing-fast) ease-in-out, border-color var(--calcite-internal-animation-timing-fast) ease-in-out, color var(--calcite-internal-animation-timing-fast) ease-in-out}/*!@.label--horizontal*/.label--horizontal.sc-calcite-radio-group-item{-ms-flex-pack:center;justify-content:center}/*!@:host*/.sc-calcite-radio-group-item-h{outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@:host(:focus)*/.sc-calcite-radio-group-item-h:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-1px}/*!@.label--scale-s*/.label--scale-s.sc-calcite-radio-group-item{padding-left:0.5rem;padding-right:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem;padding-top:0.125rem;padding-bottom:0.125rem}/*!@.label--scale-m*/.label--scale-m.sc-calcite-radio-group-item{padding-left:0.75rem;padding-right:0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem;padding-top:0.375rem;padding-bottom:0.375rem}/*!@.label--scale-l*/.label--scale-l.sc-calcite-radio-group-item{padding-left:1rem;padding-right:1rem;padding-top:0.625rem;padding-bottom:0.625rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host(:hover) label*/.sc-calcite-radio-group-item-h:hover label.sc-calcite-radio-group-item{background-color:var(--calcite-ui-foreground-2);color:var(--calcite-ui-text-1)}/*!@:host(:active) label*/.sc-calcite-radio-group-item-h:active label.sc-calcite-radio-group-item{background-color:var(--calcite-ui-foreground-3)}/*!@:host([checked]) label*/[checked].sc-calcite-radio-group-item-h label.sc-calcite-radio-group-item{cursor:default;border-color:var(--calcite-ui-brand);background-color:var(--calcite-ui-brand);color:var(--calcite-ui-background)}/*!@:host([checked]) .label--outline*/[checked].sc-calcite-radio-group-item-h .label--outline.sc-calcite-radio-group-item{border-color:var(--calcite-ui-brand);background-color:var(--calcite-ui-foreground-1);-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-brand);box-shadow:inset 0 0 0 1px var(--calcite-ui-brand);color:var(--calcite-ui-brand)}/*!@::slotted(input)*/.sc-calcite-radio-group-item-s>input{display:none}/*!@.radio-group-item-icon*/.radio-group-item-icon.sc-calcite-radio-group-item{position:relative;margin:0px;display:-ms-inline-flexbox;display:inline-flex;line-height:inherit}/*!@:host([icon-position=start]) .label--scale-s .radio-group-item-icon*/[icon-position=start].sc-calcite-radio-group-item-h .label--scale-s.sc-calcite-radio-group-item .radio-group-item-icon.sc-calcite-radio-group-item{-webkit-margin-end:0.5rem;margin-inline-end:0.5rem}/*!@:host([icon-position=end]) .label--scale-s .radio-group-item-icon*/[icon-position=end].sc-calcite-radio-group-item-h .label--scale-s.sc-calcite-radio-group-item .radio-group-item-icon.sc-calcite-radio-group-item{-webkit-margin-end:unset;margin-inline-end:unset;-webkit-margin-start:0.5rem;margin-inline-start:0.5rem}/*!@:host([icon-position=start]) .label--scale-m .radio-group-item-icon*/[icon-position=start].sc-calcite-radio-group-item-h .label--scale-m.sc-calcite-radio-group-item .radio-group-item-icon.sc-calcite-radio-group-item{-webkit-margin-end:0.75rem;margin-inline-end:0.75rem}/*!@:host([icon-position=end]) .label--scale-m .radio-group-item-icon*/[icon-position=end].sc-calcite-radio-group-item-h .label--scale-m.sc-calcite-radio-group-item .radio-group-item-icon.sc-calcite-radio-group-item{-webkit-margin-end:unset;margin-inline-end:unset;-webkit-margin-start:0.75rem;margin-inline-start:0.75rem}/*!@:host([icon-position=start]) .label--scale-l .radio-group-item-icon*/[icon-position=start].sc-calcite-radio-group-item-h .label--scale-l.sc-calcite-radio-group-item .radio-group-item-icon.sc-calcite-radio-group-item{-webkit-margin-end:1rem;margin-inline-end:1rem}/*!@:host([icon-position=end]) .label--scale-l .radio-group-item-icon*/[icon-position=end].sc-calcite-radio-group-item-h .label--scale-l.sc-calcite-radio-group-item .radio-group-item-icon.sc-calcite-radio-group-item{-webkit-margin-end:unset;margin-inline-end:unset;-webkit-margin-start:1rem;margin-inline-start:1rem}";
- class RadioGroupItem {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteRadioGroupItemChange = createEvent(this, "calciteRadioGroupItemChange", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** Indicates whether the control is checked. */
- this.checked = false;
- /** flip the icon in rtl */
- this.iconFlipRtl = false;
- /** optionally used with icon, select where to position the icon */
- this.iconPosition = "start";
- }
- handleCheckedChange() {
- this.calciteRadioGroupItemChange.emit();
- }
- render() {
- const { checked, value } = this;
- const scale = getElementProp(this.el, "scale", "m");
- const appearance = getElementProp(this.el, "appearance", "solid");
- const layout = getElementProp(this.el, "layout", "horizontal");
- const iconEl = (hAsync("calcite-icon", { class: CSS$e.radioGroupItemIcon, flipRtl: this.iconFlipRtl, icon: this.icon, scale: "s" }));
- return (hAsync(Host, { "aria-checked": toAriaBoolean(checked), role: "radio" }, hAsync("label", { class: {
- "label--scale-s": scale === "s",
- "label--scale-m": scale === "m",
- "label--scale-l": scale === "l",
- "label--horizontal": layout === "horizontal",
- "label--outline": appearance === "outline"
- } }, this.icon && this.iconPosition === "start" ? iconEl : null, hAsync("slot", null, value), hAsync("slot", { name: SLOTS$8.input }), this.icon && this.iconPosition === "end" ? iconEl : null)));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "checked": ["handleCheckedChange"]
- }; }
- static get style() { return radioGroupItemCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-radio-group-item",
- "$members$": {
- "checked": [1540],
- "icon": [513],
- "iconFlipRtl": [516, "icon-flip-rtl"],
- "iconPosition": [513, "icon-position"],
- "value": [1032]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["checked", "checked"], ["icon", "icon"], ["iconFlipRtl", "icon-flip-rtl"], ["iconPosition", "icon-position"]]
- }; }
- }
- const TEXT$5 = {
- rating: "Rating",
- stars: "Stars: ${num}"
- };
- const ratingCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-rating:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-rating{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-rating{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-rating{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-rating{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-rating{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-rating:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-rating-h{display:none}/*!@:host*/.sc-calcite-rating-h{position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}/*!@:host([disabled])*/[disabled].sc-calcite-rating-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-rating-h[disabled] .sc-calcite-rating-s>[calcite-hydrated][disabled],[disabled].sc-calcite-rating-h [calcite-hydrated][disabled].sc-calcite-rating{opacity:1}/*!@:host([scale=s])*/[scale=s].sc-calcite-rating-h{height:1.5rem;--calcite-rating-spacing-unit:0.25rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-rating-h{height:2rem;--calcite-rating-spacing-unit:0.5rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-rating-h{height:2.75rem;--calcite-rating-spacing-unit:0.75rem}/*!@:host([read-only])*/[read-only].sc-calcite-rating-h{pointer-events:none}/*!@.fieldset*/.fieldset.sc-calcite-rating{margin:0px;display:-ms-flexbox;display:flex;border-width:0px;padding:0px}/*!@.wrapper*/.wrapper.sc-calcite-rating{display:inline-block;-webkit-margin-end:var(--calcite-rating-spacing-unit);margin-inline-end:var(--calcite-rating-spacing-unit)}/*!@.star*/.star.sc-calcite-rating{position:relative;display:-ms-flexbox;display:flex;cursor:pointer;outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;color:var(--calcite-ui-border-input);-webkit-transition:var(--calcite-animation-timing);transition:var(--calcite-animation-timing);-webkit-transform:scale(1);transform:scale(1)}/*!@.star:active*/.star.sc-calcite-rating:active{-webkit-transform:scale(1.1);transform:scale(1.1)}/*!@.focused*/.focused.sc-calcite-rating{outline:2px solid var(--calcite-ui-brand);outline-offset:2px}/*!@.average,\n.fraction*/.average.sc-calcite-rating,.fraction.sc-calcite-rating{color:var(--calcite-ui-warning)}/*!@.hovered,\n.selected,\n:host([read-only]) .average,\n:host([read-only]) .fraction*/.hovered.sc-calcite-rating,.selected.sc-calcite-rating,[read-only].sc-calcite-rating-h .average.sc-calcite-rating,[read-only].sc-calcite-rating-h .fraction.sc-calcite-rating{color:var(--calcite-ui-brand)}/*!@.hovered:not(.selected)*/.hovered.sc-calcite-rating:not(.selected){-webkit-transform:scale(0.9);transform:scale(0.9)}/*!@:host .fraction*/.sc-calcite-rating-h .fraction.sc-calcite-rating{pointer-events:none;position:absolute;top:0px;overflow:hidden;-webkit-transition:var(--calcite-animation-timing);transition:var(--calcite-animation-timing);inset-inline-start:0}/*!@calcite-chip*/calcite-chip.sc-calcite-rating{pointer-events:none;cursor:default}/*!@.number--average*/.number--average.sc-calcite-rating{font-weight:var(--calcite-font-weight-bold)}/*!@.number--count*/.number--count.sc-calcite-rating{color:var(--calcite-ui-text-2);font-style:italic}/*!@.number--count:not(:first-child)*/.number--count.sc-calcite-rating:not(:first-child){-webkit-margin-start:var(--calcite-rating-spacing-unit);margin-inline-start:var(--calcite-rating-spacing-unit)}/*!@.visually-hidden*/.visually-hidden.sc-calcite-rating{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-rating-s>input[slot=hidden-form-input]{bottom:0 !important;left:0 !important;margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;right:0 !important;top:0 !important;-webkit-transform:none !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}";
- class Rating {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteRatingChange = createEvent(this, "calciteRatingChange", 7);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /** specify the scale of the component, defaults to m */
- this.scale = "m";
- /** the value of the rating component */
- this.value = 0;
- /** is the rating component in a selectable mode */
- this.readOnly = false;
- /** is the rating component in a selectable mode */
- this.disabled = false;
- /** Show average and count data summary chip (if available) */
- this.showChip = false;
- /** Localized string for "Rating" (used for aria label)
- * @default "Rating"
- */
- this.intlRating = TEXT$5.rating;
- /** Localized string for labelling each star, `${num}` in the string will be replaced by the number
- * @default "Stars: ${num}"
- */
- this.intlStars = TEXT$5.stars;
- /**
- * When true, makes the component required for form-submission.
- *
- * @internal
- */
- this.required = false;
- this.guid = `calcite-ratings-${guid()}`;
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- connectLabel(this);
- connectForm(this);
- }
- disconnectedCallback() {
- disconnectLabel(this);
- disconnectForm(this);
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- blurHandler() {
- this.hasFocus = false;
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- renderStars() {
- return [1, 2, 3, 4, 5].map((i) => {
- const selected = this.value >= i;
- const average = this.average && !this.value && i <= this.average;
- const hovered = i <= this.hoverValue;
- const fraction = this.average && this.average + 1 - i;
- const partial = !this.value && !hovered && fraction > 0 && fraction < 1;
- const focused = this.hasFocus && this.focusValue === i;
- return (hAsync("span", { class: { wrapper: true } }, hAsync("label", { class: { star: true, focused, selected, average, hovered, partial }, htmlFor: `${this.guid}-${i}`, onMouseOver: () => {
- this.hoverValue = i;
- } }, hAsync("calcite-icon", { "aria-hidden": "true", class: "icon", icon: selected || average || this.readOnly ? "star-f" : "star", scale: this.scale }), partial && (hAsync("div", { class: "fraction", style: { width: `${fraction * 100}%` } }, hAsync("calcite-icon", { icon: "star-f", scale: this.scale }))), hAsync("span", { class: "visually-hidden" }, this.intlStars.replace("${num}", `${i}`))), hAsync("input", { checked: i === this.value, class: "visually-hidden", disabled: this.disabled || this.readOnly, id: `${this.guid}-${i}`, name: this.guid, onChange: () => this.updateValue(i), onClick: (event) =>
- // click is fired from the the component's label, so we treat this as an internal event
- event.stopPropagation(), onFocus: () => {
- this.hasFocus = true;
- this.focusValue = i;
- }, ref: (el) => (i === 1 || i === this.value) && (this.inputFocusRef = el), type: "radio", value: i })));
- });
- }
- render() {
- const { disabled, intlRating, showChip, scale, count, average } = this;
- return (hAsync(Fragment, null, hAsync("fieldset", { class: "fieldset", disabled: disabled, onBlur: () => (this.hoverValue = null), onMouseLeave: () => (this.hoverValue = null), onTouchEnd: () => (this.hoverValue = null) }, hAsync("legend", { class: "visually-hidden" }, intlRating), this.renderStars()), (count || average) && showChip ? (hAsync("calcite-chip", { scale: scale, value: count === null || count === void 0 ? void 0 : count.toString() }, !!average && hAsync("span", { class: "number--average" }, average.toString()), !!count && hAsync("span", { class: "number--count" }, "(", count === null || count === void 0 ? void 0 :
- count.toString(), ")"))) : null, hAsync(HiddenFormInputSlot, { component: this })));
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- onLabelClick() {
- this.setFocus();
- }
- updateValue(value) {
- this.value = value;
- this.calciteRatingChange.emit({ value });
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- this.inputFocusRef.focus();
- }
- get el() { return getElement(this); }
- static get style() { return ratingCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-rating",
- "$members$": {
- "scale": [513],
- "value": [1538],
- "readOnly": [516, "read-only"],
- "disabled": [516],
- "showChip": [516, "show-chip"],
- "count": [514],
- "average": [514],
- "name": [513],
- "intlRating": [1, "intl-rating"],
- "intlStars": [1, "intl-stars"],
- "required": [516],
- "hoverValue": [32],
- "focusValue": [32],
- "hasFocus": [32],
- "setFocus": [64]
- },
- "$listeners$": [[0, "blur", "blurHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["scale", "scale"], ["value", "value"], ["readOnly", "read-only"], ["disabled", "disabled"], ["showChip", "show-chip"], ["count", "count"], ["average", "average"], ["name", "name"], ["required", "required"]]
- }; }
- }
- const CSS$d = {
- scrim: "scrim",
- content: "content"
- };
- const TEXT$4 = {
- loading: "Loading"
- };
- const scrimCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-scrim:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-scrim{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-scrim{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-scrim{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-scrim{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-scrim{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-scrim:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-scrim-h{display:none}/*!@:host*/.sc-calcite-scrim-h{position:absolute;top:0px;right:0px;bottom:0px;left:0px;z-index:50;display:-ms-flexbox;display:flex;height:100%;width:100%;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:stretch;align-items:stretch}@-webkit-keyframes calcite-scrim-fade-in{0%{--tw-bg-opacity:0}100%{--tw-text-opacity:1}}@keyframes calcite-scrim-fade-in{0%{--tw-bg-opacity:0}100%{--tw-text-opacity:1}}/*!@.scrim*/.scrim.sc-calcite-scrim{position:absolute;top:0px;right:0px;bottom:0px;left:0px;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-line-pack:center;align-content:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;overflow:hidden;-webkit-animation:calcite-scrim-fade-in var(--calcite-internal-animation-timing-medium) ease-in-out;animation:calcite-scrim-fade-in var(--calcite-internal-animation-timing-medium) ease-in-out;background-color:var(--calcite-scrim-background)}/*!@.content*/.content.sc-calcite-scrim{padding:1rem}";
- /**
- * @slot - A slot for adding custom content, primarily loading information.
- */
- class Scrim {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /** string to override English loading text
- * @default "Loading"
- */
- this.intlLoading = TEXT$4.loading;
- /**
- * Determines if the component will have the loader overlay.
- * Otherwise, will render opaque disabled state.
- */
- this.loading = false;
- }
- // --------------------------------------------------------------------------
- //
- // Render Method
- //
- // --------------------------------------------------------------------------
- render() {
- const { el, loading, intlLoading } = this;
- const hasContent = el.innerHTML.trim().length > 0;
- const loaderNode = loading ? hAsync("calcite-loader", { active: true, label: intlLoading }) : null;
- const contentNode = hasContent ? (hAsync("div", { class: CSS$d.content }, hAsync("slot", null))) : null;
- return (hAsync("div", { class: CSS$d.scrim }, loaderNode, contentNode));
- }
- get el() { return getElement(this); }
- static get style() { return scrimCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-scrim",
- "$members$": {
- "intlLoading": [1, "intl-loading"],
- "loading": [516]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["loading", "loading"]]
- }; }
- }
- const CSS$c = {
- icon: "icon",
- iconContainer: "icon-container",
- select: "select"
- };
- const selectCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-select:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-select{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-select{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-select{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-select{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-select{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:host*/.sc-calcite-select-h{--calcite-icon-size:1rem;--calcite-spacing-eighth:0.125rem;--calcite-spacing-quarter:0.25rem;--calcite-spacing-half:0.5rem;--calcite-spacing-three-quarters:0.75rem;--calcite-spacing:1rem;--calcite-spacing-plus-quarter:1.25rem;--calcite-spacing-plus-half:1.5rem;--calcite-spacing-double:2rem;--calcite-menu-min-width:10rem;--calcite-header-min-height:3rem;--calcite-footer-min-height:3rem}/*!@:root*/.sc-calcite-select:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-select-h{display:none}/*!@:host*/.sc-calcite-select-h{position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:stretch;align-items:stretch;width:var(--select-width)}/*!@:host([disabled])*/[disabled].sc-calcite-select-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-select-h[disabled] .sc-calcite-select-s>[calcite-hydrated][disabled],[disabled].sc-calcite-select-h [calcite-hydrated][disabled].sc-calcite-select{opacity:1}/*!@:host([scale=s])*/[scale=s].sc-calcite-select-h{height:1.5rem;--calcite-select-font-size:var(--calcite-font-size--2);--calcite-select-spacing-inline:0.5rem 2rem}/*!@:host([scale=s]) .icon-container*/[scale=s].sc-calcite-select-h .icon-container.sc-calcite-select{padding-left:0.5rem;padding-right:0.5rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-select-h{height:2rem;--calcite-select-font-size:var(--calcite-font-size--1);--calcite-select-spacing-inline:0.75rem 2.5rem}/*!@:host([scale=m]) .icon-container*/[scale=m].sc-calcite-select-h .icon-container.sc-calcite-select{padding-left:0.75rem;padding-right:0.75rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-select-h{height:44px;--calcite-select-font-size:var(--calcite-font-size-0);--calcite-select-spacing-inline:1rem 3rem}/*!@:host([scale=l]) .icon-container*/[scale=l].sc-calcite-select-h .icon-container.sc-calcite-select{padding-left:1rem;padding-right:1rem}/*!@:host([width=auto])*/[width=auto].sc-calcite-select-h{width:auto}/*!@:host([width=half])*/[width=half].sc-calcite-select-h{width:50%}/*!@:host([width=full])*/[width=full].sc-calcite-select-h{width:100%}/*!@.select*/.select.sc-calcite-select{margin:0px;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:0px;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-input);background-color:var(--calcite-ui-foreground-1);font-family:inherit;color:var(--calcite-ui-text-2);outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;font-size:var(--calcite-select-font-size);padding-inline:var(--calcite-select-spacing-inline);border-inline-end-width:0px}/*!@.select:focus*/.select.sc-calcite-select:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@.select:hover*/.select.sc-calcite-select:hover{background-color:var(--calcite-ui-foreground-2)}/*!@select:disabled*/select.sc-calcite-select:disabled{border-color:var(--calcite-ui-border-input);--tw-bg-opacity:1}/*!@.icon-container*/.icon-container.sc-calcite-select{pointer-events:none;position:absolute;top:0px;bottom:0px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;border-width:0px;border-style:solid;border-color:var(--calcite-ui-border-input);background-color:transparent;color:var(--calcite-ui-text-2);inset-inline-end:0px;border-inline-width:0px 1px}/*!@.select:focus ~ .icon-container*/.select.sc-calcite-select:focus~.icon-container.sc-calcite-select{border-color:transparent}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-select-s>input[slot=hidden-form-input]{bottom:0 !important;left:0 !important;margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;right:0 !important;top:0 !important;-webkit-transform:none !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}";
- function isOption(optionOrGroup) {
- return optionOrGroup.tagName === "CALCITE-OPTION";
- }
- function isOptionGroup(optionOrGroup) {
- return optionOrGroup.tagName === "CALCITE-OPTION-GROUP";
- }
- /**
- * @slot - A slot for adding `calcite-option`s.
- */
- class Select {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteSelectChange = createEvent(this, "calciteSelectChange", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /**
- * When true, it prevents the option from being selected.
- */
- this.disabled = false;
- /**
- * When true, makes the component required for form-submission.
- *
- * @internal
- */
- this.required = false;
- /**
- * The component scale.
- */
- this.scale = "m";
- /** The value of the selectedOption */
- this.value = null;
- /**
- * The component width.
- */
- this.width = "auto";
- this.componentToNativeEl = new Map();
- this.mutationObserver = createObserver();
- this.handleInternalSelectChange = () => {
- const selected = this.selectEl.selectedOptions[0];
- this.selectFromNativeOption(selected);
- requestAnimationFrame(() => this.emitChangeEvent());
- };
- this.populateInternalSelect = () => {
- const optionsAndGroups = Array.from(this.el.children).filter((child) => child.tagName === "CALCITE-OPTION" || child.tagName === "CALCITE-OPTION-GROUP");
- this.clearInternalSelect();
- optionsAndGroups.forEach((optionOrGroup) => { var _a; return (_a = this.selectEl) === null || _a === void 0 ? void 0 : _a.append(this.toNativeElement(optionOrGroup)); });
- };
- this.storeSelectRef = (node) => {
- this.selectEl = node;
- this.populateInternalSelect();
- const selected = this.selectEl.selectedOptions[0];
- this.selectFromNativeOption(selected);
- };
- this.emitChangeEvent = () => {
- this.calciteSelectChange.emit();
- };
- }
- valueHandler(value) {
- const items = this.el.querySelectorAll("calcite-option");
- items.forEach((item) => (item.selected = item.value === value));
- }
- selectedOptionHandler(selectedOption) {
- this.value = selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.value;
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- var _a;
- const { el } = this;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(el, {
- subtree: true,
- childList: true
- });
- connectLabel(this);
- connectForm(this);
- }
- disconnectedCallback() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- disconnectLabel(this);
- disconnectForm(this);
- }
- componentDidLoad() {
- var _a, _b;
- afterConnectDefaultValueSet(this, (_b = (_a = this.selectedOption) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : "");
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- focusElement(this.selectEl);
- }
- handleOptionOrGroupChange(event) {
- event.stopPropagation();
- const optionOrGroup = event.target;
- const nativeEl = this.componentToNativeEl.get(optionOrGroup);
- if (!nativeEl) {
- return;
- }
- this.updateNativeElement(optionOrGroup, nativeEl);
- if (isOption(optionOrGroup) && optionOrGroup.selected) {
- this.deselectAllExcept(optionOrGroup);
- this.selectedOption = optionOrGroup;
- }
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- onLabelClick() {
- this.setFocus();
- }
- updateNativeElement(optionOrGroup, nativeOptionOrGroup) {
- nativeOptionOrGroup.disabled = optionOrGroup.disabled;
- nativeOptionOrGroup.label = optionOrGroup.label;
- if (isOption(optionOrGroup)) {
- const option = nativeOptionOrGroup;
- option.selected = optionOrGroup.selected;
- option.value = optionOrGroup.value;
- // need to set innerText for mobile
- // see https://stackoverflow.com/questions/35021620/ios-safari-not-showing-all-options-for-select-menu/41749701
- option.innerText = optionOrGroup.label;
- }
- }
- clearInternalSelect() {
- this.componentToNativeEl.forEach((value) => value.remove());
- this.componentToNativeEl.clear();
- }
- selectFromNativeOption(nativeOption) {
- if (!nativeOption) {
- return;
- }
- let futureSelected;
- this.componentToNativeEl.forEach((nativeOptionOrGroup, optionOrGroup) => {
- if (isOption(optionOrGroup) && nativeOptionOrGroup === nativeOption) {
- optionOrGroup.selected = true;
- futureSelected = optionOrGroup;
- this.deselectAllExcept(optionOrGroup);
- }
- });
- if (futureSelected) {
- this.selectedOption = futureSelected;
- }
- }
- toNativeElement(optionOrGroup) {
- if (isOption(optionOrGroup)) {
- const option = document.createElement("option");
- this.updateNativeElement(optionOrGroup, option);
- this.componentToNativeEl.set(optionOrGroup, option);
- return option;
- }
- if (isOptionGroup(optionOrGroup)) {
- const group = document.createElement("optgroup");
- this.updateNativeElement(optionOrGroup, group);
- Array.from(optionOrGroup.children).forEach((option) => {
- const nativeOption = this.toNativeElement(option);
- group.append(nativeOption);
- this.componentToNativeEl.set(optionOrGroup, nativeOption);
- });
- this.componentToNativeEl.set(optionOrGroup, group);
- return group;
- }
- throw new Error("unsupported element child provided");
- }
- deselectAllExcept(except) {
- this.el.querySelectorAll("calcite-option").forEach((option) => {
- if (option === except) {
- return;
- }
- option.selected = false;
- });
- }
- //--------------------------------------------------------------------------
- //
- // Render Methods
- //
- //--------------------------------------------------------------------------
- renderChevron() {
- return (hAsync("div", { class: CSS$c.iconContainer }, hAsync("calcite-icon", { class: CSS$c.icon, icon: "chevron-down", scale: "s" })));
- }
- render() {
- return (hAsync(Fragment, null, hAsync("select", { "aria-label": this.label, class: CSS$c.select, disabled: this.disabled, onChange: this.handleInternalSelectChange, ref: this.storeSelectRef }, hAsync("slot", null)), this.renderChevron(), hAsync(HiddenFormInputSlot, { component: this })));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "value": ["valueHandler"],
- "selectedOption": ["selectedOptionHandler"]
- }; }
- static get style() { return selectCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-select",
- "$members$": {
- "disabled": [516],
- "label": [1],
- "name": [1],
- "required": [516],
- "scale": [513],
- "value": [1025],
- "selectedOption": [1040],
- "width": [513],
- "setFocus": [64]
- },
- "$listeners$": [[0, "calciteOptionChange", "handleOptionOrGroupChange"], [0, "calciteOptionGroupChange", "handleOptionOrGroupChange"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"], ["required", "required"], ["scale", "scale"], ["width", "width"]]
- }; }
- }
- const CSS$b = {
- main: "main",
- mainReversed: "main--reversed",
- content: "content",
- contentBehind: "content--behind",
- footer: "footer"
- };
- const SLOTS$7 = {
- centerRow: "center-row",
- primaryPanel: "primary-panel",
- contextualPanel: "contextual-panel",
- header: "header",
- footer: "footer"
- };
- const shellCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-shell:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-shell{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-shell{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-shell{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-shell{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-shell{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:host*/.sc-calcite-shell-h{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}/*!@:host **/.sc-calcite-shell-h *.sc-calcite-shell{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:root*/.sc-calcite-shell:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-shell-h{display:none}/*!@:host*/.sc-calcite-shell-h{position:absolute;top:0px;right:0px;bottom:0px;left:0px;display:-ms-flexbox;display:flex;height:100%;width:100%;-ms-flex-direction:column;flex-direction:column;overflow:hidden;--calcite-shell-tip-spacing:26vw}/*!@.main*/.main.sc-calcite-shell{position:relative;display:-ms-flexbox;display:flex;height:100%;width:100%;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:justify;justify-content:space-between;overflow:hidden}/*!@.main--reversed*/.main--reversed.sc-calcite-shell{-ms-flex-direction:row-reverse;flex-direction:row-reverse}/*!@.content*/.content.sc-calcite-shell{display:-ms-flexbox;display:flex;height:100%;width:100%;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow:auto}/*!@.content ::slotted(calcite-shell-center-row), .content ::slotted(calcite-panel), .content ::slotted(calcite-flow)*/.content .sc-calcite-shell-s>calcite-shell-center-row,.content.sc-calcite-shell-s>calcite-panel,.content .sc-calcite-shell-s>calcite-panel,.content.sc-calcite-shell-s>calcite-flow,.content .sc-calcite-shell-s>calcite-flow{-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-item-align:stretch;align-self:stretch;max-height:unset}/*!@.content--behind*/.content--behind.sc-calcite-shell{position:absolute;top:0px;right:0px;bottom:0px;left:0px;z-index:0;border-width:0px;display:initial}/*!@::slotted(calcite-shell-center-row)*/.sc-calcite-shell-s>calcite-shell-center-row{width:unset}/*!@::slotted(.header .heading)*/.sc-calcite-shell-s>.header .heading{font-size:var(--calcite-font-size--2);line-height:1.375;font-weight:var(--calcite-font-weight-normal)}/*!@::slotted(calcite-shell-panel), ::slotted(calcite-shell-center-row)*/.sc-calcite-shell-s>calcite-shell-panel,.sc-calcite-shell-s>calcite-shell-center-row{position:relative;z-index:1}/*!@::slotted(calcite-panel), ::slotted(calcite-flow)*/.sc-calcite-shell-s>calcite-panel,.sc-calcite-shell-s>calcite-flow{border-width:1px;border-left-width:0px;border-right-width:0px;border-style:solid;border-color:var(--calcite-ui-border-3)}/*!@slot[name=center-row]::slotted(calcite-shell-center-row:not([detached]))*/slot[name=center-row].sc-calcite-shell-s>calcite-shell-center-row:not([detached]){border-left-width:1px;border-right-width:1px;border-color:var(--calcite-ui-border-3)}/*!@::slotted(calcite-tip-manager)*/.sc-calcite-shell-s>calcite-tip-manager{position:absolute;-webkit-box-sizing:border-box;box-sizing:border-box}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}/*!@::slotted(calcite-tip-manager)*/.sc-calcite-shell-s>calcite-tip-manager{-webkit-animation:in-up var(--calcite-internal-animation-timing-slow) ease-in-out;animation:in-up var(--calcite-internal-animation-timing-slow) ease-in-out;border-radius:0.25rem;--tw-shadow:0 6px 20px -4px rgba(0, 0, 0, 0.1), 0 4px 12px -2px rgba(0, 0, 0, 0.08);--tw-shadow-colored:0 6px 20px -4px var(--tw-shadow-color), 0 4px 12px -2px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);bottom:0.5rem;left:var(--calcite-shell-tip-spacing);right:var(--calcite-shell-tip-spacing);z-index:2}";
- /**
- * @slot - A slot for adding content to the shell. This content will appear between any leading and trailing panels added to the shell. (eg. a map)
- * @slot header - A slot for adding header content. This content will be positioned at the top of the shell.
- * @slot footer - A slot for adding footer content. This content will be positioned at the bottom of the shell.
- * @slot primary-panel - A slot for adding the leading `calcite-shell-panel`.
- * @slot contextual-panel - A slot for adding the trailing `calcite-shell-panel`.
- * @slot center-row - A slot for adding custom content in the center row.
- */
- class Shell {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * Positions the center content behind any calcite-shell-panels.
- */
- this.contentBehind = false;
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- disconnectConditionalSlotComponent(this);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- renderHeader() {
- const hasHeader = !!getSlotted(this.el, SLOTS$7.header);
- return hasHeader ? hAsync("slot", { key: "header", name: SLOTS$7.header }) : null;
- }
- renderContent() {
- const defaultSlotNode = hAsync("slot", { key: "default-slot" });
- const centerRowSlotNode = hAsync("slot", { key: "center-row-slot", name: SLOTS$7.centerRow });
- const contentContainerKey = "content-container";
- const content = !!this.contentBehind
- ? [
- hAsync("div", { class: {
- [CSS$b.content]: true,
- [CSS$b.contentBehind]: true
- }, key: contentContainerKey }, defaultSlotNode),
- centerRowSlotNode
- ]
- : [
- hAsync("div", { class: CSS$b.content, key: contentContainerKey }, defaultSlotNode, centerRowSlotNode)
- ];
- return content;
- }
- renderFooter() {
- const hasFooter = !!getSlotted(this.el, SLOTS$7.footer);
- return hasFooter ? (hAsync("div", { class: CSS$b.footer, key: "footer" }, hAsync("slot", { name: SLOTS$7.footer }))) : null;
- }
- renderMain() {
- const primaryPanel = getSlotted(this.el, SLOTS$7.primaryPanel);
- const mainClasses = {
- [CSS$b.main]: true,
- [CSS$b.mainReversed]: (primaryPanel === null || primaryPanel === void 0 ? void 0 : primaryPanel.position) === "end"
- };
- return (hAsync("div", { class: mainClasses }, hAsync("slot", { name: SLOTS$7.primaryPanel }), this.renderContent(), hAsync("slot", { name: SLOTS$7.contextualPanel })));
- }
- render() {
- return (hAsync(Fragment, null, this.renderHeader(), this.renderMain(), this.renderFooter()));
- }
- get el() { return getElement(this); }
- static get style() { return shellCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-shell",
- "$members$": {
- "contentBehind": [516, "content-behind"]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["contentBehind", "content-behind"]]
- }; }
- }
- const CSS$a = {
- actionBarContainer: "action-bar-container",
- content: "content"
- };
- const SLOTS$6 = {
- actionBar: "action-bar"
- };
- const shellCenterRowCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-shell-center-row:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-shell-center-row{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-shell-center-row{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-shell-center-row{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-shell-center-row{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-shell-center-row{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:host*/.sc-calcite-shell-center-row-h{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}/*!@:host **/.sc-calcite-shell-center-row-h *.sc-calcite-shell-center-row{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:root*/.sc-calcite-shell-center-row:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-shell-center-row-h{display:none}/*!@:host*/.sc-calcite-shell-center-row-h{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;overflow:hidden;background-color:transparent}/*!@.content*/.content.sc-calcite-shell-center-row{margin:0px;display:-ms-flexbox;display:flex;height:100%;width:100%;overflow:hidden;-ms-flex:1 0 0px;flex:1 0 0}/*!@.action-bar-container*/.action-bar-container.sc-calcite-shell-center-row{display:-ms-flexbox;display:flex}/*!@:host([detached])*/[detached].sc-calcite-shell-center-row-h{margin-left:0.5rem;margin-right:0.5rem;margin-top:0.5rem;margin-bottom:1.5rem}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}/*!@:host([detached])*/[detached].sc-calcite-shell-center-row-h{-webkit-animation:in-up var(--calcite-internal-animation-timing-slow) ease-in-out;animation:in-up var(--calcite-internal-animation-timing-slow) ease-in-out;border-radius:0.25rem;border-width:0px;--tw-shadow:0 4px 8px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.04);--tw-shadow-colored:0 4px 8px -1px var(--tw-shadow-color), 0 2px 4px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@:host([position=end])*/[position=end].sc-calcite-shell-center-row-h{-ms-flex-item-align:end;align-self:flex-end}/*!@:host([position=start])*/[position=start].sc-calcite-shell-center-row-h{-ms-flex-item-align:start;align-self:flex-start}/*!@:host([height-scale=s])*/[height-scale=s].sc-calcite-shell-center-row-h{height:33.333333%}/*!@:host([height-scale=m])*/[height-scale=m].sc-calcite-shell-center-row-h{height:70%}/*!@:host([height-scale=l])*/[height-scale=l].sc-calcite-shell-center-row-h{height:100%}/*!@:host([height-scale=l][detached])*/[height-scale=l][detached].sc-calcite-shell-center-row-h{height:calc(100% - 2rem)}/*!@::slotted(calcite-panel)*/.sc-calcite-shell-center-row-s>calcite-panel{height:100%;width:100%}/*!@::slotted(calcite-action-bar),\n::slotted(calcite-action-bar[position=end])*/.sc-calcite-shell-center-row-s>calcite-action-bar,.sc-calcite-shell-center-row-s>calcite-action-bar[position=end]{-webkit-border-end:1px solid;border-inline-end:1px solid;border-color:var(--calcite-ui-border-3)}";
- /**
- * @slot - A slot for adding content to the shell panel.
- * @slot action-bar - A slot for adding a `calcite-action-bar` to the panel.
- */
- class ShellCenterRow {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * This property makes the content area appear like a "floating" panel.
- */
- this.detached = false;
- /**
- * Specifies the maximum height of the row.
- */
- this.heightScale = "s";
- /**
- * Arranges the component depending on the elements 'dir' property.
- */
- this.position = "end";
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- disconnectConditionalSlotComponent(this);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- const { el } = this;
- const contentNode = (hAsync("div", { class: CSS$a.content }, hAsync("slot", null)));
- const actionBar = getSlotted(el, SLOTS$6.actionBar);
- const actionBarNode = actionBar ? (hAsync("div", { class: CSS$a.actionBarContainer, key: "action-bar" }, hAsync("slot", { name: SLOTS$6.actionBar }))) : null;
- const children = [actionBarNode, contentNode];
- if ((actionBar === null || actionBar === void 0 ? void 0 : actionBar.position) === "end") {
- children.reverse();
- }
- return hAsync(Fragment, null, children);
- }
- get el() { return getElement(this); }
- static get style() { return shellCenterRowCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-shell-center-row",
- "$members$": {
- "detached": [516],
- "heightScale": [513, "height-scale"],
- "position": [513]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["detached", "detached"], ["heightScale", "height-scale"], ["position", "position"]]
- }; }
- }
- const CSS$9 = {
- container: "container",
- content: "content",
- contentHeader: "content__header",
- contentBody: "content__body",
- contentDetached: "content--detached",
- separator: "separator"
- };
- const SLOTS$5 = {
- actionBar: "action-bar",
- header: "header"
- };
- const TEXT$3 = {
- resize: "Resize"
- };
- const shellPanelCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-shell-panel:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-shell-panel{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-shell-panel{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-shell-panel{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-shell-panel{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-shell-panel{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-shell-panel:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-shell-panel-h{display:none}/*!@:host*/.sc-calcite-shell-panel-h{pointer-events:none;display:-ms-flexbox;display:flex;-ms-flex:0 1 auto;flex:0 1 auto;-ms-flex-align:stretch;align-items:stretch;--calcite-shell-panel-detached-max-height:unset}/*!@.container*/.container.sc-calcite-shell-panel{pointer-events:none;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-align:stretch;align-items:stretch;background-color:transparent;font-size:var(--calcite-font-size--1);color:var(--calcite-ui-text-2)}/*!@.container **/.container.sc-calcite-shell-panel *.sc-calcite-shell-panel{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:host(:hover) .separator:not(:hover):not(:focus), :host(:focus-within) .separator:not(:hover):not(:focus)*/.sc-calcite-shell-panel-h:hover .separator.sc-calcite-shell-panel:not(:hover):not(:focus),.sc-calcite-shell-panel-h:focus-within .separator.sc-calcite-shell-panel:not(:hover):not(:focus){opacity:1;background-color:var(--calcite-ui-border-3)}/*!@.separator*/.separator.sc-calcite-shell-panel{pointer-events:auto;position:absolute;bottom:0px;top:0px;z-index:10;display:-ms-flexbox;display:flex;height:100%;width:0.125rem;background-color:transparent;opacity:0;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;cursor:col-resize;outline:none}/*!@.separator:hover*/.separator.sc-calcite-shell-panel:hover{opacity:1;background-color:var(--calcite-ui-border-2)}/*!@.separator:focus*/.separator.sc-calcite-shell-panel:focus{background-color:var(--calcite-ui-brand);opacity:1}/*!@:host([position=start]) .separator*/[position=start].sc-calcite-shell-panel-h .separator.sc-calcite-shell-panel{inset-inline-end:-2px}/*!@:host([position=end]) .separator*/[position=end].sc-calcite-shell-panel-h .separator.sc-calcite-shell-panel{inset-inline-start:-2px}/*!@::slotted(calcite-panel), ::slotted(calcite-flow)*/.sc-calcite-shell-panel-s>calcite-panel,.sc-calcite-shell-panel-s>calcite-flow{height:100%;width:100%;-ms-flex:1 1 auto;flex:1 1 auto;max-height:unset;max-width:unset}/*!@::slotted(.calcite-match-height)*/.sc-calcite-shell-panel-s>.calcite-match-height{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;overflow:hidden}/*!@.content*/.content.sc-calcite-shell-panel{pointer-events:auto;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-align:stretch;align-items:stretch;-ms-flex-item-align:stretch;align-self:stretch;background-color:var(--calcite-ui-background);padding:0px;width:var(--calcite-shell-panel-width);max-width:var(--calcite-shell-panel-max-width);min-width:var(--calcite-shell-panel-min-width);-webkit-transition:max-height var(--calcite-animation-timing), max-width var(--calcite-animation-timing);transition:max-height var(--calcite-animation-timing), max-width var(--calcite-animation-timing)}/*!@.content__header*/.content__header.sc-calcite-shell-panel{display:-ms-flexbox;display:flex;-ms-flex:0 1 auto;flex:0 1 auto;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-align:stretch;align-items:stretch}/*!@.content__body*/.content__body.sc-calcite-shell-panel{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column;overflow:hidden}/*!@:host([width-scale=s]) .content*/[width-scale=s].sc-calcite-shell-panel-h .content.sc-calcite-shell-panel{--calcite-shell-panel-width:calc(var(--calcite-panel-width-multiplier) * 12vw);--calcite-shell-panel-max-width:calc(var(--calcite-panel-width-multiplier) * 300px);--calcite-shell-panel-min-width:calc(var(--calcite-panel-width-multiplier) * 150px)}/*!@:host([width-scale=m]) .content*/[width-scale=m].sc-calcite-shell-panel-h .content.sc-calcite-shell-panel{--calcite-shell-panel-width:calc(var(--calcite-panel-width-multiplier) * 20vw);--calcite-shell-panel-max-width:calc(var(--calcite-panel-width-multiplier) * 420px);--calcite-shell-panel-min-width:calc(var(--calcite-panel-width-multiplier) * 240px)}/*!@:host([width-scale=l]) .content*/[width-scale=l].sc-calcite-shell-panel-h .content.sc-calcite-shell-panel{--calcite-shell-panel-width:calc(var(--calcite-panel-width-multiplier) * 45vw);--calcite-shell-panel-max-width:calc(var(--calcite-panel-width-multiplier) * 680px);--calcite-shell-panel-min-width:calc(var(--calcite-panel-width-multiplier) * 340px)}/*!@:host([detached-height-scale=s]) .content--detached*/[detached-height-scale=s].sc-calcite-shell-panel-h .content--detached.sc-calcite-shell-panel{--calcite-shell-panel-detached-max-height:40vh}/*!@:host([detached-height-scale=m]) .content--detached*/[detached-height-scale=m].sc-calcite-shell-panel-h .content--detached.sc-calcite-shell-panel{--calcite-shell-panel-detached-max-height:60vh}/*!@:host([detached-height-scale=l]) .content--detached*/[detached-height-scale=l].sc-calcite-shell-panel-h .content--detached.sc-calcite-shell-panel{--calcite-shell-panel-detached-max-height:80vh}/*!@.content--detached*/.content--detached.sc-calcite-shell-panel{margin-left:0.5rem;margin-right:0.5rem;margin-top:0.5rem;margin-bottom:auto;height:auto;overflow:hidden;border-radius:0.25rem;--tw-shadow:0 4px 8px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.04);--tw-shadow-colored:0 4px 8px -1px var(--tw-shadow-color), 0 2px 4px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);max-height:var(--calcite-shell-panel-detached-max-height)}/*!@.content--detached ::slotted(calcite-panel),\n.content--detached ::slotted(calcite-flow)*/.content--detached .sc-calcite-shell-panel-s>calcite-panel,.content--detached .sc-calcite-shell-panel-s>calcite-flow{max-height:unset}/*!@:host([position=start]) .content--detached ::slotted(calcite-panel), :host([position=start]) .content--detached ::slotted(calcite-flow), :host([position=end]) .content--detached ::slotted(calcite-panel), :host([position=end]) .content--detached ::slotted(calcite-flow)*/.sc-calcite-shell-panel-h[position=start] .content--detached .sc-calcite-shell-panel-s>calcite-panel,.sc-calcite-shell-panel-h[position=start] .content--detached .sc-calcite-shell-panel-s>calcite-flow,.sc-calcite-shell-panel-h[position=end] .content--detached .sc-calcite-shell-panel-s>calcite-panel,.sc-calcite-shell-panel-h[position=end] .content--detached .sc-calcite-shell-panel-s>calcite-flow{border-style:none}/*!@.content[hidden]*/.content[hidden].sc-calcite-shell-panel{display:none}/*!@slot[name=action-bar]::slotted(calcite-action-bar), .content ::slotted(calcite-flow), .content ::slotted(calcite-panel:not([dismissed]))*/slot[name=action-bar].sc-calcite-shell-panel-s>calcite-action-bar,.content.sc-calcite-shell-panel-s>calcite-flow,.content .sc-calcite-shell-panel-s>calcite-flow,.content.sc-calcite-shell-panel-s>calcite-panel:not([dismissed]),.content .sc-calcite-shell-panel-s>calcite-panel:not([dismissed]){border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3)}/*!@:host([position=start]) slot[name=action-bar]::slotted(calcite-action-bar),\n:host([position=start]) .content ::slotted(calcite-flow),\n:host([position=start]) .content ::slotted(calcite-panel)*/.sc-calcite-shell-panel-h[position=start] slot[name=action-bar].sc-calcite-shell-panel-s>calcite-action-bar,.sc-calcite-shell-panel-h[position=start] .content .sc-calcite-shell-panel-s>calcite-flow,.sc-calcite-shell-panel-h[position=start] .content .sc-calcite-shell-panel-s>calcite-panel{-webkit-border-start:none;border-inline-start:none}/*!@:host([position=end]) slot[name=action-bar]::slotted(calcite-action-bar),\n:host([position=end]) .content ::slotted(calcite-flow),\n:host([position=end]) .content ::slotted(calcite-panel)*/.sc-calcite-shell-panel-h[position=end] slot[name=action-bar].sc-calcite-shell-panel-s>calcite-action-bar,.sc-calcite-shell-panel-h[position=end] .content .sc-calcite-shell-panel-s>calcite-flow,.sc-calcite-shell-panel-h[position=end] .content .sc-calcite-shell-panel-s>calcite-panel{-webkit-border-end:none;border-inline-end:none}";
- /**
- * @slot - A slot for adding content to the shell panel.
- * @slot action-bar - A slot for adding a `calcite-action-bar` to the panel.
- */
- class ShellPanel {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteShellPanelToggle = createEvent(this, "calciteShellPanelToggle", 7);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * Hide the content panel.
- */
- this.collapsed = false;
- /**
- * This property makes the content area appear like a "floating" panel.
- */
- this.detached = false;
- /**
- * Specifies the maximum height of the contents when detached.
- */
- this.detachedHeightScale = "l";
- /**
- * This sets width of the content area.
- */
- this.widthScale = "m";
- /**
- * Accessible label for resize separator.
- * @default "Resize"
- */
- this.intlResize = TEXT$3.resize;
- /**
- * This property makes the content area resizable if the calcite-shell-panel is not 'detached'.
- */
- this.resizable = false;
- this.contentWidth = null;
- this.initialContentWidth = null;
- this.initialClientX = null;
- this.contentWidthMax = null;
- this.contentWidthMin = null;
- this.step = 1;
- this.stepMultiplier = 10;
- this.storeContentEl = (contentEl) => {
- this.contentEl = contentEl;
- };
- this.getKeyAdjustedWidth = (event) => {
- const { key } = event;
- const { el, step, stepMultiplier, contentWidthMin, contentWidthMax, initialContentWidth, position } = this;
- const multipliedStep = step * stepMultiplier;
- const MOVEMENT_KEYS = [
- "ArrowUp",
- "ArrowDown",
- "ArrowLeft",
- "ArrowRight",
- "Home",
- "End",
- "PageUp",
- "PageDown"
- ];
- if (MOVEMENT_KEYS.indexOf(key) > -1) {
- event.preventDefault();
- }
- const dir = getElementDir(el);
- const directionKeys = ["ArrowLeft", "ArrowRight"];
- const directionFactor = dir === "rtl" && directionKeys.includes(key) ? -1 : 1;
- const increaseKeys = key === "ArrowUp" ||
- (position === "end" ? key === directionKeys[0] : key === directionKeys[1]);
- if (increaseKeys) {
- const stepValue = event.shiftKey ? multipliedStep : step;
- return initialContentWidth + directionFactor * stepValue;
- }
- const decreaseKeys = key === "ArrowDown" ||
- (position === "end" ? key === directionKeys[1] : key === directionKeys[0]);
- if (decreaseKeys) {
- const stepValue = event.shiftKey ? multipliedStep : step;
- return initialContentWidth - directionFactor * stepValue;
- }
- if (typeof contentWidthMin === "number" && key === "Home") {
- return contentWidthMin;
- }
- if (typeof contentWidthMax === "number" && key === "End") {
- return contentWidthMax;
- }
- if (key === "PageDown") {
- return initialContentWidth - multipliedStep;
- }
- if (key === "PageUp") {
- return initialContentWidth + multipliedStep;
- }
- return null;
- };
- this.separatorKeyDown = (event) => {
- this.setInitialContentWidth();
- const width = this.getKeyAdjustedWidth(event);
- if (typeof width === "number") {
- this.setContentWidth(width);
- }
- };
- this.separatorPointerMove = (event) => {
- event.preventDefault();
- const { el, initialContentWidth, position, initialClientX } = this;
- const offset = event.clientX - initialClientX;
- const dir = getElementDir(el);
- const adjustmentDirection = dir === "rtl" ? -1 : 1;
- const adjustedOffset = position === "end" ? -adjustmentDirection * offset : adjustmentDirection * offset;
- const width = initialContentWidth + adjustedOffset;
- this.setContentWidth(width);
- };
- this.separatorPointerUp = (event) => {
- event.preventDefault();
- document.removeEventListener("pointerup", this.separatorPointerUp);
- document.removeEventListener("pointermove", this.separatorPointerMove);
- };
- this.setInitialContentWidth = () => {
- var _a;
- this.initialContentWidth = (_a = this.contentEl) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().width;
- };
- this.separatorPointerDown = (event) => {
- event.preventDefault();
- const { separatorEl } = this;
- separatorEl && document.activeElement !== separatorEl && separatorEl.focus();
- this.setInitialContentWidth();
- this.initialClientX = event.clientX;
- document.addEventListener("pointerup", this.separatorPointerUp);
- document.addEventListener("pointermove", this.separatorPointerMove);
- };
- this.connectSeparator = (separatorEl) => {
- this.disconnectSeparator();
- this.separatorEl = separatorEl;
- separatorEl.addEventListener("pointerdown", this.separatorPointerDown);
- };
- this.disconnectSeparator = () => {
- var _a;
- (_a = this.separatorEl) === null || _a === void 0 ? void 0 : _a.removeEventListener("pointerdown", this.separatorPointerDown);
- };
- }
- watchHandler() {
- this.calciteShellPanelToggle.emit();
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- disconnectConditionalSlotComponent(this);
- this.disconnectSeparator();
- }
- componentDidLoad() {
- this.updateAriaValues();
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- renderHeader() {
- const { el } = this;
- const hasHeader = getSlotted(el, SLOTS$5.header);
- return hasHeader ? (hAsync("div", { class: CSS$9.contentHeader, key: "header" }, hAsync("slot", { name: SLOTS$5.header }))) : null;
- }
- render() {
- const { collapsed, detached, position, initialContentWidth, contentWidth, contentWidthMax, contentWidthMin, intlResize, resizable } = this;
- const allowResizing = !detached && resizable;
- const contentNode = (hAsync("div", { class: { [CSS$9.content]: true, [CSS$9.contentDetached]: detached }, hidden: collapsed, key: "content", ref: this.storeContentEl, style: allowResizing && contentWidth ? { width: `${contentWidth}px` } : null }, this.renderHeader(), hAsync("div", { class: CSS$9.contentBody }, hAsync("slot", null))));
- const separatorNode = allowResizing ? (hAsync("div", { "aria-label": intlResize, "aria-orientation": "horizontal", "aria-valuemax": contentWidthMax, "aria-valuemin": contentWidthMin, "aria-valuenow": contentWidth !== null && contentWidth !== void 0 ? contentWidth : initialContentWidth, class: CSS$9.separator, key: "separator", onKeyDown: this.separatorKeyDown, ref: this.connectSeparator, role: "separator", tabIndex: 0, "touch-action": "none" })) : null;
- const actionBarNode = hAsync("slot", { key: "action-bar", name: SLOTS$5.actionBar });
- const mainNodes = [actionBarNode, contentNode, separatorNode];
- if (position === "end") {
- mainNodes.reverse();
- }
- return hAsync("div", { class: { [CSS$9.container]: true } }, mainNodes);
- }
- // --------------------------------------------------------------------------
- //
- // private Methods
- //
- // --------------------------------------------------------------------------
- setContentWidth(width) {
- const { contentWidthMax, contentWidthMin } = this;
- const roundedWidth = Math.round(width);
- this.contentWidth =
- typeof contentWidthMax === "number" && typeof contentWidthMin === "number"
- ? clamp(roundedWidth, contentWidthMin, contentWidthMax)
- : roundedWidth;
- }
- updateAriaValues() {
- const { contentEl } = this;
- const computedStyle = contentEl && getComputedStyle(contentEl);
- if (!computedStyle) {
- return;
- }
- const max = parseInt(computedStyle.getPropertyValue("max-width"), 10);
- const min = parseInt(computedStyle.getPropertyValue("min-width"), 10);
- const valueNow = parseInt(computedStyle.getPropertyValue("width"), 10);
- if (typeof valueNow === "number" && !isNaN(valueNow)) {
- this.initialContentWidth = valueNow;
- }
- if (typeof max === "number" && !isNaN(max)) {
- this.contentWidthMax = max;
- }
- if (typeof min === "number" && !isNaN(min)) {
- this.contentWidthMin = min;
- }
- forceUpdate$1(this);
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "collapsed": ["watchHandler"]
- }; }
- static get style() { return shellPanelCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-shell-panel",
- "$members$": {
- "collapsed": [516],
- "detached": [516],
- "detachedHeightScale": [513, "detached-height-scale"],
- "widthScale": [513, "width-scale"],
- "position": [513],
- "intlResize": [1, "intl-resize"],
- "resizable": [516],
- "contentWidth": [32]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["collapsed", "collapsed"], ["detached", "detached"], ["detachedHeightScale", "detached-height-scale"], ["widthScale", "width-scale"], ["position", "position"], ["resizable", "resizable"]]
- }; }
- }
- const sliderCss = "@charset \"UTF-8\";@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-slider:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-slider{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-slider{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-slider{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-slider{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-slider{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-slider:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-slider-h{display:none}/*!@.scale--s*/.scale--s.sc-calcite-slider{--calcite-slider-handle-size:10px;--calcite-slider-handle-extension-height:6.5px;--calcite-slider-container-font-size:var(--calcite-font-size--3)}/*!@.scale--s .handle__label, .scale--s .tick__label*/.scale--s.sc-calcite-slider .handle__label.sc-calcite-slider,.scale--s.sc-calcite-slider .tick__label.sc-calcite-slider{line-height:.75rem}/*!@.scale--m*/.scale--m.sc-calcite-slider{--calcite-slider-handle-size:14px;--calcite-slider-handle-extension-height:8px;--calcite-slider-container-font-size:var(--calcite-font-size--2)}/*!@.scale--m .handle__label, .scale--m .tick__label*/.scale--m.sc-calcite-slider .handle__label.sc-calcite-slider,.scale--m.sc-calcite-slider .tick__label.sc-calcite-slider{line-height:1rem}/*!@.scale--l*/.scale--l.sc-calcite-slider{--calcite-slider-handle-size:16px;--calcite-slider-handle-extension-height:10.5px;--calcite-slider-container-font-size:var(--calcite-font-size--1)}/*!@.scale--l .handle__label, .scale--l .tick__label*/.scale--l.sc-calcite-slider .handle__label.sc-calcite-slider,.scale--l.sc-calcite-slider .tick__label.sc-calcite-slider{line-height:1rem}/*!@.handle__label, .tick__label*/.handle__label.sc-calcite-slider,.tick__label.sc-calcite-slider{font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-2);font-size:var(--calcite-slider-container-font-size)}/*!@:host*/.sc-calcite-slider-h{display:block}/*!@.container*/.container.sc-calcite-slider{position:relative;display:block;overflow-wrap:normal;word-break:normal;padding:calc(var(--calcite-slider-handle-size) * 0.5);margin:calc(var(--calcite-slider-handle-size) * 0.5) 0;--calcite-slider-full-handle-height:calc(\n var(--calcite-slider-handle-size) + var(--calcite-slider-handle-extension-height)\n )}/*!@:host([disabled])*/[disabled].sc-calcite-slider-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) .track__range,\n:host([disabled]) .tick--active*/[disabled].sc-calcite-slider-h .track__range.sc-calcite-slider,[disabled].sc-calcite-slider-h .tick--active.sc-calcite-slider{background-color:var(--calcite-ui-text-3)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-slider-h[disabled] .sc-calcite-slider-s>[calcite-hydrated][disabled],[disabled].sc-calcite-slider-h [calcite-hydrated][disabled].sc-calcite-slider{opacity:1}/*!@.scale--s .thumb:not(.thumb--precise)*/.scale--s.sc-calcite-slider .thumb.sc-calcite-slider:not(.thumb--precise){--calcite-slider-thumb-y-offset:-6px}/*!@.scale--m .thumb:not(.thumb--precise)*/.scale--m.sc-calcite-slider .thumb.sc-calcite-slider:not(.thumb--precise){--calcite-slider-thumb-y-offset:-8px}/*!@.scale--l .thumb:not(.thumb--precise)*/.scale--l.sc-calcite-slider .thumb.sc-calcite-slider:not(.thumb--precise){--calcite-slider-thumb-y-offset:-9px}/*!@:host([precise]:not([has-histogram])) .container .thumb--value*/[precise].sc-calcite-slider-h:not([has-histogram]) .container.sc-calcite-slider .thumb--value.sc-calcite-slider{--calcite-slider-thumb-y-offset:calc(var(--calcite-slider-full-handle-height) * -1)}/*!@.thumb-container*/.thumb-container.sc-calcite-slider{position:relative;max-width:100%}/*!@.thumb*/.thumb.sc-calcite-slider{--calcite-slider-thumb-x-offset:calc(var(--calcite-slider-handle-size) * 0.5);position:absolute;margin:0px;display:-ms-flexbox;display:flex;cursor:pointer;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;border-style:none;background-color:transparent;padding:0px;font-family:inherit;outline:2px solid transparent;outline-offset:2px;-webkit-transform:translate(var(--calcite-slider-thumb-x-offset), var(--calcite-slider-thumb-y-offset));transform:translate(var(--calcite-slider-thumb-x-offset), var(--calcite-slider-thumb-y-offset))}/*!@.thumb .handle__label.static, .thumb .handle__label.transformed*/.thumb.sc-calcite-slider .handle__label.static.sc-calcite-slider,.thumb.sc-calcite-slider .handle__label.transformed.sc-calcite-slider{position:absolute;top:0px;bottom:0px;opacity:0}/*!@.thumb .handle__label.hyphen::after*/.thumb.sc-calcite-slider .handle__label.hyphen.sc-calcite-slider::after{content:\"—\";display:inline-block;width:1em}/*!@.thumb .handle__label.hyphen--wrap*/.thumb.sc-calcite-slider .handle__label.hyphen--wrap.sc-calcite-slider{display:-ms-flexbox;display:flex}/*!@.thumb .handle*/.thumb.sc-calcite-slider .handle.sc-calcite-slider{-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:9999px;background-color:var(--calcite-ui-foreground-1);outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;height:var(--calcite-slider-handle-size);width:var(--calcite-slider-handle-size);-webkit-box-shadow:0 0 0 2px var(--calcite-ui-text-3) inset;box-shadow:0 0 0 2px var(--calcite-ui-text-3) inset;-webkit-transition:border var(--calcite-internal-animation-timing-medium) ease, background-color var(--calcite-internal-animation-timing-medium) ease, -webkit-box-shadow var(--calcite-animation-timing) ease;transition:border var(--calcite-internal-animation-timing-medium) ease, background-color var(--calcite-internal-animation-timing-medium) ease, -webkit-box-shadow var(--calcite-animation-timing) ease;transition:border var(--calcite-internal-animation-timing-medium) ease, background-color var(--calcite-internal-animation-timing-medium) ease, box-shadow var(--calcite-animation-timing) ease;transition:border var(--calcite-internal-animation-timing-medium) ease, background-color var(--calcite-internal-animation-timing-medium) ease, box-shadow var(--calcite-animation-timing) ease, -webkit-box-shadow var(--calcite-animation-timing) ease}/*!@.thumb .handle-extension*/.thumb.sc-calcite-slider .handle-extension.sc-calcite-slider{width:0.125rem;height:var(--calcite-slider-handle-extension-height);background-color:var(--calcite-ui-text-3)}/*!@.thumb:hover .handle*/.thumb.sc-calcite-slider:hover .handle.sc-calcite-slider{-webkit-box-shadow:0 0 0 3px var(--calcite-ui-brand) inset;box-shadow:0 0 0 3px var(--calcite-ui-brand) inset}/*!@.thumb:hover .handle-extension*/.thumb.sc-calcite-slider:hover .handle-extension.sc-calcite-slider{background-color:var(--calcite-ui-brand)}/*!@.thumb:focus .handle*/.thumb.sc-calcite-slider:focus .handle.sc-calcite-slider{outline:2px solid var(--calcite-ui-brand);outline-offset:2px}/*!@.thumb:focus .handle-extension*/.thumb.sc-calcite-slider:focus .handle-extension.sc-calcite-slider{background-color:var(--calcite-ui-brand)}/*!@.thumb.thumb--minValue*/.thumb.thumb--minValue.sc-calcite-slider{-webkit-transform:translate(calc(var(--calcite-slider-thumb-x-offset) * -1), var(--calcite-slider-thumb-y-offset));transform:translate(calc(var(--calcite-slider-thumb-x-offset) * -1), var(--calcite-slider-thumb-y-offset))}/*!@.thumb.thumb--precise*/.thumb.thumb--precise.sc-calcite-slider{--calcite-slider-thumb-y-offset:-2px}/*!@:host([label-handles]) .thumb*/[label-handles].sc-calcite-slider-h .thumb.sc-calcite-slider{--calcite-slider-thumb-x-offset:50%}/*!@:host([label-handles]):host(:not([has-histogram])) .scale--s .thumb:not(.thumb--precise)*/[label-handles].sc-calcite-slider-h(.sc-calcite-slider-h:not([has-histogram])) .scale--s.sc-calcite-slider .thumb.sc-calcite-slider:not(.thumb--precise){--calcite-slider-thumb-y-offset:-23px}/*!@:host([label-handles]):host(:not([has-histogram])) .scale--m .thumb:not(.thumb--precise)*/[label-handles].sc-calcite-slider-h(.sc-calcite-slider-h:not([has-histogram])) .scale--m.sc-calcite-slider .thumb.sc-calcite-slider:not(.thumb--precise){--calcite-slider-thumb-y-offset:-30px}/*!@:host([label-handles]):host(:not([has-histogram])) .scale--l .thumb:not(.thumb--precise)*/[label-handles].sc-calcite-slider-h(.sc-calcite-slider-h:not([has-histogram])) .scale--l.sc-calcite-slider .thumb.sc-calcite-slider:not(.thumb--precise){--calcite-slider-thumb-y-offset:-32px}/*!@:host([has-histogram][label-handles]) .handle__label,\n:host([label-handles]:not([has-histogram])) .thumb--minValue.thumb--precise .handle__label*/[has-histogram][label-handles].sc-calcite-slider-h .handle__label.sc-calcite-slider,[label-handles].sc-calcite-slider-h:not([has-histogram]) .thumb--minValue.thumb--precise.sc-calcite-slider .handle__label.sc-calcite-slider{margin-top:0.5em}/*!@:host(:not([has-histogram]):not([precise])) .handle__label,\n:host([label-handles]:not([has-histogram])) .thumb--value .handle__label*/.sc-calcite-slider-h:not([has-histogram]):not([precise]) .handle__label.sc-calcite-slider,[label-handles].sc-calcite-slider-h:not([has-histogram]) .thumb--value.sc-calcite-slider .handle__label.sc-calcite-slider{margin-bottom:0.5em}/*!@:host([label-handles][precise]):host(:not([has-histogram])) .scale--s .thumb--value*/[label-handles][precise].sc-calcite-slider-h(.sc-calcite-slider-h:not([has-histogram])) .scale--s.sc-calcite-slider .thumb--value.sc-calcite-slider{--calcite-slider-thumb-y-offset:-33px}/*!@:host([label-handles][precise]):host(:not([has-histogram])) .scale--m .thumb--value*/[label-handles][precise].sc-calcite-slider-h(.sc-calcite-slider-h:not([has-histogram])) .scale--m.sc-calcite-slider .thumb--value.sc-calcite-slider{--calcite-slider-thumb-y-offset:-44px}/*!@:host([label-handles][precise]):host(:not([has-histogram])) .scale--l .thumb--value*/[label-handles][precise].sc-calcite-slider-h(.sc-calcite-slider-h:not([has-histogram])) .scale--l.sc-calcite-slider .thumb--value.sc-calcite-slider{--calcite-slider-thumb-y-offset:-49px}/*!@.thumb:focus .handle, .thumb--active .handle*/.thumb.sc-calcite-slider:focus .handle.sc-calcite-slider,.thumb--active.sc-calcite-slider .handle.sc-calcite-slider{background-color:var(--calcite-ui-brand);-webkit-box-shadow:0 0 8px 0 rgba(0, 0, 0, 0.16);box-shadow:0 0 8px 0 rgba(0, 0, 0, 0.16)}/*!@.thumb:hover.thumb--precise:after, .thumb:focus.thumb--precise:after, .thumb--active.thumb--precise:after*/.thumb.sc-calcite-slider:hover.thumb--precise:after,.thumb.sc-calcite-slider:focus.thumb--precise:after,.thumb--active.thumb--precise.sc-calcite-slider:after{background-color:var(--calcite-ui-brand)}/*!@.track*/.track.sc-calcite-slider{position:relative;height:0.125rem;border-radius:0px;background-color:var(--calcite-ui-border-2);-webkit-transition:all var(--calcite-internal-animation-timing-medium) ease-in;transition:all var(--calcite-internal-animation-timing-medium) ease-in}/*!@.track__range*/.track__range.sc-calcite-slider{position:absolute;top:0px;height:0.125rem;background-color:var(--calcite-ui-brand)}/*!@.container--range .track__range:hover*/.container--range.sc-calcite-slider .track__range.sc-calcite-slider:hover{cursor:ew-resize}/*!@.container--range .track__range:after*/.container--range.sc-calcite-slider .track__range.sc-calcite-slider:after{position:absolute;width:100%;content:\"\";top:calc(var(--calcite-slider-full-handle-height) * 0.5 * -1);height:calc(var(--calcite-slider-handle-size) + var(--calcite-slider-handle-extension-height))}@media (forced-colors: active){/*!@.thumb*/.thumb.sc-calcite-slider{outline-width:0;outline-offset:0}/*!@.handle*/.handle.sc-calcite-slider{outline:2px solid transparent;outline-offset:2px}/*!@.thumb:focus .handle,\n.thumb .handle-extension,\n.thumb:hover .handle-extension,\n.thumb:focus .handle-extension,\n.thumb:active .handle-extension*/.thumb.sc-calcite-slider:focus .handle.sc-calcite-slider,.thumb.sc-calcite-slider .handle-extension.sc-calcite-slider,.thumb.sc-calcite-slider:hover .handle-extension.sc-calcite-slider,.thumb.sc-calcite-slider:focus .handle-extension.sc-calcite-slider,.thumb.sc-calcite-slider:active .handle-extension.sc-calcite-slider{background-color:canvasText}/*!@.track*/.track.sc-calcite-slider{background-color:canvasText}/*!@.track__range*/.track__range.sc-calcite-slider{background-color:highlight}}/*!@.tick*/.tick.sc-calcite-slider{position:absolute;height:0.25rem;width:0.125rem;border-width:1px;border-style:solid;background-color:var(--calcite-ui-border-input);border-color:var(--calcite-ui-foreground-1);top:-2px;pointer-events:none;-webkit-margin-start:calc(-1 * 0.125rem);margin-inline-start:calc(-1 * 0.125rem)}/*!@.tick--active*/.tick--active.sc-calcite-slider{background-color:var(--calcite-ui-brand)}/*!@.tick__label*/.tick__label.sc-calcite-slider{pointer-events:none;margin-top:0.875rem;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}/*!@.tick__label--min*/.tick__label--min.sc-calcite-slider{-webkit-transition:opacity var(--calcite-animation-timing);transition:opacity var(--calcite-animation-timing)}/*!@.tick__label--max*/.tick__label--max.sc-calcite-slider{-webkit-transition:opacity var(--calcite-internal-animation-timing-fast);transition:opacity var(--calcite-internal-animation-timing-fast)}/*!@:host([has-histogram][label-handles]) .tick__label--min, :host([has-histogram][label-handles]) .tick__label--max, :host([has-histogram][precise]) .tick__label--min, :host([has-histogram][precise]) .tick__label--max*/[has-histogram][label-handles].sc-calcite-slider-h .tick__label--min.sc-calcite-slider,[has-histogram][label-handles].sc-calcite-slider-h .tick__label--max.sc-calcite-slider,[has-histogram][precise].sc-calcite-slider-h .tick__label--min.sc-calcite-slider,[has-histogram][precise].sc-calcite-slider-h .tick__label--max.sc-calcite-slider{font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-3)}/*!@.graph*/.graph.sc-calcite-slider{color:var(--calcite-ui-foreground-3);height:48px}/*!@:host([label-ticks][ticks]) .container*/[label-ticks][ticks].sc-calcite-slider-h .container.sc-calcite-slider{padding-bottom:calc(0.875rem + var(--calcite-slider-container-font-size))}/*!@:host([has-histogram]):host([precise][label-handles]) .container*/[has-histogram].sc-calcite-slider-h([precise][label-handles]).sc-calcite-slider-h .container.sc-calcite-slider{padding-bottom:calc(var(--calcite-slider-full-handle-height) + 1em)}/*!@:host([has-histogram]):host([label-handles]:not([precise])) .container*/[has-histogram].sc-calcite-slider-h([label-handles].sc-calcite-slider-h:not([precise])) .container.sc-calcite-slider{padding-bottom:calc(var(--calcite-slider-handle-size) * 0.5 + 1em)}/*!@:host([has-histogram]):host([precise]:not([label-handles])) .container*/[has-histogram].sc-calcite-slider-h([precise].sc-calcite-slider-h:not([label-handles])) .container.sc-calcite-slider{padding-bottom:var(--calcite-slider-full-handle-height)}/*!@:host(:not([has-histogram])):host([precise]:not([label-handles])) .container*/.sc-calcite-slider-h:not([has-histogram]).sc-calcite-slider-h([precise]:not([label-handles])) .container.sc-calcite-slider{padding-top:var(--calcite-slider-full-handle-height)}/*!@:host(:not([has-histogram])):host([precise]:not([label-handles])) .container--range*/.sc-calcite-slider-h:not([has-histogram]).sc-calcite-slider-h([precise]:not([label-handles])) .container--range.sc-calcite-slider{padding-bottom:var(--calcite-slider-full-handle-height)}/*!@:host(:not([has-histogram])):host([label-handles]:not([precise])) .container*/.sc-calcite-slider-h:not([has-histogram]).sc-calcite-slider-h([label-handles]:not([precise])) .container.sc-calcite-slider{padding-top:calc(var(--calcite-slider-full-handle-height) + 4px)}/*!@:host(:not([has-histogram])):host([label-handles][precise]) .container*/.sc-calcite-slider-h:not([has-histogram]).sc-calcite-slider-h([label-handles][precise]) .container.sc-calcite-slider{padding-top:calc(var(--calcite-slider-full-handle-height) + var(--calcite-slider-container-font-size) + 4px)}/*!@:host(:not([has-histogram])):host([label-handles][precise]) .container--range*/.sc-calcite-slider-h:not([has-histogram]).sc-calcite-slider-h([label-handles][precise]) .container--range.sc-calcite-slider{padding-bottom:calc(var(--calcite-slider-full-handle-height) + var(--calcite-slider-container-font-size) + 4px)}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-slider-s>input[slot=hidden-form-input]{bottom:0 !important;left:0 !important;margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;right:0 !important;top:0 !important;-webkit-transform:none !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}";
- function isRange(value) {
- return Array.isArray(value);
- }
- class Slider {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteSliderInput = createEvent(this, "calciteSliderInput", 7);
- this.calciteSliderChange = createEvent(this, "calciteSliderChange", 7);
- this.calciteSliderUpdate = createEvent(this, "calciteSliderUpdate", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** Disable and gray out the slider */
- this.disabled = false;
- /** Indicates if a histogram is present */
- this.hasHistogram = false;
- /** Label handles with their numeric value */
- this.labelHandles = false;
- /** Label tick marks with their numeric value. */
- this.labelTicks = false;
- /** Maximum selectable value */
- this.max = 100;
- /** Minimum selectable value */
- this.min = 0;
- /**
- * When true, the slider will display values from high to low.
- *
- * Note that this value will be ignored if the slider has an associated histogram.
- */
- this.mirrored = false;
- /** Use finer point for handles */
- this.precise = false;
- /**
- * When true, makes the component required for form-submission.
- */
- this.required = false;
- /** When true, enables snap selection along the step interval */
- this.snap = false;
- /** Interval to move on up/down keys */
- this.step = 1;
- /** Currently selected number (if single select) */
- this.value = 0;
- /**
- * Specify the scale of the slider, defaults to m
- */
- this.scale = "m";
- this.guid = `calcite-slider-${guid()}`;
- this.activeProp = "value";
- this.minMaxValueRange = null;
- this.minValueDragRange = null;
- this.maxValueDragRange = null;
- this.tickValues = [];
- this.dragUpdate = (event) => {
- event.preventDefault();
- if (this.dragProp) {
- const value = this.translate(event.clientX || event.pageX);
- if (isRange(this.value) && this.dragProp === "minMaxValue") {
- if (this.minValueDragRange && this.maxValueDragRange && this.minMaxValueRange) {
- const newMinValue = value - this.minValueDragRange;
- const newMaxValue = value + this.maxValueDragRange;
- if (newMaxValue <= this.max &&
- newMinValue >= this.min &&
- newMaxValue - newMinValue === this.minMaxValueRange) {
- this.minValue = this.clamp(newMinValue, "minValue");
- this.maxValue = this.clamp(newMaxValue, "maxValue");
- }
- }
- else {
- this.minValueDragRange = value - this.minValue;
- this.maxValueDragRange = this.maxValue - value;
- this.minMaxValueRange = this.maxValue - this.minValue;
- }
- }
- else {
- this.setValue(this.dragProp, this.clamp(value, this.dragProp));
- }
- }
- };
- this.dragEnd = (event) => {
- this.removeDragListeners();
- this.focusActiveHandle(event.clientX);
- if (this.lastDragPropValue != this[this.dragProp]) {
- this.emitChange();
- }
- this.dragProp = null;
- this.lastDragPropValue = null;
- this.minValueDragRange = null;
- this.maxValueDragRange = null;
- this.minMaxValueRange = null;
- };
- /**
- * Set the reference of the track Element
- * @internal
- * @param node
- */
- this.storeTrackRef = (node) => {
- this.trackEl = node;
- };
- }
- histogramWatcher(newHistogram) {
- this.hasHistogram = !!newHistogram;
- }
- valueHandler() {
- this.setMinMaxFromValue();
- }
- minMaxValueHandler() {
- this.setValueFromMinMax();
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- this.setMinMaxFromValue();
- this.setValueFromMinMax();
- connectLabel(this);
- connectForm(this);
- }
- disconnectedCallback() {
- disconnectLabel(this);
- disconnectForm(this);
- this.removeDragListeners();
- }
- componentWillLoad() {
- this.tickValues = this.generateTickValues();
- if (!isRange(this.value)) {
- this.value = this.clamp(this.value);
- }
- afterConnectDefaultValueSet(this, this.value);
- if (this.snap && !isRange(this.value)) {
- this.value = this.getClosestStep(this.value);
- }
- if (this.histogram) {
- this.hasHistogram = true;
- }
- }
- componentDidRender() {
- if (this.labelHandles) {
- this.adjustHostObscuredHandleLabel("value");
- if (isRange(this.value)) {
- this.adjustHostObscuredHandleLabel("minValue");
- if (!(this.precise && !this.hasHistogram)) {
- this.hyphenateCollidingRangeHandleLabels();
- }
- }
- }
- this.hideObscuredBoundingTickLabels();
- updateHostInteraction(this);
- }
- render() {
- const id = this.el.id || this.guid;
- const maxProp = isRange(this.value) ? "maxValue" : "value";
- const value = isRange(this.value) ? this.maxValue : this.value;
- const min = this.minValue || this.min;
- const useMinValue = this.shouldUseMinValue();
- const minInterval = this.getUnitInterval(useMinValue ? this.minValue : min) * 100;
- const maxInterval = this.getUnitInterval(value) * 100;
- const mirror = this.shouldMirror();
- const leftThumbOffset = `${mirror ? 100 - minInterval : minInterval}%`;
- const rightThumbOffset = `${mirror ? maxInterval : 100 - maxInterval}%`;
- const valueIsRange = isRange(this.value);
- const handle = (hAsync("div", { "aria-disabled": this.disabled, "aria-label": valueIsRange ? this.maxLabel : this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": value, class: {
- thumb: true,
- "thumb--value": true,
- "thumb--active": this.lastDragProp !== "minMaxValue" && this.dragProp === maxProp
- }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: () => this.dragStart(maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, hAsync("div", { class: "handle" })));
- const labeledHandle = (hAsync("div", { "aria-disabled": this.disabled, "aria-label": valueIsRange ? this.maxLabel : this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": value, class: {
- thumb: true,
- "thumb--value": true,
- "thumb--active": this.lastDragProp !== "minMaxValue" && this.dragProp === maxProp
- }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: () => this.dragStart(maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--value" }, value ? value.toLocaleString() : value), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--value static" }, value ? value.toLocaleString() : value), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--value transformed" }, value ? value.toLocaleString() : value), hAsync("div", { class: "handle" })));
- const histogramLabeledHandle = (hAsync("div", { "aria-disabled": this.disabled, "aria-label": valueIsRange ? this.maxLabel : this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": value, class: {
- thumb: true,
- "thumb--value": true,
- "thumb--active": this.lastDragProp !== "minMaxValue" && this.dragProp === maxProp
- }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: () => this.dragStart(maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, hAsync("div", { class: "handle" }), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--value" }, value ? value.toLocaleString() : value), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--value static" }, value ? value.toLocaleString() : value), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--value transformed" }, value ? value.toLocaleString() : value)));
- const preciseHandle = (hAsync("div", { "aria-disabled": this.disabled, "aria-label": valueIsRange ? this.maxLabel : this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": value, class: {
- thumb: true,
- "thumb--value": true,
- "thumb--active": this.lastDragProp !== "minMaxValue" && this.dragProp === maxProp,
- "thumb--precise": true
- }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: () => this.dragStart(maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, hAsync("div", { class: "handle" }), hAsync("div", { class: "handle-extension" })));
- const histogramPreciseHandle = (hAsync("div", { "aria-disabled": this.disabled, "aria-label": valueIsRange ? this.maxLabel : this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": value, class: {
- thumb: true,
- "thumb--value": true,
- "thumb--active": this.lastDragProp !== "minMaxValue" && this.dragProp === maxProp,
- "thumb--precise": true
- }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: () => this.dragStart(maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, hAsync("div", { class: "handle-extension" }), hAsync("div", { class: "handle" })));
- const labeledPreciseHandle = (hAsync("div", { "aria-disabled": this.disabled, "aria-label": valueIsRange ? this.maxLabel : this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": value, class: {
- thumb: true,
- "thumb--value": true,
- "thumb--active": this.lastDragProp !== "minMaxValue" && this.dragProp === maxProp,
- "thumb--precise": true
- }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: () => this.dragStart(maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--value" }, value ? value.toLocaleString() : value), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--value static" }, value ? value.toLocaleString() : value), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--value transformed" }, value ? value.toLocaleString() : value), hAsync("div", { class: "handle" }), hAsync("div", { class: "handle-extension" })));
- const histogramLabeledPreciseHandle = (hAsync("div", { "aria-disabled": this.disabled, "aria-label": valueIsRange ? this.maxLabel : this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": value, class: {
- thumb: true,
- "thumb--value": true,
- "thumb--active": this.lastDragProp !== "minMaxValue" && this.dragProp === maxProp,
- "thumb--precise": true
- }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: () => this.dragStart(maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, hAsync("div", { class: "handle-extension" }), hAsync("div", { class: "handle" }), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--value" }, value ? value.toLocaleString() : value), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--value static" }, value ? value.toLocaleString() : value), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--value transformed" }, value ? value.toLocaleString() : value)));
- const minHandle = (hAsync("div", { "aria-disabled": this.disabled, "aria-label": this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": this.minValue, class: {
- thumb: true,
- "thumb--minValue": true,
- "thumb--active": this.dragProp === "minValue"
- }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = "minValue"), onPointerDown: () => this.dragStart("minValue"), ref: (el) => (this.minHandle = el), role: "slider", style: { left: leftThumbOffset }, tabIndex: 0 }, hAsync("div", { class: "handle" })));
- const minLabeledHandle = (hAsync("div", { "aria-disabled": this.disabled, "aria-label": this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": this.minValue, class: {
- thumb: true,
- "thumb--minValue": true,
- "thumb--active": this.dragProp === "minValue"
- }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = "minValue"), onPointerDown: () => this.dragStart("minValue"), ref: (el) => (this.minHandle = el), role: "slider", style: { left: leftThumbOffset }, tabIndex: 0 }, hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--minValue" }, this.minValue && this.minValue.toLocaleString()), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--minValue static" }, this.minValue && this.minValue.toLocaleString()), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--minValue transformed" }, this.minValue && this.minValue.toLocaleString()), hAsync("div", { class: "handle" })));
- const minHistogramLabeledHandle = (hAsync("div", { "aria-disabled": this.disabled, "aria-label": this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": this.minValue, class: {
- thumb: true,
- "thumb--minValue": true,
- "thumb--active": this.dragProp === "minValue"
- }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = "minValue"), onPointerDown: () => this.dragStart("minValue"), ref: (el) => (this.minHandle = el), role: "slider", style: { left: leftThumbOffset }, tabIndex: 0 }, hAsync("div", { class: "handle" }), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--minValue" }, this.minValue && this.minValue.toLocaleString()), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--minValue static" }, this.minValue && this.minValue.toLocaleString()), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--minValue transformed" }, this.minValue && this.minValue.toLocaleString())));
- const minPreciseHandle = (hAsync("div", { "aria-disabled": this.disabled, "aria-label": this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": this.minValue, class: {
- thumb: true,
- "thumb--minValue": true,
- "thumb--active": this.dragProp === "minValue",
- "thumb--precise": true
- }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = "minValue"), onPointerDown: () => this.dragStart("minValue"), ref: (el) => (this.minHandle = el), role: "slider", style: { left: leftThumbOffset }, tabIndex: 0 }, hAsync("div", { class: "handle-extension" }), hAsync("div", { class: "handle" })));
- const minLabeledPreciseHandle = (hAsync("div", { "aria-disabled": this.disabled, "aria-label": this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": this.minValue, class: {
- thumb: true,
- "thumb--minValue": true,
- "thumb--active": this.dragProp === "minValue",
- "thumb--precise": true
- }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = "minValue"), onPointerDown: () => this.dragStart("minValue"), ref: (el) => (this.minHandle = el), role: "slider", style: { left: leftThumbOffset }, tabIndex: 0 }, hAsync("div", { class: "handle-extension" }), hAsync("div", { class: "handle" }), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--minValue" }, this.minValue && this.minValue.toLocaleString()), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--minValue static" }, this.minValue && this.minValue.toLocaleString()), hAsync("span", { "aria-hidden": "true", class: "handle__label handle__label--minValue transformed" }, this.minValue && this.minValue.toLocaleString())));
- return (hAsync(Host, { id: id, onTouchStart: this.handleTouchStart }, hAsync("div", { class: {
- ["container"]: true,
- ["container--range"]: valueIsRange,
- [`scale--${this.scale}`]: true
- } }, this.renderGraph(), hAsync("div", { class: "track", ref: this.storeTrackRef }, hAsync("div", { class: "track__range", onPointerDown: () => this.dragStart("minMaxValue"), style: {
- left: `${mirror ? 100 - maxInterval : minInterval}%`,
- right: `${mirror ? minInterval : 100 - maxInterval}%`
- } }), hAsync("div", { class: "ticks" }, this.tickValues.map((tick) => {
- const tickOffset = `${this.getUnitInterval(tick) * 100}%`;
- let activeTicks = tick >= min && tick <= value;
- if (useMinValue) {
- activeTicks = tick >= this.minValue && tick <= this.maxValue;
- }
- return (hAsync("span", { class: {
- tick: true,
- "tick--active": activeTicks
- }, style: {
- left: mirror ? "" : tickOffset,
- right: mirror ? tickOffset : ""
- } }, this.renderTickLabel(tick)));
- }))), hAsync("div", { class: "thumb-container" }, !this.precise && !this.labelHandles && valueIsRange && minHandle, !this.hasHistogram &&
- !this.precise &&
- this.labelHandles &&
- valueIsRange &&
- minLabeledHandle, this.precise && !this.labelHandles && valueIsRange && minPreciseHandle, this.precise && this.labelHandles && valueIsRange && minLabeledPreciseHandle, this.hasHistogram &&
- !this.precise &&
- this.labelHandles &&
- valueIsRange &&
- minHistogramLabeledHandle, !this.precise && !this.labelHandles && handle, !this.hasHistogram && !this.precise && this.labelHandles && labeledHandle, !this.hasHistogram && this.precise && !this.labelHandles && preciseHandle, this.hasHistogram && this.precise && !this.labelHandles && histogramPreciseHandle, !this.hasHistogram && this.precise && this.labelHandles && labeledPreciseHandle, this.hasHistogram && !this.precise && this.labelHandles && histogramLabeledHandle, this.hasHistogram &&
- this.precise &&
- this.labelHandles &&
- histogramLabeledPreciseHandle, hAsync(HiddenFormInputSlot, { component: this })))));
- }
- renderGraph() {
- return this.histogram ? (hAsync("calcite-graph", { class: "graph", colorStops: this.histogramStops, data: this.histogram, highlightMax: isRange(this.value) ? this.maxValue : this.value, highlightMin: isRange(this.value) ? this.minValue : this.min, max: this.max, min: this.min })) : null;
- }
- renderTickLabel(tick) {
- const valueIsRange = isRange(this.value);
- const isMinTickLabel = tick === this.min;
- const isMaxTickLabel = tick === this.max;
- const tickLabel = (hAsync("span", { class: {
- tick__label: true,
- "tick__label--min": isMinTickLabel,
- "tick__label--max": isMaxTickLabel
- } }, tick.toLocaleString()));
- if (this.labelTicks && !this.hasHistogram && !valueIsRange) {
- return tickLabel;
- }
- if (this.labelTicks &&
- !this.hasHistogram &&
- valueIsRange &&
- !this.precise &&
- !this.labelHandles) {
- return tickLabel;
- }
- if (this.labelTicks &&
- !this.hasHistogram &&
- valueIsRange &&
- !this.precise &&
- this.labelHandles) {
- return tickLabel;
- }
- if (this.labelTicks &&
- !this.hasHistogram &&
- valueIsRange &&
- this.precise &&
- (isMinTickLabel || isMaxTickLabel)) {
- return tickLabel;
- }
- if (this.labelTicks && this.hasHistogram && !this.precise && !this.labelHandles) {
- return tickLabel;
- }
- if (this.labelTicks &&
- this.hasHistogram &&
- this.precise &&
- !this.labelHandles &&
- (isMinTickLabel || isMaxTickLabel)) {
- return tickLabel;
- }
- if (this.labelTicks &&
- this.hasHistogram &&
- !this.precise &&
- this.labelHandles &&
- (isMinTickLabel || isMaxTickLabel)) {
- return tickLabel;
- }
- if (this.labelTicks &&
- this.hasHistogram &&
- this.precise &&
- this.labelHandles &&
- (isMinTickLabel || isMaxTickLabel)) {
- return tickLabel;
- }
- return null;
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- keyDownHandler(event) {
- const mirror = this.shouldMirror();
- const { activeProp, max, min, pageStep, step } = this;
- const value = this[activeProp];
- const key = event.key;
- if (key === "Enter" || key === " ") {
- event.preventDefault();
- return;
- }
- let adjustment;
- if (key === "ArrowUp" || key === "ArrowRight") {
- const directionFactor = mirror && key === "ArrowRight" ? -1 : 1;
- adjustment = value + step * directionFactor;
- }
- else if (key === "ArrowDown" || key === "ArrowLeft") {
- const directionFactor = mirror && key === "ArrowLeft" ? -1 : 1;
- adjustment = value - step * directionFactor;
- }
- else if (key === "PageUp") {
- if (pageStep) {
- adjustment = value + pageStep;
- }
- }
- else if (key === "PageDown") {
- if (pageStep) {
- adjustment = value - pageStep;
- }
- }
- else if (key === "Home") {
- adjustment = min;
- }
- else if (key === "End") {
- adjustment = max;
- }
- if (isNaN(adjustment)) {
- return;
- }
- event.preventDefault();
- const fixedDecimalAdjustment = Number(adjustment.toFixed(decimalPlaces(step)));
- this.setValue(activeProp, this.clamp(fixedDecimalAdjustment, activeProp));
- }
- clickHandler(event) {
- this.focusActiveHandle(event.clientX);
- }
- pointerDownHandler(event) {
- const x = event.clientX || event.pageX;
- const position = this.translate(x);
- let prop = "value";
- if (isRange(this.value)) {
- const inRange = position >= this.minValue && position <= this.maxValue;
- if (inRange && this.lastDragProp === "minMaxValue") {
- prop = "minMaxValue";
- }
- else {
- const closerToMax = Math.abs(this.maxValue - position) < Math.abs(this.minValue - position);
- prop = closerToMax || position > this.maxValue ? "maxValue" : "minValue";
- }
- }
- this.lastDragPropValue = this[prop];
- this.dragStart(prop);
- const isThumbActive = this.el.shadowRoot.querySelector(".thumb:active");
- if (!isThumbActive) {
- this.setValue(prop, this.clamp(position, prop));
- }
- }
- handleTouchStart(event) {
- // needed to prevent extra click at the end of a handle drag
- event.preventDefault();
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- const handle = this.minHandle ? this.minHandle : this.maxHandle;
- handle.focus();
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- setValueFromMinMax() {
- const { minValue, maxValue } = this;
- if (typeof minValue === "number" && typeof maxValue === "number") {
- this.value = [minValue, maxValue];
- }
- }
- setMinMaxFromValue() {
- const { value } = this;
- if (isRange(value)) {
- this.minValue = value[0];
- this.maxValue = value[1];
- }
- }
- onLabelClick() {
- this.setFocus();
- }
- shouldMirror() {
- return this.mirrored && !this.hasHistogram;
- }
- shouldUseMinValue() {
- if (!isRange(this.value)) {
- return false;
- }
- return ((this.hasHistogram && this.maxValue === 0) || (!this.hasHistogram && this.minValue === 0));
- }
- generateTickValues() {
- const ticks = [];
- let current = this.min;
- while (this.ticks && current < this.max + this.ticks) {
- ticks.push(Math.min(current, this.max));
- current = current + this.ticks;
- }
- return ticks;
- }
- dragStart(prop) {
- this.dragProp = prop;
- this.lastDragProp = this.dragProp;
- this.activeProp = prop;
- document.addEventListener("pointermove", this.dragUpdate);
- document.addEventListener("pointerup", this.dragEnd);
- document.addEventListener("pointercancel", this.dragEnd);
- }
- focusActiveHandle(valueX) {
- switch (this.dragProp) {
- case "minValue":
- this.minHandle.focus();
- break;
- case "maxValue":
- this.maxHandle.focus();
- break;
- case "minMaxValue":
- this.getClosestHandle(valueX).focus();
- break;
- }
- }
- emitInput() {
- this.calciteSliderInput.emit();
- this.calciteSliderUpdate.emit();
- }
- emitChange() {
- this.calciteSliderChange.emit();
- }
- removeDragListeners() {
- document.removeEventListener("pointermove", this.dragUpdate);
- document.removeEventListener("pointerup", this.dragEnd);
- document.removeEventListener("pointercancel", this.dragEnd);
- }
- /**
- * Set the prop value if changed at the component level
- * @param valueProp
- * @param value
- */
- setValue(valueProp, value) {
- const oldValue = this[valueProp];
- const valueChanged = oldValue !== value;
- if (!valueChanged) {
- return;
- }
- this[valueProp] = value;
- const dragging = this.dragProp;
- if (!dragging) {
- this.emitChange();
- }
- this.emitInput();
- }
- /**
- * If number is outside range, constrain to min or max
- * @internal
- */
- clamp(value, prop) {
- value = clamp(value, this.min, this.max);
- // ensure that maxValue and minValue don't swap positions
- if (prop === "maxValue") {
- value = Math.max(value, this.minValue);
- }
- if (prop === "minValue") {
- value = Math.min(value, this.maxValue);
- }
- return value;
- }
- /**
- * Translate a pixel position to value along the range
- * @internal
- */
- translate(x) {
- const range = this.max - this.min;
- const { left, width } = this.trackEl.getBoundingClientRect();
- const percent = (x - left) / width;
- const mirror = this.shouldMirror();
- const clampedValue = this.clamp(this.min + range * (mirror ? 1 - percent : percent));
- let value = Number(clampedValue.toFixed(decimalPlaces(this.step)));
- if (this.snap && this.step) {
- value = this.getClosestStep(value);
- }
- return value;
- }
- /**
- * Get closest allowed value along stepped values
- * @internal
- */
- getClosestStep(num) {
- num = Number(this.clamp(num).toFixed(decimalPlaces(this.step)));
- if (this.step) {
- const step = Math.round(num / this.step) * this.step;
- num = Number(this.clamp(step).toFixed(decimalPlaces(this.step)));
- }
- return num;
- }
- getClosestHandle(valueX) {
- return this.getDistanceX(this.maxHandle, valueX) > this.getDistanceX(this.minHandle, valueX)
- ? this.minHandle
- : this.maxHandle;
- }
- getDistanceX(el, valueX) {
- return Math.abs(el.getBoundingClientRect().left - valueX);
- }
- getFontSizeForElement(element) {
- return Number(window.getComputedStyle(element).getPropertyValue("font-size").match(/\d+/)[0]);
- }
- /**
- * Get position of value along range as fractional value
- * @return {number} number in the unit interval [0,1]
- * @internal
- */
- getUnitInterval(num) {
- num = this.clamp(num);
- const range = this.max - this.min;
- return (num - this.min) / range;
- }
- adjustHostObscuredHandleLabel(name) {
- const label = this.el.shadowRoot.querySelector(`.handle__label--${name}`);
- const labelStatic = this.el.shadowRoot.querySelector(`.handle__label--${name}.static`);
- const labelTransformed = this.el.shadowRoot.querySelector(`.handle__label--${name}.transformed`);
- const labelStaticBounds = labelStatic.getBoundingClientRect();
- const labelStaticOffset = this.getHostOffset(labelStaticBounds.left, labelStaticBounds.right);
- label.style.transform = `translateX(${labelStaticOffset}px)`;
- labelTransformed.style.transform = `translateX(${labelStaticOffset}px)`;
- }
- hyphenateCollidingRangeHandleLabels() {
- const { shadowRoot } = this.el;
- const mirror = this.shouldMirror();
- const leftModifier = mirror ? "value" : "minValue";
- const rightModifier = mirror ? "minValue" : "value";
- const leftValueLabel = shadowRoot.querySelector(`.handle__label--${leftModifier}`);
- const leftValueLabelStatic = shadowRoot.querySelector(`.handle__label--${leftModifier}.static`);
- const leftValueLabelTransformed = shadowRoot.querySelector(`.handle__label--${leftModifier}.transformed`);
- const leftValueLabelStaticHostOffset = this.getHostOffset(leftValueLabelStatic.getBoundingClientRect().left, leftValueLabelStatic.getBoundingClientRect().right);
- const rightValueLabel = shadowRoot.querySelector(`.handle__label--${rightModifier}`);
- const rightValueLabelStatic = shadowRoot.querySelector(`.handle__label--${rightModifier}.static`);
- const rightValueLabelTransformed = shadowRoot.querySelector(`.handle__label--${rightModifier}.transformed`);
- const rightValueLabelStaticHostOffset = this.getHostOffset(rightValueLabelStatic.getBoundingClientRect().left, rightValueLabelStatic.getBoundingClientRect().right);
- const labelFontSize = this.getFontSizeForElement(leftValueLabel);
- const labelTransformedOverlap = this.getRangeLabelOverlap(leftValueLabelTransformed, rightValueLabelTransformed);
- const hyphenLabel = leftValueLabel;
- const labelOffset = labelFontSize / 2;
- if (labelTransformedOverlap > 0) {
- hyphenLabel.classList.add("hyphen", "hyphen--wrap");
- if (rightValueLabelStaticHostOffset === 0 && leftValueLabelStaticHostOffset === 0) {
- // Neither handle overlaps the host boundary
- let leftValueLabelTranslate = labelTransformedOverlap / 2 - labelOffset;
- leftValueLabelTranslate =
- Math.sign(leftValueLabelTranslate) === -1
- ? Math.abs(leftValueLabelTranslate)
- : -leftValueLabelTranslate;
- const leftValueLabelTransformedHostOffset = this.getHostOffset(leftValueLabelTransformed.getBoundingClientRect().left +
- leftValueLabelTranslate -
- labelOffset, leftValueLabelTransformed.getBoundingClientRect().right +
- leftValueLabelTranslate -
- labelOffset);
- let rightValueLabelTranslate = labelTransformedOverlap / 2;
- const rightValueLabelTransformedHostOffset = this.getHostOffset(rightValueLabelTransformed.getBoundingClientRect().left + rightValueLabelTranslate, rightValueLabelTransformed.getBoundingClientRect().right + rightValueLabelTranslate);
- if (leftValueLabelTransformedHostOffset !== 0) {
- leftValueLabelTranslate += leftValueLabelTransformedHostOffset;
- rightValueLabelTranslate += leftValueLabelTransformedHostOffset;
- }
- if (rightValueLabelTransformedHostOffset !== 0) {
- leftValueLabelTranslate += rightValueLabelTransformedHostOffset;
- rightValueLabelTranslate += rightValueLabelTransformedHostOffset;
- }
- leftValueLabel.style.transform = `translateX(${leftValueLabelTranslate}px)`;
- leftValueLabelTransformed.style.transform = `translateX(${leftValueLabelTranslate - labelOffset}px)`;
- rightValueLabel.style.transform = `translateX(${rightValueLabelTranslate}px)`;
- rightValueLabelTransformed.style.transform = `translateX(${rightValueLabelTranslate}px)`;
- }
- else if (leftValueLabelStaticHostOffset > 0 || rightValueLabelStaticHostOffset > 0) {
- // labels overlap host boundary on the left side
- leftValueLabel.style.transform = `translateX(${leftValueLabelStaticHostOffset + labelOffset}px)`;
- rightValueLabel.style.transform = `translateX(${labelTransformedOverlap + rightValueLabelStaticHostOffset}px)`;
- rightValueLabelTransformed.style.transform = `translateX(${labelTransformedOverlap + rightValueLabelStaticHostOffset}px)`;
- }
- else if (leftValueLabelStaticHostOffset < 0 || rightValueLabelStaticHostOffset < 0) {
- // labels overlap host boundary on the right side
- let leftValueLabelTranslate = Math.abs(leftValueLabelStaticHostOffset) + labelTransformedOverlap - labelOffset;
- leftValueLabelTranslate =
- Math.sign(leftValueLabelTranslate) === -1
- ? Math.abs(leftValueLabelTranslate)
- : -leftValueLabelTranslate;
- leftValueLabel.style.transform = `translateX(${leftValueLabelTranslate}px)`;
- leftValueLabelTransformed.style.transform = `translateX(${leftValueLabelTranslate - labelOffset}px)`;
- }
- }
- else {
- hyphenLabel.classList.remove("hyphen", "hyphen--wrap");
- leftValueLabel.style.transform = `translateX(${leftValueLabelStaticHostOffset}px)`;
- leftValueLabelTransformed.style.transform = `translateX(${leftValueLabelStaticHostOffset}px)`;
- rightValueLabel.style.transform = `translateX(${rightValueLabelStaticHostOffset}px)`;
- rightValueLabelTransformed.style.transform = `translateX(${rightValueLabelStaticHostOffset}px)`;
- }
- }
- /**
- * Hides bounding tick labels that are obscured by either handle.
- */
- hideObscuredBoundingTickLabels() {
- const valueIsRange = isRange(this.value);
- if (!this.hasHistogram && !valueIsRange && !this.labelHandles && !this.precise) {
- return;
- }
- if (!this.hasHistogram && !valueIsRange && this.labelHandles && !this.precise) {
- return;
- }
- if (!this.hasHistogram && !valueIsRange && !this.labelHandles && this.precise) {
- return;
- }
- if (!this.hasHistogram && !valueIsRange && this.labelHandles && this.precise) {
- return;
- }
- if (!this.hasHistogram && valueIsRange && !this.precise) {
- return;
- }
- if (this.hasHistogram && !this.precise && !this.labelHandles) {
- return;
- }
- const minHandle = this.el.shadowRoot.querySelector(".thumb--minValue");
- const maxHandle = this.el.shadowRoot.querySelector(".thumb--value");
- const minTickLabel = this.el.shadowRoot.querySelector(".tick__label--min");
- const maxTickLabel = this.el.shadowRoot.querySelector(".tick__label--max");
- if (!minHandle && maxHandle && minTickLabel && maxTickLabel) {
- minTickLabel.style.opacity = this.isMinTickLabelObscured(minTickLabel, maxHandle) ? "0" : "1";
- maxTickLabel.style.opacity = this.isMaxTickLabelObscured(maxTickLabel, maxHandle) ? "0" : "1";
- }
- if (minHandle && maxHandle && minTickLabel && maxTickLabel) {
- minTickLabel.style.opacity =
- this.isMinTickLabelObscured(minTickLabel, minHandle) ||
- this.isMinTickLabelObscured(minTickLabel, maxHandle)
- ? "0"
- : "1";
- maxTickLabel.style.opacity =
- this.isMaxTickLabelObscured(maxTickLabel, minHandle) ||
- (this.isMaxTickLabelObscured(maxTickLabel, maxHandle) && this.hasHistogram)
- ? "0"
- : "1";
- }
- }
- /**
- * Returns an integer representing the number of pixels to offset on the left or right side based on desired position behavior.
- * @internal
- */
- getHostOffset(leftBounds, rightBounds) {
- const hostBounds = this.el.getBoundingClientRect();
- const buffer = 7;
- if (leftBounds + buffer < hostBounds.left) {
- return hostBounds.left - leftBounds - buffer;
- }
- if (rightBounds - buffer > hostBounds.right) {
- return -(rightBounds - hostBounds.right) + buffer;
- }
- return 0;
- }
- /**
- * Returns an integer representing the number of pixels that the two given span elements are overlapping, taking into account
- * a space in between the two spans equal to the font-size set on them to account for the space needed to render a hyphen.
- * @param leftLabel
- * @param rightLabel
- */
- getRangeLabelOverlap(leftLabel, rightLabel) {
- const leftLabelBounds = leftLabel.getBoundingClientRect();
- const rightLabelBounds = rightLabel.getBoundingClientRect();
- const leftLabelFontSize = this.getFontSizeForElement(leftLabel);
- const rangeLabelOverlap = leftLabelBounds.right + leftLabelFontSize - rightLabelBounds.left;
- return Math.max(rangeLabelOverlap, 0);
- }
- /**
- * Returns a boolean value representing if the minLabel span element is obscured (being overlapped) by the given handle div element.
- * @param minLabel
- * @param handle
- */
- isMinTickLabelObscured(minLabel, handle) {
- const minLabelBounds = minLabel.getBoundingClientRect();
- const handleBounds = handle.getBoundingClientRect();
- return intersects(minLabelBounds, handleBounds);
- }
- /**
- * Returns a boolean value representing if the maxLabel span element is obscured (being overlapped) by the given handle div element.
- * @param maxLabel
- * @param handle
- */
- isMaxTickLabelObscured(maxLabel, handle) {
- const maxLabelBounds = maxLabel.getBoundingClientRect();
- const handleBounds = handle.getBoundingClientRect();
- return intersects(maxLabelBounds, handleBounds);
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "histogram": ["histogramWatcher"],
- "value": ["valueHandler"],
- "minValue": ["minMaxValueHandler"],
- "maxValue": ["minMaxValueHandler"]
- }; }
- static get style() { return sliderCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-slider",
- "$members$": {
- "disabled": [516],
- "hasHistogram": [1540, "has-histogram"],
- "histogram": [16],
- "histogramStops": [16],
- "labelHandles": [516, "label-handles"],
- "labelTicks": [516, "label-ticks"],
- "max": [514],
- "maxLabel": [1, "max-label"],
- "maxValue": [1026, "max-value"],
- "min": [514],
- "minLabel": [1, "min-label"],
- "minValue": [1026, "min-value"],
- "mirrored": [516],
- "name": [513],
- "pageStep": [2, "page-step"],
- "precise": [4],
- "required": [516],
- "snap": [4],
- "step": [2],
- "ticks": [2],
- "value": [1538],
- "scale": [1],
- "activeProp": [32],
- "minMaxValueRange": [32],
- "minValueDragRange": [32],
- "maxValueDragRange": [32],
- "tickValues": [32],
- "setFocus": [64]
- },
- "$listeners$": [[0, "keydown", "keyDownHandler"], [0, "click", "clickHandler"], [1, "pointerdown", "pointerDownHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"], ["hasHistogram", "has-histogram"], ["labelHandles", "label-handles"], ["labelTicks", "label-ticks"], ["max", "max"], ["min", "min"], ["mirrored", "mirrored"], ["name", "name"], ["required", "required"], ["value", "value"]]
- }; }
- }
- /**!
- * Sortable 1.15.0
- * @author RubaXa <trash@rubaxa.org>
- * @author owenm <owen23355@gmail.com>
- * @license MIT
- */
- function ownKeys(object, enumerableOnly) {
- var keys = Object.keys(object);
- if (Object.getOwnPropertySymbols) {
- var symbols = Object.getOwnPropertySymbols(object);
- if (enumerableOnly) {
- symbols = symbols.filter(function (sym) {
- return Object.getOwnPropertyDescriptor(object, sym).enumerable;
- });
- }
- keys.push.apply(keys, symbols);
- }
- return keys;
- }
- function _objectSpread2(target) {
- for (var i = 1; i < arguments.length; i++) {
- var source = arguments[i] != null ? arguments[i] : {};
- if (i % 2) {
- ownKeys(Object(source), true).forEach(function (key) {
- _defineProperty(target, key, source[key]);
- });
- } else if (Object.getOwnPropertyDescriptors) {
- Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
- } else {
- ownKeys(Object(source)).forEach(function (key) {
- Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
- });
- }
- }
- return target;
- }
- function _typeof(obj) {
- "@babel/helpers - typeof";
- if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
- _typeof = function (obj) {
- return typeof obj;
- };
- } else {
- _typeof = function (obj) {
- return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
- };
- }
- return _typeof(obj);
- }
- function _defineProperty(obj, key, value) {
- if (key in obj) {
- Object.defineProperty(obj, key, {
- value: value,
- enumerable: true,
- configurable: true,
- writable: true
- });
- } else {
- obj[key] = value;
- }
- return obj;
- }
- function _extends() {
- _extends = Object.assign || function (target) {
- for (var i = 1; i < arguments.length; i++) {
- var source = arguments[i];
- for (var key in source) {
- if (Object.prototype.hasOwnProperty.call(source, key)) {
- target[key] = source[key];
- }
- }
- }
- return target;
- };
- return _extends.apply(this, arguments);
- }
- function _objectWithoutPropertiesLoose(source, excluded) {
- if (source == null) return {};
- var target = {};
- var sourceKeys = Object.keys(source);
- var key, i;
- for (i = 0; i < sourceKeys.length; i++) {
- key = sourceKeys[i];
- if (excluded.indexOf(key) >= 0) continue;
- target[key] = source[key];
- }
- return target;
- }
- function _objectWithoutProperties(source, excluded) {
- if (source == null) return {};
- var target = _objectWithoutPropertiesLoose(source, excluded);
- var key, i;
- if (Object.getOwnPropertySymbols) {
- var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
- for (i = 0; i < sourceSymbolKeys.length; i++) {
- key = sourceSymbolKeys[i];
- if (excluded.indexOf(key) >= 0) continue;
- if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
- target[key] = source[key];
- }
- }
- return target;
- }
- var version = "1.15.0";
- function userAgent(pattern) {
- if (typeof window !== 'undefined' && window.navigator) {
- return !! /*@__PURE__*/navigator.userAgent.match(pattern);
- }
- }
- var IE11OrLess = userAgent(/(?:Trident.*rv[ :]?11\.|msie|iemobile|Windows Phone)/i);
- var Edge = userAgent(/Edge/i);
- var FireFox = userAgent(/firefox/i);
- var Safari = userAgent(/safari/i) && !userAgent(/chrome/i) && !userAgent(/android/i);
- var IOS = userAgent(/iP(ad|od|hone)/i);
- var ChromeForAndroid = userAgent(/chrome/i) && userAgent(/android/i);
- var captureMode = {
- capture: false,
- passive: false
- };
- function on(el, event, fn) {
- el.addEventListener(event, fn, !IE11OrLess && captureMode);
- }
- function off(el, event, fn) {
- el.removeEventListener(event, fn, !IE11OrLess && captureMode);
- }
- function matches(
- /**HTMLElement*/
- el,
- /**String*/
- selector) {
- if (!selector) return;
- selector[0] === '>' && (selector = selector.substring(1));
- if (el) {
- try {
- if (el.matches) {
- return el.matches(selector);
- } else if (el.msMatchesSelector) {
- return el.msMatchesSelector(selector);
- } else if (el.webkitMatchesSelector) {
- return el.webkitMatchesSelector(selector);
- }
- } catch (_) {
- return false;
- }
- }
- return false;
- }
- function getParentOrHost(el) {
- return el.host && el !== document && el.host.nodeType ? el.host : el.parentNode;
- }
- function closest(
- /**HTMLElement*/
- el,
- /**String*/
- selector,
- /**HTMLElement*/
- ctx, includeCTX) {
- if (el) {
- ctx = ctx || document;
- do {
- if (selector != null && (selector[0] === '>' ? el.parentNode === ctx && matches(el, selector) : matches(el, selector)) || includeCTX && el === ctx) {
- return el;
- }
- if (el === ctx) break;
- /* jshint boss:true */
- } while (el = getParentOrHost(el));
- }
- return null;
- }
- var R_SPACE = /\s+/g;
- function toggleClass(el, name, state) {
- if (el && name) {
- if (el.classList) {
- el.classList[state ? 'add' : 'remove'](name);
- } else {
- var className = (' ' + el.className + ' ').replace(R_SPACE, ' ').replace(' ' + name + ' ', ' ');
- el.className = (className + (state ? ' ' + name : '')).replace(R_SPACE, ' ');
- }
- }
- }
- function css(el, prop, val) {
- var style = el && el.style;
- if (style) {
- if (val === void 0) {
- if (document.defaultView && document.defaultView.getComputedStyle) {
- val = document.defaultView.getComputedStyle(el, '');
- } else if (el.currentStyle) {
- val = el.currentStyle;
- }
- return prop === void 0 ? val : val[prop];
- } else {
- if (!(prop in style) && prop.indexOf('webkit') === -1) {
- prop = '-webkit-' + prop;
- }
- style[prop] = val + (typeof val === 'string' ? '' : 'px');
- }
- }
- }
- function matrix(el, selfOnly) {
- var appliedTransforms = '';
- if (typeof el === 'string') {
- appliedTransforms = el;
- } else {
- do {
- var transform = css(el, 'transform');
- if (transform && transform !== 'none') {
- appliedTransforms = transform + ' ' + appliedTransforms;
- }
- /* jshint boss:true */
- } while (!selfOnly && (el = el.parentNode));
- }
- var matrixFn = window.DOMMatrix || window.WebKitCSSMatrix || window.CSSMatrix || window.MSCSSMatrix;
- /*jshint -W056 */
- return matrixFn && new matrixFn(appliedTransforms);
- }
- function find(ctx, tagName, iterator) {
- if (ctx) {
- var list = ctx.getElementsByTagName(tagName),
- i = 0,
- n = list.length;
- if (iterator) {
- for (; i < n; i++) {
- iterator(list[i], i);
- }
- }
- return list;
- }
- return [];
- }
- function getWindowScrollingElement() {
- var scrollingElement = document.scrollingElement;
- if (scrollingElement) {
- return scrollingElement;
- } else {
- return document.documentElement;
- }
- }
- /**
- * Returns the "bounding client rect" of given element
- * @param {HTMLElement} el The element whose boundingClientRect is wanted
- * @param {[Boolean]} relativeToContainingBlock Whether the rect should be relative to the containing block of (including) the container
- * @param {[Boolean]} relativeToNonStaticParent Whether the rect should be relative to the relative parent of (including) the contaienr
- * @param {[Boolean]} undoScale Whether the container's scale() should be undone
- * @param {[HTMLElement]} container The parent the element will be placed in
- * @return {Object} The boundingClientRect of el, with specified adjustments
- */
- function getRect(el, relativeToContainingBlock, relativeToNonStaticParent, undoScale, container) {
- if (!el.getBoundingClientRect && el !== window) return;
- var elRect, top, left, bottom, right, height, width;
- if (el !== window && el.parentNode && el !== getWindowScrollingElement()) {
- elRect = el.getBoundingClientRect();
- top = elRect.top;
- left = elRect.left;
- bottom = elRect.bottom;
- right = elRect.right;
- height = elRect.height;
- width = elRect.width;
- } else {
- top = 0;
- left = 0;
- bottom = window.innerHeight;
- right = window.innerWidth;
- height = window.innerHeight;
- width = window.innerWidth;
- }
- if ((relativeToContainingBlock || relativeToNonStaticParent) && el !== window) {
- // Adjust for translate()
- container = container || el.parentNode; // solves #1123 (see: https://stackoverflow.com/a/37953806/6088312)
- // Not needed on <= IE11
- if (!IE11OrLess) {
- do {
- if (container && container.getBoundingClientRect && (css(container, 'transform') !== 'none' || relativeToNonStaticParent && css(container, 'position') !== 'static')) {
- var containerRect = container.getBoundingClientRect(); // Set relative to edges of padding box of container
- top -= containerRect.top + parseInt(css(container, 'border-top-width'));
- left -= containerRect.left + parseInt(css(container, 'border-left-width'));
- bottom = top + elRect.height;
- right = left + elRect.width;
- break;
- }
- /* jshint boss:true */
- } while (container = container.parentNode);
- }
- }
- if (undoScale && el !== window) {
- // Adjust for scale()
- var elMatrix = matrix(container || el),
- scaleX = elMatrix && elMatrix.a,
- scaleY = elMatrix && elMatrix.d;
- if (elMatrix) {
- top /= scaleY;
- left /= scaleX;
- width /= scaleX;
- height /= scaleY;
- bottom = top + height;
- right = left + width;
- }
- }
- return {
- top: top,
- left: left,
- bottom: bottom,
- right: right,
- width: width,
- height: height
- };
- }
- /**
- * Checks if a side of an element is scrolled past a side of its parents
- * @param {HTMLElement} el The element who's side being scrolled out of view is in question
- * @param {String} elSide Side of the element in question ('top', 'left', 'right', 'bottom')
- * @param {String} parentSide Side of the parent in question ('top', 'left', 'right', 'bottom')
- * @return {HTMLElement} The parent scroll element that the el's side is scrolled past, or null if there is no such element
- */
- function isScrolledPast(el, elSide, parentSide) {
- var parent = getParentAutoScrollElement(el, true),
- elSideVal = getRect(el)[elSide];
- /* jshint boss:true */
- while (parent) {
- var parentSideVal = getRect(parent)[parentSide],
- visible = void 0;
- if (parentSide === 'top' || parentSide === 'left') {
- visible = elSideVal >= parentSideVal;
- } else {
- visible = elSideVal <= parentSideVal;
- }
- if (!visible) return parent;
- if (parent === getWindowScrollingElement()) break;
- parent = getParentAutoScrollElement(parent, false);
- }
- return false;
- }
- /**
- * Gets nth child of el, ignoring hidden children, sortable's elements (does not ignore clone if it's visible)
- * and non-draggable elements
- * @param {HTMLElement} el The parent element
- * @param {Number} childNum The index of the child
- * @param {Object} options Parent Sortable's options
- * @return {HTMLElement} The child at index childNum, or null if not found
- */
- function getChild(el, childNum, options, includeDragEl) {
- var currentChild = 0,
- i = 0,
- children = el.children;
- while (i < children.length) {
- if (children[i].style.display !== 'none' && children[i] !== Sortable.ghost && (includeDragEl || children[i] !== Sortable.dragged) && closest(children[i], options.draggable, el, false)) {
- if (currentChild === childNum) {
- return children[i];
- }
- currentChild++;
- }
- i++;
- }
- return null;
- }
- /**
- * Gets the last child in the el, ignoring ghostEl or invisible elements (clones)
- * @param {HTMLElement} el Parent element
- * @param {selector} selector Any other elements that should be ignored
- * @return {HTMLElement} The last child, ignoring ghostEl
- */
- function lastChild(el, selector) {
- var last = el.lastElementChild;
- while (last && (last === Sortable.ghost || css(last, 'display') === 'none' || selector && !matches(last, selector))) {
- last = last.previousElementSibling;
- }
- return last || null;
- }
- /**
- * Returns the index of an element within its parent for a selected set of
- * elements
- * @param {HTMLElement} el
- * @param {selector} selector
- * @return {number}
- */
- function index(el, selector) {
- var index = 0;
- if (!el || !el.parentNode) {
- return -1;
- }
- /* jshint boss:true */
- while (el = el.previousElementSibling) {
- if (el.nodeName.toUpperCase() !== 'TEMPLATE' && el !== Sortable.clone && (!selector || matches(el, selector))) {
- index++;
- }
- }
- return index;
- }
- /**
- * Returns the scroll offset of the given element, added with all the scroll offsets of parent elements.
- * The value is returned in real pixels.
- * @param {HTMLElement} el
- * @return {Array} Offsets in the format of [left, top]
- */
- function getRelativeScrollOffset(el) {
- var offsetLeft = 0,
- offsetTop = 0,
- winScroller = getWindowScrollingElement();
- if (el) {
- do {
- var elMatrix = matrix(el),
- scaleX = elMatrix.a,
- scaleY = elMatrix.d;
- offsetLeft += el.scrollLeft * scaleX;
- offsetTop += el.scrollTop * scaleY;
- } while (el !== winScroller && (el = el.parentNode));
- }
- return [offsetLeft, offsetTop];
- }
- /**
- * Returns the index of the object within the given array
- * @param {Array} arr Array that may or may not hold the object
- * @param {Object} obj An object that has a key-value pair unique to and identical to a key-value pair in the object you want to find
- * @return {Number} The index of the object in the array, or -1
- */
- function indexOfObject(arr, obj) {
- for (var i in arr) {
- if (!arr.hasOwnProperty(i)) continue;
- for (var key in obj) {
- if (obj.hasOwnProperty(key) && obj[key] === arr[i][key]) return Number(i);
- }
- }
- return -1;
- }
- function getParentAutoScrollElement(el, includeSelf) {
- // skip to window
- if (!el || !el.getBoundingClientRect) return getWindowScrollingElement();
- var elem = el;
- var gotSelf = false;
- do {
- // we don't need to get elem css if it isn't even overflowing in the first place (performance)
- if (elem.clientWidth < elem.scrollWidth || elem.clientHeight < elem.scrollHeight) {
- var elemCSS = css(elem);
- if (elem.clientWidth < elem.scrollWidth && (elemCSS.overflowX == 'auto' || elemCSS.overflowX == 'scroll') || elem.clientHeight < elem.scrollHeight && (elemCSS.overflowY == 'auto' || elemCSS.overflowY == 'scroll')) {
- if (!elem.getBoundingClientRect || elem === document.body) return getWindowScrollingElement();
- if (gotSelf || includeSelf) return elem;
- gotSelf = true;
- }
- }
- /* jshint boss:true */
- } while (elem = elem.parentNode);
- return getWindowScrollingElement();
- }
- function extend(dst, src) {
- if (dst && src) {
- for (var key in src) {
- if (src.hasOwnProperty(key)) {
- dst[key] = src[key];
- }
- }
- }
- return dst;
- }
- function isRectEqual(rect1, rect2) {
- return Math.round(rect1.top) === Math.round(rect2.top) && Math.round(rect1.left) === Math.round(rect2.left) && Math.round(rect1.height) === Math.round(rect2.height) && Math.round(rect1.width) === Math.round(rect2.width);
- }
- var _throttleTimeout;
- function throttle(callback, ms) {
- return function () {
- if (!_throttleTimeout) {
- var args = arguments,
- _this = this;
- if (args.length === 1) {
- callback.call(_this, args[0]);
- } else {
- callback.apply(_this, args);
- }
- _throttleTimeout = setTimeout(function () {
- _throttleTimeout = void 0;
- }, ms);
- }
- };
- }
- function cancelThrottle() {
- clearTimeout(_throttleTimeout);
- _throttleTimeout = void 0;
- }
- function scrollBy(el, x, y) {
- el.scrollLeft += x;
- el.scrollTop += y;
- }
- function clone(el) {
- var Polymer = window.Polymer;
- var $ = window.jQuery || window.Zepto;
- if (Polymer && Polymer.dom) {
- return Polymer.dom(el).cloneNode(true);
- } else if ($) {
- return $(el).clone(true)[0];
- } else {
- return el.cloneNode(true);
- }
- }
- var expando = 'Sortable' + new Date().getTime();
- function AnimationStateManager() {
- var animationStates = [],
- animationCallbackId;
- return {
- captureAnimationState: function captureAnimationState() {
- animationStates = [];
- if (!this.options.animation) return;
- var children = [].slice.call(this.el.children);
- children.forEach(function (child) {
- if (css(child, 'display') === 'none' || child === Sortable.ghost) return;
- animationStates.push({
- target: child,
- rect: getRect(child)
- });
- var fromRect = _objectSpread2({}, animationStates[animationStates.length - 1].rect); // If animating: compensate for current animation
- if (child.thisAnimationDuration) {
- var childMatrix = matrix(child, true);
- if (childMatrix) {
- fromRect.top -= childMatrix.f;
- fromRect.left -= childMatrix.e;
- }
- }
- child.fromRect = fromRect;
- });
- },
- addAnimationState: function addAnimationState(state) {
- animationStates.push(state);
- },
- removeAnimationState: function removeAnimationState(target) {
- animationStates.splice(indexOfObject(animationStates, {
- target: target
- }), 1);
- },
- animateAll: function animateAll(callback) {
- var _this = this;
- if (!this.options.animation) {
- clearTimeout(animationCallbackId);
- if (typeof callback === 'function') callback();
- return;
- }
- var animating = false,
- animationTime = 0;
- animationStates.forEach(function (state) {
- var time = 0,
- target = state.target,
- fromRect = target.fromRect,
- toRect = getRect(target),
- prevFromRect = target.prevFromRect,
- prevToRect = target.prevToRect,
- animatingRect = state.rect,
- targetMatrix = matrix(target, true);
- if (targetMatrix) {
- // Compensate for current animation
- toRect.top -= targetMatrix.f;
- toRect.left -= targetMatrix.e;
- }
- target.toRect = toRect;
- if (target.thisAnimationDuration) {
- // Could also check if animatingRect is between fromRect and toRect
- if (isRectEqual(prevFromRect, toRect) && !isRectEqual(fromRect, toRect) && // Make sure animatingRect is on line between toRect & fromRect
- (animatingRect.top - toRect.top) / (animatingRect.left - toRect.left) === (fromRect.top - toRect.top) / (fromRect.left - toRect.left)) {
- // If returning to same place as started from animation and on same axis
- time = calculateRealTime(animatingRect, prevFromRect, prevToRect, _this.options);
- }
- } // if fromRect != toRect: animate
- if (!isRectEqual(toRect, fromRect)) {
- target.prevFromRect = fromRect;
- target.prevToRect = toRect;
- if (!time) {
- time = _this.options.animation;
- }
- _this.animate(target, animatingRect, toRect, time);
- }
- if (time) {
- animating = true;
- animationTime = Math.max(animationTime, time);
- clearTimeout(target.animationResetTimer);
- target.animationResetTimer = setTimeout(function () {
- target.animationTime = 0;
- target.prevFromRect = null;
- target.fromRect = null;
- target.prevToRect = null;
- target.thisAnimationDuration = null;
- }, time);
- target.thisAnimationDuration = time;
- }
- });
- clearTimeout(animationCallbackId);
- if (!animating) {
- if (typeof callback === 'function') callback();
- } else {
- animationCallbackId = setTimeout(function () {
- if (typeof callback === 'function') callback();
- }, animationTime);
- }
- animationStates = [];
- },
- animate: function animate(target, currentRect, toRect, duration) {
- if (duration) {
- css(target, 'transition', '');
- css(target, 'transform', '');
- var elMatrix = matrix(this.el),
- scaleX = elMatrix && elMatrix.a,
- scaleY = elMatrix && elMatrix.d,
- translateX = (currentRect.left - toRect.left) / (scaleX || 1),
- translateY = (currentRect.top - toRect.top) / (scaleY || 1);
- target.animatingX = !!translateX;
- target.animatingY = !!translateY;
- css(target, 'transform', 'translate3d(' + translateX + 'px,' + translateY + 'px,0)');
- this.forRepaintDummy = repaint(target); // repaint
- css(target, 'transition', 'transform ' + duration + 'ms' + (this.options.easing ? ' ' + this.options.easing : ''));
- css(target, 'transform', 'translate3d(0,0,0)');
- typeof target.animated === 'number' && clearTimeout(target.animated);
- target.animated = setTimeout(function () {
- css(target, 'transition', '');
- css(target, 'transform', '');
- target.animated = false;
- target.animatingX = false;
- target.animatingY = false;
- }, duration);
- }
- }
- };
- }
- function repaint(target) {
- return target.offsetWidth;
- }
- function calculateRealTime(animatingRect, fromRect, toRect, options) {
- return Math.sqrt(Math.pow(fromRect.top - animatingRect.top, 2) + Math.pow(fromRect.left - animatingRect.left, 2)) / Math.sqrt(Math.pow(fromRect.top - toRect.top, 2) + Math.pow(fromRect.left - toRect.left, 2)) * options.animation;
- }
- var plugins = [];
- var defaults = {
- initializeByDefault: true
- };
- var PluginManager = {
- mount: function mount(plugin) {
- // Set default static properties
- for (var option in defaults) {
- if (defaults.hasOwnProperty(option) && !(option in plugin)) {
- plugin[option] = defaults[option];
- }
- }
- plugins.forEach(function (p) {
- if (p.pluginName === plugin.pluginName) {
- throw "Sortable: Cannot mount plugin ".concat(plugin.pluginName, " more than once");
- }
- });
- plugins.push(plugin);
- },
- pluginEvent: function pluginEvent(eventName, sortable, evt) {
- var _this = this;
- this.eventCanceled = false;
- evt.cancel = function () {
- _this.eventCanceled = true;
- };
- var eventNameGlobal = eventName + 'Global';
- plugins.forEach(function (plugin) {
- if (!sortable[plugin.pluginName]) return; // Fire global events if it exists in this sortable
- if (sortable[plugin.pluginName][eventNameGlobal]) {
- sortable[plugin.pluginName][eventNameGlobal](_objectSpread2({
- sortable: sortable
- }, evt));
- } // Only fire plugin event if plugin is enabled in this sortable,
- // and plugin has event defined
- if (sortable.options[plugin.pluginName] && sortable[plugin.pluginName][eventName]) {
- sortable[plugin.pluginName][eventName](_objectSpread2({
- sortable: sortable
- }, evt));
- }
- });
- },
- initializePlugins: function initializePlugins(sortable, el, defaults, options) {
- plugins.forEach(function (plugin) {
- var pluginName = plugin.pluginName;
- if (!sortable.options[pluginName] && !plugin.initializeByDefault) return;
- var initialized = new plugin(sortable, el, sortable.options);
- initialized.sortable = sortable;
- initialized.options = sortable.options;
- sortable[pluginName] = initialized; // Add default options from plugin
- _extends(defaults, initialized.defaults);
- });
- for (var option in sortable.options) {
- if (!sortable.options.hasOwnProperty(option)) continue;
- var modified = this.modifyOption(sortable, option, sortable.options[option]);
- if (typeof modified !== 'undefined') {
- sortable.options[option] = modified;
- }
- }
- },
- getEventProperties: function getEventProperties(name, sortable) {
- var eventProperties = {};
- plugins.forEach(function (plugin) {
- if (typeof plugin.eventProperties !== 'function') return;
- _extends(eventProperties, plugin.eventProperties.call(sortable[plugin.pluginName], name));
- });
- return eventProperties;
- },
- modifyOption: function modifyOption(sortable, name, value) {
- var modifiedValue;
- plugins.forEach(function (plugin) {
- // Plugin must exist on the Sortable
- if (!sortable[plugin.pluginName]) return; // If static option listener exists for this option, call in the context of the Sortable's instance of this plugin
- if (plugin.optionListeners && typeof plugin.optionListeners[name] === 'function') {
- modifiedValue = plugin.optionListeners[name].call(sortable[plugin.pluginName], value);
- }
- });
- return modifiedValue;
- }
- };
- function dispatchEvent(_ref) {
- var sortable = _ref.sortable,
- rootEl = _ref.rootEl,
- name = _ref.name,
- targetEl = _ref.targetEl,
- cloneEl = _ref.cloneEl,
- toEl = _ref.toEl,
- fromEl = _ref.fromEl,
- oldIndex = _ref.oldIndex,
- newIndex = _ref.newIndex,
- oldDraggableIndex = _ref.oldDraggableIndex,
- newDraggableIndex = _ref.newDraggableIndex,
- originalEvent = _ref.originalEvent,
- putSortable = _ref.putSortable,
- extraEventProperties = _ref.extraEventProperties;
- sortable = sortable || rootEl && rootEl[expando];
- if (!sortable) return;
- var evt,
- options = sortable.options,
- onName = 'on' + name.charAt(0).toUpperCase() + name.substr(1); // Support for new CustomEvent feature
- if (window.CustomEvent && !IE11OrLess && !Edge) {
- evt = new CustomEvent(name, {
- bubbles: true,
- cancelable: true
- });
- } else {
- evt = document.createEvent('Event');
- evt.initEvent(name, true, true);
- }
- evt.to = toEl || rootEl;
- evt.from = fromEl || rootEl;
- evt.item = targetEl || rootEl;
- evt.clone = cloneEl;
- evt.oldIndex = oldIndex;
- evt.newIndex = newIndex;
- evt.oldDraggableIndex = oldDraggableIndex;
- evt.newDraggableIndex = newDraggableIndex;
- evt.originalEvent = originalEvent;
- evt.pullMode = putSortable ? putSortable.lastPutMode : undefined;
- var allEventProperties = _objectSpread2(_objectSpread2({}, extraEventProperties), PluginManager.getEventProperties(name, sortable));
- for (var option in allEventProperties) {
- evt[option] = allEventProperties[option];
- }
- if (rootEl) {
- rootEl.dispatchEvent(evt);
- }
- if (options[onName]) {
- options[onName].call(sortable, evt);
- }
- }
- var _excluded = ["evt"];
- var pluginEvent = function pluginEvent(eventName, sortable) {
- var _ref = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},
- originalEvent = _ref.evt,
- data = _objectWithoutProperties(_ref, _excluded);
- PluginManager.pluginEvent.bind(Sortable)(eventName, sortable, _objectSpread2({
- dragEl: dragEl,
- parentEl: parentEl,
- ghostEl: ghostEl,
- rootEl: rootEl,
- nextEl: nextEl,
- lastDownEl: lastDownEl,
- cloneEl: cloneEl,
- cloneHidden: cloneHidden,
- dragStarted: moved,
- putSortable: putSortable,
- activeSortable: Sortable.active,
- originalEvent: originalEvent,
- oldIndex: oldIndex,
- oldDraggableIndex: oldDraggableIndex,
- newIndex: newIndex,
- newDraggableIndex: newDraggableIndex,
- hideGhostForTarget: _hideGhostForTarget,
- unhideGhostForTarget: _unhideGhostForTarget,
- cloneNowHidden: function cloneNowHidden() {
- cloneHidden = true;
- },
- cloneNowShown: function cloneNowShown() {
- cloneHidden = false;
- },
- dispatchSortableEvent: function dispatchSortableEvent(name) {
- _dispatchEvent({
- sortable: sortable,
- name: name,
- originalEvent: originalEvent
- });
- }
- }, data));
- };
- function _dispatchEvent(info) {
- dispatchEvent(_objectSpread2({
- putSortable: putSortable,
- cloneEl: cloneEl,
- targetEl: dragEl,
- rootEl: rootEl,
- oldIndex: oldIndex,
- oldDraggableIndex: oldDraggableIndex,
- newIndex: newIndex,
- newDraggableIndex: newDraggableIndex
- }, info));
- }
- var dragEl,
- parentEl,
- ghostEl,
- rootEl,
- nextEl,
- lastDownEl,
- cloneEl,
- cloneHidden,
- oldIndex,
- newIndex,
- oldDraggableIndex,
- newDraggableIndex,
- activeGroup,
- putSortable,
- awaitingDragStarted = false,
- ignoreNextClick = false,
- sortables = [],
- tapEvt,
- touchEvt,
- lastDx,
- lastDy,
- tapDistanceLeft,
- tapDistanceTop,
- moved,
- lastTarget,
- lastDirection,
- pastFirstInvertThresh = false,
- isCircumstantialInvert = false,
- targetMoveDistance,
- // For positioning ghost absolutely
- ghostRelativeParent,
- ghostRelativeParentInitialScroll = [],
- // (left, top)
- _silent = false,
- savedInputChecked = [];
- /** @const */
- var documentExists = typeof document !== 'undefined',
- PositionGhostAbsolutely = IOS,
- CSSFloatProperty = Edge || IE11OrLess ? 'cssFloat' : 'float',
- // This will not pass for IE9, because IE9 DnD only works on anchors
- supportDraggable = documentExists && !ChromeForAndroid && !IOS && 'draggable' in document.createElement('div'),
- supportCssPointerEvents = function () {
- if (!documentExists) return; // false when <= IE11
- if (IE11OrLess) {
- return false;
- }
- var el = document.createElement('x');
- el.style.cssText = 'pointer-events:auto';
- return el.style.pointerEvents === 'auto';
- }(),
- _detectDirection = function _detectDirection(el, options) {
- var elCSS = css(el),
- elWidth = parseInt(elCSS.width) - parseInt(elCSS.paddingLeft) - parseInt(elCSS.paddingRight) - parseInt(elCSS.borderLeftWidth) - parseInt(elCSS.borderRightWidth),
- child1 = getChild(el, 0, options),
- child2 = getChild(el, 1, options),
- firstChildCSS = child1 && css(child1),
- secondChildCSS = child2 && css(child2),
- firstChildWidth = firstChildCSS && parseInt(firstChildCSS.marginLeft) + parseInt(firstChildCSS.marginRight) + getRect(child1).width,
- secondChildWidth = secondChildCSS && parseInt(secondChildCSS.marginLeft) + parseInt(secondChildCSS.marginRight) + getRect(child2).width;
- if (elCSS.display === 'flex') {
- return elCSS.flexDirection === 'column' || elCSS.flexDirection === 'column-reverse' ? 'vertical' : 'horizontal';
- }
- if (elCSS.display === 'grid') {
- return elCSS.gridTemplateColumns.split(' ').length <= 1 ? 'vertical' : 'horizontal';
- }
- if (child1 && firstChildCSS["float"] && firstChildCSS["float"] !== 'none') {
- var touchingSideChild2 = firstChildCSS["float"] === 'left' ? 'left' : 'right';
- return child2 && (secondChildCSS.clear === 'both' || secondChildCSS.clear === touchingSideChild2) ? 'vertical' : 'horizontal';
- }
- return child1 && (firstChildCSS.display === 'block' || firstChildCSS.display === 'flex' || firstChildCSS.display === 'table' || firstChildCSS.display === 'grid' || firstChildWidth >= elWidth && elCSS[CSSFloatProperty] === 'none' || child2 && elCSS[CSSFloatProperty] === 'none' && firstChildWidth + secondChildWidth > elWidth) ? 'vertical' : 'horizontal';
- },
- _dragElInRowColumn = function _dragElInRowColumn(dragRect, targetRect, vertical) {
- var dragElS1Opp = vertical ? dragRect.left : dragRect.top,
- dragElS2Opp = vertical ? dragRect.right : dragRect.bottom,
- dragElOppLength = vertical ? dragRect.width : dragRect.height,
- targetS1Opp = vertical ? targetRect.left : targetRect.top,
- targetS2Opp = vertical ? targetRect.right : targetRect.bottom,
- targetOppLength = vertical ? targetRect.width : targetRect.height;
- return dragElS1Opp === targetS1Opp || dragElS2Opp === targetS2Opp || dragElS1Opp + dragElOppLength / 2 === targetS1Opp + targetOppLength / 2;
- },
- /**
- * Detects first nearest empty sortable to X and Y position using emptyInsertThreshold.
- * @param {Number} x X position
- * @param {Number} y Y position
- * @return {HTMLElement} Element of the first found nearest Sortable
- */
- _detectNearestEmptySortable = function _detectNearestEmptySortable(x, y) {
- var ret;
- sortables.some(function (sortable) {
- var threshold = sortable[expando].options.emptyInsertThreshold;
- if (!threshold || lastChild(sortable)) return;
- var rect = getRect(sortable),
- insideHorizontally = x >= rect.left - threshold && x <= rect.right + threshold,
- insideVertically = y >= rect.top - threshold && y <= rect.bottom + threshold;
- if (insideHorizontally && insideVertically) {
- return ret = sortable;
- }
- });
- return ret;
- },
- _prepareGroup = function _prepareGroup(options) {
- function toFn(value, pull) {
- return function (to, from, dragEl, evt) {
- var sameGroup = to.options.group.name && from.options.group.name && to.options.group.name === from.options.group.name;
- if (value == null && (pull || sameGroup)) {
- // Default pull value
- // Default pull and put value if same group
- return true;
- } else if (value == null || value === false) {
- return false;
- } else if (pull && value === 'clone') {
- return value;
- } else if (typeof value === 'function') {
- return toFn(value(to, from, dragEl, evt), pull)(to, from, dragEl, evt);
- } else {
- var otherGroup = (pull ? to : from).options.group.name;
- return value === true || typeof value === 'string' && value === otherGroup || value.join && value.indexOf(otherGroup) > -1;
- }
- };
- }
- var group = {};
- var originalGroup = options.group;
- if (!originalGroup || _typeof(originalGroup) != 'object') {
- originalGroup = {
- name: originalGroup
- };
- }
- group.name = originalGroup.name;
- group.checkPull = toFn(originalGroup.pull, true);
- group.checkPut = toFn(originalGroup.put);
- group.revertClone = originalGroup.revertClone;
- options.group = group;
- },
- _hideGhostForTarget = function _hideGhostForTarget() {
- if (!supportCssPointerEvents && ghostEl) {
- css(ghostEl, 'display', 'none');
- }
- },
- _unhideGhostForTarget = function _unhideGhostForTarget() {
- if (!supportCssPointerEvents && ghostEl) {
- css(ghostEl, 'display', '');
- }
- }; // #1184 fix - Prevent click event on fallback if dragged but item not changed position
- if (documentExists && !ChromeForAndroid) {
- document.addEventListener('click', function (evt) {
- if (ignoreNextClick) {
- evt.preventDefault();
- evt.stopPropagation && evt.stopPropagation();
- evt.stopImmediatePropagation && evt.stopImmediatePropagation();
- ignoreNextClick = false;
- return false;
- }
- }, true);
- }
- var nearestEmptyInsertDetectEvent = function nearestEmptyInsertDetectEvent(evt) {
- if (dragEl) {
- evt = evt.touches ? evt.touches[0] : evt;
- var nearest = _detectNearestEmptySortable(evt.clientX, evt.clientY);
- if (nearest) {
- // Create imitation event
- var event = {};
- for (var i in evt) {
- if (evt.hasOwnProperty(i)) {
- event[i] = evt[i];
- }
- }
- event.target = event.rootEl = nearest;
- event.preventDefault = void 0;
- event.stopPropagation = void 0;
- nearest[expando]._onDragOver(event);
- }
- }
- };
- var _checkOutsideTargetEl = function _checkOutsideTargetEl(evt) {
- if (dragEl) {
- dragEl.parentNode[expando]._isOutsideThisEl(evt.target);
- }
- };
- /**
- * @class Sortable
- * @param {HTMLElement} el
- * @param {Object} [options]
- */
- function Sortable(el, options) {
- if (!(el && el.nodeType && el.nodeType === 1)) {
- throw "Sortable: `el` must be an HTMLElement, not ".concat({}.toString.call(el));
- }
- this.el = el; // root element
- this.options = options = _extends({}, options); // Export instance
- el[expando] = this;
- var defaults = {
- group: null,
- sort: true,
- disabled: false,
- store: null,
- handle: null,
- draggable: /^[uo]l$/i.test(el.nodeName) ? '>li' : '>*',
- swapThreshold: 1,
- // percentage; 0 <= x <= 1
- invertSwap: false,
- // invert always
- invertedSwapThreshold: null,
- // will be set to same as swapThreshold if default
- removeCloneOnHide: true,
- direction: function direction() {
- return _detectDirection(el, this.options);
- },
- ghostClass: 'sortable-ghost',
- chosenClass: 'sortable-chosen',
- dragClass: 'sortable-drag',
- ignore: 'a, img',
- filter: null,
- preventOnFilter: true,
- animation: 0,
- easing: null,
- setData: function setData(dataTransfer, dragEl) {
- dataTransfer.setData('Text', dragEl.textContent);
- },
- dropBubble: false,
- dragoverBubble: false,
- dataIdAttr: 'data-id',
- delay: 0,
- delayOnTouchOnly: false,
- touchStartThreshold: (Number.parseInt ? Number : window).parseInt(window.devicePixelRatio, 10) || 1,
- forceFallback: false,
- fallbackClass: 'sortable-fallback',
- fallbackOnBody: false,
- fallbackTolerance: 0,
- fallbackOffset: {
- x: 0,
- y: 0
- },
- supportPointer: Sortable.supportPointer !== false && 'PointerEvent' in window && !Safari,
- emptyInsertThreshold: 5
- };
- PluginManager.initializePlugins(this, el, defaults); // Set default options
- for (var name in defaults) {
- !(name in options) && (options[name] = defaults[name]);
- }
- _prepareGroup(options); // Bind all private methods
- for (var fn in this) {
- if (fn.charAt(0) === '_' && typeof this[fn] === 'function') {
- this[fn] = this[fn].bind(this);
- }
- } // Setup drag mode
- this.nativeDraggable = options.forceFallback ? false : supportDraggable;
- if (this.nativeDraggable) {
- // Touch start threshold cannot be greater than the native dragstart threshold
- this.options.touchStartThreshold = 1;
- } // Bind events
- if (options.supportPointer) {
- on(el, 'pointerdown', this._onTapStart);
- } else {
- on(el, 'mousedown', this._onTapStart);
- on(el, 'touchstart', this._onTapStart);
- }
- if (this.nativeDraggable) {
- on(el, 'dragover', this);
- on(el, 'dragenter', this);
- }
- sortables.push(this.el); // Restore sorting
- options.store && options.store.get && this.sort(options.store.get(this) || []); // Add animation state manager
- _extends(this, AnimationStateManager());
- }
- Sortable.prototype =
- /** @lends Sortable.prototype */
- {
- constructor: Sortable,
- _isOutsideThisEl: function _isOutsideThisEl(target) {
- if (!this.el.contains(target) && target !== this.el) {
- lastTarget = null;
- }
- },
- _getDirection: function _getDirection(evt, target) {
- return typeof this.options.direction === 'function' ? this.options.direction.call(this, evt, target, dragEl) : this.options.direction;
- },
- _onTapStart: function _onTapStart(
- /** Event|TouchEvent */
- evt) {
- if (!evt.cancelable) return;
- var _this = this,
- el = this.el,
- options = this.options,
- preventOnFilter = options.preventOnFilter,
- type = evt.type,
- touch = evt.touches && evt.touches[0] || evt.pointerType && evt.pointerType === 'touch' && evt,
- target = (touch || evt).target,
- originalTarget = evt.target.shadowRoot && (evt.path && evt.path[0] || evt.composedPath && evt.composedPath()[0]) || target,
- filter = options.filter;
- _saveInputCheckedState(el); // Don't trigger start event when an element is been dragged, otherwise the evt.oldindex always wrong when set option.group.
- if (dragEl) {
- return;
- }
- if (/mousedown|pointerdown/.test(type) && evt.button !== 0 || options.disabled) {
- return; // only left button and enabled
- } // cancel dnd if original target is content editable
- if (originalTarget.isContentEditable) {
- return;
- } // Safari ignores further event handling after mousedown
- if (!this.nativeDraggable && Safari && target && target.tagName.toUpperCase() === 'SELECT') {
- return;
- }
- target = closest(target, options.draggable, el, false);
- if (target && target.animated) {
- return;
- }
- if (lastDownEl === target) {
- // Ignoring duplicate `down`
- return;
- } // Get the index of the dragged element within its parent
- oldIndex = index(target);
- oldDraggableIndex = index(target, options.draggable); // Check filter
- if (typeof filter === 'function') {
- if (filter.call(this, evt, target, this)) {
- _dispatchEvent({
- sortable: _this,
- rootEl: originalTarget,
- name: 'filter',
- targetEl: target,
- toEl: el,
- fromEl: el
- });
- pluginEvent('filter', _this, {
- evt: evt
- });
- preventOnFilter && evt.cancelable && evt.preventDefault();
- return; // cancel dnd
- }
- } else if (filter) {
- filter = filter.split(',').some(function (criteria) {
- criteria = closest(originalTarget, criteria.trim(), el, false);
- if (criteria) {
- _dispatchEvent({
- sortable: _this,
- rootEl: criteria,
- name: 'filter',
- targetEl: target,
- fromEl: el,
- toEl: el
- });
- pluginEvent('filter', _this, {
- evt: evt
- });
- return true;
- }
- });
- if (filter) {
- preventOnFilter && evt.cancelable && evt.preventDefault();
- return; // cancel dnd
- }
- }
- if (options.handle && !closest(originalTarget, options.handle, el, false)) {
- return;
- } // Prepare `dragstart`
- this._prepareDragStart(evt, touch, target);
- },
- _prepareDragStart: function _prepareDragStart(
- /** Event */
- evt,
- /** Touch */
- touch,
- /** HTMLElement */
- target) {
- var _this = this,
- el = _this.el,
- options = _this.options,
- ownerDocument = el.ownerDocument,
- dragStartFn;
- if (target && !dragEl && target.parentNode === el) {
- var dragRect = getRect(target);
- rootEl = el;
- dragEl = target;
- parentEl = dragEl.parentNode;
- nextEl = dragEl.nextSibling;
- lastDownEl = target;
- activeGroup = options.group;
- Sortable.dragged = dragEl;
- tapEvt = {
- target: dragEl,
- clientX: (touch || evt).clientX,
- clientY: (touch || evt).clientY
- };
- tapDistanceLeft = tapEvt.clientX - dragRect.left;
- tapDistanceTop = tapEvt.clientY - dragRect.top;
- this._lastX = (touch || evt).clientX;
- this._lastY = (touch || evt).clientY;
- dragEl.style['will-change'] = 'all';
- dragStartFn = function dragStartFn() {
- pluginEvent('delayEnded', _this, {
- evt: evt
- });
- if (Sortable.eventCanceled) {
- _this._onDrop();
- return;
- } // Delayed drag has been triggered
- // we can re-enable the events: touchmove/mousemove
- _this._disableDelayedDragEvents();
- if (!FireFox && _this.nativeDraggable) {
- dragEl.draggable = true;
- } // Bind the events: dragstart/dragend
- _this._triggerDragStart(evt, touch); // Drag start event
- _dispatchEvent({
- sortable: _this,
- name: 'choose',
- originalEvent: evt
- }); // Chosen item
- toggleClass(dragEl, options.chosenClass, true);
- }; // Disable "draggable"
- options.ignore.split(',').forEach(function (criteria) {
- find(dragEl, criteria.trim(), _disableDraggable);
- });
- on(ownerDocument, 'dragover', nearestEmptyInsertDetectEvent);
- on(ownerDocument, 'mousemove', nearestEmptyInsertDetectEvent);
- on(ownerDocument, 'touchmove', nearestEmptyInsertDetectEvent);
- on(ownerDocument, 'mouseup', _this._onDrop);
- on(ownerDocument, 'touchend', _this._onDrop);
- on(ownerDocument, 'touchcancel', _this._onDrop); // Make dragEl draggable (must be before delay for FireFox)
- if (FireFox && this.nativeDraggable) {
- this.options.touchStartThreshold = 4;
- dragEl.draggable = true;
- }
- pluginEvent('delayStart', this, {
- evt: evt
- }); // Delay is impossible for native DnD in Edge or IE
- if (options.delay && (!options.delayOnTouchOnly || touch) && (!this.nativeDraggable || !(Edge || IE11OrLess))) {
- if (Sortable.eventCanceled) {
- this._onDrop();
- return;
- } // If the user moves the pointer or let go the click or touch
- // before the delay has been reached:
- // disable the delayed drag
- on(ownerDocument, 'mouseup', _this._disableDelayedDrag);
- on(ownerDocument, 'touchend', _this._disableDelayedDrag);
- on(ownerDocument, 'touchcancel', _this._disableDelayedDrag);
- on(ownerDocument, 'mousemove', _this._delayedDragTouchMoveHandler);
- on(ownerDocument, 'touchmove', _this._delayedDragTouchMoveHandler);
- options.supportPointer && on(ownerDocument, 'pointermove', _this._delayedDragTouchMoveHandler);
- _this._dragStartTimer = setTimeout(dragStartFn, options.delay);
- } else {
- dragStartFn();
- }
- }
- },
- _delayedDragTouchMoveHandler: function _delayedDragTouchMoveHandler(
- /** TouchEvent|PointerEvent **/
- e) {
- var touch = e.touches ? e.touches[0] : e;
- if (Math.max(Math.abs(touch.clientX - this._lastX), Math.abs(touch.clientY - this._lastY)) >= Math.floor(this.options.touchStartThreshold / (this.nativeDraggable && window.devicePixelRatio || 1))) {
- this._disableDelayedDrag();
- }
- },
- _disableDelayedDrag: function _disableDelayedDrag() {
- dragEl && _disableDraggable(dragEl);
- clearTimeout(this._dragStartTimer);
- this._disableDelayedDragEvents();
- },
- _disableDelayedDragEvents: function _disableDelayedDragEvents() {
- var ownerDocument = this.el.ownerDocument;
- off(ownerDocument, 'mouseup', this._disableDelayedDrag);
- off(ownerDocument, 'touchend', this._disableDelayedDrag);
- off(ownerDocument, 'touchcancel', this._disableDelayedDrag);
- off(ownerDocument, 'mousemove', this._delayedDragTouchMoveHandler);
- off(ownerDocument, 'touchmove', this._delayedDragTouchMoveHandler);
- off(ownerDocument, 'pointermove', this._delayedDragTouchMoveHandler);
- },
- _triggerDragStart: function _triggerDragStart(
- /** Event */
- evt,
- /** Touch */
- touch) {
- touch = touch || evt.pointerType == 'touch' && evt;
- if (!this.nativeDraggable || touch) {
- if (this.options.supportPointer) {
- on(document, 'pointermove', this._onTouchMove);
- } else if (touch) {
- on(document, 'touchmove', this._onTouchMove);
- } else {
- on(document, 'mousemove', this._onTouchMove);
- }
- } else {
- on(dragEl, 'dragend', this);
- on(rootEl, 'dragstart', this._onDragStart);
- }
- try {
- if (document.selection) {
- // Timeout neccessary for IE9
- _nextTick(function () {
- document.selection.empty();
- });
- } else {
- window.getSelection().removeAllRanges();
- }
- } catch (err) {}
- },
- _dragStarted: function _dragStarted(fallback, evt) {
- awaitingDragStarted = false;
- if (rootEl && dragEl) {
- pluginEvent('dragStarted', this, {
- evt: evt
- });
- if (this.nativeDraggable) {
- on(document, 'dragover', _checkOutsideTargetEl);
- }
- var options = this.options; // Apply effect
- !fallback && toggleClass(dragEl, options.dragClass, false);
- toggleClass(dragEl, options.ghostClass, true);
- Sortable.active = this;
- fallback && this._appendGhost(); // Drag start event
- _dispatchEvent({
- sortable: this,
- name: 'start',
- originalEvent: evt
- });
- } else {
- this._nulling();
- }
- },
- _emulateDragOver: function _emulateDragOver() {
- if (touchEvt) {
- this._lastX = touchEvt.clientX;
- this._lastY = touchEvt.clientY;
- _hideGhostForTarget();
- var target = document.elementFromPoint(touchEvt.clientX, touchEvt.clientY);
- var parent = target;
- while (target && target.shadowRoot) {
- target = target.shadowRoot.elementFromPoint(touchEvt.clientX, touchEvt.clientY);
- if (target === parent) break;
- parent = target;
- }
- dragEl.parentNode[expando]._isOutsideThisEl(target);
- if (parent) {
- do {
- if (parent[expando]) {
- var inserted = void 0;
- inserted = parent[expando]._onDragOver({
- clientX: touchEvt.clientX,
- clientY: touchEvt.clientY,
- target: target,
- rootEl: parent
- });
- if (inserted && !this.options.dragoverBubble) {
- break;
- }
- }
- target = parent; // store last element
- }
- /* jshint boss:true */
- while (parent = parent.parentNode);
- }
- _unhideGhostForTarget();
- }
- },
- _onTouchMove: function _onTouchMove(
- /**TouchEvent*/
- evt) {
- if (tapEvt) {
- var options = this.options,
- fallbackTolerance = options.fallbackTolerance,
- fallbackOffset = options.fallbackOffset,
- touch = evt.touches ? evt.touches[0] : evt,
- ghostMatrix = ghostEl && matrix(ghostEl, true),
- scaleX = ghostEl && ghostMatrix && ghostMatrix.a,
- scaleY = ghostEl && ghostMatrix && ghostMatrix.d,
- relativeScrollOffset = PositionGhostAbsolutely && ghostRelativeParent && getRelativeScrollOffset(ghostRelativeParent),
- dx = (touch.clientX - tapEvt.clientX + fallbackOffset.x) / (scaleX || 1) + (relativeScrollOffset ? relativeScrollOffset[0] - ghostRelativeParentInitialScroll[0] : 0) / (scaleX || 1),
- dy = (touch.clientY - tapEvt.clientY + fallbackOffset.y) / (scaleY || 1) + (relativeScrollOffset ? relativeScrollOffset[1] - ghostRelativeParentInitialScroll[1] : 0) / (scaleY || 1); // only set the status to dragging, when we are actually dragging
- if (!Sortable.active && !awaitingDragStarted) {
- if (fallbackTolerance && Math.max(Math.abs(touch.clientX - this._lastX), Math.abs(touch.clientY - this._lastY)) < fallbackTolerance) {
- return;
- }
- this._onDragStart(evt, true);
- }
- if (ghostEl) {
- if (ghostMatrix) {
- ghostMatrix.e += dx - (lastDx || 0);
- ghostMatrix.f += dy - (lastDy || 0);
- } else {
- ghostMatrix = {
- a: 1,
- b: 0,
- c: 0,
- d: 1,
- e: dx,
- f: dy
- };
- }
- var cssMatrix = "matrix(".concat(ghostMatrix.a, ",").concat(ghostMatrix.b, ",").concat(ghostMatrix.c, ",").concat(ghostMatrix.d, ",").concat(ghostMatrix.e, ",").concat(ghostMatrix.f, ")");
- css(ghostEl, 'webkitTransform', cssMatrix);
- css(ghostEl, 'mozTransform', cssMatrix);
- css(ghostEl, 'msTransform', cssMatrix);
- css(ghostEl, 'transform', cssMatrix);
- lastDx = dx;
- lastDy = dy;
- touchEvt = touch;
- }
- evt.cancelable && evt.preventDefault();
- }
- },
- _appendGhost: function _appendGhost() {
- // Bug if using scale(): https://stackoverflow.com/questions/2637058
- // Not being adjusted for
- if (!ghostEl) {
- var container = this.options.fallbackOnBody ? document.body : rootEl,
- rect = getRect(dragEl, true, PositionGhostAbsolutely, true, container),
- options = this.options; // Position absolutely
- if (PositionGhostAbsolutely) {
- // Get relatively positioned parent
- ghostRelativeParent = container;
- while (css(ghostRelativeParent, 'position') === 'static' && css(ghostRelativeParent, 'transform') === 'none' && ghostRelativeParent !== document) {
- ghostRelativeParent = ghostRelativeParent.parentNode;
- }
- if (ghostRelativeParent !== document.body && ghostRelativeParent !== document.documentElement) {
- if (ghostRelativeParent === document) ghostRelativeParent = getWindowScrollingElement();
- rect.top += ghostRelativeParent.scrollTop;
- rect.left += ghostRelativeParent.scrollLeft;
- } else {
- ghostRelativeParent = getWindowScrollingElement();
- }
- ghostRelativeParentInitialScroll = getRelativeScrollOffset(ghostRelativeParent);
- }
- ghostEl = dragEl.cloneNode(true);
- toggleClass(ghostEl, options.ghostClass, false);
- toggleClass(ghostEl, options.fallbackClass, true);
- toggleClass(ghostEl, options.dragClass, true);
- css(ghostEl, 'transition', '');
- css(ghostEl, 'transform', '');
- css(ghostEl, 'box-sizing', 'border-box');
- css(ghostEl, 'margin', 0);
- css(ghostEl, 'top', rect.top);
- css(ghostEl, 'left', rect.left);
- css(ghostEl, 'width', rect.width);
- css(ghostEl, 'height', rect.height);
- css(ghostEl, 'opacity', '0.8');
- css(ghostEl, 'position', PositionGhostAbsolutely ? 'absolute' : 'fixed');
- css(ghostEl, 'zIndex', '100000');
- css(ghostEl, 'pointerEvents', 'none');
- Sortable.ghost = ghostEl;
- container.appendChild(ghostEl); // Set transform-origin
- css(ghostEl, 'transform-origin', tapDistanceLeft / parseInt(ghostEl.style.width) * 100 + '% ' + tapDistanceTop / parseInt(ghostEl.style.height) * 100 + '%');
- }
- },
- _onDragStart: function _onDragStart(
- /**Event*/
- evt,
- /**boolean*/
- fallback) {
- var _this = this;
- var dataTransfer = evt.dataTransfer;
- var options = _this.options;
- pluginEvent('dragStart', this, {
- evt: evt
- });
- if (Sortable.eventCanceled) {
- this._onDrop();
- return;
- }
- pluginEvent('setupClone', this);
- if (!Sortable.eventCanceled) {
- cloneEl = clone(dragEl);
- cloneEl.removeAttribute("id");
- cloneEl.draggable = false;
- cloneEl.style['will-change'] = '';
- this._hideClone();
- toggleClass(cloneEl, this.options.chosenClass, false);
- Sortable.clone = cloneEl;
- } // #1143: IFrame support workaround
- _this.cloneId = _nextTick(function () {
- pluginEvent('clone', _this);
- if (Sortable.eventCanceled) return;
- if (!_this.options.removeCloneOnHide) {
- rootEl.insertBefore(cloneEl, dragEl);
- }
- _this._hideClone();
- _dispatchEvent({
- sortable: _this,
- name: 'clone'
- });
- });
- !fallback && toggleClass(dragEl, options.dragClass, true); // Set proper drop events
- if (fallback) {
- ignoreNextClick = true;
- _this._loopId = setInterval(_this._emulateDragOver, 50);
- } else {
- // Undo what was set in _prepareDragStart before drag started
- off(document, 'mouseup', _this._onDrop);
- off(document, 'touchend', _this._onDrop);
- off(document, 'touchcancel', _this._onDrop);
- if (dataTransfer) {
- dataTransfer.effectAllowed = 'move';
- options.setData && options.setData.call(_this, dataTransfer, dragEl);
- }
- on(document, 'drop', _this); // #1276 fix:
- css(dragEl, 'transform', 'translateZ(0)');
- }
- awaitingDragStarted = true;
- _this._dragStartId = _nextTick(_this._dragStarted.bind(_this, fallback, evt));
- on(document, 'selectstart', _this);
- moved = true;
- if (Safari) {
- css(document.body, 'user-select', 'none');
- }
- },
- // Returns true - if no further action is needed (either inserted or another condition)
- _onDragOver: function _onDragOver(
- /**Event*/
- evt) {
- var el = this.el,
- target = evt.target,
- dragRect,
- targetRect,
- revert,
- options = this.options,
- group = options.group,
- activeSortable = Sortable.active,
- isOwner = activeGroup === group,
- canSort = options.sort,
- fromSortable = putSortable || activeSortable,
- vertical,
- _this = this,
- completedFired = false;
- if (_silent) return;
- function dragOverEvent(name, extra) {
- pluginEvent(name, _this, _objectSpread2({
- evt: evt,
- isOwner: isOwner,
- axis: vertical ? 'vertical' : 'horizontal',
- revert: revert,
- dragRect: dragRect,
- targetRect: targetRect,
- canSort: canSort,
- fromSortable: fromSortable,
- target: target,
- completed: completed,
- onMove: function onMove(target, after) {
- return _onMove(rootEl, el, dragEl, dragRect, target, getRect(target), evt, after);
- },
- changed: changed
- }, extra));
- } // Capture animation state
- function capture() {
- dragOverEvent('dragOverAnimationCapture');
- _this.captureAnimationState();
- if (_this !== fromSortable) {
- fromSortable.captureAnimationState();
- }
- } // Return invocation when dragEl is inserted (or completed)
- function completed(insertion) {
- dragOverEvent('dragOverCompleted', {
- insertion: insertion
- });
- if (insertion) {
- // Clones must be hidden before folding animation to capture dragRectAbsolute properly
- if (isOwner) {
- activeSortable._hideClone();
- } else {
- activeSortable._showClone(_this);
- }
- if (_this !== fromSortable) {
- // Set ghost class to new sortable's ghost class
- toggleClass(dragEl, putSortable ? putSortable.options.ghostClass : activeSortable.options.ghostClass, false);
- toggleClass(dragEl, options.ghostClass, true);
- }
- if (putSortable !== _this && _this !== Sortable.active) {
- putSortable = _this;
- } else if (_this === Sortable.active && putSortable) {
- putSortable = null;
- } // Animation
- if (fromSortable === _this) {
- _this._ignoreWhileAnimating = target;
- }
- _this.animateAll(function () {
- dragOverEvent('dragOverAnimationComplete');
- _this._ignoreWhileAnimating = null;
- });
- if (_this !== fromSortable) {
- fromSortable.animateAll();
- fromSortable._ignoreWhileAnimating = null;
- }
- } // Null lastTarget if it is not inside a previously swapped element
- if (target === dragEl && !dragEl.animated || target === el && !target.animated) {
- lastTarget = null;
- } // no bubbling and not fallback
- if (!options.dragoverBubble && !evt.rootEl && target !== document) {
- dragEl.parentNode[expando]._isOutsideThisEl(evt.target); // Do not detect for empty insert if already inserted
- !insertion && nearestEmptyInsertDetectEvent(evt);
- }
- !options.dragoverBubble && evt.stopPropagation && evt.stopPropagation();
- return completedFired = true;
- } // Call when dragEl has been inserted
- function changed() {
- newIndex = index(dragEl);
- newDraggableIndex = index(dragEl, options.draggable);
- _dispatchEvent({
- sortable: _this,
- name: 'change',
- toEl: el,
- newIndex: newIndex,
- newDraggableIndex: newDraggableIndex,
- originalEvent: evt
- });
- }
- if (evt.preventDefault !== void 0) {
- evt.cancelable && evt.preventDefault();
- }
- target = closest(target, options.draggable, el, true);
- dragOverEvent('dragOver');
- if (Sortable.eventCanceled) return completedFired;
- if (dragEl.contains(evt.target) || target.animated && target.animatingX && target.animatingY || _this._ignoreWhileAnimating === target) {
- return completed(false);
- }
- ignoreNextClick = false;
- if (activeSortable && !options.disabled && (isOwner ? canSort || (revert = parentEl !== rootEl) // Reverting item into the original list
- : putSortable === this || (this.lastPutMode = activeGroup.checkPull(this, activeSortable, dragEl, evt)) && group.checkPut(this, activeSortable, dragEl, evt))) {
- vertical = this._getDirection(evt, target) === 'vertical';
- dragRect = getRect(dragEl);
- dragOverEvent('dragOverValid');
- if (Sortable.eventCanceled) return completedFired;
- if (revert) {
- parentEl = rootEl; // actualization
- capture();
- this._hideClone();
- dragOverEvent('revert');
- if (!Sortable.eventCanceled) {
- if (nextEl) {
- rootEl.insertBefore(dragEl, nextEl);
- } else {
- rootEl.appendChild(dragEl);
- }
- }
- return completed(true);
- }
- var elLastChild = lastChild(el, options.draggable);
- if (!elLastChild || _ghostIsLast(evt, vertical, this) && !elLastChild.animated) {
- // Insert to end of list
- // If already at end of list: Do not insert
- if (elLastChild === dragEl) {
- return completed(false);
- } // if there is a last element, it is the target
- if (elLastChild && el === evt.target) {
- target = elLastChild;
- }
- if (target) {
- targetRect = getRect(target);
- }
- if (_onMove(rootEl, el, dragEl, dragRect, target, targetRect, evt, !!target) !== false) {
- capture();
- if (elLastChild && elLastChild.nextSibling) {
- // the last draggable element is not the last node
- el.insertBefore(dragEl, elLastChild.nextSibling);
- } else {
- el.appendChild(dragEl);
- }
- parentEl = el; // actualization
- changed();
- return completed(true);
- }
- } else if (elLastChild && _ghostIsFirst(evt, vertical, this)) {
- // Insert to start of list
- var firstChild = getChild(el, 0, options, true);
- if (firstChild === dragEl) {
- return completed(false);
- }
- target = firstChild;
- targetRect = getRect(target);
- if (_onMove(rootEl, el, dragEl, dragRect, target, targetRect, evt, false) !== false) {
- capture();
- el.insertBefore(dragEl, firstChild);
- parentEl = el; // actualization
- changed();
- return completed(true);
- }
- } else if (target.parentNode === el) {
- targetRect = getRect(target);
- var direction = 0,
- targetBeforeFirstSwap,
- differentLevel = dragEl.parentNode !== el,
- differentRowCol = !_dragElInRowColumn(dragEl.animated && dragEl.toRect || dragRect, target.animated && target.toRect || targetRect, vertical),
- side1 = vertical ? 'top' : 'left',
- scrolledPastTop = isScrolledPast(target, 'top', 'top') || isScrolledPast(dragEl, 'top', 'top'),
- scrollBefore = scrolledPastTop ? scrolledPastTop.scrollTop : void 0;
- if (lastTarget !== target) {
- targetBeforeFirstSwap = targetRect[side1];
- pastFirstInvertThresh = false;
- isCircumstantialInvert = !differentRowCol && options.invertSwap || differentLevel;
- }
- direction = _getSwapDirection(evt, target, targetRect, vertical, differentRowCol ? 1 : options.swapThreshold, options.invertedSwapThreshold == null ? options.swapThreshold : options.invertedSwapThreshold, isCircumstantialInvert, lastTarget === target);
- var sibling;
- if (direction !== 0) {
- // Check if target is beside dragEl in respective direction (ignoring hidden elements)
- var dragIndex = index(dragEl);
- do {
- dragIndex -= direction;
- sibling = parentEl.children[dragIndex];
- } while (sibling && (css(sibling, 'display') === 'none' || sibling === ghostEl));
- } // If dragEl is already beside target: Do not insert
- if (direction === 0 || sibling === target) {
- return completed(false);
- }
- lastTarget = target;
- lastDirection = direction;
- var nextSibling = target.nextElementSibling,
- after = false;
- after = direction === 1;
- var moveVector = _onMove(rootEl, el, dragEl, dragRect, target, targetRect, evt, after);
- if (moveVector !== false) {
- if (moveVector === 1 || moveVector === -1) {
- after = moveVector === 1;
- }
- _silent = true;
- setTimeout(_unsilent, 30);
- capture();
- if (after && !nextSibling) {
- el.appendChild(dragEl);
- } else {
- target.parentNode.insertBefore(dragEl, after ? nextSibling : target);
- } // Undo chrome's scroll adjustment (has no effect on other browsers)
- if (scrolledPastTop) {
- scrollBy(scrolledPastTop, 0, scrollBefore - scrolledPastTop.scrollTop);
- }
- parentEl = dragEl.parentNode; // actualization
- // must be done before animation
- if (targetBeforeFirstSwap !== undefined && !isCircumstantialInvert) {
- targetMoveDistance = Math.abs(targetBeforeFirstSwap - getRect(target)[side1]);
- }
- changed();
- return completed(true);
- }
- }
- if (el.contains(dragEl)) {
- return completed(false);
- }
- }
- return false;
- },
- _ignoreWhileAnimating: null,
- _offMoveEvents: function _offMoveEvents() {
- off(document, 'mousemove', this._onTouchMove);
- off(document, 'touchmove', this._onTouchMove);
- off(document, 'pointermove', this._onTouchMove);
- off(document, 'dragover', nearestEmptyInsertDetectEvent);
- off(document, 'mousemove', nearestEmptyInsertDetectEvent);
- off(document, 'touchmove', nearestEmptyInsertDetectEvent);
- },
- _offUpEvents: function _offUpEvents() {
- var ownerDocument = this.el.ownerDocument;
- off(ownerDocument, 'mouseup', this._onDrop);
- off(ownerDocument, 'touchend', this._onDrop);
- off(ownerDocument, 'pointerup', this._onDrop);
- off(ownerDocument, 'touchcancel', this._onDrop);
- off(document, 'selectstart', this);
- },
- _onDrop: function _onDrop(
- /**Event*/
- evt) {
- var el = this.el,
- options = this.options; // Get the index of the dragged element within its parent
- newIndex = index(dragEl);
- newDraggableIndex = index(dragEl, options.draggable);
- pluginEvent('drop', this, {
- evt: evt
- });
- parentEl = dragEl && dragEl.parentNode; // Get again after plugin event
- newIndex = index(dragEl);
- newDraggableIndex = index(dragEl, options.draggable);
- if (Sortable.eventCanceled) {
- this._nulling();
- return;
- }
- awaitingDragStarted = false;
- isCircumstantialInvert = false;
- pastFirstInvertThresh = false;
- clearInterval(this._loopId);
- clearTimeout(this._dragStartTimer);
- _cancelNextTick(this.cloneId);
- _cancelNextTick(this._dragStartId); // Unbind events
- if (this.nativeDraggable) {
- off(document, 'drop', this);
- off(el, 'dragstart', this._onDragStart);
- }
- this._offMoveEvents();
- this._offUpEvents();
- if (Safari) {
- css(document.body, 'user-select', '');
- }
- css(dragEl, 'transform', '');
- if (evt) {
- if (moved) {
- evt.cancelable && evt.preventDefault();
- !options.dropBubble && evt.stopPropagation();
- }
- ghostEl && ghostEl.parentNode && ghostEl.parentNode.removeChild(ghostEl);
- if (rootEl === parentEl || putSortable && putSortable.lastPutMode !== 'clone') {
- // Remove clone(s)
- cloneEl && cloneEl.parentNode && cloneEl.parentNode.removeChild(cloneEl);
- }
- if (dragEl) {
- if (this.nativeDraggable) {
- off(dragEl, 'dragend', this);
- }
- _disableDraggable(dragEl);
- dragEl.style['will-change'] = ''; // Remove classes
- // ghostClass is added in dragStarted
- if (moved && !awaitingDragStarted) {
- toggleClass(dragEl, putSortable ? putSortable.options.ghostClass : this.options.ghostClass, false);
- }
- toggleClass(dragEl, this.options.chosenClass, false); // Drag stop event
- _dispatchEvent({
- sortable: this,
- name: 'unchoose',
- toEl: parentEl,
- newIndex: null,
- newDraggableIndex: null,
- originalEvent: evt
- });
- if (rootEl !== parentEl) {
- if (newIndex >= 0) {
- // Add event
- _dispatchEvent({
- rootEl: parentEl,
- name: 'add',
- toEl: parentEl,
- fromEl: rootEl,
- originalEvent: evt
- }); // Remove event
- _dispatchEvent({
- sortable: this,
- name: 'remove',
- toEl: parentEl,
- originalEvent: evt
- }); // drag from one list and drop into another
- _dispatchEvent({
- rootEl: parentEl,
- name: 'sort',
- toEl: parentEl,
- fromEl: rootEl,
- originalEvent: evt
- });
- _dispatchEvent({
- sortable: this,
- name: 'sort',
- toEl: parentEl,
- originalEvent: evt
- });
- }
- putSortable && putSortable.save();
- } else {
- if (newIndex !== oldIndex) {
- if (newIndex >= 0) {
- // drag & drop within the same list
- _dispatchEvent({
- sortable: this,
- name: 'update',
- toEl: parentEl,
- originalEvent: evt
- });
- _dispatchEvent({
- sortable: this,
- name: 'sort',
- toEl: parentEl,
- originalEvent: evt
- });
- }
- }
- }
- if (Sortable.active) {
- /* jshint eqnull:true */
- if (newIndex == null || newIndex === -1) {
- newIndex = oldIndex;
- newDraggableIndex = oldDraggableIndex;
- }
- _dispatchEvent({
- sortable: this,
- name: 'end',
- toEl: parentEl,
- originalEvent: evt
- }); // Save sorting
- this.save();
- }
- }
- }
- this._nulling();
- },
- _nulling: function _nulling() {
- pluginEvent('nulling', this);
- rootEl = dragEl = parentEl = ghostEl = nextEl = cloneEl = lastDownEl = cloneHidden = tapEvt = touchEvt = moved = newIndex = newDraggableIndex = oldIndex = oldDraggableIndex = lastTarget = lastDirection = putSortable = activeGroup = Sortable.dragged = Sortable.ghost = Sortable.clone = Sortable.active = null;
- savedInputChecked.forEach(function (el) {
- el.checked = true;
- });
- savedInputChecked.length = lastDx = lastDy = 0;
- },
- handleEvent: function handleEvent(
- /**Event*/
- evt) {
- switch (evt.type) {
- case 'drop':
- case 'dragend':
- this._onDrop(evt);
- break;
- case 'dragenter':
- case 'dragover':
- if (dragEl) {
- this._onDragOver(evt);
- _globalDragOver(evt);
- }
- break;
- case 'selectstart':
- evt.preventDefault();
- break;
- }
- },
- /**
- * Serializes the item into an array of string.
- * @returns {String[]}
- */
- toArray: function toArray() {
- var order = [],
- el,
- children = this.el.children,
- i = 0,
- n = children.length,
- options = this.options;
- for (; i < n; i++) {
- el = children[i];
- if (closest(el, options.draggable, this.el, false)) {
- order.push(el.getAttribute(options.dataIdAttr) || _generateId(el));
- }
- }
- return order;
- },
- /**
- * Sorts the elements according to the array.
- * @param {String[]} order order of the items
- */
- sort: function sort(order, useAnimation) {
- var items = {},
- rootEl = this.el;
- this.toArray().forEach(function (id, i) {
- var el = rootEl.children[i];
- if (closest(el, this.options.draggable, rootEl, false)) {
- items[id] = el;
- }
- }, this);
- useAnimation && this.captureAnimationState();
- order.forEach(function (id) {
- if (items[id]) {
- rootEl.removeChild(items[id]);
- rootEl.appendChild(items[id]);
- }
- });
- useAnimation && this.animateAll();
- },
- /**
- * Save the current sorting
- */
- save: function save() {
- var store = this.options.store;
- store && store.set && store.set(this);
- },
- /**
- * For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.
- * @param {HTMLElement} el
- * @param {String} [selector] default: `options.draggable`
- * @returns {HTMLElement|null}
- */
- closest: function closest$1(el, selector) {
- return closest(el, selector || this.options.draggable, this.el, false);
- },
- /**
- * Set/get option
- * @param {string} name
- * @param {*} [value]
- * @returns {*}
- */
- option: function option(name, value) {
- var options = this.options;
- if (value === void 0) {
- return options[name];
- } else {
- var modifiedValue = PluginManager.modifyOption(this, name, value);
- if (typeof modifiedValue !== 'undefined') {
- options[name] = modifiedValue;
- } else {
- options[name] = value;
- }
- if (name === 'group') {
- _prepareGroup(options);
- }
- }
- },
- /**
- * Destroy
- */
- destroy: function destroy() {
- pluginEvent('destroy', this);
- var el = this.el;
- el[expando] = null;
- off(el, 'mousedown', this._onTapStart);
- off(el, 'touchstart', this._onTapStart);
- off(el, 'pointerdown', this._onTapStart);
- if (this.nativeDraggable) {
- off(el, 'dragover', this);
- off(el, 'dragenter', this);
- } // Remove draggable attributes
- Array.prototype.forEach.call(el.querySelectorAll('[draggable]'), function (el) {
- el.removeAttribute('draggable');
- });
- this._onDrop();
- this._disableDelayedDragEvents();
- sortables.splice(sortables.indexOf(this.el), 1);
- this.el = el = null;
- },
- _hideClone: function _hideClone() {
- if (!cloneHidden) {
- pluginEvent('hideClone', this);
- if (Sortable.eventCanceled) return;
- css(cloneEl, 'display', 'none');
- if (this.options.removeCloneOnHide && cloneEl.parentNode) {
- cloneEl.parentNode.removeChild(cloneEl);
- }
- cloneHidden = true;
- }
- },
- _showClone: function _showClone(putSortable) {
- if (putSortable.lastPutMode !== 'clone') {
- this._hideClone();
- return;
- }
- if (cloneHidden) {
- pluginEvent('showClone', this);
- if (Sortable.eventCanceled) return; // show clone at dragEl or original position
- if (dragEl.parentNode == rootEl && !this.options.group.revertClone) {
- rootEl.insertBefore(cloneEl, dragEl);
- } else if (nextEl) {
- rootEl.insertBefore(cloneEl, nextEl);
- } else {
- rootEl.appendChild(cloneEl);
- }
- if (this.options.group.revertClone) {
- this.animate(dragEl, cloneEl);
- }
- css(cloneEl, 'display', '');
- cloneHidden = false;
- }
- }
- };
- function _globalDragOver(
- /**Event*/
- evt) {
- if (evt.dataTransfer) {
- evt.dataTransfer.dropEffect = 'move';
- }
- evt.cancelable && evt.preventDefault();
- }
- function _onMove(fromEl, toEl, dragEl, dragRect, targetEl, targetRect, originalEvent, willInsertAfter) {
- var evt,
- sortable = fromEl[expando],
- onMoveFn = sortable.options.onMove,
- retVal; // Support for new CustomEvent feature
- if (window.CustomEvent && !IE11OrLess && !Edge) {
- evt = new CustomEvent('move', {
- bubbles: true,
- cancelable: true
- });
- } else {
- evt = document.createEvent('Event');
- evt.initEvent('move', true, true);
- }
- evt.to = toEl;
- evt.from = fromEl;
- evt.dragged = dragEl;
- evt.draggedRect = dragRect;
- evt.related = targetEl || toEl;
- evt.relatedRect = targetRect || getRect(toEl);
- evt.willInsertAfter = willInsertAfter;
- evt.originalEvent = originalEvent;
- fromEl.dispatchEvent(evt);
- if (onMoveFn) {
- retVal = onMoveFn.call(sortable, evt, originalEvent);
- }
- return retVal;
- }
- function _disableDraggable(el) {
- el.draggable = false;
- }
- function _unsilent() {
- _silent = false;
- }
- function _ghostIsFirst(evt, vertical, sortable) {
- var rect = getRect(getChild(sortable.el, 0, sortable.options, true));
- var spacer = 10;
- return vertical ? evt.clientX < rect.left - spacer || evt.clientY < rect.top && evt.clientX < rect.right : evt.clientY < rect.top - spacer || evt.clientY < rect.bottom && evt.clientX < rect.left;
- }
- function _ghostIsLast(evt, vertical, sortable) {
- var rect = getRect(lastChild(sortable.el, sortable.options.draggable));
- var spacer = 10;
- return vertical ? evt.clientX > rect.right + spacer || evt.clientX <= rect.right && evt.clientY > rect.bottom && evt.clientX >= rect.left : evt.clientX > rect.right && evt.clientY > rect.top || evt.clientX <= rect.right && evt.clientY > rect.bottom + spacer;
- }
- function _getSwapDirection(evt, target, targetRect, vertical, swapThreshold, invertedSwapThreshold, invertSwap, isLastTarget) {
- var mouseOnAxis = vertical ? evt.clientY : evt.clientX,
- targetLength = vertical ? targetRect.height : targetRect.width,
- targetS1 = vertical ? targetRect.top : targetRect.left,
- targetS2 = vertical ? targetRect.bottom : targetRect.right,
- invert = false;
- if (!invertSwap) {
- // Never invert or create dragEl shadow when target movemenet causes mouse to move past the end of regular swapThreshold
- if (isLastTarget && targetMoveDistance < targetLength * swapThreshold) {
- // multiplied only by swapThreshold because mouse will already be inside target by (1 - threshold) * targetLength / 2
- // check if past first invert threshold on side opposite of lastDirection
- if (!pastFirstInvertThresh && (lastDirection === 1 ? mouseOnAxis > targetS1 + targetLength * invertedSwapThreshold / 2 : mouseOnAxis < targetS2 - targetLength * invertedSwapThreshold / 2)) {
- // past first invert threshold, do not restrict inverted threshold to dragEl shadow
- pastFirstInvertThresh = true;
- }
- if (!pastFirstInvertThresh) {
- // dragEl shadow (target move distance shadow)
- if (lastDirection === 1 ? mouseOnAxis < targetS1 + targetMoveDistance // over dragEl shadow
- : mouseOnAxis > targetS2 - targetMoveDistance) {
- return -lastDirection;
- }
- } else {
- invert = true;
- }
- } else {
- // Regular
- if (mouseOnAxis > targetS1 + targetLength * (1 - swapThreshold) / 2 && mouseOnAxis < targetS2 - targetLength * (1 - swapThreshold) / 2) {
- return _getInsertDirection(target);
- }
- }
- }
- invert = invert || invertSwap;
- if (invert) {
- // Invert of regular
- if (mouseOnAxis < targetS1 + targetLength * invertedSwapThreshold / 2 || mouseOnAxis > targetS2 - targetLength * invertedSwapThreshold / 2) {
- return mouseOnAxis > targetS1 + targetLength / 2 ? 1 : -1;
- }
- }
- return 0;
- }
- /**
- * Gets the direction dragEl must be swapped relative to target in order to make it
- * seem that dragEl has been "inserted" into that element's position
- * @param {HTMLElement} target The target whose position dragEl is being inserted at
- * @return {Number} Direction dragEl must be swapped
- */
- function _getInsertDirection(target) {
- if (index(dragEl) < index(target)) {
- return 1;
- } else {
- return -1;
- }
- }
- /**
- * Generate id
- * @param {HTMLElement} el
- * @returns {String}
- * @private
- */
- function _generateId(el) {
- var str = el.tagName + el.className + el.src + el.href + el.textContent,
- i = str.length,
- sum = 0;
- while (i--) {
- sum += str.charCodeAt(i);
- }
- return sum.toString(36);
- }
- function _saveInputCheckedState(root) {
- savedInputChecked.length = 0;
- var inputs = root.getElementsByTagName('input');
- var idx = inputs.length;
- while (idx--) {
- var el = inputs[idx];
- el.checked && savedInputChecked.push(el);
- }
- }
- function _nextTick(fn) {
- return setTimeout(fn, 0);
- }
- function _cancelNextTick(id) {
- return clearTimeout(id);
- } // Fixed #973:
- if (documentExists) {
- on(document, 'touchmove', function (evt) {
- if ((Sortable.active || awaitingDragStarted) && evt.cancelable) {
- evt.preventDefault();
- }
- });
- } // Export utils
- Sortable.utils = {
- on: on,
- off: off,
- css: css,
- find: find,
- is: function is(el, selector) {
- return !!closest(el, selector, el, false);
- },
- extend: extend,
- throttle: throttle,
- closest: closest,
- toggleClass: toggleClass,
- clone: clone,
- index: index,
- nextTick: _nextTick,
- cancelNextTick: _cancelNextTick,
- detectDirection: _detectDirection,
- getChild: getChild
- };
- /**
- * Get the Sortable instance of an element
- * @param {HTMLElement} element The element
- * @return {Sortable|undefined} The instance of Sortable
- */
- Sortable.get = function (element) {
- return element[expando];
- };
- /**
- * Mount a plugin to Sortable
- * @param {...SortablePlugin|SortablePlugin[]} plugins Plugins being mounted
- */
- Sortable.mount = function () {
- for (var _len = arguments.length, plugins = new Array(_len), _key = 0; _key < _len; _key++) {
- plugins[_key] = arguments[_key];
- }
- if (plugins[0].constructor === Array) plugins = plugins[0];
- plugins.forEach(function (plugin) {
- if (!plugin.prototype || !plugin.prototype.constructor) {
- throw "Sortable: Mounted plugin must be a constructor function, not ".concat({}.toString.call(plugin));
- }
- if (plugin.utils) Sortable.utils = _objectSpread2(_objectSpread2({}, Sortable.utils), plugin.utils);
- PluginManager.mount(plugin);
- });
- };
- /**
- * Create sortable instance
- * @param {HTMLElement} el
- * @param {Object} [options]
- */
- Sortable.create = function (el, options) {
- return new Sortable(el, options);
- }; // Export
- Sortable.version = version;
- var autoScrolls = [],
- scrollEl,
- scrollRootEl,
- scrolling = false,
- lastAutoScrollX,
- lastAutoScrollY,
- touchEvt$1,
- pointerElemChangedInterval;
- function AutoScrollPlugin() {
- function AutoScroll() {
- this.defaults = {
- scroll: true,
- forceAutoScrollFallback: false,
- scrollSensitivity: 30,
- scrollSpeed: 10,
- bubbleScroll: true
- }; // Bind all private methods
- for (var fn in this) {
- if (fn.charAt(0) === '_' && typeof this[fn] === 'function') {
- this[fn] = this[fn].bind(this);
- }
- }
- }
- AutoScroll.prototype = {
- dragStarted: function dragStarted(_ref) {
- var originalEvent = _ref.originalEvent;
- if (this.sortable.nativeDraggable) {
- on(document, 'dragover', this._handleAutoScroll);
- } else {
- if (this.options.supportPointer) {
- on(document, 'pointermove', this._handleFallbackAutoScroll);
- } else if (originalEvent.touches) {
- on(document, 'touchmove', this._handleFallbackAutoScroll);
- } else {
- on(document, 'mousemove', this._handleFallbackAutoScroll);
- }
- }
- },
- dragOverCompleted: function dragOverCompleted(_ref2) {
- var originalEvent = _ref2.originalEvent;
- // For when bubbling is canceled and using fallback (fallback 'touchmove' always reached)
- if (!this.options.dragOverBubble && !originalEvent.rootEl) {
- this._handleAutoScroll(originalEvent);
- }
- },
- drop: function drop() {
- if (this.sortable.nativeDraggable) {
- off(document, 'dragover', this._handleAutoScroll);
- } else {
- off(document, 'pointermove', this._handleFallbackAutoScroll);
- off(document, 'touchmove', this._handleFallbackAutoScroll);
- off(document, 'mousemove', this._handleFallbackAutoScroll);
- }
- clearPointerElemChangedInterval();
- clearAutoScrolls();
- cancelThrottle();
- },
- nulling: function nulling() {
- touchEvt$1 = scrollRootEl = scrollEl = scrolling = pointerElemChangedInterval = lastAutoScrollX = lastAutoScrollY = null;
- autoScrolls.length = 0;
- },
- _handleFallbackAutoScroll: function _handleFallbackAutoScroll(evt) {
- this._handleAutoScroll(evt, true);
- },
- _handleAutoScroll: function _handleAutoScroll(evt, fallback) {
- var _this = this;
- var x = (evt.touches ? evt.touches[0] : evt).clientX,
- y = (evt.touches ? evt.touches[0] : evt).clientY,
- elem = document.elementFromPoint(x, y);
- touchEvt$1 = evt; // IE does not seem to have native autoscroll,
- // Edge's autoscroll seems too conditional,
- // MACOS Safari does not have autoscroll,
- // Firefox and Chrome are good
- if (fallback || this.options.forceAutoScrollFallback || Edge || IE11OrLess || Safari) {
- autoScroll(evt, this.options, elem, fallback); // Listener for pointer element change
- var ogElemScroller = getParentAutoScrollElement(elem, true);
- if (scrolling && (!pointerElemChangedInterval || x !== lastAutoScrollX || y !== lastAutoScrollY)) {
- pointerElemChangedInterval && clearPointerElemChangedInterval(); // Detect for pointer elem change, emulating native DnD behaviour
- pointerElemChangedInterval = setInterval(function () {
- var newElem = getParentAutoScrollElement(document.elementFromPoint(x, y), true);
- if (newElem !== ogElemScroller) {
- ogElemScroller = newElem;
- clearAutoScrolls();
- }
- autoScroll(evt, _this.options, newElem, fallback);
- }, 10);
- lastAutoScrollX = x;
- lastAutoScrollY = y;
- }
- } else {
- // if DnD is enabled (and browser has good autoscrolling), first autoscroll will already scroll, so get parent autoscroll of first autoscroll
- if (!this.options.bubbleScroll || getParentAutoScrollElement(elem, true) === getWindowScrollingElement()) {
- clearAutoScrolls();
- return;
- }
- autoScroll(evt, this.options, getParentAutoScrollElement(elem, false), false);
- }
- }
- };
- return _extends(AutoScroll, {
- pluginName: 'scroll',
- initializeByDefault: true
- });
- }
- function clearAutoScrolls() {
- autoScrolls.forEach(function (autoScroll) {
- clearInterval(autoScroll.pid);
- });
- autoScrolls = [];
- }
- function clearPointerElemChangedInterval() {
- clearInterval(pointerElemChangedInterval);
- }
- var autoScroll = throttle(function (evt, options, rootEl, isFallback) {
- // Bug: https://bugzilla.mozilla.org/show_bug.cgi?id=505521
- if (!options.scroll) return;
- var x = (evt.touches ? evt.touches[0] : evt).clientX,
- y = (evt.touches ? evt.touches[0] : evt).clientY,
- sens = options.scrollSensitivity,
- speed = options.scrollSpeed,
- winScroller = getWindowScrollingElement();
- var scrollThisInstance = false,
- scrollCustomFn; // New scroll root, set scrollEl
- if (scrollRootEl !== rootEl) {
- scrollRootEl = rootEl;
- clearAutoScrolls();
- scrollEl = options.scroll;
- scrollCustomFn = options.scrollFn;
- if (scrollEl === true) {
- scrollEl = getParentAutoScrollElement(rootEl, true);
- }
- }
- var layersOut = 0;
- var currentParent = scrollEl;
- do {
- var el = currentParent,
- rect = getRect(el),
- top = rect.top,
- bottom = rect.bottom,
- left = rect.left,
- right = rect.right,
- width = rect.width,
- height = rect.height,
- canScrollX = void 0,
- canScrollY = void 0,
- scrollWidth = el.scrollWidth,
- scrollHeight = el.scrollHeight,
- elCSS = css(el),
- scrollPosX = el.scrollLeft,
- scrollPosY = el.scrollTop;
- if (el === winScroller) {
- canScrollX = width < scrollWidth && (elCSS.overflowX === 'auto' || elCSS.overflowX === 'scroll' || elCSS.overflowX === 'visible');
- canScrollY = height < scrollHeight && (elCSS.overflowY === 'auto' || elCSS.overflowY === 'scroll' || elCSS.overflowY === 'visible');
- } else {
- canScrollX = width < scrollWidth && (elCSS.overflowX === 'auto' || elCSS.overflowX === 'scroll');
- canScrollY = height < scrollHeight && (elCSS.overflowY === 'auto' || elCSS.overflowY === 'scroll');
- }
- var vx = canScrollX && (Math.abs(right - x) <= sens && scrollPosX + width < scrollWidth) - (Math.abs(left - x) <= sens && !!scrollPosX);
- var vy = canScrollY && (Math.abs(bottom - y) <= sens && scrollPosY + height < scrollHeight) - (Math.abs(top - y) <= sens && !!scrollPosY);
- if (!autoScrolls[layersOut]) {
- for (var i = 0; i <= layersOut; i++) {
- if (!autoScrolls[i]) {
- autoScrolls[i] = {};
- }
- }
- }
- if (autoScrolls[layersOut].vx != vx || autoScrolls[layersOut].vy != vy || autoScrolls[layersOut].el !== el) {
- autoScrolls[layersOut].el = el;
- autoScrolls[layersOut].vx = vx;
- autoScrolls[layersOut].vy = vy;
- clearInterval(autoScrolls[layersOut].pid);
- if (vx != 0 || vy != 0) {
- scrollThisInstance = true;
- /* jshint loopfunc:true */
- autoScrolls[layersOut].pid = setInterval(function () {
- // emulate drag over during autoscroll (fallback), emulating native DnD behaviour
- if (isFallback && this.layer === 0) {
- Sortable.active._onTouchMove(touchEvt$1); // To move ghost if it is positioned absolutely
- }
- var scrollOffsetY = autoScrolls[this.layer].vy ? autoScrolls[this.layer].vy * speed : 0;
- var scrollOffsetX = autoScrolls[this.layer].vx ? autoScrolls[this.layer].vx * speed : 0;
- if (typeof scrollCustomFn === 'function') {
- if (scrollCustomFn.call(Sortable.dragged.parentNode[expando], scrollOffsetX, scrollOffsetY, evt, touchEvt$1, autoScrolls[this.layer].el) !== 'continue') {
- return;
- }
- }
- scrollBy(autoScrolls[this.layer].el, scrollOffsetX, scrollOffsetY);
- }.bind({
- layer: layersOut
- }), 24);
- }
- }
- layersOut++;
- } while (options.bubbleScroll && currentParent !== winScroller && (currentParent = getParentAutoScrollElement(currentParent, false)));
- scrolling = scrollThisInstance; // in case another function catches scrolling as false in between when it is not
- }, 30);
- var drop = function drop(_ref) {
- var originalEvent = _ref.originalEvent,
- putSortable = _ref.putSortable,
- dragEl = _ref.dragEl,
- activeSortable = _ref.activeSortable,
- dispatchSortableEvent = _ref.dispatchSortableEvent,
- hideGhostForTarget = _ref.hideGhostForTarget,
- unhideGhostForTarget = _ref.unhideGhostForTarget;
- if (!originalEvent) return;
- var toSortable = putSortable || activeSortable;
- hideGhostForTarget();
- var touch = originalEvent.changedTouches && originalEvent.changedTouches.length ? originalEvent.changedTouches[0] : originalEvent;
- var target = document.elementFromPoint(touch.clientX, touch.clientY);
- unhideGhostForTarget();
- if (toSortable && !toSortable.el.contains(target)) {
- dispatchSortableEvent('spill');
- this.onSpill({
- dragEl: dragEl,
- putSortable: putSortable
- });
- }
- };
- function Revert() {}
- Revert.prototype = {
- startIndex: null,
- dragStart: function dragStart(_ref2) {
- var oldDraggableIndex = _ref2.oldDraggableIndex;
- this.startIndex = oldDraggableIndex;
- },
- onSpill: function onSpill(_ref3) {
- var dragEl = _ref3.dragEl,
- putSortable = _ref3.putSortable;
- this.sortable.captureAnimationState();
- if (putSortable) {
- putSortable.captureAnimationState();
- }
- var nextSibling = getChild(this.sortable.el, this.startIndex, this.options);
- if (nextSibling) {
- this.sortable.el.insertBefore(dragEl, nextSibling);
- } else {
- this.sortable.el.appendChild(dragEl);
- }
- this.sortable.animateAll();
- if (putSortable) {
- putSortable.animateAll();
- }
- },
- drop: drop
- };
- _extends(Revert, {
- pluginName: 'revertOnSpill'
- });
- function Remove() {}
- Remove.prototype = {
- onSpill: function onSpill(_ref4) {
- var dragEl = _ref4.dragEl,
- putSortable = _ref4.putSortable;
- var parentSortable = putSortable || this.sortable;
- parentSortable.captureAnimationState();
- dragEl.parentNode && dragEl.parentNode.removeChild(dragEl);
- parentSortable.animateAll();
- },
- drop: drop
- };
- _extends(Remove, {
- pluginName: 'removeOnSpill'
- });
- Sortable.mount(new AutoScrollPlugin());
- Sortable.mount(Remove, Revert);
- const CSS$8 = {
- sortItem: "sort-item",
- container: "container",
- containerHorizontal: "container--horizontal",
- containerVertical: "container--vertical"
- };
- const sortableListCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-sortable-list:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-sortable-list{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-sortable-list{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-sortable-list{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-sortable-list{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-sortable-list{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-sortable-list:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-sortable-list-h{display:none}/*!@:host*/.sc-calcite-sortable-list-h{display:-ms-flexbox;display:flex}/*!@:host([disabled])*/[disabled].sc-calcite-sortable-list-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-sortable-list-h[disabled] .sc-calcite-sortable-list-s>[calcite-hydrated][disabled],[disabled].sc-calcite-sortable-list-h [calcite-hydrated][disabled].sc-calcite-sortable-list{opacity:1}/*!@.container*/.container.sc-calcite-sortable-list{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto}/*!@.container--vertical*/.container--vertical.sc-calcite-sortable-list{-ms-flex-direction:column;flex-direction:column}/*!@.container--horizontal*/.container--horizontal.sc-calcite-sortable-list{-ms-flex-direction:row;flex-direction:row}";
- /**
- * @slot - A slot for adding sortable items.
- */
- class SortableList {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteListOrderChange = createEvent(this, "calciteListOrderChange", 7);
- /**
- * The selector for the handle elements.
- */
- this.handleSelector = "calcite-handle";
- /**
- * Indicates the horizontal or vertical orientation of the component.
- */
- this.layout = "vertical";
- /**
- * When true, disabled prevents interaction. This state shows items with lower opacity/grayed.
- */
- this.disabled = false;
- /**
- * When true, content is waiting to be loaded. This state shows a busy indicator.
- */
- this.loading = false;
- this.handleActivated = false;
- this.items = [];
- this.mutationObserver = createObserver();
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- this.items = Array.from(this.el.children);
- this.setUpDragAndDrop();
- this.beginObserving();
- }
- disconnectedCallback() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- this.cleanUpDragAndDrop();
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- calciteHandleNudgeHandler(event) {
- var _a;
- const sortItem = this.items.find((item) => {
- return item.contains(event.detail.handle) || event.composedPath().includes(item);
- });
- const lastIndex = this.items.length - 1;
- const startingIndex = this.items.indexOf(sortItem);
- let appendInstead = false;
- let buddyIndex;
- switch (event.detail.direction) {
- case "up":
- event.preventDefault();
- if (startingIndex === 0) {
- appendInstead = true;
- }
- else {
- buddyIndex = startingIndex - 1;
- }
- break;
- case "down":
- event.preventDefault();
- if (startingIndex === lastIndex) {
- buddyIndex = 0;
- }
- else if (startingIndex === lastIndex - 1) {
- appendInstead = true;
- }
- else {
- buddyIndex = startingIndex + 2;
- }
- break;
- default:
- return;
- }
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- if (appendInstead) {
- sortItem.parentElement.appendChild(sortItem);
- }
- else {
- sortItem.parentElement.insertBefore(sortItem, this.items[buddyIndex]);
- }
- this.items = Array.from(this.el.children);
- event.detail.handle.activated = true;
- event.detail.handle.setFocus();
- this.beginObserving();
- }
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- setUpDragAndDrop() {
- this.cleanUpDragAndDrop();
- const options = {
- dataIdAttr: "id",
- group: this.group,
- handle: this.handleSelector,
- // Changed sorting within list
- onUpdate: () => {
- this.items = Array.from(this.el.children);
- this.calciteListOrderChange.emit();
- },
- // Element dragging started
- onStart: () => {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- },
- // Element dragging ended
- onEnd: () => {
- this.beginObserving();
- }
- };
- if (this.dragSelector) {
- options.draggable = this.dragSelector;
- }
- this.sortable = Sortable.create(this.el, options);
- }
- cleanUpDragAndDrop() {
- var _a;
- (_a = this.sortable) === null || _a === void 0 ? void 0 : _a.destroy();
- this.sortable = null;
- }
- beginObserving() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- const { layout } = this;
- const horizontal = layout === "horizontal" || false;
- return (hAsync("div", { class: {
- [CSS$8.container]: true,
- [CSS$8.containerVertical]: !horizontal,
- [CSS$8.containerHorizontal]: horizontal
- } }, hAsync("slot", null)));
- }
- get el() { return getElement(this); }
- static get style() { return sortableListCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-sortable-list",
- "$members$": {
- "dragSelector": [1, "drag-selector"],
- "group": [1],
- "handleSelector": [1, "handle-selector"],
- "layout": [1],
- "disabled": [516],
- "loading": [516],
- "handleActivated": [32]
- },
- "$listeners$": [[0, "calciteHandleNudge", "calciteHandleNudgeHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"], ["loading", "loading"]]
- }; }
- }
- const CSS$7 = {
- container: "split-button__container",
- dividerContainer: "split-button__divider-container",
- divider: "split-button__divider",
- widthAuto: "width-auto",
- widthHalf: "width-half",
- widthFull: "width-full"
- };
- const splitButtonCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-split-button:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-split-button{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-split-button{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-split-button{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-split-button{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-split-button{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-split-button:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-split-button-h{display:none}/*!@:host*/.sc-calcite-split-button-h{display:inline-block}/*!@:host .split-button__container*/.sc-calcite-split-button-h .split-button__container.sc-calcite-split-button{display:-ms-flexbox;display:flex;-ms-flex-align:stretch;align-items:stretch}/*!@:host .split-button__container > calcite-dropdown > calcite-button*/.sc-calcite-split-button-h .split-button__container.sc-calcite-split-button>calcite-dropdown.sc-calcite-split-button>calcite-button.sc-calcite-split-button{height:100%;vertical-align:top}/*!@:host([appearance=solid]):host([color=blue])*/[appearance=solid].sc-calcite-split-button-h([color=blue]).sc-calcite-split-button-h{--calcite-split-button-background:var(--calcite-ui-brand);--calcite-split-button-divider:var(--calcite-ui-foreground-1)}/*!@:host([appearance=solid]):host([color=red])*/[appearance=solid].sc-calcite-split-button-h([color=red]).sc-calcite-split-button-h{--calcite-split-button-background:var(--calcite-ui-danger);--calcite-split-button-divider:var(--calcite-ui-foreground-1)}/*!@:host([appearance=solid]):host([color=neutral])*/[appearance=solid].sc-calcite-split-button-h([color=neutral]).sc-calcite-split-button-h{--calcite-split-button-background:var(--calcite-ui-foreground-3);--calcite-split-button-divider:var(--calcite-ui-text-1)}/*!@:host([appearance=solid]):host([color=inverse])*/[appearance=solid].sc-calcite-split-button-h([color=inverse]).sc-calcite-split-button-h{--calcite-split-button-background:var(--calcite-ui-inverse);--calcite-split-button-divider:var(--calcite-ui-foreground-1)}/*!@:host([appearance=transparent]):host([color=blue])*/[appearance=transparent].sc-calcite-split-button-h([color=blue]).sc-calcite-split-button-h{--calcite-split-button-divider:var(--calcite-ui-brand)}/*!@:host([appearance=transparent]):host([color=red])*/[appearance=transparent].sc-calcite-split-button-h([color=red]).sc-calcite-split-button-h{--calcite-split-button-divider:var(--calcite-ui-danger)}/*!@:host([appearance=transparent]):host([color=neutral])*/[appearance=transparent].sc-calcite-split-button-h([color=neutral]).sc-calcite-split-button-h{--calcite-split-button-divider:var(--calcite-ui-text-1)}/*!@:host([appearance=transparent]):host([color=inverse])*/[appearance=transparent].sc-calcite-split-button-h([color=inverse]).sc-calcite-split-button-h{--calcite-split-button-divider:var(--calcite-ui-foreground-1)}/*!@:host([appearance=clear]),\n:host([appearance=transparent])*/[appearance=clear].sc-calcite-split-button-h,[appearance=transparent].sc-calcite-split-button-h{--calcite-split-button-background:transparent}/*!@:host([appearance=outline])*/[appearance=outline].sc-calcite-split-button-h{--calcite-split-button-background:var(--calcite-ui-foreground-1)}/*!@:host([appearance=clear]):host([color=blue]),\n:host([appearance=outline]):host([color=blue])*/[appearance=clear].sc-calcite-split-button-h([color=blue]).sc-calcite-split-button-h,[appearance=outline].sc-calcite-split-button-h([color=blue]).sc-calcite-split-button-h{--calcite-split-button-divider:var(--calcite-ui-brand)}/*!@:host([appearance=clear]):host([color=red]),\n:host([appearance=outline]):host([color=red])*/[appearance=clear].sc-calcite-split-button-h([color=red]).sc-calcite-split-button-h,[appearance=outline].sc-calcite-split-button-h([color=red]).sc-calcite-split-button-h{--calcite-split-button-divider:var(--calcite-ui-danger)}/*!@:host([appearance=clear]):host([color=neutral]),\n:host([appearance=outline]):host([color=neutral])*/[appearance=clear].sc-calcite-split-button-h([color=neutral]).sc-calcite-split-button-h,[appearance=outline].sc-calcite-split-button-h([color=neutral]).sc-calcite-split-button-h{--calcite-split-button-divider:var(--calcite-ui-foreground-3)}/*!@:host([appearance=clear]):host([color=inverse]),\n:host([appearance=outline]):host([color=inverse])*/[appearance=clear].sc-calcite-split-button-h([color=inverse]).sc-calcite-split-button-h,[appearance=outline].sc-calcite-split-button-h([color=inverse]).sc-calcite-split-button-h{--calcite-split-button-divider:var(--calcite-ui-inverse)}/*!@.width-auto*/.width-auto.sc-calcite-split-button{width:auto}/*!@.width-half*/.width-half.sc-calcite-split-button{width:50%}/*!@.width-full*/.width-full.sc-calcite-split-button{width:100%}/*!@.split-button__divider-container*/.split-button__divider-container.sc-calcite-split-button{display:-ms-flexbox;display:flex;width:1px;-ms-flex-align:stretch;align-items:stretch;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;background-color:var(--calcite-split-button-background)}/*!@.split-button__divider*/.split-button__divider.sc-calcite-split-button{margin-top:0.25rem;margin-bottom:0.25rem;display:inline-block;width:1px;background-color:var(--calcite-split-button-divider)}/*!@:host([appearance=outline]) .split-button__divider-container,\n:host([appearance=clear]) .split-button__divider-container*/[appearance=outline].sc-calcite-split-button-h .split-button__divider-container.sc-calcite-split-button,[appearance=clear].sc-calcite-split-button-h .split-button__divider-container.sc-calcite-split-button{border-top:1px solid var(--calcite-split-button-divider);border-bottom:1px solid var(--calcite-split-button-divider)}/*!@:host([appearance=outline]):hover .split-button__divider-container,\n:host([appearance=clear]):hover .split-button__divider-container*/[appearance=outline].sc-calcite-split-button-h:hover .split-button__divider-container.sc-calcite-split-button,[appearance=clear].sc-calcite-split-button-h:hover .split-button__divider-container.sc-calcite-split-button{background-color:var(--calcite-split-button-divider)}/*!@:host([appearance=outline]:hover) .split-button__divider-container,\n:host([appearance=clear]:hover) .split-button__divider-container*/[appearance=outline].sc-calcite-split-button-h:hover .split-button__divider-container.sc-calcite-split-button,[appearance=clear].sc-calcite-split-button-h:hover .split-button__divider-container.sc-calcite-split-button{background-color:var(--calcite-split-button-divider)}/*!@:host([appearance=outline]:focus-within):host([color=blue]),\n:host([appearance=clear]:focus-within):host([color=blue])*/[appearance=outline].sc-calcite-split-button-h:focus-within.sc-calcite-split-button-h([color=blue]),[appearance=clear].sc-calcite-split-button-h:focus-within.sc-calcite-split-button-h([color=blue]){--calcite-split-button-divider:var(--calcite-ui-brand-press)}/*!@:host([appearance=outline]:focus-within):host([color=red]),\n:host([appearance=clear]:focus-within):host([color=red])*/[appearance=outline].sc-calcite-split-button-h:focus-within.sc-calcite-split-button-h([color=red]),[appearance=clear].sc-calcite-split-button-h:focus-within.sc-calcite-split-button-h([color=red]){--calcite-split-button-divider:var(--calcite-ui-danger-press)}/*!@:host([appearance=outline]:focus-within) .split-button__divider-container,\n:host([appearance=clear]:focus-within) .split-button__divider-container*/[appearance=outline].sc-calcite-split-button-h:focus-within .split-button__divider-container.sc-calcite-split-button,[appearance=clear].sc-calcite-split-button-h:focus-within .split-button__divider-container.sc-calcite-split-button{background-color:var(--calcite-split-button-divider)}/*!@:host([disabled])*/[disabled].sc-calcite-split-button-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) .split-button__divider-container*/[disabled].sc-calcite-split-button-h .split-button__divider-container.sc-calcite-split-button{opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) calcite-dropdown > calcite-button*/[disabled].sc-calcite-split-button-h calcite-dropdown.sc-calcite-split-button>calcite-button.sc-calcite-split-button{pointer-events:none}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-split-button-h[disabled] .sc-calcite-split-button-s>[calcite-hydrated][disabled],[disabled].sc-calcite-split-button-h [calcite-hydrated][disabled].sc-calcite-split-button{opacity:1}";
- /**
- * @slot - A slot for adding `calcite-dropdown` content.
- */
- class SplitButton {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteSplitButtonPrimaryClick = createEvent(this, "calciteSplitButtonPrimaryClick", 7);
- this.calciteSplitButtonSecondaryClick = createEvent(this, "calciteSplitButtonSecondaryClick", 7);
- /** specify the appearance style of the button, defaults to solid. */
- this.appearance = "solid";
- /** specify the color of the control, defaults to blue */
- this.color = "blue";
- /** is the control disabled */
- this.disabled = false;
- /**
- * Is the dropdown currently active or not
- * @internal
- */
- this.active = false;
- /** specify the icon used for the dropdown menu, defaults to chevron */
- this.dropdownIconType = "chevron";
- /** optionally add a calcite-loader component to the control,
- disabling interaction. with the primary button */
- this.loading = false;
- /** Describes the type of positioning to use for the dropdown. If your element is in a fixed container, use the 'fixed' value. */
- this.overlayPositioning = "absolute";
- /** specify the scale of the control, defaults to m */
- this.scale = "m";
- /** specify the width of the button, defaults to auto */
- this.width = "auto";
- this.calciteSplitButtonPrimaryClickHandler = (e) => this.calciteSplitButtonPrimaryClick.emit(e);
- this.calciteSplitButtonSecondaryClickHandler = (e) => this.calciteSplitButtonSecondaryClick.emit(e);
- }
- handleDisabledChange(value) {
- if (!value) {
- this.active = false;
- }
- }
- activeHandler() {
- if (this.disabled) {
- this.active = false;
- }
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentDidRender() {
- updateHostInteraction(this);
- }
- render() {
- const widthClasses = {
- [CSS$7.container]: true,
- [CSS$7.widthAuto]: this.width === "auto",
- [CSS$7.widthHalf]: this.width === "half",
- [CSS$7.widthFull]: this.width === "full"
- };
- const buttonWidth = this.width === "auto" ? "auto" : "full";
- return (hAsync("div", { class: widthClasses }, hAsync("calcite-button", { appearance: this.appearance, color: this.color, disabled: this.disabled, "icon-end": this.primaryIconEnd ? this.primaryIconEnd : null, "icon-start": this.primaryIconStart ? this.primaryIconStart : null, iconFlipRtl: this.primaryIconFlipRtl ? this.primaryIconFlipRtl : null, label: this.primaryLabel, loading: this.loading, onClick: this.calciteSplitButtonPrimaryClickHandler, scale: this.scale, splitChild: "primary", type: "button", width: buttonWidth }, this.primaryText), hAsync("div", { class: CSS$7.dividerContainer }, hAsync("div", { class: CSS$7.divider })), hAsync("calcite-dropdown", { active: this.active, disabled: this.disabled, onClick: this.calciteSplitButtonSecondaryClickHandler, overlayPositioning: this.overlayPositioning, placement: "bottom-trailing", scale: this.scale, width: this.scale }, hAsync("calcite-button", { appearance: this.appearance, color: this.color, disabled: this.disabled, "icon-start": this.dropdownIcon, label: this.dropdownLabel, scale: this.scale, slot: "dropdown-trigger", splitChild: "secondary", type: "button" }), hAsync("slot", null))));
- }
- get dropdownIcon() {
- return this.dropdownIconType === "chevron"
- ? "chevronDown"
- : this.dropdownIconType === "caret"
- ? "caretDown"
- : this.dropdownIconType === "ellipsis"
- ? "ellipsis"
- : "handle-vertical";
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "disabled": ["handleDisabledChange"],
- "active": ["activeHandler"]
- }; }
- static get style() { return splitButtonCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-split-button",
- "$members$": {
- "appearance": [513],
- "color": [513],
- "disabled": [516],
- "active": [1540],
- "dropdownIconType": [513, "dropdown-icon-type"],
- "dropdownLabel": [513, "dropdown-label"],
- "loading": [516],
- "overlayPositioning": [1, "overlay-positioning"],
- "primaryIconEnd": [513, "primary-icon-end"],
- "primaryIconFlipRtl": [513, "primary-icon-flip-rtl"],
- "primaryIconStart": [513, "primary-icon-start"],
- "primaryLabel": [513, "primary-label"],
- "primaryText": [513, "primary-text"],
- "scale": [513],
- "width": [513]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["appearance", "appearance"], ["color", "color"], ["disabled", "disabled"], ["active", "active"], ["dropdownIconType", "dropdown-icon-type"], ["dropdownLabel", "dropdown-label"], ["loading", "loading"], ["primaryIconEnd", "primary-icon-end"], ["primaryIconFlipRtl", "primary-icon-flip-rtl"], ["primaryIconStart", "primary-icon-start"], ["primaryLabel", "primary-label"], ["primaryText", "primary-text"], ["scale", "scale"], ["width", "width"]]
- }; }
- }
- const stepperCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-stepper:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-stepper{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-stepper{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-stepper{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-stepper{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-stepper{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-stepper:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-stepper-h{display:none}/*!@:host*/.sc-calcite-stepper-h{position:relative;display:-ms-flexbox;display:flex;width:100%;min-width:100%;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:justify;justify-content:space-between}/*!@:host([layout=vertical])*/[layout=vertical].sc-calcite-stepper-h{-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column}/*!@:host ::slotted(.calcite-stepper-content)*/.sc-calcite-stepper-h .sc-calcite-stepper-s>.calcite-stepper-content{display:-ms-flexbox;display:flex;width:100%;min-width:100%;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:wrap;flex-wrap:wrap}";
- /**
- * @slot - A slot for adding `calcite-stepper-item`s.
- */
- class Stepper {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteStepperItemChange = createEvent(this, "calciteStepperItemChange", 7);
- //--------------------------------------------------------------------------
- //
- // Public Properties
- //
- //--------------------------------------------------------------------------
- /** optionally display a status icon next to the step title */
- this.icon = false;
- /** specify the layout of stepper, defaults to horizontal */
- this.layout = "horizontal";
- /** optionally display the number next to the step title */
- this.numbered = false;
- /** specify the scale of stepper, defaults to m */
- this.scale = "m";
- //--------------------------------------------------------------------------
- //
- // Private State/Props
- //
- //--------------------------------------------------------------------------
- this.itemMap = new Map();
- /** list of sorted Stepper items */
- this.items = [];
- /** list of enabled Stepper items */
- this.enabledItems = [];
- }
- // watch for removal of disabled to register step
- contentWatcher() {
- if (this.layout === "horizontal") {
- if (!this.stepperContentContainer && this.requestedContent) {
- this.addHorizontalContentContainer();
- }
- this.updateContent(this.requestedContent);
- }
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentDidLoad() {
- // if no stepper items are set as active, default to the first one
- if (!this.currentPosition) {
- this.calciteStepperItemChange.emit({
- position: 0
- });
- }
- }
- componentWillLoad() {
- if (this.layout === "horizontal" && !this.stepperContentContainer) {
- this.addHorizontalContentContainer();
- }
- }
- render() {
- return hAsync("slot", null);
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- calciteStepperItemKeyEvent(e) {
- const item = e.detail.item;
- const itemToFocus = e.target;
- const isFirstItem = this.itemIndex(itemToFocus) === 0;
- const isLastItem = this.itemIndex(itemToFocus) === this.enabledItems.length - 1;
- switch (item.key) {
- case "ArrowDown":
- case "ArrowRight":
- if (isLastItem) {
- this.focusFirstItem();
- }
- else {
- this.focusNextItem(itemToFocus);
- }
- break;
- case "ArrowUp":
- case "ArrowLeft":
- if (isFirstItem) {
- this.focusLastItem();
- }
- else {
- this.focusPrevItem(itemToFocus);
- }
- break;
- case "Home":
- this.focusFirstItem();
- break;
- case "End":
- this.focusLastItem();
- break;
- }
- }
- registerItem(event) {
- const item = event.target;
- const { content, position } = event.detail;
- if (content && item.active) {
- this.requestedContent = content;
- }
- this.itemMap.set(item, position);
- this.items = this.sortItems();
- this.enabledItems = this.filterItems();
- }
- updateItem(event) {
- if (event.detail.content) {
- this.requestedContent = event.detail.content;
- }
- this.currentPosition = event.detail.position;
- this.calciteStepperItemChange.emit({
- position: this.currentPosition
- });
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** set the next step as active */
- async nextStep() {
- const enabledStepIndex = this.getEnabledStepIndex(this.currentPosition + 1, "next");
- if (typeof enabledStepIndex !== "number") {
- return;
- }
- this.emitChangedItem(enabledStepIndex);
- }
- /** set the previous step as active */
- async prevStep() {
- const enabledStepIndex = this.getEnabledStepIndex(this.currentPosition - 1, "previous");
- if (typeof enabledStepIndex !== "number") {
- return;
- }
- this.emitChangedItem(enabledStepIndex);
- }
- /** set the requested step as active */
- async goToStep(step) {
- const position = step - 1;
- if (this.currentPosition !== position) {
- this.emitChangedItem(position);
- }
- }
- /** set the first step as active */
- async startStep() {
- const enabledStepIndex = this.getEnabledStepIndex(0, "next");
- if (typeof enabledStepIndex !== "number") {
- return;
- }
- this.emitChangedItem(enabledStepIndex);
- }
- /** set the last step as active */
- async endStep() {
- const enabledStepIndex = this.getEnabledStepIndex(this.items.length - 1, "previous");
- if (typeof enabledStepIndex !== "number") {
- return;
- }
- this.emitChangedItem(enabledStepIndex);
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- getEnabledStepIndex(startIndex, direction = "next") {
- var _a;
- const { items, currentPosition } = this;
- let newIndex = startIndex;
- while ((_a = items[newIndex]) === null || _a === void 0 ? void 0 : _a.disabled) {
- newIndex = newIndex + (direction === "previous" ? -1 : 1);
- }
- return newIndex !== currentPosition && newIndex < items.length && newIndex >= 0
- ? newIndex
- : null;
- }
- addHorizontalContentContainer() {
- this.stepperContentContainer = document.createElement("div");
- this.stepperContentContainer.classList.add("calcite-stepper-content");
- this.el.insertAdjacentElement("beforeend", this.stepperContentContainer);
- }
- emitChangedItem(position) {
- this.currentPosition = position;
- this.calciteStepperItemChange.emit({
- position
- });
- }
- focusFirstItem() {
- const firstItem = this.enabledItems[0];
- this.focusElement(firstItem);
- }
- focusLastItem() {
- const lastItem = this.enabledItems[this.enabledItems.length - 1];
- this.focusElement(lastItem);
- }
- focusNextItem(e) {
- const index = this.itemIndex(e);
- const nextItem = this.enabledItems[index + 1] || this.enabledItems[0];
- this.focusElement(nextItem);
- }
- focusPrevItem(e) {
- const index = this.itemIndex(e);
- const prevItem = this.enabledItems[index - 1] || this.enabledItems[this.enabledItems.length - 1];
- this.focusElement(prevItem);
- }
- itemIndex(e) {
- return this.enabledItems.indexOf(e);
- }
- focusElement(item) {
- item.focus();
- }
- sortItems() {
- const { itemMap } = this;
- return Array.from(itemMap.keys()).sort((a, b) => itemMap.get(a) - itemMap.get(b));
- }
- filterItems() {
- return this.items.filter((item) => !item.disabled);
- }
- updateContent(content) {
- this.stepperContentContainer.innerHTML = "";
- this.stepperContentContainer.append(...content);
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "requestedContent": ["contentWatcher"]
- }; }
- static get style() { return stepperCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-stepper",
- "$members$": {
- "icon": [516],
- "layout": [513],
- "numbered": [516],
- "scale": [513],
- "requestedContent": [1040],
- "nextStep": [64],
- "prevStep": [64],
- "goToStep": [64],
- "startStep": [64],
- "endStep": [64]
- },
- "$listeners$": [[0, "calciteStepperItemKeyEvent", "calciteStepperItemKeyEvent"], [0, "calciteStepperItemRegister", "registerItem"], [0, "calciteStepperItemSelect", "updateItem"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["icon", "icon"], ["layout", "layout"], ["numbered", "numbered"], ["scale", "scale"]]
- }; }
- }
- const stepperItemCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-stepper-item:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-stepper-item{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-stepper-item{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-stepper-item{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-stepper-item{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-stepper-item{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-stepper-item:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-stepper-item-h{display:none}/*!@:host([scale=s])*/[scale=s].sc-calcite-stepper-item-h{--calcite-stepper-item-spacing-unit-s:0.25rem;--calcite-stepper-item-spacing-unit-m:0.75rem;--calcite-stepper-item-spacing-unit-l:1rem;font-size:var(--calcite-font-size--1);line-height:1rem;-webkit-margin-end:0.25rem;margin-inline-end:0.25rem}/*!@:host([scale=s]) .stepper-item-subtitle*/[scale=s].sc-calcite-stepper-item-h .stepper-item-subtitle.sc-calcite-stepper-item{font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-stepper-item-h{--calcite-stepper-item-spacing-unit-s:0.5rem;--calcite-stepper-item-spacing-unit-m:1rem;--calcite-stepper-item-spacing-unit-l:1.25rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;-webkit-margin-end:0.5rem;margin-inline-end:0.5rem}/*!@:host([scale=m]) .stepper-item-subtitle*/[scale=m].sc-calcite-stepper-item-h .stepper-item-subtitle.sc-calcite-stepper-item{font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-stepper-item-h{--calcite-stepper-item-spacing-unit-s:0.75rem;--calcite-stepper-item-spacing-unit-m:1.25rem;--calcite-stepper-item-spacing-unit-l:1.5rem;font-size:var(--calcite-font-size-1);line-height:1.5rem;-webkit-margin-end:0.75rem;margin-inline-end:0.75rem}/*!@:host([scale=l]) .stepper-item-subtitle*/[scale=l].sc-calcite-stepper-item-h .stepper-item-subtitle.sc-calcite-stepper-item{font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host*/.sc-calcite-stepper-item-h{position:relative;display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-direction:column;flex-direction:column;margin-bottom:var(--calcite-stepper-item-spacing-unit-s)}/*!@:host .container*/.sc-calcite-stepper-item-h .container.sc-calcite-stepper-item{position:relative;display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;cursor:pointer;-ms-flex-direction:column;flex-direction:column;border-width:0px;border-top-width:2px;border-style:solid;border-color:var(--calcite-ui-border-3);color:var(--calcite-ui-text-3);-webkit-text-decoration-line:none;text-decoration-line:none;outline:2px solid transparent;outline-offset:2px;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}/*!@:host*/.sc-calcite-stepper-item-h{outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@:host(:focus)*/.sc-calcite-stepper-item-h:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:2px}/*!@:host .stepper-item-header*/.sc-calcite-stepper-item-h .stepper-item-header.sc-calcite-stepper-item{display:-ms-flexbox;display:flex;cursor:pointer;-ms-flex-align:start;align-items:flex-start}/*!@:host .stepper-item-content, :host .stepper-item-header*/.sc-calcite-stepper-item-h .stepper-item-content.sc-calcite-stepper-item,.sc-calcite-stepper-item-h .stepper-item-header.sc-calcite-stepper-item{-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);padding-block:var(--calcite-stepper-item-spacing-unit-l);-webkit-padding-end:var(--calcite-stepper-item-spacing-unit-m);padding-inline-end:var(--calcite-stepper-item-spacing-unit-m);text-align:start}/*!@:host .stepper-item-header **/.sc-calcite-stepper-item-h .stepper-item-header.sc-calcite-stepper-item *.sc-calcite-stepper-item{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}/*!@:host .stepper-item-content*/.sc-calcite-stepper-item-h .stepper-item-content.sc-calcite-stepper-item{display:none;width:100%;-ms-flex-direction:column;flex-direction:column;font-size:var(--calcite-font-size--2);line-height:1.375}/*!@:host .stepper-item-icon*/.sc-calcite-stepper-item-h .stepper-item-icon.sc-calcite-stepper-item{-webkit-margin-end:var(--calcite-stepper-item-spacing-unit-m);margin-inline-end:var(--calcite-stepper-item-spacing-unit-m);margin-top:1px;display:-ms-inline-flexbox;display:inline-flex;height:0.75rem;-ms-flex-negative:0;flex-shrink:0;-ms-flex-item-align:start;align-self:flex-start;color:var(--calcite-ui-text-3);opacity:var(--calcite-ui-opacity-disabled);-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}/*!@:host .stepper-item-header-text*/.sc-calcite-stepper-item-h .stepper-item-header-text.sc-calcite-stepper-item{-ms-flex-direction:column;flex-direction:column;text-align:initial;-webkit-margin-end:auto;margin-inline-end:auto}/*!@:host .stepper-item-title, :host .stepper-item-subtitle*/.sc-calcite-stepper-item-h .stepper-item-title.sc-calcite-stepper-item,.sc-calcite-stepper-item-h .stepper-item-subtitle.sc-calcite-stepper-item{display:-ms-flexbox;display:flex;width:100%}/*!@:host .stepper-item-title*/.sc-calcite-stepper-item-h .stepper-item-title.sc-calcite-stepper-item{margin-bottom:0.25rem;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-2)}/*!@:host .stepper-item-subtitle*/.sc-calcite-stepper-item-h .stepper-item-subtitle.sc-calcite-stepper-item{color:var(--calcite-ui-text-3)}/*!@:host .stepper-item-number*/.sc-calcite-stepper-item-h .stepper-item-number.sc-calcite-stepper-item{font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-3);-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-margin-end:var(--calcite-stepper-item-spacing-unit-m);margin-inline-end:var(--calcite-stepper-item-spacing-unit-m)}/*!@:host([disabled])*/[disabled].sc-calcite-stepper-item-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-stepper-item-h[disabled] .sc-calcite-stepper-item-s>[calcite-hydrated][disabled],[disabled].sc-calcite-stepper-item-h [calcite-hydrated][disabled].sc-calcite-stepper-item{opacity:1}/*!@:host([complete]) .container*/[complete].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item{border-color:rgba(0, 122, 194, 0.5)}/*!@:host([complete]) .container .stepper-item-icon*/[complete].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item .stepper-item-icon.sc-calcite-stepper-item{color:var(--calcite-ui-brand)}/*!@:host([error]) .container*/[error].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item{border-top-color:var(--calcite-ui-danger)}/*!@:host([error]) .container .stepper-item-number*/[error].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item .stepper-item-number.sc-calcite-stepper-item{color:var(--calcite-ui-danger)}/*!@:host([error]) .container .stepper-item-icon*/[error].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item .stepper-item-icon.sc-calcite-stepper-item{opacity:1;color:var(--calcite-ui-danger)}/*!@:host(:hover:not([disabled]):not([active])) .container, :host(:focus:not([disabled]):not([active])) .container*/.sc-calcite-stepper-item-h:hover:not([disabled]):not([active]) .container.sc-calcite-stepper-item,.sc-calcite-stepper-item-h:focus:not([disabled]):not([active]) .container.sc-calcite-stepper-item{border-top-color:var(--calcite-ui-brand)}/*!@:host(:hover:not([disabled]):not([active])) .container .stepper-item-title, :host(:focus:not([disabled]):not([active])) .container .stepper-item-title*/.sc-calcite-stepper-item-h:hover:not([disabled]):not([active]) .container.sc-calcite-stepper-item .stepper-item-title.sc-calcite-stepper-item,.sc-calcite-stepper-item-h:focus:not([disabled]):not([active]) .container.sc-calcite-stepper-item .stepper-item-title.sc-calcite-stepper-item{color:var(--calcite-ui-text-1)}/*!@:host(:hover:not([disabled]):not([active])) .container .stepper-item-subtitle, :host(:focus:not([disabled]):not([active])) .container .stepper-item-subtitle*/.sc-calcite-stepper-item-h:hover:not([disabled]):not([active]) .container.sc-calcite-stepper-item .stepper-item-subtitle.sc-calcite-stepper-item,.sc-calcite-stepper-item-h:focus:not([disabled]):not([active]) .container.sc-calcite-stepper-item .stepper-item-subtitle.sc-calcite-stepper-item{color:var(--calcite-ui-text-2)}/*!@:host([error]:hover:not([disabled]):not([active])) .container, :host([error]:focus:not([disabled]):not([active])) .container*/[error].sc-calcite-stepper-item-h:hover:not([disabled]):not([active]) .container.sc-calcite-stepper-item,[error].sc-calcite-stepper-item-h:focus:not([disabled]):not([active]) .container.sc-calcite-stepper-item{border-top-color:var(--calcite-ui-danger-hover)}/*!@:host([active]) .container*/[active].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item{border-top-color:var(--calcite-ui-brand)}/*!@:host([active]) .container .stepper-item-title*/[active].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item .stepper-item-title.sc-calcite-stepper-item{color:var(--calcite-ui-text-1)}/*!@:host([active]) .container .stepper-item-subtitle*/[active].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item .stepper-item-subtitle.sc-calcite-stepper-item{color:var(--calcite-ui-text-2)}/*!@:host([active]) .container .stepper-item-number*/[active].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item .stepper-item-number.sc-calcite-stepper-item{color:var(--calcite-ui-brand)}/*!@:host([active]) .container .stepper-item-icon*/[active].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item .stepper-item-icon.sc-calcite-stepper-item{color:var(--calcite-ui-brand);opacity:1}/*!@:host([layout=vertical]) .container*/[layout=vertical].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item{margin-left:0px;margin-right:0px;margin-top:0px;-ms-flex:1 1 auto;flex:1 1 auto;border-top-width:0px;border-style:solid;border-color:var(--calcite-ui-border-3);padding-top:0px;padding-bottom:0px;border-inline-start-width:2px;-webkit-padding-start:var(--calcite-stepper-item-spacing-unit-l);padding-inline-start:var(--calcite-stepper-item-spacing-unit-l)}/*!@:host([layout=vertical]) .container .stepper-item-icon*/[layout=vertical].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item .stepper-item-icon.sc-calcite-stepper-item{-ms-flex-order:3;order:3;margin-top:1px;margin-bottom:0px;-webkit-padding-start:var(--calcite-stepper-item-spacing-unit-s);padding-inline-start:var(--calcite-stepper-item-spacing-unit-s);-webkit-margin-start:auto;margin-inline-start:auto}/*!@:host([layout=vertical]) .container .stepper-item-header*/[layout=vertical].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item .stepper-item-header.sc-calcite-stepper-item{-webkit-padding-end:0px;padding-inline-end:0px}/*!@:host([layout=vertical]) .container .stepper-item-content*/[layout=vertical].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item .stepper-item-content.sc-calcite-stepper-item{padding:0px}/*!@:host([layout=vertical][active]) .container .stepper-item-content*/[layout=vertical][active].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item .stepper-item-content.sc-calcite-stepper-item{display:-ms-flexbox;display:flex}/*!@:host([layout=vertical][active]) .container .stepper-item-content ::slotted(:last-child)*/.sc-calcite-stepper-item-h[layout=vertical][active] .container .stepper-item-content .sc-calcite-stepper-item-s>:last-child{margin-bottom:var(--calcite-stepper-item-spacing-unit-l)}/*!@:host([layout=vertical][complete]) .container*/[layout=vertical][complete].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item{border-color:rgba(0, 122, 194, 0.5)}/*!@:host([layout=vertical][complete]:hover:not([disabled]):not([active])) .container, :host([layout=vertical][complete]:focus:not([disabled]):not([active])) .container*/[layout=vertical][complete].sc-calcite-stepper-item-h:hover:not([disabled]):not([active]) .container.sc-calcite-stepper-item,[layout=vertical][complete].sc-calcite-stepper-item-h:focus:not([disabled]):not([active]) .container.sc-calcite-stepper-item{border-color:var(--calcite-ui-brand)}/*!@:host([layout=vertical][error]) .container*/[layout=vertical][error].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item{border-color:var(--calcite-ui-danger)}/*!@:host([layout=vertical][active]) .container*/[layout=vertical][active].sc-calcite-stepper-item-h .container.sc-calcite-stepper-item{border-color:var(--calcite-ui-brand)}/*!@:host([layout=vertical]:hover:not([disabled]):not([active])) .container,\n:host([layout=vertical]:focus:not([disabled]):not([active])) .container*/[layout=vertical].sc-calcite-stepper-item-h:hover:not([disabled]):not([active]) .container.sc-calcite-stepper-item,[layout=vertical].sc-calcite-stepper-item-h:focus:not([disabled]):not([active]) .container.sc-calcite-stepper-item{border-color:rgba(0, 122, 194, 0.5)}/*!@:host([layout=vertical][error]:hover:not([disabled]):not([active])) .container, :host([layout=vertical][error]:focus:not([disabled]):not([active])) .container*/[layout=vertical][error].sc-calcite-stepper-item-h:hover:not([disabled]):not([active]) .container.sc-calcite-stepper-item,[layout=vertical][error].sc-calcite-stepper-item-h:focus:not([disabled]):not([active]) .container.sc-calcite-stepper-item{border-color:var(--calcite-ui-danger-hover)}";
- /**
- * @slot - A slot for adding custom content.
- */
- class StepperItem {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteStepperItemKeyEvent = createEvent(this, "calciteStepperItemKeyEvent", 7);
- this.calciteStepperItemSelect = createEvent(this, "calciteStepperItemSelect", 7);
- this.calciteStepperItemRegister = createEvent(this, "calciteStepperItemRegister", 7);
- //--------------------------------------------------------------------------
- //
- // Public Properties
- //
- //--------------------------------------------------------------------------
- /** is the step active */
- this.active = false;
- /** has the step been completed */
- this.complete = false;
- /** does the step contain an error that needs to be resolved by the user */
- this.error = false;
- /** is the step disabled and not navigable to by a user */
- this.disabled = false;
- /** should the items display an icon based on status */
- /** @internal */
- this.icon = false;
- /** optionally display the step number next to the title and subtitle */
- /** @internal */
- this.numbered = false;
- /** the scale of the item */
- /** @internal */
- this.scale = "m";
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- this.keyDownHandler = (e) => {
- if (!this.disabled && e.target === this.el) {
- switch (e.key) {
- case " ":
- case "Enter":
- this.emitRequestedItem();
- e.preventDefault();
- break;
- case "ArrowUp":
- case "ArrowDown":
- case "ArrowLeft":
- case "ArrowRight":
- case "Home":
- case "End":
- this.calciteStepperItemKeyEvent.emit({ item: e });
- e.preventDefault();
- break;
- }
- }
- };
- this.emitRequestedItem = () => {
- if (!this.disabled) {
- this.calciteStepperItemSelect.emit({
- position: this.itemPosition,
- content: this.itemContent
- });
- }
- };
- this.setItemContent = (event) => {
- this.itemPosition = this.getItemPosition();
- const itemContent = event.target.assignedNodes({ flatten: true });
- if (itemContent.length) {
- this.itemContent = itemContent;
- }
- this.registerStepperItem();
- if (this.active) {
- this.emitRequestedItem();
- }
- };
- }
- // watch for removal of disabled to register step
- disabledWatcher() {
- this.registerStepperItem();
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentWillLoad() {
- this.icon = getElementProp(this.el, "icon", false);
- this.numbered = getElementProp(this.el, "numbered", false);
- this.layout = getElementProp(this.el, "layout", false);
- this.scale = getElementProp(this.el, "scale", "m");
- this.parentStepperEl = this.el.parentElement;
- }
- componentDidRender() {
- updateHostInteraction(this, true);
- }
- render() {
- return (hAsync(Host, { "aria-expanded": toAriaBoolean(this.active), onClick: this.emitRequestedItem, onKeyDown: this.keyDownHandler }, hAsync("div", { class: "container" }, hAsync("div", { class: "stepper-item-header" }, this.icon ? this.renderIcon() : null, this.numbered ? (hAsync("div", { class: "stepper-item-number" }, this.getItemPosition() + 1, ".")) : null, hAsync("div", { class: "stepper-item-header-text" }, hAsync("span", { class: "stepper-item-title" }, this.itemTitle), hAsync("span", { class: "stepper-item-subtitle" }, this.itemSubtitle))), hAsync("div", { class: "stepper-item-content" }, hAsync("slot", { onSlotchange: this.setItemContent })))));
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- updateActiveItemOnChange(event) {
- if (event.target === this.parentStepperEl ||
- event.composedPath().includes(this.parentStepperEl)) {
- this.activePosition = event.detail.position;
- this.determineActiveItem();
- }
- }
- renderIcon() {
- const path = this.active
- ? "circleF"
- : this.error
- ? "exclamationMarkCircleF"
- : this.complete
- ? "checkCircleF"
- : "circle";
- return hAsync("calcite-icon", { class: "stepper-item-icon", icon: path, scale: "s" });
- }
- determineActiveItem() {
- this.active = !this.disabled && this.itemPosition === this.activePosition;
- }
- registerStepperItem() {
- this.calciteStepperItemRegister.emit({
- position: this.itemPosition,
- content: this.itemContent
- });
- }
- getItemPosition() {
- return Array.prototype.indexOf.call(this.parentStepperEl.querySelectorAll("calcite-stepper-item"), this.el);
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "disabled": ["disabledWatcher"]
- }; }
- static get style() { return stepperItemCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-stepper-item",
- "$members$": {
- "active": [1540],
- "complete": [516],
- "error": [4],
- "disabled": [516],
- "itemTitle": [1, "item-title"],
- "itemSubtitle": [1, "item-subtitle"],
- "layout": [1537],
- "icon": [1028],
- "numbered": [1028],
- "scale": [1537]
- },
- "$listeners$": [[16, "calciteStepperItemChange", "updateActiveItemOnChange"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["active", "active"], ["complete", "complete"], ["disabled", "disabled"], ["layout", "layout"], ["scale", "scale"]]
- }; }
- }
- const switchCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-switch:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-switch{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-switch{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-switch{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-switch{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-switch{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-switch:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-switch-h{display:none}/*!@:host([scale=s]) .container*/[scale=s].sc-calcite-switch-h .container.sc-calcite-switch{height:0.75rem}/*!@:host([scale=s]) .track*/[scale=s].sc-calcite-switch-h .track.sc-calcite-switch{height:0.75rem;width:1.5rem}/*!@:host([scale=s]) .handle*/[scale=s].sc-calcite-switch-h .handle.sc-calcite-switch{height:0.5rem;width:0.5rem}/*!@:host([scale=m]) .container*/[scale=m].sc-calcite-switch-h .container.sc-calcite-switch{height:1rem}/*!@:host([scale=m]) .track*/[scale=m].sc-calcite-switch-h .track.sc-calcite-switch{height:1rem;width:2rem}/*!@:host([scale=m]) .handle*/[scale=m].sc-calcite-switch-h .handle.sc-calcite-switch{height:0.75rem;width:0.75rem}/*!@:host([scale=l]) .container*/[scale=l].sc-calcite-switch-h .container.sc-calcite-switch{height:1.5rem}/*!@:host([scale=l]) .track*/[scale=l].sc-calcite-switch-h .track.sc-calcite-switch{height:1.5rem;width:3rem}/*!@:host([scale=l]) .handle*/[scale=l].sc-calcite-switch-h .handle.sc-calcite-switch{height:1.25rem;width:1.25rem}/*!@:host*/.sc-calcite-switch-h{position:relative;display:inline-block;width:auto;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle;tap-highlight-color:transparent}/*!@:host([disabled])*/[disabled].sc-calcite-switch-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-switch-h[disabled] .sc-calcite-switch-s>[calcite-hydrated][disabled],[disabled].sc-calcite-switch-h [calcite-hydrated][disabled].sc-calcite-switch{opacity:1}/*!@:host*/.sc-calcite-switch-h{width:auto;outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@.track*/.track.sc-calcite-switch{pointer-events:none;position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;display:inline-block;border-radius:9999px;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-2);background-color:var(--calcite-ui-foreground-2);vertical-align:top;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}/*!@.handle*/.handle.sc-calcite-switch{pointer-events:none;position:absolute;display:block;border-radius:9999px;border-width:2px;border-style:solid;border-color:var(--calcite-ui-border-input);background-color:var(--calcite-ui-foreground-1);-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);top:-1px;inset-inline:-1px auto}/*!@:host(:hover) .handle, :host(:focus) .handle*/.sc-calcite-switch-h:hover .handle.sc-calcite-switch,.sc-calcite-switch-h:focus .handle.sc-calcite-switch{border-color:var(--calcite-ui-brand);-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-brand);box-shadow:inset 0 0 0 1px var(--calcite-ui-brand)}/*!@:host([checked]) .track*/[checked].sc-calcite-switch-h .track.sc-calcite-switch{border-color:var(--calcite-ui-brand-hover);background-color:var(--calcite-ui-brand)}/*!@:host([checked]) .handle*/[checked].sc-calcite-switch-h .handle.sc-calcite-switch{border-color:var(--calcite-ui-brand);inset-inline:auto -1px}/*!@:host([checked]:hover) .track*/[checked].sc-calcite-switch-h:hover .track.sc-calcite-switch{border-color:var(--calcite-ui-brand-hover);background-color:var(--calcite-ui-brand)}/*!@:host([checked]:hover) .handle*/[checked].sc-calcite-switch-h:hover .handle.sc-calcite-switch{border-color:var(--calcite-ui-brand-hover);-webkit-box-shadow:inset 0 0 0 1px var(--calcite-ui-brand-hover);box-shadow:inset 0 0 0 1px var(--calcite-ui-brand-hover)}@media (forced-colors: active){/*!@:host([checked]) .track*/[checked].sc-calcite-switch-h .track.sc-calcite-switch{background-color:canvasText}}/*!@.container:focus*/.container.sc-calcite-switch:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:2px}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-switch-s>input[slot=hidden-form-input]{bottom:0 !important;left:0 !important;margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;right:0 !important;top:0 !important;-webkit-transform:none !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}";
- class Switch {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteSwitchChange = createEvent(this, "calciteSwitchChange", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** True if the switch is disabled */
- this.disabled = false;
- /** The scale of the switch */
- this.scale = "m";
- /** True if the switch is initially on
- * @deprecated use 'checked' instead.
- */
- this.switched = false;
- /** True if the switch is initially on */
- this.checked = false;
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- this.keyDownHandler = (e) => {
- const key = e.key;
- if (!this.disabled && (key === " " || key === "Enter")) {
- this.toggle();
- e.preventDefault();
- }
- };
- this.clickHandler = () => {
- this.toggle();
- };
- this.setSwitchEl = (el) => {
- this.switchEl = el;
- };
- }
- switchedWatcher(switched) {
- this.checked = switched;
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- focusElement(this.switchEl);
- }
- onLabelClick() {
- if (!this.disabled) {
- this.toggle();
- this.setFocus();
- }
- }
- toggle() {
- this.checked = !this.checked;
- this.calciteSwitchChange.emit({
- // todo: We should remove emmitting redudant props in event payload.
- // https://github.com/Esri/calcite-components/issues/3163
- switched: this.checked
- });
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- const initiallyChecked = this.checked || this.switched;
- if (initiallyChecked) {
- // if either prop is set, we ensure both are synced initially
- this.switched = this.checked = initiallyChecked;
- }
- connectLabel(this);
- connectForm(this);
- }
- disconnectedCallback() {
- disconnectLabel(this);
- disconnectForm(this);
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- return (hAsync(Host, { onClick: this.clickHandler, onKeyDown: this.keyDownHandler }, hAsync("div", { "aria-checked": toAriaBoolean(this.checked), "aria-label": getLabelText(this), class: "container", ref: this.setSwitchEl, role: "switch", tabIndex: 0 }, hAsync("div", { class: "track" }, hAsync("div", { class: "handle" })), hAsync(HiddenFormInputSlot, { component: this }))));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "switched": ["switchedWatcher"]
- }; }
- static get style() { return switchCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-switch",
- "$members$": {
- "disabled": [516],
- "label": [1],
- "name": [513],
- "scale": [513],
- "switched": [1028],
- "checked": [1540],
- "value": [8],
- "setFocus": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"], ["name", "name"], ["scale", "scale"], ["checked", "checked"]]
- }; }
- }
- const tabCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-tab:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-tab{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-tab{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-tab{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-tab{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-tab{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-tab:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-tab-h{display:none}/*!@:host([active]) section*/[active].sc-calcite-tab-h section.sc-calcite-tab{display:block}/*!@:host*/.sc-calcite-tab-h{display:none;height:100%;width:100%}/*!@:host([active])*/[active].sc-calcite-tab-h{display:block;height:100%;width:100%;overflow:auto}/*!@section*/section.sc-calcite-tab{display:none;height:100%;width:100%}/*!@:host([scale=s])*/[scale=s].sc-calcite-tab-h{padding-top:0.25rem;padding-bottom:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-tab-h{padding-top:0.5rem;padding-bottom:0.5rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-tab-h{padding-top:0.75rem;padding-bottom:0.75rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}";
- /**
- * @slot - A slot for adding custom content.
- */
- class Tab {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteTabRegister = createEvent(this, "calciteTabRegister", 7);
- /**
- * Show this tab
- */
- this.active = false;
- /** @internal Parent tabs component scale value */
- this.scale = "m";
- this.guid = `calcite-tab-title-${guid()}`;
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- render() {
- const id = this.el.id || this.guid;
- return (hAsync(Host, { "aria-expanded": toAriaBoolean(this.active), "aria-labelledby": this.labeledBy, id: id, role: "tabpanel" }, hAsync("section", null, hAsync("slot", null))));
- }
- connectedCallback() {
- this.parentTabsEl = this.el.closest("calcite-tabs");
- }
- componentDidLoad() {
- this.calciteTabRegister.emit();
- }
- componentWillRender() {
- var _a;
- this.scale = (_a = this.parentTabsEl) === null || _a === void 0 ? void 0 : _a.scale;
- }
- disconnectedCallback() {
- var _a;
- // Dispatching to body in order to be listened by other elements that are still connected to the DOM.
- (_a = document.body) === null || _a === void 0 ? void 0 : _a.dispatchEvent(new CustomEvent("calciteTabUnregister", {
- detail: this.el
- }));
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- internalTabChangeHandler(event) {
- const targetTabsEl = event
- .composedPath()
- .find((el) => el.tagName === "CALCITE-TABS");
- // to allow `<calcite-tabs>` to be nested we need to make sure this
- // `calciteTabChange` event was actually fired from a within the same
- // `<calcite-tabs>` that is the a parent of this tab.
- if (targetTabsEl !== this.parentTabsEl) {
- return;
- }
- if (this.tab) {
- this.active = this.tab === event.detail.tab;
- }
- else {
- this.getTabIndex().then((index) => {
- this.active = index === event.detail.tab;
- });
- }
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /**
- * Return the index of this tab within the tab array
- */
- async getTabIndex() {
- return Array.prototype.indexOf.call(nodeListToArray(this.el.parentElement.children).filter((e) => e.matches("calcite-tab")), this.el);
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- /**
- * @internal
- */
- async updateAriaInfo(tabIds = [], titleIds = []) {
- this.labeledBy = titleIds[tabIds.indexOf(this.el.id)] || null;
- }
- get el() { return getElement(this); }
- static get style() { return tabCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-tab",
- "$members$": {
- "tab": [513],
- "active": [1540],
- "scale": [1537],
- "labeledBy": [32],
- "getTabIndex": [64],
- "updateAriaInfo": [64]
- },
- "$listeners$": [[16, "calciteInternalTabChange", "internalTabChangeHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["tab", "tab"], ["active", "active"], ["scale", "scale"]]
- }; }
- }
- const tabNavCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-tab-nav:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-tab-nav{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-tab-nav{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-tab-nav{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-tab-nav{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-tab-nav{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-tab-nav:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-tab-nav-h{display:none}/*!@:host*/.sc-calcite-tab-nav-h{position:relative;display:-ms-flexbox;display:flex}/*!@:host([scale=s])*/[scale=s].sc-calcite-tab-nav-h{min-height:1.5rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-tab-nav-h{min-height:2rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-tab-nav-h{min-height:2.75rem}/*!@.tab-nav*/.tab-nav.sc-calcite-tab-nav{display:-ms-flexbox;display:flex;width:100%;-ms-flex-pack:start;justify-content:flex-start;overflow:auto}/*!@:host([layout=center]) .tab-nav*/[layout=center].sc-calcite-tab-nav-h .tab-nav.sc-calcite-tab-nav{-ms-flex-pack:center;justify-content:center}/*!@.tab-nav-active-indicator-container*/.tab-nav-active-indicator-container.sc-calcite-tab-nav{position:absolute;left:0px;right:0px;bottom:0px;height:0.125rem;width:100%;overflow:hidden}/*!@.tab-nav-active-indicator*/.tab-nav-active-indicator.sc-calcite-tab-nav{position:absolute;bottom:0px;display:block;height:0.125rem;background-color:var(--calcite-ui-brand);-webkit-transition-property:all;transition-property:all;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0, 0, 0.2, 1);transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}/*!@:host([position=below]) .tab-nav-active-indicator*/[position=below].sc-calcite-tab-nav-h .tab-nav-active-indicator.sc-calcite-tab-nav{bottom:unset;top:0px}/*!@:host([position=below]) .tab-nav-active-indicator-container*/[position=below].sc-calcite-tab-nav-h .tab-nav-active-indicator-container.sc-calcite-tab-nav{bottom:unset;top:0px}/*!@:host([bordered]) .tab-nav-active-indicator-container*/[bordered].sc-calcite-tab-nav-h .tab-nav-active-indicator-container.sc-calcite-tab-nav{bottom:unset}/*!@:host([bordered][position=below]) .tab-nav-active-indicator-container*/[bordered][position=below].sc-calcite-tab-nav-h .tab-nav-active-indicator-container.sc-calcite-tab-nav{bottom:0;top:unset}";
- /**
- * @slot - A slot for adding `calcite-tab-title`s.
- */
- class TabNav {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteTabChange = createEvent(this, "calciteTabChange", 7);
- this.calciteInternalTabChange = createEvent(this, "calciteInternalTabChange", 7);
- /** @internal Parent tabs component scale value */
- this.scale = "m";
- /** @internal Parent tabs component layout value */
- this.layout = "inline";
- /** @internal Parent tabs component position value */
- this.position = "below";
- /** @internal Parent tabs component bordered value when layout is "inline" */
- this.bordered = false;
- this.animationActiveDuration = 0.3;
- this.resizeObserver = createObserver();
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- this.handleContainerScroll = () => {
- // remove active indicator transition duration while container is scrolling to prevent wobble
- this.activeIndicatorEl.style.transitionDuration = "0s";
- this.updateOffsetPosition();
- };
- }
- async selectedTabChanged() {
- if (localStorage &&
- this.storageId &&
- this.selectedTab !== undefined &&
- this.selectedTab !== null) {
- localStorage.setItem(`calcite-tab-nav-${this.storageId}`, JSON.stringify(this.selectedTab));
- }
- this.calciteInternalTabChange.emit({
- tab: this.selectedTab
- });
- this.selectedTabEl = await this.getTabTitleById(this.selectedTab);
- }
- selectedTabElChanged() {
- this.updateOffsetPosition();
- this.updateActiveWidth();
- // reset the animation time on tab selection
- this.activeIndicatorEl.style.transitionDuration = `${this.animationActiveDuration}s`;
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- var _a;
- this.parentTabsEl = this.el.closest("calcite-tabs");
- (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el);
- }
- disconnectedCallback() {
- var _a;
- (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- }
- componentWillLoad() {
- const storageKey = `calcite-tab-nav-${this.storageId}`;
- if (localStorage && this.storageId && localStorage.getItem(storageKey)) {
- const storedTab = JSON.parse(localStorage.getItem(storageKey));
- this.selectedTab = storedTab;
- }
- }
- componentWillRender() {
- const { parentTabsEl } = this;
- this.layout = parentTabsEl === null || parentTabsEl === void 0 ? void 0 : parentTabsEl.layout;
- this.position = parentTabsEl === null || parentTabsEl === void 0 ? void 0 : parentTabsEl.position;
- this.scale = parentTabsEl === null || parentTabsEl === void 0 ? void 0 : parentTabsEl.scale;
- this.bordered = parentTabsEl === null || parentTabsEl === void 0 ? void 0 : parentTabsEl.bordered;
- // fix issue with active tab-title not lining up with blue indicator
- if (this.selectedTabEl) {
- this.updateOffsetPosition();
- }
- }
- componentDidRender() {
- // if every tab title is active select the first tab.
- if (this.tabTitles.length &&
- this.tabTitles.every((title) => !title.active) &&
- !this.selectedTab) {
- this.tabTitles[0].getTabIdentifier().then((tab) => {
- this.calciteInternalTabChange.emit({
- tab
- });
- });
- }
- }
- render() {
- const dir = getElementDir(this.el);
- const width = `${this.indicatorWidth}px`;
- const offset = `${this.indicatorOffset}px`;
- const indicatorStyle = dir !== "rtl" ? { width, left: offset } : { width, right: offset };
- return (hAsync(Host, { role: "tablist" }, hAsync("div", { class: "tab-nav", onScroll: this.handleContainerScroll, ref: (el) => (this.tabNavEl = el) }, hAsync("div", { class: "tab-nav-active-indicator-container", ref: (el) => (this.activeIndicatorContainerEl = el) }, hAsync("div", { class: "tab-nav-active-indicator", ref: (el) => (this.activeIndicatorEl = el), style: indicatorStyle })), hAsync("slot", null))));
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- focusPreviousTabHandler(e) {
- const currentIndex = this.getIndexOfTabTitle(e.target, this.enabledTabTitles);
- const previousTab = this.enabledTabTitles[currentIndex - 1] ||
- this.enabledTabTitles[this.enabledTabTitles.length - 1];
- previousTab.focus();
- e.stopPropagation();
- e.preventDefault();
- }
- focusNextTabHandler(e) {
- const currentIndex = this.getIndexOfTabTitle(e.target, this.enabledTabTitles);
- const nextTab = this.enabledTabTitles[currentIndex + 1] || this.enabledTabTitles[0];
- nextTab.focus();
- e.stopPropagation();
- e.preventDefault();
- }
- internalActivateTabHandler(e) {
- this.selectedTab = e.detail.tab
- ? e.detail.tab
- : this.getIndexOfTabTitle(e.target);
- e.stopPropagation();
- e.preventDefault();
- }
- activateTabHandler(e) {
- this.calciteTabChange.emit({
- tab: this.selectedTab
- });
- e.stopPropagation();
- e.preventDefault();
- }
- /**
- * Check for active tabs on register and update selected
- */
- updateTabTitles(e) {
- if (e.target.active) {
- this.selectedTab = e.detail;
- }
- }
- globalInternalTabChangeHandler(e) {
- if (this.syncId &&
- e.target !== this.el &&
- e.target.syncId === this.syncId &&
- this.selectedTab !== e.detail.tab) {
- this.selectedTab = e.detail.tab;
- e.stopPropagation();
- }
- }
- updateOffsetPosition() {
- var _a, _b, _c, _d, _e;
- const dir = getElementDir(this.el);
- const navWidth = (_a = this.activeIndicatorContainerEl) === null || _a === void 0 ? void 0 : _a.offsetWidth;
- const tabLeft = (_b = this.selectedTabEl) === null || _b === void 0 ? void 0 : _b.offsetLeft;
- const tabWidth = (_c = this.selectedTabEl) === null || _c === void 0 ? void 0 : _c.offsetWidth;
- const offsetRight = navWidth - (tabLeft + tabWidth);
- this.indicatorOffset =
- dir !== "rtl" ? tabLeft - ((_d = this.tabNavEl) === null || _d === void 0 ? void 0 : _d.scrollLeft) : offsetRight + ((_e = this.tabNavEl) === null || _e === void 0 ? void 0 : _e.scrollLeft);
- }
- updateActiveWidth() {
- var _a;
- this.indicatorWidth = (_a = this.selectedTabEl) === null || _a === void 0 ? void 0 : _a.offsetWidth;
- }
- getIndexOfTabTitle(el, tabTitles = this.tabTitles) {
- // In most cases, since these indexes correlate with tab contents, we want to consider all tab titles.
- // However, when doing relative index operations, it makes sense to pass in this.enabledTabTitles as the 2nd arg.
- return tabTitles.indexOf(el);
- }
- async getTabTitleById(id) {
- return Promise.all(this.tabTitles.map((el) => el.getTabIdentifier())).then((ids) => {
- return this.tabTitles[ids.indexOf(id)];
- });
- }
- get tabTitles() {
- return filterDirectChildren(this.el, "calcite-tab-title");
- }
- get enabledTabTitles() {
- return filterDirectChildren(this.el, "calcite-tab-title:not([disabled])");
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "selectedTab": ["selectedTabChanged"],
- "selectedTabEl": ["selectedTabElChanged"]
- }; }
- static get style() { return tabNavCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-tab-nav",
- "$members$": {
- "storageId": [1, "storage-id"],
- "syncId": [1, "sync-id"],
- "scale": [1537],
- "layout": [1537],
- "position": [1537],
- "bordered": [1540],
- "indicatorOffset": [1026, "indicator-offset"],
- "indicatorWidth": [1026, "indicator-width"],
- "selectedTab": [32],
- "selectedTabEl": [32]
- },
- "$listeners$": [[0, "calciteTabsFocusPrevious", "focusPreviousTabHandler"], [0, "calciteTabsFocusNext", "focusNextTabHandler"], [0, "calciteInternalTabsActivate", "internalActivateTabHandler"], [0, "calciteTabsActivate", "activateTabHandler"], [0, "calciteTabTitleRegister", "updateTabTitles"], [16, "calciteInternalTabChange", "globalInternalTabChangeHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["scale", "scale"], ["layout", "layout"], ["position", "position"], ["bordered", "bordered"]]
- }; }
- }
- const tabTitleCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-tab-title:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-tab-title{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-tab-title{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-tab-title{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-tab-title{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-tab-title{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-tab-title:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-tab-title-h{display:none}/*!@:host*/.sc-calcite-tab-title-h{margin-right:1.25rem;display:block;-ms-flex:0 1 auto;flex:0 1 auto;outline:2px solid transparent;outline-offset:2px;-webkit-margin-start:0px;margin-inline-start:0px;-webkit-margin-end:1.25rem;margin-inline-end:1.25rem}/*!@:host([layout=center])*/[layout=center].sc-calcite-tab-title-h{margin-top:0px;margin-bottom:0px;margin-left:1.25rem;margin-right:1.25rem;text-align:center;-ms-flex-preferred-size:12rem;flex-basis:12rem}/*!@:host([position=below]) a*/[position=below].sc-calcite-tab-title-h a.sc-calcite-tab-title{border-bottom-width:0px;border-top-width:2px;border-top-color:transparent;border-top-style:solid}/*!@:host a*/.sc-calcite-tab-title-h a.sc-calcite-tab-title{outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@:host(:focus) a*/.sc-calcite-tab-title-h:focus a.sc-calcite-tab-title{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@:host(:active) a, :host(:focus) a, :host(:hover) a*/.sc-calcite-tab-title-h:active a.sc-calcite-tab-title,.sc-calcite-tab-title-h:focus a.sc-calcite-tab-title,.sc-calcite-tab-title-h:hover a.sc-calcite-tab-title{border-color:var(--calcite-ui-border-2);color:var(--calcite-ui-text-1);-webkit-text-decoration-line:none;text-decoration-line:none}/*!@:host([active]) a*/[active].sc-calcite-tab-title-h a.sc-calcite-tab-title{border-color:transparent;color:var(--calcite-ui-text-1)}/*!@:host([disabled])*/[disabled].sc-calcite-tab-title-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) span, :host([disabled]) a*/[disabled].sc-calcite-tab-title-h span.sc-calcite-tab-title,[disabled].sc-calcite-tab-title-h a.sc-calcite-tab-title{pointer-events:none;opacity:0.5}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-tab-title-h[disabled] .sc-calcite-tab-title-s>[calcite-hydrated][disabled],[disabled].sc-calcite-tab-title-h [calcite-hydrated][disabled].sc-calcite-tab-title{opacity:1}/*!@:host([scale=s])*/[scale=s].sc-calcite-tab-title-h{-webkit-margin-end:1rem;margin-inline-end:1rem}/*!@:host([scale=s]) a, :host([scale=s]) span*/[scale=s].sc-calcite-tab-title-h a.sc-calcite-tab-title,[scale=s].sc-calcite-tab-title-h span.sc-calcite-tab-title{padding-top:0.25rem;padding-bottom:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=m]) a, :host([scale=m]) span*/[scale=m].sc-calcite-tab-title-h a.sc-calcite-tab-title,[scale=m].sc-calcite-tab-title-h span.sc-calcite-tab-title{padding-top:0.5rem;padding-bottom:0.5rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-tab-title-h{-webkit-margin-end:1.5rem;margin-inline-end:1.5rem}/*!@:host([scale=l]) a, :host([scale=l]) span*/[scale=l].sc-calcite-tab-title-h a.sc-calcite-tab-title,[scale=l].sc-calcite-tab-title-h span.sc-calcite-tab-title{padding-top:0.75rem;padding-bottom:0.75rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@a, span*/a.sc-calcite-tab-title,span.sc-calcite-tab-title{-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;height:100%;width:100%;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;-ms-flex-pack:center;justify-content:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-bottom-width:2px;padding-left:0px;padding-right:0px;padding-top:0.5rem;padding-bottom:0.5rem;font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-ui-text-3);-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;border-bottom-color:transparent;border-bottom-style:solid}/*!@span*/span.sc-calcite-tab-title{cursor:default}/*!@.calcite-tab-title--icon*/.calcite-tab-title--icon.sc-calcite-tab-title{position:relative;margin:0px;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-item-align:center;align-self:center}/*!@.calcite-tab-title--icon svg*/.calcite-tab-title--icon.sc-calcite-tab-title svg.sc-calcite-tab-title{-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s}/*!@.container--has-text*/.container--has-text.sc-calcite-tab-title{padding:0.25rem}/*!@.container--has-text .calcite-tab-title--icon.icon-start*/.container--has-text.sc-calcite-tab-title .calcite-tab-title--icon.icon-start.sc-calcite-tab-title{-webkit-margin-end:0.5rem;margin-inline-end:0.5rem}/*!@.container--has-text .calcite-tab-title--icon.icon-end*/.container--has-text.sc-calcite-tab-title .calcite-tab-title--icon.icon-end.sc-calcite-tab-title{-webkit-margin-start:0.5rem;margin-inline-start:0.5rem}/*!@:host([icon-start][icon-end]) .calcite-tab-title--icon:first-child*/[icon-start][icon-end].sc-calcite-tab-title-h .calcite-tab-title--icon.sc-calcite-tab-title:first-child{-webkit-margin-end:0.5rem;margin-inline-end:0.5rem}/*!@:host([bordered])*/[bordered].sc-calcite-tab-title-h{-webkit-margin-end:0;margin-inline-end:0}/*!@:host([bordered][active])*/[bordered][active].sc-calcite-tab-title-h{-webkit-box-shadow:inset 0px -2px var(--calcite-ui-foreground-1);box-shadow:inset 0px -2px var(--calcite-ui-foreground-1)}/*!@:host([bordered][active][position=below])*/[bordered][active][position=below].sc-calcite-tab-title-h{-webkit-box-shadow:inset 0 2px 0 var(--calcite-ui-foreground-1);box-shadow:inset 0 2px 0 var(--calcite-ui-foreground-1)}/*!@:host([bordered]:hover) a, :host([bordered]:focus) a, :host([bordered]:active) a*/[bordered].sc-calcite-tab-title-h:hover a.sc-calcite-tab-title,[bordered].sc-calcite-tab-title-h:focus a.sc-calcite-tab-title,[bordered].sc-calcite-tab-title-h:active a.sc-calcite-tab-title{position:relative}/*!@:host([bordered]:hover) a*/[bordered].sc-calcite-tab-title-h:hover a.sc-calcite-tab-title{background-color:var(--calcite-button-transparent-hover);-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s}/*!@:host([bordered]) a*/[bordered].sc-calcite-tab-title-h a.sc-calcite-tab-title{border-bottom-style:unset}/*!@:host([bordered][position=below]) a*/[bordered][position=below].sc-calcite-tab-title-h a.sc-calcite-tab-title{border-top-style:unset}/*!@:host([active][bordered]) a*/[active][bordered].sc-calcite-tab-title-h a.sc-calcite-tab-title{border-left:1px solid var(--calcite-ui-border-1);border-right:1px solid var(--calcite-ui-border-1)}/*!@:host([bordered]) a, :host([bordered]) span*/[bordered].sc-calcite-tab-title-h a.sc-calcite-tab-title,[bordered].sc-calcite-tab-title-h span.sc-calcite-tab-title{padding-left:0.75rem;padding-right:0.75rem}/*!@:host([bordered][scale=s]) a, :host([bordered][scale=s]) span*/[bordered][scale=s].sc-calcite-tab-title-h a.sc-calcite-tab-title,[bordered][scale=s].sc-calcite-tab-title-h span.sc-calcite-tab-title{padding-left:0.5rem;padding-right:0.5rem}/*!@:host([bordered][scale=l]) a, :host([bordered][scale=l]) span*/[bordered][scale=l].sc-calcite-tab-title-h a.sc-calcite-tab-title,[bordered][scale=l].sc-calcite-tab-title-h span.sc-calcite-tab-title{padding-left:1rem;padding-right:1rem}";
- /**
- * @slot - A slot for adding text.
- */
- class TabTitle {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteTabsActivate = createEvent(this, "calciteTabsActivate", 7);
- this.calciteInternalTabsActivate = createEvent(this, "calciteInternalTabsActivate", 7);
- this.calciteTabsFocusNext = createEvent(this, "calciteTabsFocusNext", 7);
- this.calciteTabsFocusPrevious = createEvent(this, "calciteTabsFocusPrevious", 7);
- this.calciteTabTitleRegister = createEvent(this, "calciteTabTitleRegister", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** Show this tab title as selected */
- this.active = false;
- /** Disable this tab title */
- this.disabled = false;
- /** @internal Parent tabs component bordered value */
- this.bordered = false;
- //--------------------------------------------------------------------------
- //
- // Private State/Props
- //
- //--------------------------------------------------------------------------
- /** watches for changing text content **/
- this.mutationObserver = createObserver();
- /** determine if there is slotted text for styling purposes */
- this.hasText = false;
- this.guid = `calcite-tab-title-${guid()}`;
- }
- activeTabChanged() {
- if (this.active) {
- this.emitActiveTab(false);
- }
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- this.setupTextContentObserver();
- this.parentTabNavEl = this.el.closest("calcite-tab-nav");
- this.parentTabsEl = this.el.closest("calcite-tabs");
- }
- disconnectedCallback() {
- var _a, _b;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- // Dispatching to body in order to be listened by other elements that are still connected to the DOM.
- (_b = document.body) === null || _b === void 0 ? void 0 : _b.dispatchEvent(new CustomEvent("calciteTabTitleUnregister", {
- detail: this.el
- }));
- }
- componentWillLoad() {
- if (this.tab && this.active) {
- this.emitActiveTab(false);
- }
- }
- componentWillRender() {
- if (this.parentTabsEl) {
- this.layout = this.parentTabsEl.layout;
- this.position = this.parentTabsEl.position;
- this.scale = this.parentTabsEl.scale;
- this.bordered = this.parentTabsEl.bordered;
- }
- // handle case when tab-nav is only parent
- if (!this.parentTabsEl && this.parentTabNavEl) {
- this.position = getElementProp(this.parentTabNavEl, "position", this.position);
- this.scale = getElementProp(this.parentTabNavEl, "scale", this.scale);
- }
- }
- render() {
- const id = this.el.id || this.guid;
- const showSideBorders = this.bordered && !this.disabled && this.layout !== "center";
- const iconStartEl = (hAsync("calcite-icon", { class: "calcite-tab-title--icon icon-start", flipRtl: this.iconFlipRtl === "start" || this.iconFlipRtl === "both", icon: this.iconStart, scale: "s" }));
- const iconEndEl = (hAsync("calcite-icon", { class: "calcite-tab-title--icon icon-end", flipRtl: this.iconFlipRtl === "end" || this.iconFlipRtl === "both", icon: this.iconEnd, scale: "s" }));
- return (hAsync(Host, { "aria-controls": this.controls, "aria-expanded": toAriaBoolean(this.active), id: id, role: "tab" }, hAsync("a", { class: {
- container: true,
- "container--has-text": this.hasText
- }, style: showSideBorders && { width: `${this.parentTabNavEl.indicatorWidth}px` } }, this.iconStart ? iconStartEl : null, hAsync("slot", null), this.iconEnd ? iconEndEl : null)));
- }
- async componentDidLoad() {
- this.calciteTabTitleRegister.emit(await this.getTabIdentifier());
- }
- componentDidRender() {
- updateHostInteraction(this, true);
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- internalTabChangeHandler(event) {
- const targetTabsEl = event
- .composedPath()
- .find((el) => el.tagName === "CALCITE-TABS");
- if (targetTabsEl !== this.parentTabsEl) {
- return;
- }
- if (this.tab) {
- this.active = this.tab === event.detail.tab;
- }
- else {
- this.getTabIndex().then((index) => {
- this.active = index === event.detail.tab;
- });
- }
- event.stopPropagation();
- }
- onClick() {
- this.emitActiveTab();
- }
- keyDownHandler(e) {
- switch (e.key) {
- case " ":
- case "Enter":
- this.emitActiveTab();
- e.preventDefault();
- break;
- case "ArrowRight":
- if (getElementDir(this.el) === "ltr") {
- this.calciteTabsFocusNext.emit();
- }
- else {
- this.calciteTabsFocusPrevious.emit();
- }
- break;
- case "ArrowLeft":
- if (getElementDir(this.el) === "ltr") {
- this.calciteTabsFocusPrevious.emit();
- }
- else {
- this.calciteTabsFocusNext.emit();
- }
- break;
- }
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /**
- * Return the index of this title within the nav
- */
- async getTabIndex() {
- return Array.prototype.indexOf.call(this.el.parentElement.querySelectorAll("calcite-tab-title"), this.el);
- }
- /**
- * @internal
- */
- async getTabIdentifier() {
- return this.tab ? this.tab : this.getTabIndex();
- }
- /**
- * @internal
- */
- async updateAriaInfo(tabIds = [], titleIds = []) {
- this.controls = tabIds[titleIds.indexOf(this.el.id)] || null;
- }
- updateHasText() {
- this.hasText = this.el.textContent.trim().length > 0;
- }
- setupTextContentObserver() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });
- }
- emitActiveTab(userTriggered = true) {
- if (this.disabled) {
- return;
- }
- const payload = { tab: this.tab };
- this.calciteInternalTabsActivate.emit(payload);
- if (userTriggered) {
- this.calciteTabsActivate.emit(payload);
- }
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "active": ["activeTabChanged"]
- }; }
- static get style() { return tabTitleCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-tab-title",
- "$members$": {
- "active": [1540],
- "disabled": [516],
- "iconEnd": [513, "icon-end"],
- "iconFlipRtl": [513, "icon-flip-rtl"],
- "iconStart": [513, "icon-start"],
- "layout": [1537],
- "position": [1537],
- "scale": [1537],
- "bordered": [1540],
- "tab": [513],
- "controls": [32],
- "hasText": [32],
- "getTabIndex": [64],
- "getTabIdentifier": [64],
- "updateAriaInfo": [64]
- },
- "$listeners$": [[16, "calciteInternalTabChange", "internalTabChangeHandler"], [0, "click", "onClick"], [0, "keydown", "keyDownHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["active", "active"], ["disabled", "disabled"], ["iconEnd", "icon-end"], ["iconFlipRtl", "icon-flip-rtl"], ["iconStart", "icon-start"], ["layout", "layout"], ["position", "position"], ["scale", "scale"], ["bordered", "bordered"], ["tab", "tab"]]
- }; }
- }
- const SLOTS$4 = {
- tabNav: "tab-nav"
- };
- const tabsCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-tabs:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-tabs{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-tabs{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-tabs{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-tabs{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-tabs{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-tabs:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-tabs-h{display:none}/*!@:host*/.sc-calcite-tabs-h{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}/*!@:host([bordered])*/[bordered].sc-calcite-tabs-h{-webkit-box-shadow:inset 0 1px 0 var(--calcite-ui-border-1);box-shadow:inset 0 1px 0 var(--calcite-ui-border-1);background-color:var(--calcite-ui-foreground-1)}/*!@:host([bordered]:not([position=below])) ::slotted(calcite-tab-nav)*/.sc-calcite-tabs-h[bordered]:not([position=below]) .sc-calcite-tabs-s>calcite-tab-nav{margin-bottom:-1px}/*!@:host([bordered][position=below]) ::slotted(calcite-tab-nav)*/.sc-calcite-tabs-h[bordered][position=below] .sc-calcite-tabs-s>calcite-tab-nav{margin-top:-1px}/*!@:host([bordered][position=below])*/[bordered][position=below].sc-calcite-tabs-h{-webkit-box-shadow:inset 0 1px 0 var(--calcite-ui-border-1), inset 0 -1px 0 var(--calcite-ui-border-1);box-shadow:inset 0 1px 0 var(--calcite-ui-border-1), inset 0 -1px 0 var(--calcite-ui-border-1)}/*!@:host([bordered]) section*/[bordered].sc-calcite-tabs-h section.sc-calcite-tabs{border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-1)}/*!@:host([bordered][scale=s]) section*/[bordered][scale=s].sc-calcite-tabs-h section.sc-calcite-tabs{padding:0.75rem}/*!@:host([bordered][scale=m]) section*/[bordered][scale=m].sc-calcite-tabs-h section.sc-calcite-tabs{padding:0.5rem}/*!@:host([bordered][scale=l]) section*/[bordered][scale=l].sc-calcite-tabs-h section.sc-calcite-tabs{padding:1rem}/*!@:host([position=below])*/[position=below].sc-calcite-tabs-h{-ms-flex-direction:column-reverse;flex-direction:column-reverse}/*!@section*/section.sc-calcite-tabs{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;overflow:hidden;border-top-width:1px;border-top-color:var(--calcite-ui-border-1);border-top-style:solid}/*!@:host([position=below]) section*/[position=below].sc-calcite-tabs-h section.sc-calcite-tabs{-ms-flex-direction:column-reverse;flex-direction:column-reverse;border-top-width:0px;border-bottom-width:1px;border-bottom-color:var(--calcite-ui-border-1)}/*!@:host([position=below]:not([bordered])) section*/[position=below].sc-calcite-tabs-h:not([bordered]) section.sc-calcite-tabs{border-bottom-style:solid}";
- /**
- * @slot - A slot for adding `calcite-tab`s.
- * @slot tab-nav - A slot for adding a tab navigation component.
- */
- class Tabs {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- //--------------------------------------------------------------------------
- //
- // Public Properties
- //
- //--------------------------------------------------------------------------
- /**
- * Align tab titles to the edge or fully justify them across the tab nav ("center")
- */
- this.layout = "inline";
- /**
- * Display the tabs above (default) or below the tab content
- */
- this.position = "above";
- /**
- * Specify the scale of the tabs component, defaults to m
- */
- this.scale = "m";
- /**
- * Optionally enable tabs to appear like a folder-style menu when its layout is "inline"
- */
- this.bordered = false;
- //--------------------------------------------------------------------------
- //
- // Events
- //
- //--------------------------------------------------------------------------
- //--------------------------------------------------------------------------
- //
- // Private State/Props
- //
- //--------------------------------------------------------------------------
- /**
- *
- * Stores an array of ids of `<calcite-tab-titles>`s to match up ARIA
- * attributes.
- */
- this.titles = [];
- /**
- *
- * Stores an array of ids of `<calcite-tab>`s to match up ARIA attributes.
- */
- this.tabs = [];
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- if (this.layout === "center") {
- this.bordered = false;
- }
- }
- render() {
- return (hAsync(Fragment, null, hAsync("slot", { name: SLOTS$4.tabNav }), hAsync("section", null, hAsync("slot", null))));
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- /**
- * @internal
- */
- calciteTabTitleRegister(e) {
- this.titles = [...this.titles, e.target];
- this.registryHandler();
- e.stopPropagation();
- }
- /**
- * @internal
- */
- calciteTabTitleUnregister(e) {
- this.titles = this.titles.filter((el) => el !== e.detail);
- this.registryHandler();
- e.stopPropagation();
- }
- /**
- * @internal
- */
- calciteTabRegister(e) {
- this.tabs = [...this.tabs, e.target];
- this.registryHandler();
- e.stopPropagation();
- }
- /**
- * @internal
- */
- calciteTabUnregister(e) {
- this.tabs = this.tabs.filter((el) => el !== e.detail);
- this.registryHandler();
- e.stopPropagation();
- }
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- /**
- *
- * Matches up elements from the internal `tabs` and `titles` to automatically
- * update the ARIA attributes and link `<calcite-tab>` and
- * `<calcite-tab-title>` components.
- */
- async registryHandler() {
- let tabIds;
- let titleIds;
- // determine if we are using `tab` based or `index` based tab identifiers.
- if (this.tabs.some((e) => e.tab) || this.titles.some((e) => e.tab)) {
- // if we are using `tab` based identifiers sort by `tab` to account for
- // possible out of order tabs and get the id of each tab
- tabIds = this.tabs.sort((a, b) => a.tab.localeCompare(b.tab)).map((e) => e.id);
- titleIds = this.titles.sort((a, b) => a.tab.localeCompare(b.tab)).map((e) => e.id);
- }
- else {
- // if we are using index based tabs then the `<calcite-tab>` and
- // `<calcite-tab-title>` might have been rendered out of order so the
- // order of `this.tabs` and `this.titles` might not reflect the DOM state,
- // and might not match each other so we need to get the index of all the
- // tabs and titles in the DOM order to match them up as a source of truth
- const tabDomIndexes = await Promise.all(this.tabs.map((el) => el.getTabIndex()));
- const titleDomIndexes = await Promise.all(this.titles.map((el) => el.getTabIndex()));
- // once we have the DOM order as a source of truth we can build the
- // matching tabIds and titleIds arrays
- tabIds = tabDomIndexes.reduce((ids, indexInDOM, registryIndex) => {
- ids[indexInDOM] = this.tabs[registryIndex].id;
- return ids;
- }, []);
- titleIds = titleDomIndexes.reduce((ids, indexInDOM, registryIndex) => {
- ids[indexInDOM] = this.titles[registryIndex].id;
- return ids;
- }, []);
- }
- // pass all our new aria information to each `<calcite-tab>` and
- // `<calcite-tab-title>` which will check if they can update their internal
- // `controlled` or `labeledBy` states and re-render if necessary
- this.tabs.forEach((el) => el.updateAriaInfo(tabIds, titleIds));
- this.titles.forEach((el) => el.updateAriaInfo(tabIds, titleIds));
- }
- get el() { return getElement(this); }
- static get style() { return tabsCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-tabs",
- "$members$": {
- "layout": [513],
- "position": [513],
- "scale": [513],
- "bordered": [1540],
- "titles": [32],
- "tabs": [32]
- },
- "$listeners$": [[0, "calciteTabTitleRegister", "calciteTabTitleRegister"], [16, "calciteTabTitleUnregister", "calciteTabTitleUnregister"], [0, "calciteTabRegister", "calciteTabRegister"], [16, "calciteTabUnregister", "calciteTabUnregister"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["layout", "layout"], ["position", "position"], ["scale", "scale"], ["bordered", "bordered"]]
- }; }
- }
- const SLOTS$3 = {
- contentStart: "content-start",
- contentEnd: "content-end"
- };
- const tileCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-tile:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-tile{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-tile{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-tile{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-tile{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-tile{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-tile:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-tile-h{display:none}/*!@:host*/.sc-calcite-tile-h{-webkit-box-sizing:border-box;box-sizing:border-box;display:inline-block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-3);-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}/*!@:host .container*/.sc-calcite-tile-h .container.sc-calcite-tile{pointer-events:none;display:grid;grid-template-columns:repeat(1, minmax(0, 1fr));gap:0.5rem}/*!@:host .content*/.sc-calcite-tile-h .content.sc-calcite-tile{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;gap:0.5rem;width:10%}/*!@:host .content-container*/.sc-calcite-tile-h .content-container.sc-calcite-tile{display:-ms-flexbox;display:flex;width:100%;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-align:stretch;align-items:stretch;padding:0px;color:var(--calcite-ui-text-2);outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@:host .content-slot-container*/.sc-calcite-tile-h .content-slot-container.sc-calcite-tile{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;background-color:var(--calcite-ui-foreground-1)}/*!@:host .content-slot-container:first-child*/.sc-calcite-tile-h .content-slot-container.sc-calcite-tile:first-child{padding-inline:0 0.75rem}/*!@:host .content-slot-container:last-child*/.sc-calcite-tile-h .content-slot-container.sc-calcite-tile:last-child{padding-inline:0.75rem 0}/*!@:host .heading*/.sc-calcite-tile-h .heading.sc-calcite-tile{pointer-events:none;overflow-wrap:break-word;font-size:var(--calcite-font-size--1);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-2);-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}/*!@:host .large-visual*/.sc-calcite-tile-h .large-visual.sc-calcite-tile{-ms-flex-align:center;align-items:center;text-align:center;min-height:12rem}/*!@:host .large-visual .icon*/.sc-calcite-tile-h .large-visual.sc-calcite-tile .icon.sc-calcite-tile{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-item-align:end;align-self:flex-end}/*!@:host .large-visual .content-container*/.sc-calcite-tile-h .large-visual.sc-calcite-tile .content-container.sc-calcite-tile{-ms-flex-item-align:center;align-self:center}/*!@:host .description*/.sc-calcite-tile-h .description.sc-calcite-tile{pointer-events:none;overflow-wrap:break-word;font-size:var(--calcite-font-size--2);line-height:1.375;color:var(--calcite-ui-text-3);-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}/*!@:host(:not([embed]))*/.sc-calcite-tile-h:not([embed]){padding:0.75rem;-webkit-box-shadow:0 0 0 1px var(--calcite-ui-border-2);box-shadow:0 0 0 1px var(--calcite-ui-border-2)}/*!@:host(:not([embed])[href]:hover)*/.sc-calcite-tile-h:not([embed])[href]:hover{cursor:pointer;-webkit-box-shadow:0 0 0 2px var(--calcite-ui-brand);box-shadow:0 0 0 2px var(--calcite-ui-brand)}/*!@:host(:not([embed])[href]:active)*/.sc-calcite-tile-h:not([embed])[href]:active{-webkit-box-shadow:0 0 0 3px var(--calcite-ui-brand);box-shadow:0 0 0 3px var(--calcite-ui-brand)}/*!@:host([icon][heading]:not([description]):not([embed]))*/[icon][heading].sc-calcite-tile-h:not([description]):not([embed]){padding:0px}/*!@:host([icon][heading]:not([description])) .icon*/[icon][heading].sc-calcite-tile-h:not([description]) .icon.sc-calcite-tile{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}/*!@:host([icon][heading]:not([description])) .large-visual*/[icon][heading].sc-calcite-tile-h:not([description]) .large-visual.sc-calcite-tile{text-align:center}/*!@:host([disabled])*/[disabled].sc-calcite-tile-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-tile-h[disabled] .sc-calcite-tile-s>[calcite-hydrated][disabled],[disabled].sc-calcite-tile-h [calcite-hydrated][disabled].sc-calcite-tile{opacity:1}/*!@:host(:hover) .heading, :host([active]) .heading*/.sc-calcite-tile-h:hover .heading.sc-calcite-tile,[active].sc-calcite-tile-h .heading.sc-calcite-tile{color:var(--calcite-ui-text-1)}/*!@:host(:hover) .description, :host([active]) .description*/.sc-calcite-tile-h:hover .description.sc-calcite-tile,[active].sc-calcite-tile-h .description.sc-calcite-tile{color:var(--calcite-ui-text-2)}";
- /**
- * @slot content-start - A slot for adding non-actionable elements before the tile content.
- * @slot content-end - A slot for adding non-actionable elements after the tile content.
- */
- class Tile {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** The active state of the tile. */
- this.active = false;
- /**
- * When true, prevents interaction.
- */
- this.disabled = false;
- /** The embed mode of the tile. When true, renders without a border and padding for use by other components. */
- this.embed = false;
- /**
- * The focused state of the tile.
- * @internal
- */
- this.focused = false;
- /** The hidden state of the tile. */
- this.hidden = false;
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- disconnectConditionalSlotComponent(this);
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- renderTile() {
- const { icon, el, heading, description } = this;
- const isLargeVisual = heading && icon && !description;
- const iconStyle = isLargeVisual
- ? {
- height: "64px",
- width: "64px"
- }
- : undefined;
- return (hAsync("div", { class: { container: true, "large-visual": isLargeVisual } }, icon && (hAsync("div", { class: "icon" }, hAsync("calcite-icon", { icon: icon, scale: "l", style: iconStyle }))), hAsync("div", { class: "content-container" }, getSlotted(el, SLOTS$3.contentStart) ? (hAsync("div", { class: "content-slot-container" }, hAsync("slot", { name: SLOTS$3.contentStart }))) : null, hAsync("div", { class: "content" }, heading && hAsync("div", { class: "heading" }, heading), description && hAsync("div", { class: "description" }, description)), getSlotted(el, SLOTS$3.contentEnd) ? (hAsync("div", { class: "content-slot-container" }, hAsync("slot", { name: SLOTS$3.contentEnd }))) : null)));
- }
- render() {
- return (hAsync(Fragment, null, this.href ? (hAsync("calcite-link", { disabled: this.disabled, href: this.href }, this.renderTile())) : (this.renderTile())));
- }
- get el() { return getElement(this); }
- static get style() { return tileCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-tile",
- "$members$": {
- "active": [516],
- "description": [513],
- "disabled": [516],
- "embed": [516],
- "focused": [516],
- "heading": [513],
- "hidden": [516],
- "href": [513],
- "icon": [513]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["active", "active"], ["description", "description"], ["disabled", "disabled"], ["embed", "embed"], ["focused", "focused"], ["heading", "heading"], ["hidden", "hidden"], ["href", "href"], ["icon", "icon"]]
- }; }
- }
- const CSS$6 = {
- checked: "checked",
- description: "description",
- descriptionOnly: "description-only",
- disabled: "disabled",
- heading: "heading",
- headingOnly: "heading-only",
- icon: "icon",
- iconOnly: "icon-only",
- inputAlignmentEnd: "input-alignment-end",
- inputAlignmentStart: "input-alignment-start",
- inputEnabled: "input-enabled",
- largeVisual: "large-visual",
- widthAuto: "width-auto",
- widthFull: "width-full"
- };
- const tileSelectCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-tile-select:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-tile-select{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-tile-select{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-tile-select{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-tile-select{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-tile-select{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-tile-select:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-tile-select-h{display:none}/*!@:host*/.sc-calcite-tile-select-h{display:block}/*!@:host .container*/.sc-calcite-tile-select-h .container.sc-calcite-tile-select{background-color:var(--calcite-ui-foreground-1);-webkit-box-shadow:0 0 0 1px var(--calcite-ui-border-2);box-shadow:0 0 0 1px var(--calcite-ui-border-2);-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;display:inline-block;height:100%;max-width:300px;padding:0.75rem;position:relative;-webkit-transition:var(--calcite-animation-timing);transition:var(--calcite-animation-timing);vertical-align:top;z-index:10}/*!@:host .container.checked*/.sc-calcite-tile-select-h .container.checked.sc-calcite-tile-select{z-index:30;-webkit-box-shadow:0 0 0 1px var(--calcite-ui-brand);box-shadow:0 0 0 1px var(--calcite-ui-brand)}/*!@:host .container.heading-only*/.sc-calcite-tile-select-h .container.heading-only.sc-calcite-tile-select{-ms-flex-align:center;align-items:center}/*!@:host .container:not(.input-enabled) ::slotted(calcite-checkbox), :host .container:not(.input-enabled) ::slotted(calcite-radio-button)*/.sc-calcite-tile-select-h .container:not(.input-enabled) .sc-calcite-tile-select-s>calcite-checkbox,.sc-calcite-tile-select-h .container:not(.input-enabled) .sc-calcite-tile-select-s>calcite-radio-button{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}/*!@:host .container.focused:not(.disabled)*/.sc-calcite-tile-select-h .container.focused.sc-calcite-tile-select:not(.disabled){z-index:30}/*!@:host .container.focused:not(.disabled):not(.input-enabled)*/.sc-calcite-tile-select-h .container.focused.sc-calcite-tile-select:not(.disabled):not(.input-enabled){-webkit-box-shadow:0 0 0 1px var(--calcite-ui-brand), inset 0 0 0 2px var(--calcite-ui-foreground-1), inset 0 0 0 5px var(--calcite-ui-brand);box-shadow:0 0 0 1px var(--calcite-ui-brand), inset 0 0 0 2px var(--calcite-ui-foreground-1), inset 0 0 0 5px var(--calcite-ui-brand)}/*!@:host .container.input-enabled.input-alignment-start.width-auto.heading-only, :host .container.input-enabled.input-alignment-start.width-auto.icon-only, :host .container.input-enabled.input-alignment-start.width-auto.description-only, :host .container.input-enabled.input-alignment-start.width-auto.heading.description, :host .container.input-enabled.input-alignment-start.width-auto.icon.description, :host .container.input-enabled.input-alignment-start.width-auto.heading.icon.description*/.sc-calcite-tile-select-h .container.input-enabled.input-alignment-start.width-auto.heading-only.sc-calcite-tile-select,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-start.width-auto.icon-only.sc-calcite-tile-select,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-start.width-auto.description-only.sc-calcite-tile-select,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-start.width-auto.heading.description.sc-calcite-tile-select,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-start.width-auto.icon.description.sc-calcite-tile-select,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-start.width-auto.heading.icon.description.sc-calcite-tile-select{display:inline-grid;grid-template-columns:-webkit-max-content 1fr;grid-template-columns:max-content 1fr}/*!@:host .container.input-enabled.input-alignment-start.heading-only, :host .container.input-enabled.input-alignment-start.icon-only, :host .container.input-enabled.input-alignment-start.description-only, :host .container.input-enabled.input-alignment-start.heading.description, :host .container.input-enabled.input-alignment-start.icon.description, :host .container.input-enabled.input-alignment-start.heading.icon.description*/.sc-calcite-tile-select-h .container.input-enabled.input-alignment-start.heading-only.sc-calcite-tile-select,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-start.icon-only.sc-calcite-tile-select,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-start.description-only.sc-calcite-tile-select,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-start.heading.description.sc-calcite-tile-select,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-start.icon.description.sc-calcite-tile-select,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-start.heading.icon.description.sc-calcite-tile-select{gap:0.75rem}/*!@:host .container.input-enabled.input-alignment-start calcite-tile*/.sc-calcite-tile-select-h .container.input-enabled.input-alignment-start.sc-calcite-tile-select calcite-tile.sc-calcite-tile-select{-ms-flex-order:1;order:1}/*!@:host .container.input-enabled.input-alignment-start.large-visual ::slotted(calcite-checkbox),\n:host .container.input-enabled.input-alignment-start.large-visual ::slotted(calcite-radio-button)*/.sc-calcite-tile-select-h .container.input-enabled.input-alignment-start.large-visual .sc-calcite-tile-select-s>calcite-checkbox,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-start.large-visual .sc-calcite-tile-select-s>calcite-radio-button{position:absolute;inset-block-start:0.75rem;inset-inline-start:0.75rem}/*!@:host .container.input-enabled.input-alignment-end.width-auto.heading-only, :host .container.input-enabled.input-alignment-end.width-auto.icon-only*/.sc-calcite-tile-select-h .container.input-enabled.input-alignment-end.width-auto.heading-only.sc-calcite-tile-select,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-end.width-auto.icon-only.sc-calcite-tile-select{display:inline-grid;grid-gap:0.75rem;grid-template-columns:-webkit-max-content 1fr;grid-template-columns:max-content 1fr}/*!@:host .container.input-enabled.input-alignment-end.heading-only, :host .container.input-enabled.input-alignment-end.icon-only*/.sc-calcite-tile-select-h .container.input-enabled.input-alignment-end.heading-only.sc-calcite-tile-select,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-end.icon-only.sc-calcite-tile-select{gap:0.75rem}/*!@:host .container.input-enabled.input-alignment-end.description-only ::slotted(calcite-checkbox),\n:host .container.input-enabled.input-alignment-end.description-only ::slotted(calcite-radio-button), :host .container.input-enabled.input-alignment-end.heading.description ::slotted(calcite-checkbox),\n:host .container.input-enabled.input-alignment-end.heading.description ::slotted(calcite-radio-button), :host .container.input-enabled.input-alignment-end.icon.description ::slotted(calcite-checkbox),\n:host .container.input-enabled.input-alignment-end.icon.description ::slotted(calcite-radio-button), :host .container.input-enabled.input-alignment-end.heading.icon.description ::slotted(calcite-checkbox),\n:host .container.input-enabled.input-alignment-end.heading.icon.description ::slotted(calcite-radio-button)*/.sc-calcite-tile-select-h .container.input-enabled.input-alignment-end.description-only .sc-calcite-tile-select-s>calcite-checkbox,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-end.description-only .sc-calcite-tile-select-s>calcite-radio-button,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-end.heading.description .sc-calcite-tile-select-s>calcite-checkbox,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-end.heading.description .sc-calcite-tile-select-s>calcite-radio-button,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-end.icon.description .sc-calcite-tile-select-s>calcite-checkbox,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-end.icon.description .sc-calcite-tile-select-s>calcite-radio-button,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-end.heading.icon.description .sc-calcite-tile-select-s>calcite-checkbox,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-end.heading.icon.description .sc-calcite-tile-select-s>calcite-radio-button{position:absolute;inset-block-start:0.75rem;inset-inline-end:0.75rem}/*!@:host .container.input-enabled.input-alignment-end.large-visual ::slotted(calcite-checkbox),\n:host .container.input-enabled.input-alignment-end.large-visual ::slotted(calcite-radio-button)*/.sc-calcite-tile-select-h .container.input-enabled.input-alignment-end.large-visual .sc-calcite-tile-select-s>calcite-checkbox,.sc-calcite-tile-select-h .container.input-enabled.input-alignment-end.large-visual .sc-calcite-tile-select-s>calcite-radio-button{position:absolute;inset-block-start:0.75rem;inset-inline-end:0.75rem}/*!@:host .container.width-full*/.sc-calcite-tile-select-h .container.width-full.sc-calcite-tile-select{display:-ms-flexbox;display:flex;max-width:none}/*!@:host .container.width-full calcite-tile*/.sc-calcite-tile-select-h .container.width-full.sc-calcite-tile-select calcite-tile.sc-calcite-tile-select{-ms-flex:1 1 auto;flex:1 1 auto}/*!@:host(:hover) .container*/.sc-calcite-tile-select-h:hover .container.sc-calcite-tile-select{z-index:20}/*!@:host(:hover) .container:not(.input-enabled)*/.sc-calcite-tile-select-h:hover .container.sc-calcite-tile-select:not(.input-enabled){-webkit-box-shadow:0 0 0 1px var(--calcite-ui-brand);box-shadow:0 0 0 1px var(--calcite-ui-brand)}/*!@:host([disabled])*/[disabled].sc-calcite-tile-select-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-tile-select-h[disabled] .sc-calcite-tile-select-s>[calcite-hydrated][disabled],[disabled].sc-calcite-tile-select-h [calcite-hydrated][disabled].sc-calcite-tile-select{opacity:1}";
- /**
- * @slot - A slot for adding custom content.
- */
- class TileSelect {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteTileSelectChange = createEvent(this, "calciteTileSelectChange", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** The checked state of the tile select. */
- this.checked = false;
- /** The disabled state of the tile select. */
- this.disabled = false;
- /** The hidden state of the tile select. */
- this.hidden = false;
- /** Display an interactive radio or checkbox. */
- this.inputEnabled = false;
- /** The side of the tile that the radio or checkbox appears on when inputEnabled is true. */
- this.inputAlignment = "start";
- /** The selection mode of the tile select: radio (single) or checkbox (multiple). */
- this.type = "radio";
- /** specify the width of the tile, defaults to auto */
- this.width = "auto";
- this.guid = `calcite-tile-select-${guid()}`;
- //--------------------------------------------------------------------------
- //
- // State
- //
- //--------------------------------------------------------------------------
- /** The focused state of the tile-select. */
- this.focused = false;
- }
- checkedChanged(newChecked) {
- this.input.checked = newChecked;
- }
- nameChanged(newName) {
- this.input.name = newName;
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus() {
- this.input.setFocus();
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- checkboxChangeHandler(event) {
- const checkbox = event.target;
- if (checkbox === this.input) {
- this.checked = checkbox.checked;
- }
- event.stopPropagation();
- this.calciteTileSelectChange.emit();
- }
- checkboxFocusBlurHandler(event) {
- const checkbox = event.target;
- if (checkbox === this.input) {
- this.focused = event.detail;
- }
- event.stopPropagation();
- }
- radioButtonChangeHandler(event) {
- const radioButton = event.target;
- if (radioButton === this.input) {
- this.checked = radioButton.checked;
- }
- event.stopPropagation();
- this.calciteTileSelectChange.emit();
- }
- radioButtonCheckedChangeHandler(event) {
- const radioButton = event.target;
- if (radioButton === this.input) {
- this.checked = radioButton.checked;
- }
- event.stopPropagation();
- }
- radioButtonFocusBlurHandler(event) {
- const radioButton = event.target;
- if (radioButton === this.input) {
- this.focused = radioButton.focused;
- }
- event.stopPropagation();
- }
- click(event) {
- const target = event.target;
- const targets = ["calcite-tile", "calcite-tile-select"];
- if (targets.includes(target.localName)) {
- this.input.click();
- }
- }
- mouseenter() {
- if (this.input.localName === "calcite-radio-button") {
- this.input.hovered = true;
- }
- if (this.input.localName === "calcite-checkbox") {
- this.input.hovered = true;
- }
- }
- mouseleave() {
- if (this.input.localName === "calcite-radio-button") {
- this.input.hovered = false;
- }
- if (this.input.localName === "calcite-checkbox") {
- this.input.hovered = false;
- }
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- this.renderInput();
- }
- disconnectedCallback() {
- this.input.parentNode.removeChild(this.input);
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- renderInput() {
- this.input = document.createElement(this.type === "radio" ? "calcite-radio-button" : "calcite-checkbox");
- this.input.checked = this.checked;
- this.input.disabled = this.disabled;
- this.input.hidden = this.hidden;
- this.input.id = this.guid;
- this.input.label = this.heading || this.name || "";
- if (this.name) {
- this.input.name = this.name;
- }
- if (this.value) {
- this.input.value = this.value != null ? this.value.toString() : "";
- }
- this.el.insertAdjacentElement("beforeend", this.input);
- }
- render() {
- const { checked, description, disabled, focused, heading, icon, inputAlignment, inputEnabled, width } = this;
- return (hAsync("div", { class: {
- checked,
- container: true,
- [CSS$6.description]: Boolean(description),
- [CSS$6.descriptionOnly]: Boolean(!heading && !icon && description),
- disabled,
- focused,
- [CSS$6.heading]: Boolean(heading),
- [CSS$6.headingOnly]: heading && !icon && !description,
- [CSS$6.icon]: Boolean(icon),
- [CSS$6.iconOnly]: !heading && icon && !description,
- [CSS$6.inputAlignmentEnd]: inputAlignment === "end",
- [CSS$6.inputAlignmentStart]: inputAlignment === "start",
- [CSS$6.inputEnabled]: inputEnabled,
- [CSS$6.largeVisual]: heading && icon && !description,
- [CSS$6.widthAuto]: width === "auto",
- [CSS$6.widthFull]: width === "full"
- } }, hAsync("calcite-tile", { active: checked, description: description, embed: true, heading: heading, icon: icon }), hAsync("slot", null)));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "checked": ["checkedChanged"],
- "name": ["nameChanged"]
- }; }
- static get style() { return tileSelectCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-tile-select",
- "$members$": {
- "checked": [1540],
- "description": [513],
- "disabled": [516],
- "heading": [513],
- "hidden": [516],
- "icon": [513],
- "name": [520],
- "inputEnabled": [516, "input-enabled"],
- "inputAlignment": [513, "input-alignment"],
- "type": [513],
- "value": [8],
- "width": [513],
- "focused": [32],
- "setFocus": [64]
- },
- "$listeners$": [[0, "calciteCheckboxChange", "checkboxChangeHandler"], [0, "calciteInternalCheckboxFocus", "checkboxFocusBlurHandler"], [0, "calciteInternalCheckboxBlur", "checkboxFocusBlurHandler"], [0, "calciteRadioButtonChange", "radioButtonChangeHandler"], [0, "calciteInternalRadioButtonCheckedChange", "radioButtonCheckedChangeHandler"], [0, "calciteInternalRadioButtonFocus", "radioButtonFocusBlurHandler"], [0, "calciteInternalRadioButtonBlur", "radioButtonFocusBlurHandler"], [0, "click", "click"], [1, "mouseenter", "mouseenter"], [1, "mouseleave", "mouseleave"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["checked", "checked"], ["description", "description"], ["disabled", "disabled"], ["heading", "heading"], ["hidden", "hidden"], ["icon", "icon"], ["name", "name"], ["inputEnabled", "input-enabled"], ["inputAlignment", "input-alignment"], ["type", "type"], ["width", "width"]]
- }; }
- }
- const tileSelectGroupCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-tile-select-group:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-tile-select-group{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-tile-select-group{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-tile-select-group{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-tile-select-group{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-tile-select-group{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-tile-select-group:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-tile-select-group-h{display:none}/*!@:host*/.sc-calcite-tile-select-group-h{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}/*!@:host ::slotted(calcite-tile-select)*/.sc-calcite-tile-select-group-h .sc-calcite-tile-select-group-s>calcite-tile-select{margin-right:1px;margin-bottom:1px}/*!@:host([layout=vertical])*/[layout=vertical].sc-calcite-tile-select-group-h{-ms-flex-direction:column;flex-direction:column}/*!@:host([disabled])*/[disabled].sc-calcite-tile-select-group-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-tile-select-group-h[disabled] .sc-calcite-tile-select-group-s>[calcite-hydrated][disabled],[disabled].sc-calcite-tile-select-group-h [calcite-hydrated][disabled].sc-calcite-tile-select-group{opacity:1}";
- /**
- * @slot - A slot for adding `calcite-tile-select`s.
- */
- class TileSelectGroup {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** The disabled state of the tile select. */
- this.disabled = false;
- /** Tiles by default move horizontally, stacking with each row, vertical allows single-column layouts */
- this.layout = "horizontal";
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentDidRender() {
- updateHostInteraction(this);
- }
- render() {
- return hAsync("slot", null);
- }
- get el() { return getElement(this); }
- static get style() { return tileSelectGroupCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-tile-select-group",
- "$members$": {
- "disabled": [516],
- "layout": [513]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"], ["layout", "layout"]]
- }; }
- }
- const CSS$5 = {
- button: "button",
- buttonBottomLeft: "button--bottom-left",
- buttonBottomRight: "button--bottom-right",
- buttonHourDown: "button--hour-down",
- buttonHourUp: "button--hour-up",
- buttonMeridiemDown: "button--meridiem-down",
- buttonMeridiemUp: "button--meridiem-up",
- buttonMinuteDown: "button--minute-down",
- buttonMinuteUp: "button--minute-up",
- buttonSecondDown: "button--second-down",
- buttonSecondUp: "button--second-up",
- buttonTopLeft: "button--top-left",
- buttonTopRight: "button--top-right",
- column: "column",
- delimiter: "delimiter",
- hour: "hour",
- input: "input",
- meridiem: "meridiem",
- minute: "minute",
- second: "second",
- showMeridiem: "show-meridiem",
- showSecond: "show-second",
- "scale-s": "scale-s",
- "scale-m": "scale-m",
- "scale-l": "scale-l",
- timePicker: "time-picker",
- meridiemStart: "meridiem--start"
- };
- const TEXT$2 = {
- hour: "Hour",
- hourDown: "Decrease hour",
- hourUp: "Increase hour",
- meridiem: "AM/PM",
- meridiemDown: "Decrease AM/PM",
- meridiemUp: "Increase AM/PM",
- minute: "Minute",
- minuteDown: "Decrease minute",
- minuteUp: "Increase minute",
- second: "Second",
- secondDown: "Decrease second",
- secondUp: "Increase second"
- };
- const timePickerCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-time-picker:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-time-picker{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-time-picker{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-time-picker{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-time-picker{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-time-picker{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-time-picker:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-time-picker-h{display:none}/*!@:host*/.sc-calcite-time-picker-h{display:inline-block}/*!@.time-picker*/.time-picker.sc-calcite-time-picker{display:-ms-flexbox;display:flex;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-ms-flex-align:center;align-items:center;background-color:var(--calcite-ui-foreground-1);font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1);--tw-shadow:0 6px 20px -4px rgba(0, 0, 0, 0.1), 0 4px 12px -2px rgba(0, 0, 0, 0.08);--tw-shadow-colored:0 6px 20px -4px var(--tw-shadow-color), 0 4px 12px -2px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);border-radius:var(--calcite-border-radius)}/*!@.time-picker .column*/.time-picker.sc-calcite-time-picker .column.sc-calcite-time-picker{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}/*!@.time-picker .meridiem--start*/.time-picker.sc-calcite-time-picker .meridiem--start.sc-calcite-time-picker{-ms-flex-order:-1;order:-1}/*!@.time-picker .button*/.time-picker.sc-calcite-time-picker .button.sc-calcite-time-picker{display:-ms-inline-flexbox;display:inline-flex;cursor:pointer;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background-color:var(--calcite-ui-foreground-1)}/*!@.time-picker .button:hover, .time-picker .button:focus*/.time-picker.sc-calcite-time-picker .button.sc-calcite-time-picker:hover,.time-picker.sc-calcite-time-picker .button.sc-calcite-time-picker:focus{background-color:var(--calcite-ui-foreground-2);outline:2px solid transparent;outline-offset:2px}/*!@.time-picker .button:active*/.time-picker.sc-calcite-time-picker .button.sc-calcite-time-picker:active{background-color:var(--calcite-ui-foreground-3)}/*!@.time-picker .button.top-left*/.time-picker.sc-calcite-time-picker .button.top-left.sc-calcite-time-picker{border-top-left-radius:var(--calcite-border-radius)}/*!@.time-picker .button.bottom-left*/.time-picker.sc-calcite-time-picker .button.bottom-left.sc-calcite-time-picker{border-bottom-left-radius:var(--calcite-border-radius)}/*!@.time-picker .button.top-right*/.time-picker.sc-calcite-time-picker .button.top-right.sc-calcite-time-picker{border-top-right-radius:var(--calcite-border-radius)}/*!@.time-picker .button.bottom-right*/.time-picker.sc-calcite-time-picker .button.bottom-right.sc-calcite-time-picker{border-bottom-right-radius:var(--calcite-border-radius)}/*!@.time-picker .button calcite-icon*/.time-picker.sc-calcite-time-picker .button.sc-calcite-time-picker calcite-icon.sc-calcite-time-picker{color:var(--calcite-ui-text-3)}/*!@.time-picker .input*/.time-picker.sc-calcite-time-picker .input.sc-calcite-time-picker{display:-ms-inline-flexbox;display:inline-flex;cursor:pointer;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background-color:var(--calcite-ui-foreground-1);font-weight:var(--calcite-font-weight-medium)}/*!@.time-picker .input:hover*/.time-picker.sc-calcite-time-picker .input.sc-calcite-time-picker:hover{-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-foreground-2);box-shadow:inset 0 0 0 2px var(--calcite-ui-foreground-2)}/*!@.time-picker .input:focus, .time-picker .input:hover:focus*/.time-picker.sc-calcite-time-picker .input.sc-calcite-time-picker:focus,.time-picker.sc-calcite-time-picker .input.sc-calcite-time-picker:hover:focus{outline:2px solid transparent;outline-offset:2px;-webkit-box-shadow:inset 0 0 0 2px var(--calcite-ui-brand);box-shadow:inset 0 0 0 2px var(--calcite-ui-brand)}/*!@.time-picker.scale-s*/.time-picker.scale-s.sc-calcite-time-picker{font-size:var(--calcite-font-size--1)}/*!@.time-picker.scale-s .button, .time-picker.scale-s .input*/.time-picker.scale-s.sc-calcite-time-picker .button.sc-calcite-time-picker,.time-picker.scale-s.sc-calcite-time-picker .input.sc-calcite-time-picker{padding-left:0.75rem;padding-right:0.75rem;padding-top:0.25rem;padding-bottom:0.25rem}/*!@.time-picker.scale-s:not(.show-meridiem) .delimiter:last-child*/.time-picker.scale-s.sc-calcite-time-picker:not(.show-meridiem) .delimiter.sc-calcite-time-picker:last-child{-webkit-padding-end:0.75rem;padding-inline-end:0.75rem}/*!@.time-picker.scale-m*/.time-picker.scale-m.sc-calcite-time-picker{font-size:var(--calcite-font-size-0)}/*!@.time-picker.scale-m .button, .time-picker.scale-m .input*/.time-picker.scale-m.sc-calcite-time-picker .button.sc-calcite-time-picker,.time-picker.scale-m.sc-calcite-time-picker .input.sc-calcite-time-picker{padding-left:1rem;padding-right:1rem;padding-top:0.5rem;padding-bottom:0.5rem}/*!@.time-picker.scale-m:not(.show-meridiem) .delimiter:last-child*/.time-picker.scale-m.sc-calcite-time-picker:not(.show-meridiem) .delimiter.sc-calcite-time-picker:last-child{-webkit-padding-end:1rem;padding-inline-end:1rem}/*!@.time-picker.scale-l*/.time-picker.scale-l.sc-calcite-time-picker{font-size:var(--calcite-font-size-1)}/*!@.time-picker.scale-l .button, .time-picker.scale-l .input*/.time-picker.scale-l.sc-calcite-time-picker .button.sc-calcite-time-picker,.time-picker.scale-l.sc-calcite-time-picker .input.sc-calcite-time-picker{padding-left:1.25rem;padding-right:1.25rem;padding-top:0.75rem;padding-bottom:0.75rem}/*!@.time-picker.scale-l:not(.show-meridiem) .delimiter:last-child*/.time-picker.scale-l.sc-calcite-time-picker:not(.show-meridiem) .delimiter.sc-calcite-time-picker:last-child{-webkit-padding-end:1.25rem;padding-inline-end:1.25rem}";
- function capitalize(str) {
- return str.charAt(0).toUpperCase() + str.slice(1);
- }
- class TimePicker {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteTimePickerBlur = createEvent(this, "calciteTimePickerBlur", 7);
- this.calciteTimePickerChange = createEvent(this, "calciteTimePickerChange", 7);
- this.calciteTimePickerFocus = createEvent(this, "calciteTimePickerFocus", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** aria-label for the hour input
- * @default "Hour"
- */
- this.intlHour = TEXT$2.hour;
- /** aria-label for the hour down button
- * @default "Decrease hour"
- */
- this.intlHourDown = TEXT$2.hourDown;
- /** aria-label for the hour up button
- * @default "Increase hour"
- */
- this.intlHourUp = TEXT$2.hourUp;
- /** aria-label for the meridiem (am/pm) input
- * @default "AM/PM"
- */
- this.intlMeridiem = TEXT$2.meridiem;
- /** aria-label for the meridiem (am/pm) down button
- * @default "Decrease AM/PM"
- */
- this.intlMeridiemDown = TEXT$2.meridiemDown;
- /** aria-label for the meridiem (am/pm) up button
- * @default "Increase AM/PM"
- */
- this.intlMeridiemUp = TEXT$2.meridiemUp;
- /** aria-label for the minute input
- * @default "Minute"
- */
- this.intlMinute = TEXT$2.minute;
- /** aria-label for the minute down button
- * @default "Decrease minute"
- */
- this.intlMinuteDown = TEXT$2.minuteDown;
- /** aria-label for the minute up button
- * @default "Increase minute"
- */
- this.intlMinuteUp = TEXT$2.minuteUp;
- /** aria-label for the second input
- * @default "Second"
- */
- this.intlSecond = TEXT$2.second;
- /** aria-label for the second down button
- * @default "Decrease second"
- */
- this.intlSecondDown = TEXT$2.secondDown;
- /** aria-label for the second up button
- * @default "Increase second"
- */
- this.intlSecondUp = TEXT$2.secondUp;
- /**
- * BCP 47 language tag for desired language and country format
- * @internal
- */
- this.locale = document.documentElement.lang || navigator.language || "en";
- /** The scale (size) of the time picker */
- this.scale = "m";
- /** number (seconds) that specifies the granularity that the value must adhere to */
- this.step = 60;
- /** The selected time in UTC (always 24-hour format) */
- this.value = null;
- this.showSecond = this.step < 60;
- this.decrementHour = () => {
- const newHour = !this.hour ? 0 : this.hour === "00" ? 23 : parseInt(this.hour) - 1;
- this.setValuePart("hour", newHour);
- };
- this.decrementMeridiem = () => {
- const newMeridiem = this.meridiem === "PM" ? "AM" : "PM";
- this.setValuePart("meridiem", newMeridiem);
- };
- this.decrementMinuteOrSecond = (key) => {
- let newValue;
- if (isValidNumber(this[key])) {
- const valueAsNumber = parseInt(this[key]);
- newValue = valueAsNumber === 0 ? 59 : valueAsNumber - 1;
- }
- else {
- newValue = 59;
- }
- this.setValuePart(key, newValue);
- };
- this.decrementMinute = () => {
- this.decrementMinuteOrSecond("minute");
- };
- this.decrementSecond = () => {
- this.decrementMinuteOrSecond("second");
- };
- this.focusHandler = (event) => {
- this.activeEl = event.currentTarget;
- };
- this.hourDownButtonKeyDownHandler = (event) => {
- if (this.buttonActivated(event)) {
- this.decrementHour();
- }
- };
- this.hourKeyDownHandler = (event) => {
- const key = event.key;
- if (numberKeys.includes(key)) {
- const keyAsNumber = parseInt(key);
- let newHour;
- if (isValidNumber(this.hour)) {
- switch (this.hourCycle) {
- case "12":
- newHour =
- this.hour === "01" && keyAsNumber >= 0 && keyAsNumber <= 2
- ? `1${keyAsNumber}`
- : keyAsNumber;
- break;
- case "24":
- if (this.hour === "01") {
- newHour = `1${keyAsNumber}`;
- }
- else if (this.hour === "02" && keyAsNumber >= 0 && keyAsNumber <= 3) {
- newHour = `2${keyAsNumber}`;
- }
- else {
- newHour = keyAsNumber;
- }
- break;
- }
- }
- else {
- newHour = keyAsNumber;
- }
- this.setValuePart("hour", newHour);
- }
- else {
- switch (key) {
- case "Backspace":
- case "Delete":
- this.setValuePart("hour", null);
- break;
- case "ArrowDown":
- event.preventDefault();
- this.decrementHour();
- break;
- case "ArrowUp":
- event.preventDefault();
- this.incrementHour();
- break;
- case " ":
- case "Spacebar":
- event.preventDefault();
- break;
- }
- }
- };
- this.hourUpButtonKeyDownHandler = (event) => {
- if (this.buttonActivated(event)) {
- this.incrementHour();
- }
- };
- this.incrementMeridiem = () => {
- const newMeridiem = this.meridiem === "AM" ? "PM" : "AM";
- this.setValuePart("meridiem", newMeridiem);
- };
- this.incrementHour = () => {
- const newHour = isValidNumber(this.hour)
- ? this.hour === "23"
- ? 0
- : parseInt(this.hour) + 1
- : 1;
- this.setValuePart("hour", newHour);
- };
- this.incrementMinuteOrSecond = (key) => {
- const newValue = isValidNumber(this[key])
- ? this[key] === "59"
- ? 0
- : parseInt(this[key]) + 1
- : 0;
- this.setValuePart(key, newValue);
- };
- this.incrementMinute = () => {
- this.incrementMinuteOrSecond("minute");
- };
- this.incrementSecond = () => {
- this.incrementMinuteOrSecond("second");
- };
- this.meridiemDownButtonKeyDownHandler = (event) => {
- if (this.buttonActivated(event)) {
- this.decrementMeridiem();
- }
- };
- this.meridiemKeyDownHandler = (event) => {
- switch (event.key) {
- case "a":
- this.setValuePart("meridiem", "AM");
- break;
- case "p":
- this.setValuePart("meridiem", "PM");
- break;
- case "Backspace":
- case "Delete":
- this.setValuePart("meridiem", null);
- break;
- case "ArrowUp":
- event.preventDefault();
- this.incrementMeridiem();
- break;
- case "ArrowDown":
- event.preventDefault();
- this.decrementMeridiem();
- break;
- case " ":
- case "Spacebar":
- event.preventDefault();
- break;
- }
- };
- this.meridiemUpButtonKeyDownHandler = (event) => {
- if (this.buttonActivated(event)) {
- this.incrementMeridiem();
- }
- };
- this.minuteDownButtonKeyDownHandler = (event) => {
- if (this.buttonActivated(event)) {
- this.decrementMinute();
- }
- };
- this.minuteKeyDownHandler = (event) => {
- const key = event.key;
- if (numberKeys.includes(key)) {
- const keyAsNumber = parseInt(key);
- let newMinute;
- if (isValidNumber(this.minute) && this.minute.startsWith("0")) {
- const minuteAsNumber = parseInt(this.minute);
- newMinute =
- minuteAsNumber > maxTenthForMinuteAndSecond
- ? keyAsNumber
- : `${minuteAsNumber}${keyAsNumber}`;
- }
- else {
- newMinute = keyAsNumber;
- }
- this.setValuePart("minute", newMinute);
- }
- else {
- switch (key) {
- case "Backspace":
- case "Delete":
- this.setValuePart("minute", null);
- break;
- case "ArrowDown":
- event.preventDefault();
- this.decrementMinute();
- break;
- case "ArrowUp":
- event.preventDefault();
- this.incrementMinute();
- break;
- case " ":
- case "Spacebar":
- event.preventDefault();
- break;
- }
- }
- };
- this.minuteUpButtonKeyDownHandler = (event) => {
- if (this.buttonActivated(event)) {
- this.incrementMinute();
- }
- };
- this.secondDownButtonKeyDownHandler = (event) => {
- if (this.buttonActivated(event)) {
- this.decrementSecond();
- }
- };
- this.secondKeyDownHandler = (event) => {
- const key = event.key;
- if (numberKeys.includes(key)) {
- const keyAsNumber = parseInt(key);
- let newSecond;
- if (isValidNumber(this.second) && this.second.startsWith("0")) {
- const secondAsNumber = parseInt(this.second);
- newSecond =
- secondAsNumber > maxTenthForMinuteAndSecond
- ? keyAsNumber
- : `${secondAsNumber}${keyAsNumber}`;
- }
- else {
- newSecond = keyAsNumber;
- }
- this.setValuePart("second", newSecond);
- }
- else {
- switch (key) {
- case "Backspace":
- case "Delete":
- this.setValuePart("second", null);
- break;
- case "ArrowDown":
- event.preventDefault();
- this.decrementSecond();
- break;
- case "ArrowUp":
- event.preventDefault();
- this.incrementSecond();
- break;
- case " ":
- case "Spacebar":
- event.preventDefault();
- break;
- }
- }
- };
- this.secondUpButtonKeyDownHandler = (event) => {
- if (this.buttonActivated(event)) {
- this.incrementSecond();
- }
- };
- this.setHourEl = (el) => (this.hourEl = el);
- this.setMeridiemEl = (el) => (this.meridiemEl = el);
- this.setMinuteEl = (el) => (this.minuteEl = el);
- this.setSecondEl = (el) => (this.secondEl = el);
- this.setValue = (value, emit = true) => {
- if (isValidTime(value)) {
- const { hour, minute, second } = parseTimeString(value);
- const { localizedHour, localizedHourSuffix, localizedMinute, localizedMinuteSuffix, localizedSecond, localizedSecondSuffix, localizedMeridiem } = localizeTimeStringToParts(value, this.locale);
- this.localizedHour = localizedHour;
- this.localizedHourSuffix = localizedHourSuffix;
- this.localizedMinute = localizedMinute;
- this.localizedMinuteSuffix = localizedMinuteSuffix;
- this.localizedSecond = localizedSecond;
- this.localizedSecondSuffix = localizedSecondSuffix;
- this.hour = hour;
- this.minute = minute;
- this.second = second;
- if (localizedMeridiem) {
- this.localizedMeridiem = localizedMeridiem;
- this.meridiem = getMeridiem(this.hour);
- const formatParts = getTimeParts(value, this.locale);
- this.meridiemOrder = this.getMeridiemOrder(formatParts);
- }
- }
- else {
- this.hour = null;
- this.localizedHour = null;
- this.localizedHourSuffix = null;
- this.localizedMeridiem = null;
- this.localizedMinute = null;
- this.localizedMinuteSuffix = null;
- this.localizedSecond = null;
- this.localizedSecondSuffix = null;
- this.meridiem = null;
- this.minute = null;
- this.second = null;
- this.value = null;
- }
- if (emit) {
- this.calciteTimePickerChange.emit();
- }
- };
- this.setValuePart = (key, value, emit = true) => {
- var _a;
- if (key === "meridiem") {
- this.meridiem = value;
- if (isValidNumber(this.hour)) {
- const hourAsNumber = parseInt(this.hour);
- switch (value) {
- case "AM":
- if (hourAsNumber >= 12) {
- this.hour = formatTimePart(hourAsNumber - 12);
- }
- break;
- case "PM":
- if (hourAsNumber < 12) {
- this.hour = formatTimePart(hourAsNumber + 12);
- }
- break;
- }
- this.localizedHour = localizeTimePart(this.hour, "hour", this.locale);
- }
- }
- else {
- this[key] = typeof value === "number" ? formatTimePart(value) : value;
- this[`localized${capitalize(key)}`] = localizeTimePart(this[key], key, this.locale);
- }
- if (this.hour && this.minute) {
- const showSeconds = this.second && this.showSecond;
- this.value = `${this.hour}:${this.minute}:${showSeconds ? this.second : "00"}`;
- }
- else {
- this.value = null;
- }
- this.localizedMeridiem = this.value
- ? ((_a = localizeTimeStringToParts(this.value, this.locale)) === null || _a === void 0 ? void 0 : _a.localizedMeridiem) || null
- : localizeTimePart(this.meridiem, "meridiem", this.locale);
- if (emit) {
- this.calciteTimePickerChange.emit();
- }
- };
- }
- localeWatcher(newLocale) {
- this.hourCycle = getLocaleHourCycle(newLocale);
- this.setValue(this.value, false);
- }
- valueWatcher(newValue) {
- this.setValue(newValue, false);
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- hostBlurHandler() {
- this.calciteTimePickerBlur.emit();
- }
- hostFocusHandler() {
- this.calciteTimePickerFocus.emit();
- }
- keyDownHandler(event) {
- const key = event.key;
- switch (this.activeEl) {
- case this.hourEl:
- if (key === "ArrowRight") {
- this.setFocus("minute");
- }
- break;
- case this.minuteEl:
- switch (key) {
- case "ArrowLeft":
- this.setFocus("hour");
- break;
- case "ArrowRight":
- if (this.step !== 60) {
- this.setFocus("second");
- }
- else if (this.hourCycle === "12") {
- this.setFocus("meridiem");
- }
- break;
- }
- break;
- case this.secondEl:
- switch (key) {
- case "ArrowLeft":
- this.setFocus("minute");
- break;
- case "ArrowRight":
- if (this.hourCycle === "12") {
- this.setFocus("meridiem");
- }
- break;
- }
- break;
- case this.meridiemEl:
- switch (key) {
- case "ArrowLeft":
- if (this.step !== 60) {
- this.setFocus("second");
- }
- else {
- this.setFocus("minute");
- }
- break;
- }
- break;
- }
- }
- //--------------------------------------------------------------------------
- //
- // Public Methods
- //
- //--------------------------------------------------------------------------
- /** Sets focus on the component. */
- async setFocus(target) {
- var _a;
- (_a = this[`${target || "hour"}El`]) === null || _a === void 0 ? void 0 : _a.focus();
- }
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- buttonActivated(event) {
- const key = event.key;
- if (key === " ") {
- event.preventDefault();
- }
- return isActivationKey(key);
- }
- getMeridiemOrder(formatParts) {
- const isRTLKind = this.locale === "ar" || this.locale === "he";
- if (formatParts && !isRTLKind) {
- const index = formatParts.findIndex((parts) => {
- return parts.value === this.localizedMeridiem;
- });
- return index;
- }
- return 0;
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- this.setValue(this.value, false);
- this.hourCycle = getLocaleHourCycle(this.locale);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- const hourIsNumber = isValidNumber(this.hour);
- const iconScale = this.scale === "s" || this.scale === "m" ? "s" : "m";
- const minuteIsNumber = isValidNumber(this.minute);
- const secondIsNumber = isValidNumber(this.second);
- const showMeridiem = this.hourCycle === "12";
- return (hAsync("div", { class: {
- [CSS$5.timePicker]: true,
- [CSS$5.showMeridiem]: showMeridiem,
- [CSS$5.showSecond]: this.showSecond,
- [CSS$5[`scale-${this.scale}`]]: true
- }, dir: "ltr" }, hAsync("div", { class: CSS$5.column, role: "group" }, hAsync("span", { "aria-label": this.intlHourUp, class: {
- [CSS$5.button]: true,
- [CSS$5.buttonHourUp]: true,
- [CSS$5.buttonTopLeft]: true
- }, onClick: this.incrementHour, onKeyDown: this.hourUpButtonKeyDownHandler, role: "button", tabIndex: -1 }, hAsync("calcite-icon", { icon: "chevron-up", scale: iconScale })), hAsync("span", { "aria-label": this.intlHour, "aria-valuemax": "23", "aria-valuemin": "1", "aria-valuenow": (hourIsNumber && parseInt(this.hour)) || "0", "aria-valuetext": this.hour, class: {
- [CSS$5.input]: true,
- [CSS$5.hour]: true
- }, onFocus: this.focusHandler, onKeyDown: this.hourKeyDownHandler, ref: this.setHourEl, role: "spinbutton", tabIndex: 0 }, this.localizedHour || "--"), hAsync("span", { "aria-label": this.intlHourDown, class: {
- [CSS$5.button]: true,
- [CSS$5.buttonHourDown]: true,
- [CSS$5.buttonBottomLeft]: true
- }, onClick: this.decrementHour, onKeyDown: this.hourDownButtonKeyDownHandler, role: "button", tabIndex: -1 }, hAsync("calcite-icon", { icon: "chevron-down", scale: iconScale }))), hAsync("span", { class: CSS$5.delimiter }, this.localizedHourSuffix), hAsync("div", { class: CSS$5.column, role: "group" }, hAsync("span", { "aria-label": this.intlMinuteUp, class: {
- [CSS$5.button]: true,
- [CSS$5.buttonMinuteUp]: true
- }, onClick: this.incrementMinute, onKeyDown: this.minuteUpButtonKeyDownHandler, role: "button", tabIndex: -1 }, hAsync("calcite-icon", { icon: "chevron-up", scale: iconScale })), hAsync("span", { "aria-label": this.intlMinute, "aria-valuemax": "12", "aria-valuemin": "1", "aria-valuenow": (minuteIsNumber && parseInt(this.minute)) || "0", "aria-valuetext": this.minute, class: {
- [CSS$5.input]: true,
- [CSS$5.minute]: true
- }, onFocus: this.focusHandler, onKeyDown: this.minuteKeyDownHandler, ref: this.setMinuteEl, role: "spinbutton", tabIndex: 0 }, this.localizedMinute || "--"), hAsync("span", { "aria-label": this.intlMinuteDown, class: {
- [CSS$5.button]: true,
- [CSS$5.buttonMinuteDown]: true
- }, onClick: this.decrementMinute, onKeyDown: this.minuteDownButtonKeyDownHandler, role: "button", tabIndex: -1 }, hAsync("calcite-icon", { icon: "chevron-down", scale: iconScale }))), this.showSecond && hAsync("span", { class: CSS$5.delimiter }, this.localizedMinuteSuffix), this.showSecond && (hAsync("div", { class: CSS$5.column, role: "group" }, hAsync("span", { "aria-label": this.intlSecondUp, class: {
- [CSS$5.button]: true,
- [CSS$5.buttonSecondUp]: true
- }, onClick: this.incrementSecond, onKeyDown: this.secondUpButtonKeyDownHandler, role: "button", tabIndex: -1 }, hAsync("calcite-icon", { icon: "chevron-up", scale: iconScale })), hAsync("span", { "aria-label": this.intlSecond, "aria-valuemax": "59", "aria-valuemin": "0", "aria-valuenow": (secondIsNumber && parseInt(this.second)) || "0", "aria-valuetext": this.second, class: {
- [CSS$5.input]: true,
- [CSS$5.second]: true
- }, onFocus: this.focusHandler, onKeyDown: this.secondKeyDownHandler, ref: this.setSecondEl, role: "spinbutton", tabIndex: 0 }, this.localizedSecond || "--"), hAsync("span", { "aria-label": this.intlSecondDown, class: {
- [CSS$5.button]: true,
- [CSS$5.buttonSecondDown]: true
- }, onClick: this.decrementSecond, onKeyDown: this.secondDownButtonKeyDownHandler, role: "button", tabIndex: -1 }, hAsync("calcite-icon", { icon: "chevron-down", scale: iconScale })))), this.localizedSecondSuffix && (hAsync("span", { class: CSS$5.delimiter }, this.localizedSecondSuffix)), showMeridiem && (hAsync("div", { class: {
- [CSS$5.column]: true,
- [CSS$5.meridiemStart]: this.meridiemOrder === 0
- }, role: "group" }, hAsync("span", { "aria-label": this.intlMeridiemUp, class: {
- [CSS$5.button]: true,
- [CSS$5.buttonMeridiemUp]: true,
- [CSS$5.buttonTopRight]: true
- }, onClick: this.incrementMeridiem, onKeyDown: this.meridiemUpButtonKeyDownHandler, role: "button", tabIndex: -1 }, hAsync("calcite-icon", { icon: "chevron-up", scale: iconScale })), hAsync("span", { "aria-label": this.intlMeridiem, "aria-valuemax": "2", "aria-valuemin": "1", "aria-valuenow": (this.meridiem === "PM" && "2") || "1", "aria-valuetext": this.meridiem, class: {
- [CSS$5.input]: true,
- [CSS$5.meridiem]: true
- }, onFocus: this.focusHandler, onKeyDown: this.meridiemKeyDownHandler, ref: this.setMeridiemEl, role: "spinbutton", tabIndex: 0 }, this.localizedMeridiem || "--"), hAsync("span", { "aria-label": this.intlMeridiemDown, class: {
- [CSS$5.button]: true,
- [CSS$5.buttonMeridiemDown]: true,
- [CSS$5.buttonBottomRight]: true
- }, onClick: this.decrementMeridiem, onKeyDown: this.meridiemDownButtonKeyDownHandler, role: "button", tabIndex: -1 }, hAsync("calcite-icon", { icon: "chevron-down", scale: iconScale }))))));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "locale": ["localeWatcher"],
- "value": ["valueWatcher"]
- }; }
- static get style() { return timePickerCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-time-picker",
- "$members$": {
- "intlHour": [1, "intl-hour"],
- "intlHourDown": [1, "intl-hour-down"],
- "intlHourUp": [1, "intl-hour-up"],
- "intlMeridiem": [1, "intl-meridiem"],
- "intlMeridiemDown": [1, "intl-meridiem-down"],
- "intlMeridiemUp": [1, "intl-meridiem-up"],
- "intlMinute": [1, "intl-minute"],
- "intlMinuteDown": [1, "intl-minute-down"],
- "intlMinuteUp": [1, "intl-minute-up"],
- "intlSecond": [1, "intl-second"],
- "intlSecondDown": [1, "intl-second-down"],
- "intlSecondUp": [1, "intl-second-up"],
- "locale": [1025, "lang"],
- "scale": [1],
- "step": [2],
- "value": [1025],
- "hour": [32],
- "hourCycle": [32],
- "localizedHour": [32],
- "localizedHourSuffix": [32],
- "localizedMeridiem": [32],
- "localizedMinute": [32],
- "localizedMinuteSuffix": [32],
- "localizedSecond": [32],
- "localizedSecondSuffix": [32],
- "meridiem": [32],
- "minute": [32],
- "second": [32],
- "showSecond": [32],
- "setFocus": [64]
- },
- "$listeners$": [[0, "blur", "hostBlurHandler"], [0, "focus", "hostFocusHandler"], [0, "keydown", "keyDownHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": []
- }; }
- }
- const CSS$4 = {
- header: "header",
- heading: "heading",
- close: "close",
- container: "container",
- tipContainer: "tip-container",
- tipContainerAdvancing: "tip-container--advancing",
- tipContainerRetreating: "tip-container--retreating",
- pagination: "pagination",
- pagePosition: "page-position",
- pageNext: "page-next",
- pagePrevious: "page-previous"
- };
- const ICONS$3 = {
- chevronLeft: "chevron-left",
- chevronRight: "chevron-right",
- close: "x"
- };
- const TEXT$1 = {
- defaultGroupTitle: "Tips",
- defaultPaginationLabel: "Tip",
- close: "Close",
- previous: "Previous",
- next: "Next"
- };
- const HEADING_LEVEL$1 = 2;
- const CSS$3 = {
- container: "container",
- header: "header",
- heading: "heading",
- close: "close",
- imageFrame: "image-frame",
- content: "content",
- info: "info"
- };
- const ICONS$2 = {
- close: "x"
- };
- const SLOTS$2 = {
- thumbnail: "thumbnail"
- };
- const TEXT = {
- close: "Close"
- };
- const HEADING_LEVEL = (HEADING_LEVEL$1 + 1);
- const tipCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-tip:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-tip{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-tip{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-tip{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-tip{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-tip{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-tip:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-tip-h{display:none}/*!@:host*/.sc-calcite-tip-h{position:relative;margin:1rem;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-2);background-color:var(--calcite-ui-foreground-1);font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-ui-text-2)}/*!@:host **/.sc-calcite-tip-h *.sc-calcite-tip{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@.container*/.container.sc-calcite-tip{width:100%;padding:1rem}/*!@:host([dismissed]), :host([dismissed]) .container*/[dismissed].sc-calcite-tip-h,[dismissed].sc-calcite-tip-h .container.sc-calcite-tip{display:none}/*!@:host([selected]) .container*/[selected].sc-calcite-tip-h .container.sc-calcite-tip{margin:0px;border-style:none;padding:0px}/*!@.header*/.header.sc-calcite-tip{margin:0px;display:-ms-flexbox;display:flex;-ms-flex-line-pack:justify;align-content:space-between;-ms-flex-align:center;align-items:center;fill:var(--calcite-ui-text-2);color:var(--calcite-ui-text-2)}/*!@.heading*/.heading.sc-calcite-tip{margin:0px;padding:0px;font-weight:var(--calcite-font-weight-medium)}/*!@.header .heading*/.header.sc-calcite-tip .heading.sc-calcite-tip{-ms-flex:1 1 auto;flex:1 1 auto;padding:0.5rem}/*!@h1.heading*/h1.heading.sc-calcite-tip{font-size:var(--calcite-font-size-2);line-height:1.5rem}/*!@h2.heading*/h2.heading.sc-calcite-tip{font-size:var(--calcite-font-size-1);line-height:1.5rem}/*!@h3.heading*/h3.heading.sc-calcite-tip{font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@h4.heading, h5.heading*/h4.heading.sc-calcite-tip,h5.heading.sc-calcite-tip{font-size:var(--calcite-font-size--1);line-height:1rem}/*!@.header*/.header.sc-calcite-tip{margin-bottom:0.5rem}/*!@.header .heading*/.header.sc-calcite-tip .heading.sc-calcite-tip{padding:0px;color:var(--calcite-ui-text-1)}/*!@.container[hidden]*/.container[hidden].sc-calcite-tip{display:none}/*!@.content*/.content.sc-calcite-tip{display:-ms-flexbox;display:flex}/*!@.info*/.info.sc-calcite-tip{padding-top:0px;padding-bottom:0px;padding-left:1rem;padding-right:1rem;width:70%}/*!@.info:only-child*/.info.sc-calcite-tip:only-child{width:100%;padding-left:0px;padding-right:0px}/*!@::slotted(p)*/.sc-calcite-tip-s>p{margin-top:0px}/*!@::slotted(a)*/.sc-calcite-tip-s>a{outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;color:var(--calcite-ui-brand)}/*!@::slotted(a:focus)*/.sc-calcite-tip-s>a:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:2px}/*!@.image-frame*/.image-frame.sc-calcite-tip{width:25%}/*!@.image-frame img*/.image-frame.sc-calcite-tip img.sc-calcite-tip{max-width:100%}/*!@::slotted(img)*/.sc-calcite-tip-s>img{max-width:100%}";
- /**
- * @slot - A slot for adding text and a hyperlink.
- * @slot thumbnail - A slot for adding an HTML image element to the tip.
- */
- class Tip {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteTipDismiss = createEvent(this, "calciteTipDismiss", 7);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * No longer displays the tip.
- */
- this.dismissed = false;
- /**
- * Indicates whether the tip can be dismissed.
- */
- this.nonDismissible = false;
- /**
- * The selected state of the tip if it is being used inside a `calcite-tip-manager`.
- */
- this.selected = false;
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.hideTip = () => {
- this.dismissed = true;
- this.calciteTipDismiss.emit();
- };
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- disconnectConditionalSlotComponent(this);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- renderHeader() {
- var _a;
- const { heading, headingLevel, el } = this;
- const parentLevel = (_a = el.closest("calcite-tip-manager")) === null || _a === void 0 ? void 0 : _a.headingLevel;
- const relativeLevel = parentLevel ? constrainHeadingLevel(parentLevel + 1) : null;
- const level = headingLevel || relativeLevel || HEADING_LEVEL;
- return heading ? (hAsync("header", { class: CSS$3.header }, hAsync(Heading, { class: CSS$3.heading, level: level }, heading))) : null;
- }
- renderDismissButton() {
- const { nonDismissible, hideTip, intlClose } = this;
- const text = intlClose || TEXT.close;
- return !nonDismissible ? (hAsync("calcite-action", { class: CSS$3.close, icon: ICONS$2.close, onClick: hideTip, scale: "l", text: text })) : null;
- }
- renderImageFrame() {
- const { el } = this;
- return getSlotted(el, SLOTS$2.thumbnail) ? (hAsync("div", { class: CSS$3.imageFrame, key: "thumbnail" }, hAsync("slot", { name: SLOTS$2.thumbnail }))) : null;
- }
- renderInfoNode() {
- return (hAsync("div", { class: CSS$3.info }, hAsync("slot", null)));
- }
- renderContent() {
- return (hAsync("div", { class: CSS$3.content }, this.renderImageFrame(), this.renderInfoNode()));
- }
- render() {
- return (hAsync(Fragment, null, hAsync("article", { class: CSS$3.container }, this.renderHeader(), this.renderContent()), this.renderDismissButton()));
- }
- get el() { return getElement(this); }
- static get style() { return tipCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-tip",
- "$members$": {
- "dismissed": [1540],
- "nonDismissible": [516, "non-dismissible"],
- "heading": [1],
- "headingLevel": [2, "heading-level"],
- "selected": [516],
- "intlClose": [1, "intl-close"]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["dismissed", "dismissed"], ["nonDismissible", "non-dismissible"], ["selected", "selected"]]
- }; }
- }
- const tipGroupCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-tip-group:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-tip-group{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-tip-group{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-tip-group{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-tip-group{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-tip-group{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-tip-group:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-tip-group-h{display:none}/*!@:host*/.sc-calcite-tip-group-h{-webkit-box-sizing:border-box;box-sizing:border-box;display:block;background-color:var(--calcite-ui-foreground-1);font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-ui-text-2)}/*!@::slotted(calcite-tip)*/.sc-calcite-tip-group-s>calcite-tip{margin:0px;border-style:none}/*!@:host-context(calcite-tip-manager)*/calcite-tip-manager.sc-calcite-tip-group-h,calcite-tip-manager .sc-calcite-tip-group-h{margin-top:0.75rem;margin-bottom:0.75rem}/*!@:host-context(calcite-tip-manager) ::slotted(calcite-tip)*/.sc-calcite-tip-group-hcalcite-tip-manager .sc-calcite-tip-group-s>calcite-tip,calcite-tip-manager .sc-calcite-tip-group-h .sc-calcite-tip-group-s>calcite-tip{padding:1rem}";
- /**
- * @slot - A slot for adding `calcite-tip`s.
- */
- class TipGroup {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- }
- render() {
- return hAsync("slot", null);
- }
- static get style() { return tipGroupCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-tip-group",
- "$members$": {
- "groupTitle": [1, "group-title"]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": []
- }; }
- }
- const tipManagerCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-tip-manager:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-tip-manager{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-tip-manager{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-tip-manager{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-tip-manager{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-tip-manager{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-tip-manager:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-tip-manager-h{display:none}/*!@:host*/.sc-calcite-tip-manager-h{-webkit-box-sizing:border-box;box-sizing:border-box;display:block;background-color:var(--calcite-ui-foreground-1);font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-ui-text-2);--calcite-tip-manager-height:19vh}/*!@:host **/.sc-calcite-tip-manager-h *.sc-calcite-tip-manager{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:host([closed])*/[closed].sc-calcite-tip-manager-h{display:none}/*!@.header*/.header.sc-calcite-tip-manager{margin:0px;display:-ms-flexbox;display:flex;-ms-flex-line-pack:justify;align-content:space-between;-ms-flex-align:center;align-items:center;fill:var(--calcite-ui-text-2);color:var(--calcite-ui-text-2)}/*!@.heading*/.heading.sc-calcite-tip-manager{margin:0px;padding:0px;font-weight:var(--calcite-font-weight-medium)}/*!@.header .heading*/.header.sc-calcite-tip-manager .heading.sc-calcite-tip-manager{-ms-flex:1 1 auto;flex:1 1 auto;padding:0.5rem}/*!@h1.heading*/h1.heading.sc-calcite-tip-manager{font-size:var(--calcite-font-size-2);line-height:1.5rem}/*!@h2.heading*/h2.heading.sc-calcite-tip-manager{font-size:var(--calcite-font-size-1);line-height:1.5rem}/*!@h3.heading*/h3.heading.sc-calcite-tip-manager{font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@h4.heading, h5.heading*/h4.heading.sc-calcite-tip-manager,h5.heading.sc-calcite-tip-manager{font-size:var(--calcite-font-size--1);line-height:1rem}/*!@.header*/.header.sc-calcite-tip-manager{border-width:0px;border-bottom-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3);padding-top:0px;padding-bottom:0px;-webkit-padding-end:0px;padding-inline-end:0px;-webkit-padding-start:1rem;padding-inline-start:1rem}/*!@.header h2.heading*/.header.sc-calcite-tip-manager h2.heading.sc-calcite-tip-manager{padding:0px;font-size:var(--calcite-font-size-1);line-height:1.5rem;font-weight:var(--calcite-font-weight-bold);color:var(--calcite-ui-text-1)}/*!@.container*/.container.sc-calcite-tip-manager{position:relative;overflow:hidden;outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;min-height:150px}/*!@.container:focus*/.container.sc-calcite-tip-manager:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:2px}/*!@.tip-container*/.tip-container.sc-calcite-tip-manager{margin-top:1px;display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:flex-start;-ms-flex-pack:center;justify-content:center;overflow:auto;outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;-webkit-animation-name:none;animation-name:none;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing);height:var(--calcite-tip-manager-height)}/*!@.tip-container:focus*/.tip-container.sc-calcite-tip-manager:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:2px}/*!@::slotted(calcite-tip)*/.sc-calcite-tip-manager-s>calcite-tip{border-style:none;padding:0.75rem;max-width:var(--calcite-tip-max-width)}/*!@.tip-container--advancing*/.tip-container--advancing.sc-calcite-tip-manager{-webkit-animation-name:tip-advance;animation-name:tip-advance}/*!@.tip-container--retreating*/.tip-container--retreating.sc-calcite-tip-manager{-webkit-animation-name:tip-retreat;animation-name:tip-retreat}/*!@.pagination*/.pagination.sc-calcite-tip-manager{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding-left:0px;padding-right:0px;padding-top:0.75rem;padding-bottom:0.5rem}/*!@.page-position*/.page-position.sc-calcite-tip-manager{margin-top:0px;margin-bottom:0px;margin-left:0.5rem;margin-right:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}@-webkit-keyframes tip-advance{0%{opacity:0;-webkit-transform:translate3d(50px, 0, 0) scale(0.99);transform:translate3d(50px, 0, 0) scale(0.99)}100%{opacity:1;-webkit-transform:translate3d(0, 0, 0) scale(1);transform:translate3d(0, 0, 0) scale(1)}}@keyframes tip-advance{0%{opacity:0;-webkit-transform:translate3d(50px, 0, 0) scale(0.99);transform:translate3d(50px, 0, 0) scale(0.99)}100%{opacity:1;-webkit-transform:translate3d(0, 0, 0) scale(1);transform:translate3d(0, 0, 0) scale(1)}}@-webkit-keyframes tip-retreat{0%{opacity:0;-webkit-transform:translate3d(-50px, 0, 0) scale(0.99);transform:translate3d(-50px, 0, 0) scale(0.99)}100%{opacity:1;-webkit-transform:translate3d(0, 0, 0) scale(1);transform:translate3d(0, 0, 0) scale(1)}}@keyframes tip-retreat{0%{opacity:0;-webkit-transform:translate3d(-50px, 0, 0) scale(0.99);transform:translate3d(-50px, 0, 0) scale(0.99)}100%{opacity:1;-webkit-transform:translate3d(0, 0, 0) scale(1);transform:translate3d(0, 0, 0) scale(1)}}";
- /**
- * @slot - A slot for adding `calcite-tip`s.
- */
- class TipManager {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteTipManagerToggle = createEvent(this, "calciteTipManagerToggle", 7);
- this.calciteTipManagerClose = createEvent(this, "calciteTipManagerClose", 7);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * Closed state of the `calcite-tip-manager`.
- */
- this.closed = false;
- this.mutationObserver = createObserver();
- this.hideTipManager = () => {
- this.closed = true;
- this.calciteTipManagerToggle.emit();
- this.calciteTipManagerClose.emit();
- };
- this.previousClicked = () => {
- this.previousTip();
- };
- this.nextClicked = () => {
- this.nextTip();
- };
- this.tipManagerKeyUpHandler = (event) => {
- if (event.target !== this.container) {
- return;
- }
- switch (event.key) {
- case "ArrowRight":
- event.preventDefault();
- this.nextTip();
- break;
- case "ArrowLeft":
- event.preventDefault();
- this.previousTip();
- break;
- case "Home":
- event.preventDefault();
- this.selectedIndex = 0;
- break;
- case "End":
- event.preventDefault();
- this.selectedIndex = this.total - 1;
- break;
- }
- };
- this.storeContainerRef = (el) => {
- this.container = el;
- };
- }
- closedChangeHandler() {
- this.direction = null;
- this.calciteTipManagerToggle.emit();
- }
- selectedChangeHandler() {
- this.showSelectedTip();
- this.updateGroupTitle();
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- var _a;
- this.setUpTips();
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });
- }
- disconnectedCallback() {
- var _a;
- (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- }
- // --------------------------------------------------------------------------
- //
- // Public Methods
- //
- // --------------------------------------------------------------------------
- /** Selects the next tip to display */
- async nextTip() {
- this.direction = "advancing";
- const nextIndex = this.selectedIndex + 1;
- this.selectedIndex = (nextIndex + this.total) % this.total;
- }
- /** Selects the previous tip to display */
- async previousTip() {
- this.direction = "retreating";
- const previousIndex = this.selectedIndex - 1;
- this.selectedIndex = (previousIndex + this.total) % this.total;
- }
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- setUpTips() {
- const tips = Array.from(this.el.querySelectorAll("calcite-tip"));
- this.total = tips.length;
- if (this.total === 0) {
- return;
- }
- const selectedTip = this.el.querySelector("calcite-tip[selected]");
- this.tips = tips;
- this.selectedIndex = selectedTip ? tips.indexOf(selectedTip) : 0;
- tips.forEach((tip) => {
- tip.nonDismissible = true;
- });
- this.showSelectedTip();
- this.updateGroupTitle();
- }
- showSelectedTip() {
- this.tips.forEach((tip, index) => {
- const isSelected = this.selectedIndex === index;
- tip.selected = isSelected;
- tip.hidden = !isSelected;
- });
- }
- updateGroupTitle() {
- const selectedTip = this.tips[this.selectedIndex];
- const tipParent = selectedTip.closest("calcite-tip-group");
- this.groupTitle = (tipParent === null || tipParent === void 0 ? void 0 : tipParent.groupTitle) || this.intlDefaultTitle || TEXT$1.defaultGroupTitle;
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- renderPagination() {
- const dir = getElementDir(this.el);
- const { selectedIndex, tips, total, intlNext, intlPrevious, intlPaginationLabel } = this;
- const nextLabel = intlNext || TEXT$1.next;
- const previousLabel = intlPrevious || TEXT$1.previous;
- const paginationLabel = intlPaginationLabel || TEXT$1.defaultPaginationLabel;
- return tips.length > 1 ? (hAsync("footer", { class: CSS$4.pagination }, hAsync("calcite-action", { class: CSS$4.pagePrevious, icon: dir === "ltr" ? ICONS$3.chevronLeft : ICONS$3.chevronRight, onClick: this.previousClicked, scale: "m", text: previousLabel }), hAsync("span", { class: CSS$4.pagePosition }, `${paginationLabel} ${selectedIndex + 1}/${total}`), hAsync("calcite-action", { class: CSS$4.pageNext, icon: dir === "ltr" ? ICONS$3.chevronRight : ICONS$3.chevronLeft, onClick: this.nextClicked, scale: "m", text: nextLabel }))) : null;
- }
- render() {
- const { closed, direction, headingLevel, groupTitle, selectedIndex, intlClose, total } = this;
- const closeLabel = intlClose || TEXT$1.close;
- if (total === 0) {
- return null;
- }
- return (hAsync("section", { "aria-hidden": toAriaBoolean(closed), class: CSS$4.container, hidden: closed, onKeyUp: this.tipManagerKeyUpHandler, ref: this.storeContainerRef, tabIndex: 0 }, hAsync("header", { class: CSS$4.header }, hAsync(Heading, { class: CSS$4.heading, level: headingLevel || HEADING_LEVEL$1 }, groupTitle), hAsync("calcite-action", { class: CSS$4.close, onClick: this.hideTipManager, scale: "m", text: closeLabel }, hAsync("calcite-icon", { icon: ICONS$3.close, scale: "m" }))), hAsync("div", { class: {
- [CSS$4.tipContainer]: true,
- [CSS$4.tipContainerAdvancing]: !closed && direction === "advancing",
- [CSS$4.tipContainerRetreating]: !closed && direction === "retreating"
- }, key: selectedIndex, tabIndex: 0 }, hAsync("slot", null)), this.renderPagination()));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "closed": ["closedChangeHandler"],
- "selectedIndex": ["selectedChangeHandler"]
- }; }
- static get style() { return tipManagerCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-tip-manager",
- "$members$": {
- "closed": [1540],
- "headingLevel": [2, "heading-level"],
- "intlClose": [1, "intl-close"],
- "intlDefaultTitle": [1, "intl-default-title"],
- "intlNext": [1, "intl-next"],
- "intlPaginationLabel": [1, "intl-pagination-label"],
- "intlPrevious": [1, "intl-previous"],
- "selectedIndex": [32],
- "tips": [32],
- "total": [32],
- "direction": [32],
- "groupTitle": [32],
- "nextTip": [64],
- "previousTip": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["closed", "closed"]]
- }; }
- }
- const CSS$2 = {
- container: "container",
- arrow: "arrow"
- };
- const TOOLTIP_DELAY_MS = 500;
- const ARIA_DESCRIBED_BY = "aria-describedby";
- class TooltipManager$1 {
- constructor() {
- // --------------------------------------------------------------------------
- //
- // Private Properties
- //
- // --------------------------------------------------------------------------
- this.registeredElements = new WeakMap();
- this.hoverTimeouts = new WeakMap();
- this.registeredElementCount = 0;
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.queryTooltip = (composedPath) => {
- const { registeredElements } = this;
- const registeredElement = composedPath.find((pathEl) => registeredElements.has(pathEl));
- return registeredElements.get(registeredElement);
- };
- this.keyDownHandler = (event) => {
- if (event.key === "Escape") {
- const { activeTooltipEl } = this;
- if (activeTooltipEl) {
- this.clearHoverTimeout(activeTooltipEl);
- this.toggleTooltip(activeTooltipEl, false);
- }
- }
- };
- this.mouseEnterShow = (event) => {
- this.hoverEvent(event, true);
- };
- this.mouseLeaveHide = (event) => {
- this.hoverEvent(event, false);
- };
- this.clickHandler = (event) => {
- this.clickedTooltip = this.queryTooltip(event.composedPath());
- };
- this.focusShow = (event) => {
- this.focusEvent(event, true);
- };
- this.blurHide = (event) => {
- this.focusEvent(event, false);
- };
- this.hoverToggle = (tooltip, value) => {
- const { hoverTimeouts } = this;
- hoverTimeouts.delete(tooltip);
- if (value) {
- this.closeExistingTooltip();
- }
- this.toggleTooltip(tooltip, value);
- };
- }
- // --------------------------------------------------------------------------
- //
- // Public Methods
- //
- // --------------------------------------------------------------------------
- registerElement(referenceEl, tooltip) {
- this.registeredElementCount++;
- this.registeredElements.set(referenceEl, tooltip);
- if (this.registeredElementCount === 1) {
- this.addListeners();
- }
- }
- unregisterElement(referenceEl) {
- if (this.registeredElements.delete(referenceEl)) {
- this.registeredElementCount--;
- }
- if (this.registeredElementCount === 0) {
- this.removeListeners();
- }
- }
- addListeners() {
- document.addEventListener("keydown", this.keyDownHandler);
- document.addEventListener("mouseover", this.mouseEnterShow, { capture: true });
- document.addEventListener("mouseout", this.mouseLeaveHide, { capture: true });
- document.addEventListener("pointerdown", this.clickHandler, { capture: true });
- document.addEventListener("focusin", this.focusShow), { capture: true };
- document.addEventListener("focusout", this.blurHide, { capture: true });
- }
- removeListeners() {
- document.removeEventListener("keydown", this.keyDownHandler);
- document.removeEventListener("mouseover", this.mouseEnterShow, { capture: true });
- document.removeEventListener("mouseout", this.mouseLeaveHide, { capture: true });
- document.removeEventListener("pointerdown", this.clickHandler, { capture: true });
- document.removeEventListener("focusin", this.focusShow, { capture: true });
- document.removeEventListener("focusout", this.blurHide, { capture: true });
- }
- clearHoverTimeout(tooltip) {
- const { hoverTimeouts } = this;
- if (hoverTimeouts.has(tooltip)) {
- window.clearTimeout(hoverTimeouts.get(tooltip));
- hoverTimeouts.delete(tooltip);
- }
- }
- closeExistingTooltip() {
- const { activeTooltipEl } = this;
- if (activeTooltipEl) {
- this.toggleTooltip(activeTooltipEl, false);
- }
- }
- focusTooltip(tooltip, value) {
- this.closeExistingTooltip();
- if (value) {
- this.clearHoverTimeout(tooltip);
- }
- this.toggleTooltip(tooltip, value);
- }
- toggleTooltip(tooltip, value) {
- tooltip.open = value;
- if (value) {
- this.activeTooltipEl = tooltip;
- }
- }
- hoverTooltip(tooltip, value) {
- this.clearHoverTimeout(tooltip);
- const { hoverTimeouts } = this;
- const timeoutId = window.setTimeout(() => this.hoverToggle(tooltip, value), TOOLTIP_DELAY_MS );
- hoverTimeouts.set(tooltip, timeoutId);
- }
- activeTooltipHover(event) {
- const { activeTooltipEl, hoverTimeouts } = this;
- const { type } = event;
- if (!activeTooltipEl) {
- return;
- }
- if (type === "mouseover" && event.composedPath().includes(activeTooltipEl)) {
- this.clearHoverTimeout(activeTooltipEl);
- }
- else if (type === "mouseout" && !hoverTimeouts.has(activeTooltipEl)) {
- this.hoverTooltip(activeTooltipEl, false);
- }
- }
- hoverEvent(event, value) {
- const tooltip = this.queryTooltip(event.composedPath());
- this.activeTooltipHover(event);
- if (!tooltip) {
- return;
- }
- this.hoverTooltip(tooltip, value);
- }
- focusEvent(event, value) {
- const tooltip = this.queryTooltip(event.composedPath());
- if (!tooltip || tooltip === this.clickedTooltip) {
- this.clickedTooltip = null;
- return;
- }
- this.focusTooltip(tooltip, value);
- }
- }
- const tooltipCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-tooltip:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-tooltip{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-tooltip{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-tooltip{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-tooltip{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-tooltip{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-tooltip:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-tooltip-h{display:none}/*!@:host*/.sc-calcite-tooltip-h{display:block;position:absolute;z-index:999;-webkit-transform:scale(0);transform:scale(0)}/*!@.calcite-popper-anim*/.calcite-popper-anim.sc-calcite-tooltip{position:relative;z-index:1;-webkit-transition:var(--calcite-popper-transition);transition:var(--calcite-popper-transition);visibility:hidden;-webkit-transition-property:visibility, opacity, -webkit-transform;transition-property:visibility, opacity, -webkit-transform;transition-property:transform, visibility, opacity;transition-property:transform, visibility, opacity, -webkit-transform;opacity:0;-webkit-box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);border-radius:0.25rem}/*!@:host([data-popper-placement^=bottom]) .calcite-popper-anim*/[data-popper-placement^=bottom].sc-calcite-tooltip-h .calcite-popper-anim.sc-calcite-tooltip{-webkit-transform:translateY(-5px);transform:translateY(-5px)}/*!@:host([data-popper-placement^=top]) .calcite-popper-anim*/[data-popper-placement^=top].sc-calcite-tooltip-h .calcite-popper-anim.sc-calcite-tooltip{-webkit-transform:translateY(5px);transform:translateY(5px)}/*!@:host([data-popper-placement^=left]) .calcite-popper-anim*/[data-popper-placement^=left].sc-calcite-tooltip-h .calcite-popper-anim.sc-calcite-tooltip{-webkit-transform:translateX(5px);transform:translateX(5px)}/*!@:host([data-popper-placement^=right]) .calcite-popper-anim*/[data-popper-placement^=right].sc-calcite-tooltip-h .calcite-popper-anim.sc-calcite-tooltip{-webkit-transform:translateX(-5px);transform:translateX(-5px)}/*!@:host([data-popper-placement]) .calcite-popper-anim--active*/[data-popper-placement].sc-calcite-tooltip-h .calcite-popper-anim--active.sc-calcite-tooltip{opacity:1;visibility:visible;-webkit-transform:translate(0);transform:translate(0)}/*!@:host([data-popper-placement][data-popper-reference-hidden])*/[data-popper-placement][data-popper-reference-hidden].sc-calcite-tooltip-h{pointer-events:none;opacity:0}/*!@.arrow,\n.arrow::before*/.arrow.sc-calcite-tooltip,.arrow.sc-calcite-tooltip::before{position:absolute;width:8px;height:8px;z-index:-1}/*!@.arrow::before*/.arrow.sc-calcite-tooltip::before{content:\"\";--tw-shadow:0 4px 8px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.04);--tw-shadow-colored:0 4px 8px -1px var(--tw-shadow-color), 0 2px 4px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);-webkit-transform:rotate(45deg);transform:rotate(45deg);background:var(--calcite-ui-foreground-1)}/*!@:host([data-popper-placement^=top]) .arrow*/[data-popper-placement^=top].sc-calcite-tooltip-h .arrow.sc-calcite-tooltip{bottom:-4px}/*!@:host([data-popper-placement^=bottom]) .arrow*/[data-popper-placement^=bottom].sc-calcite-tooltip-h .arrow.sc-calcite-tooltip{top:-4px}/*!@:host([data-popper-placement^=left]) .arrow*/[data-popper-placement^=left].sc-calcite-tooltip-h .arrow.sc-calcite-tooltip{right:-4px}/*!@:host([data-popper-placement^=right]) .arrow*/[data-popper-placement^=right].sc-calcite-tooltip-h .arrow.sc-calcite-tooltip{left:-4px}/*!@.container*/.container.sc-calcite-tooltip{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:start;justify-content:flex-start;overflow:hidden;border-radius:0.25rem;background-color:var(--calcite-ui-foreground-1);padding-top:0.75rem;padding-bottom:0.75rem;padding-left:1rem;padding-right:1rem;font-size:var(--calcite-font-size--2);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1);max-width:20rem;max-height:20rem}/*!@.calcite-popper-anim*/.calcite-popper-anim.sc-calcite-tooltip{border-radius:0.25rem;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3);background-color:var(--calcite-ui-foreground-1)}/*!@.arrow::before*/.arrow.sc-calcite-tooltip::before{outline:1px solid var(--calcite-ui-border-3)}";
- const manager = new TooltipManager$1();
- /**
- * @slot - A slot for adding text.
- */
- class Tooltip {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- /**
- * Offset the position of the tooltip away from the reference element.
- * @default 6
- */
- this.offsetDistance = defaultOffsetDistance;
- /**
- * Offset the position of the tooltip along the reference element.
- */
- this.offsetSkidding = 0;
- /**
- * Display and position the component.
- */
- this.open = false;
- /** Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value. */
- this.overlayPositioning = "absolute";
- /**
- * Determines where the component will be positioned relative to the referenceElement.
- * @see [PopperPlacement](https://github.com/Esri/calcite-components/blob/master/src/utils/popper.ts#L25)
- */
- this.placement = "auto";
- this.guid = `calcite-tooltip-${guid()}`;
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.setUpReferenceElement = () => {
- this.removeReferences();
- this.effectiveReferenceElement = this.getReferenceElement();
- const { el, referenceElement, effectiveReferenceElement } = this;
- if (referenceElement && !effectiveReferenceElement) {
- console.warn(`${el.tagName}: reference-element id "${referenceElement}" was not found.`, {
- el
- });
- }
- this.addReferences();
- this.createPopper();
- };
- this.getId = () => {
- return this.el.id || this.guid;
- };
- this.addReferences = () => {
- const { effectiveReferenceElement } = this;
- if (!effectiveReferenceElement) {
- return;
- }
- const id = this.getId();
- effectiveReferenceElement.setAttribute(ARIA_DESCRIBED_BY, id);
- manager.registerElement(effectiveReferenceElement, this.el);
- };
- this.removeReferences = () => {
- const { effectiveReferenceElement } = this;
- if (!effectiveReferenceElement) {
- return;
- }
- effectiveReferenceElement.removeAttribute(ARIA_DESCRIBED_BY);
- manager.unregisterElement(effectiveReferenceElement);
- };
- }
- offsetDistanceOffsetHandler() {
- this.reposition();
- }
- offsetSkiddingHandler() {
- this.reposition();
- }
- openHandler() {
- this.reposition();
- }
- placementHandler() {
- this.reposition();
- }
- referenceElementHandler() {
- this.setUpReferenceElement();
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- componentWillLoad() {
- this.setUpReferenceElement();
- }
- componentDidLoad() {
- this.reposition();
- }
- disconnectedCallback() {
- this.removeReferences();
- this.destroyPopper();
- }
- // --------------------------------------------------------------------------
- //
- // Public Methods
- //
- // --------------------------------------------------------------------------
- /** Updates the position of the component. */
- async reposition() {
- const { popper, el, placement } = this;
- const modifiers = this.getModifiers();
- popper
- ? await updatePopper({
- el,
- modifiers,
- placement,
- popper
- })
- : this.createPopper();
- }
- getReferenceElement() {
- const { referenceElement, el } = this;
- return ((typeof referenceElement === "string"
- ? queryElementRoots(el, { id: referenceElement })
- : referenceElement) || null);
- }
- getModifiers() {
- const { arrowEl, offsetDistance, offsetSkidding } = this;
- const arrowModifier = {
- name: "arrow",
- enabled: true,
- options: {
- element: arrowEl
- }
- };
- const offsetModifier = {
- name: "offset",
- enabled: true,
- options: {
- offset: [offsetSkidding, offsetDistance]
- }
- };
- const eventListenerModifier = {
- name: "eventListeners",
- enabled: this.open
- };
- return [arrowModifier, offsetModifier, eventListenerModifier];
- }
- createPopper() {
- this.destroyPopper();
- const { el, placement, effectiveReferenceElement: referenceEl, overlayPositioning } = this;
- const modifiers = this.getModifiers();
- this.popper = createPopper({
- el,
- modifiers,
- placement,
- overlayPositioning,
- referenceEl
- });
- }
- destroyPopper() {
- const { popper } = this;
- if (popper) {
- popper.destroy();
- }
- this.popper = null;
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- const { effectiveReferenceElement, label, open } = this;
- const displayed = effectiveReferenceElement && open;
- const hidden = !displayed;
- return (hAsync(Host, { "aria-hidden": toAriaBoolean(hidden), "aria-label": label, "calcite-hydrated-hidden": hidden, id: this.getId(), role: "tooltip" }, hAsync("div", { class: {
- [CSS$D.animation]: true,
- [CSS$D.animationActive]: displayed
- } }, hAsync("div", { class: CSS$2.arrow, ref: (arrowEl) => (this.arrowEl = arrowEl) }), hAsync("div", { class: CSS$2.container }, hAsync("slot", null)))));
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "offsetDistance": ["offsetDistanceOffsetHandler"],
- "offsetSkidding": ["offsetSkiddingHandler"],
- "open": ["openHandler"],
- "placement": ["placementHandler"],
- "referenceElement": ["referenceElementHandler"]
- }; }
- static get style() { return tooltipCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-tooltip",
- "$members$": {
- "label": [1],
- "offsetDistance": [514, "offset-distance"],
- "offsetSkidding": [514, "offset-skidding"],
- "open": [516],
- "overlayPositioning": [1, "overlay-positioning"],
- "placement": [513],
- "referenceElement": [1, "reference-element"],
- "effectiveReferenceElement": [32],
- "reposition": [64]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["offsetDistance", "offset-distance"], ["offsetSkidding", "offset-skidding"], ["open", "open"], ["placement", "placement"]]
- }; }
- }
- const tooltipManagerCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-tooltip-manager:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-tooltip-manager{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-tooltip-manager{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-tooltip-manager{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-tooltip-manager{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-tooltip-manager{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-tooltip-manager:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-tooltip-manager-h{display:none}/*!@:host*/.sc-calcite-tooltip-manager-h{position:relative;display:block}";
- /**
- * @slot - A slot for adding elements that reference a 'calcite-tooltip' by the 'selector' property.
- * @deprecated No longer required for tooltip usage.
- */
- class TooltipManager {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * CSS Selector to match reference elements for tooltips. Reference elements will be identified by this selector in order to open their associated tooltip.
- * @default `[data-calcite-tooltip-reference]`
- */
- this.selector = "[data-calcite-tooltip-reference]";
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- render() {
- return hAsync("slot", null);
- }
- static get style() { return tooltipManagerCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-tooltip-manager",
- "$members$": {
- "selector": [1]
- },
- "$listeners$": undefined,
- "$lazyBundleId$": "-",
- "$attrsToReflect$": []
- }; }
- }
- var TreeSelectionMode;
- (function (TreeSelectionMode) {
- TreeSelectionMode["Single"] = "single";
- TreeSelectionMode["Multi"] = "multi";
- TreeSelectionMode["Children"] = "children";
- TreeSelectionMode["MultiChildren"] = "multi-children";
- TreeSelectionMode["Ancestors"] = "ancestors";
- })(TreeSelectionMode || (TreeSelectionMode = {}));
- const treeCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-tree:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-tree{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-tree{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-tree{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-tree{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-tree{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-tree:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-tree-h{display:none}/*!@:host*/.sc-calcite-tree-h{display:block;outline:2px solid transparent;outline-offset:2px}";
- /**
- * @slot - A slot for calcite-tree-item elements.
- */
- class Tree {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteTreeSelect = createEvent(this, "calciteTreeSelect", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** Display indentation guide lines. */
- this.lines = false;
- /** Display input
- * @deprecated Use "ancestors" selection-mode for checkbox input.
- */
- this.inputEnabled = false;
- /** Specify the scale of the tree. */
- this.scale = "m";
- /** Customize how tree selection works.
- * @default "single"
- * @see [TreeSelectionMode](https://github.com/Esri/calcite-components/blob/master/src/components/tree/interfaces.ts#L5)
- */
- this.selectionMode = TreeSelectionMode.Single;
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- componentWillRender() {
- const parent = this.el.parentElement.closest("calcite-tree");
- this.lines = parent ? parent.lines : this.lines;
- this.scale = parent ? parent.scale : this.scale;
- this.selectionMode = parent ? parent.selectionMode : this.selectionMode;
- this.child = !!parent;
- }
- render() {
- return (hAsync(Host, { "aria-multiselectable": this.child
- ? undefined
- : (this.selectionMode === TreeSelectionMode.Multi ||
- this.selectionMode === TreeSelectionMode.MultiChildren).toString(), role: !this.child ? "tree" : undefined, tabIndex: this.getRootTabIndex() }, hAsync("slot", null)));
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- onFocus() {
- if (!this.child) {
- const focusTarget = this.el.querySelector("calcite-tree-item[selected]") ||
- this.el.querySelector("calcite-tree-item");
- focusElement(focusTarget);
- }
- }
- onFocusIn(event) {
- const focusedFromRootOrOutsideTree = event.relatedTarget === this.el || !this.el.contains(event.relatedTarget);
- if (focusedFromRootOrOutsideTree) {
- // gives user the ability to tab into external elements (modifying tabindex property will not work in firefox)
- this.el.removeAttribute("tabindex");
- }
- }
- onFocusOut(event) {
- const willFocusOutsideTree = !this.el.contains(event.relatedTarget);
- if (willFocusOutsideTree) {
- this.el.tabIndex = this.getRootTabIndex();
- }
- }
- onClick(e) {
- const target = e.target;
- const childItems = nodeListToArray(target.querySelectorAll("calcite-tree-item"));
- if (this.child) {
- return;
- }
- if (!this.child) {
- e.preventDefault();
- e.stopPropagation();
- }
- if (this.selectionMode === TreeSelectionMode.Ancestors && !this.child) {
- this.updateAncestorTree(e);
- return;
- }
- const shouldSelect = this.selectionMode !== null &&
- (!target.hasChildren ||
- (target.hasChildren &&
- (this.selectionMode === TreeSelectionMode.Children ||
- this.selectionMode === TreeSelectionMode.MultiChildren)));
- const shouldModifyToCurrentSelection = e.detail.modifyCurrentSelection &&
- (this.selectionMode === TreeSelectionMode.Multi ||
- this.selectionMode === TreeSelectionMode.MultiChildren);
- const shouldSelectChildren = this.selectionMode === TreeSelectionMode.MultiChildren ||
- this.selectionMode === TreeSelectionMode.Children;
- const shouldClearCurrentSelection = !shouldModifyToCurrentSelection &&
- (((this.selectionMode === TreeSelectionMode.Single ||
- this.selectionMode === TreeSelectionMode.Multi) &&
- childItems.length <= 0) ||
- this.selectionMode === TreeSelectionMode.Children ||
- this.selectionMode === TreeSelectionMode.MultiChildren);
- const shouldExpandTarget = this.selectionMode === TreeSelectionMode.Children ||
- this.selectionMode === TreeSelectionMode.MultiChildren;
- if (!this.child) {
- const targetItems = [];
- if (shouldSelect) {
- targetItems.push(target);
- }
- if (shouldSelectChildren) {
- childItems.forEach((treeItem) => {
- targetItems.push(treeItem);
- });
- }
- if (shouldClearCurrentSelection) {
- const selectedItems = nodeListToArray(this.el.querySelectorAll("calcite-tree-item[selected]"));
- selectedItems.forEach((treeItem) => {
- if (!targetItems.includes(treeItem)) {
- treeItem.selected = false;
- }
- });
- }
- if (shouldExpandTarget && !e.detail.forceToggle) {
- target.expanded = true;
- }
- if (shouldModifyToCurrentSelection) {
- window.getSelection().removeAllRanges();
- }
- if ((shouldModifyToCurrentSelection && target.selected) ||
- (shouldSelectChildren && e.detail.forceToggle)) {
- targetItems.forEach((treeItem) => {
- treeItem.selected = false;
- });
- }
- else {
- targetItems.forEach((treeItem) => {
- treeItem.selected = true;
- });
- }
- }
- this.calciteTreeSelect.emit({
- selected: nodeListToArray(this.el.querySelectorAll("calcite-tree-item")).filter((i) => i.selected)
- });
- }
- keyDownHandler(event) {
- var _a;
- const root = this.el.closest("calcite-tree:not([child])");
- const target = event.target;
- if (root === this.el && target.tagName === "CALCITE-TREE-ITEM" && this.el.contains(target)) {
- switch (event.key) {
- case "ArrowDown":
- const next = target.nextElementSibling;
- if (next && next.matches("calcite-tree-item")) {
- next.focus();
- event.preventDefault();
- }
- break;
- case "ArrowLeft":
- // When focus is on an open node, closes the node.
- if (target.hasChildren && target.expanded) {
- target.expanded = false;
- event.preventDefault();
- break;
- }
- // When focus is on a child node that is also either an end node or a closed node, moves focus to its parent node.
- const parentItem = target.parentElement.closest("calcite-tree-item");
- if (parentItem && (!target.hasChildren || target.expanded === false)) {
- parentItem.focus();
- event.preventDefault();
- break;
- }
- // When focus is on a root node that is also either an end node or a closed node, does nothing.
- break;
- case "ArrowRight":
- if (!target.hasChildren) {
- break;
- }
- if (target.expanded && document.activeElement === target) {
- // When focus is on an open node, moves focus to the first child node.
- (_a = target.querySelector("calcite-tree-item")) === null || _a === void 0 ? void 0 : _a.focus();
- event.preventDefault();
- }
- else {
- // When focus is on a closed node, opens the node; focus does not move.
- target.expanded = true;
- event.preventDefault();
- }
- // When focus is on an end node, does nothing.
- break;
- case "ArrowUp":
- const previous = target.previousElementSibling;
- if (previous && previous.matches("calcite-tree-item")) {
- previous.focus();
- event.preventDefault();
- }
- break;
- }
- }
- }
- updateAncestorTree(e) {
- const item = e.target;
- const children = item.querySelectorAll("calcite-tree-item");
- const ancestors = [];
- let parent = item.parentElement.closest("calcite-tree-item");
- while (parent) {
- ancestors.push(parent);
- parent = parent.parentElement.closest("calcite-tree-item");
- }
- item.selected = !item.selected;
- item.indeterminate = false;
- if (children === null || children === void 0 ? void 0 : children.length) {
- children.forEach((el) => {
- el.selected = item.selected;
- el.indeterminate = false;
- });
- }
- if (ancestors) {
- ancestors.forEach((ancestor) => {
- const descendants = nodeListToArray(ancestor.querySelectorAll("calcite-tree-item"));
- const activeDescendants = descendants.filter((el) => el.selected);
- if (activeDescendants.length === 0) {
- ancestor.selected = false;
- ancestor.indeterminate = false;
- return;
- }
- const indeterminate = activeDescendants.length < descendants.length;
- ancestor.indeterminate = indeterminate;
- ancestor.selected = !indeterminate;
- });
- }
- this.calciteTreeSelect.emit({
- selected: nodeListToArray(this.el.querySelectorAll("calcite-tree-item")).filter((i) => i.selected)
- });
- }
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- getRootTabIndex() {
- return !this.child ? 0 : -1;
- }
- get el() { return getElement(this); }
- static get style() { return treeCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-tree",
- "$members$": {
- "lines": [1540],
- "inputEnabled": [4, "input-enabled"],
- "child": [1540],
- "scale": [1537],
- "selectionMode": [1537, "selection-mode"]
- },
- "$listeners$": [[0, "focus", "onFocus"], [0, "focusin", "onFocusIn"], [0, "focusout", "onFocusOut"], [0, "calciteTreeItemSelect", "onClick"], [0, "keydown", "keyDownHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["lines", "lines"], ["child", "child"], ["scale", "scale"], ["selectionMode", "selection-mode"]]
- }; }
- }
- const CSS$1 = {
- checkboxLabel: "checkbox-label",
- checkbox: "checkbox",
- chevron: "chevron",
- nodeContainer: "node-container",
- childrenContainer: "children-container",
- bulletPointIcon: "bullet-point",
- checkmarkIcon: "checkmark"
- };
- const SLOTS$1 = {
- children: "children"
- };
- const ICONS$1 = {
- bulletPoint: "bullet-point",
- checkmark: "check",
- chevronRight: "chevron-right"
- };
- const treeItemCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-tree-item:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-tree-item{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-tree-item{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-tree-item{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-tree-item{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-tree-item{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-tree-item:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-tree-item-h{display:none}/*!@:host*/.sc-calcite-tree-item-h{display:block;max-width:100%;cursor:pointer;color:var(--calcite-ui-text-3);outline:2px solid transparent;outline-offset:2px}/*!@:host([scale=s])*/[scale=s].sc-calcite-tree-item-h{font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=s]) .node-container*/[scale=s].sc-calcite-tree-item-h .node-container.sc-calcite-tree-item{--calcite-tree-padding-y:0.25rem}/*!@:host([scale=s]) .node-container .checkbox,\n:host([scale=s]) .node-container .chevron,\n:host([scale=s]) .node-container .checkmark,\n:host([scale=s]) .node-container .bullet-point*/[scale=s].sc-calcite-tree-item-h .node-container.sc-calcite-tree-item .checkbox.sc-calcite-tree-item,[scale=s].sc-calcite-tree-item-h .node-container.sc-calcite-tree-item .chevron.sc-calcite-tree-item,[scale=s].sc-calcite-tree-item-h .node-container.sc-calcite-tree-item .checkmark.sc-calcite-tree-item,[scale=s].sc-calcite-tree-item-h .node-container.sc-calcite-tree-item .bullet-point.sc-calcite-tree-item{margin-inline:0.25rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-tree-item-h{font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=m]) .node-container*/[scale=m].sc-calcite-tree-item-h .node-container.sc-calcite-tree-item{--calcite-tree-padding-y:0.5rem}/*!@:host([scale=m]) .node-container .checkbox,\n:host([scale=m]) .node-container .chevron,\n:host([scale=m]) .node-container .checkmark,\n:host([scale=m]) .node-container .bullet-point*/[scale=m].sc-calcite-tree-item-h .node-container.sc-calcite-tree-item .checkbox.sc-calcite-tree-item,[scale=m].sc-calcite-tree-item-h .node-container.sc-calcite-tree-item .chevron.sc-calcite-tree-item,[scale=m].sc-calcite-tree-item-h .node-container.sc-calcite-tree-item .checkmark.sc-calcite-tree-item,[scale=m].sc-calcite-tree-item-h .node-container.sc-calcite-tree-item .bullet-point.sc-calcite-tree-item{margin-inline:0.5rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-tree-item-h{font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host([scale=l]) .node-container*/[scale=l].sc-calcite-tree-item-h .node-container.sc-calcite-tree-item{--calcite-tree-padding-y:0.75rem}/*!@:host([scale=l]) .node-container .checkbox,\n:host([scale=l]) .node-container .chevron,\n:host([scale=l]) .node-container .checkmark,\n:host([scale=l]) .node-container .bullet-point*/[scale=l].sc-calcite-tree-item-h .node-container.sc-calcite-tree-item .checkbox.sc-calcite-tree-item,[scale=l].sc-calcite-tree-item-h .node-container.sc-calcite-tree-item .chevron.sc-calcite-tree-item,[scale=l].sc-calcite-tree-item-h .node-container.sc-calcite-tree-item .checkmark.sc-calcite-tree-item,[scale=l].sc-calcite-tree-item-h .node-container.sc-calcite-tree-item .bullet-point.sc-calcite-tree-item{margin-inline:0.75rem}/*!@:host([lines]) .children-container:after*/[lines].sc-calcite-tree-item-h .children-container.sc-calcite-tree-item:after{position:absolute;top:0px;width:1px;transition-property:color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;-webkit-transition-property:color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;height:96%;content:\"\";background-color:var(--calcite-ui-border-2);z-index:-1}/*!@:host(:not([lines])) .node-container:after*/.sc-calcite-tree-item-h:not([lines]) .node-container.sc-calcite-tree-item:after{display:none}/*!@::slotted(*)*/.sc-calcite-tree-item-s>*{min-width:0px;max-width:100%;overflow-wrap:break-word;color:inherit;text-decoration:none !important}/*!@::slotted(*):hover*/.sc-calcite-tree-item-s>*:hover{text-decoration:none !important}/*!@::slotted(a)*/.sc-calcite-tree-item-s>a{width:100%;-webkit-text-decoration-line:none;text-decoration-line:none}/*!@:host*/.sc-calcite-tree-item-h{outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@:host(:focus)*/.sc-calcite-tree-item-h:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@.checkbox*/.checkbox.sc-calcite-tree-item{outline:2px solid transparent;outline-offset:2px;line-height:0}/*!@.checkbox-label*/.checkbox-label.sc-calcite-tree-item{pointer-events:none;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}/*!@.children-container*/.children-container.sc-calcite-tree-item{position:relative;height:0px;overflow:hidden;-webkit-margin-start:1.25rem;margin-inline-start:1.25rem;-webkit-transform:scaleY(0);transform:scaleY(0);opacity:0;-webkit-transition:var(--calcite-animation-timing) cubic-bezier(0.215, 0.44, 0.42, 0.88), opacity var(--calcite-animation-timing) cubic-bezier(0.215, 0.44, 0.42, 0.88), all var(--calcite-animation-timing) ease-in-out;transition:var(--calcite-animation-timing) cubic-bezier(0.215, 0.44, 0.42, 0.88), opacity var(--calcite-animation-timing) cubic-bezier(0.215, 0.44, 0.42, 0.88), all var(--calcite-animation-timing) ease-in-out;-webkit-transform-origin:top;transform-origin:top}/*!@:host([expanded]) > .children-container*/[expanded].sc-calcite-tree-item-h>.children-container.sc-calcite-tree-item{-webkit-transform:scaleY(1);transform:scaleY(1);opacity:1;height:auto}/*!@.node-container*/.node-container.sc-calcite-tree-item{position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding:var(--calcite-tree-padding-y) 0}/*!@.node-container .checkmark, .node-container .bullet-point*/.node-container.sc-calcite-tree-item .checkmark.sc-calcite-tree-item,.node-container.sc-calcite-tree-item .bullet-point.sc-calcite-tree-item{opacity:0;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;color:var(--calcite-ui-border-1)}/*!@.node-container:hover .checkmark, .node-container:hover .bullet-point, :host([selected]) .node-container:hover .checkmark, :host([selected]) .node-container:hover .bullet-point, :host(:focus) .node-container .checkmark, :host(:focus) .node-container .bullet-point*/.node-container.sc-calcite-tree-item:hover .checkmark.sc-calcite-tree-item,.node-container.sc-calcite-tree-item:hover .bullet-point.sc-calcite-tree-item,[selected].sc-calcite-tree-item-h .node-container.sc-calcite-tree-item:hover .checkmark.sc-calcite-tree-item,[selected].sc-calcite-tree-item-h .node-container.sc-calcite-tree-item:hover .bullet-point.sc-calcite-tree-item,.sc-calcite-tree-item-h:focus .node-container.sc-calcite-tree-item .checkmark.sc-calcite-tree-item,.sc-calcite-tree-item-h:focus .node-container.sc-calcite-tree-item .bullet-point.sc-calcite-tree-item{opacity:1}/*!@:host([selected]) > .node-container, :host([selected]) > .node-container:hover*/[selected].sc-calcite-tree-item-h>.node-container.sc-calcite-tree-item,[selected].sc-calcite-tree-item-h>.node-container.sc-calcite-tree-item:hover{font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1)}/*!@:host([selected]) > .node-container .bullet-point, :host([selected]) > .node-container .checkmark, :host([selected]) > .node-container:hover .bullet-point, :host([selected]) > .node-container:hover .checkmark*/[selected].sc-calcite-tree-item-h>.node-container.sc-calcite-tree-item .bullet-point.sc-calcite-tree-item,[selected].sc-calcite-tree-item-h>.node-container.sc-calcite-tree-item .checkmark.sc-calcite-tree-item,[selected].sc-calcite-tree-item-h>.node-container.sc-calcite-tree-item:hover .bullet-point.sc-calcite-tree-item,[selected].sc-calcite-tree-item-h>.node-container.sc-calcite-tree-item:hover .checkmark.sc-calcite-tree-item{opacity:1;color:var(--calcite-ui-brand)}/*!@:host(:not([has-children])):host([scale=s]) > .node-container[data-selection-mode=ancestors] .checkbox*/.sc-calcite-tree-item-h:not([has-children]).sc-calcite-tree-item-h([scale=s])>.node-container[data-selection-mode=ancestors].sc-calcite-tree-item .checkbox.sc-calcite-tree-item{-webkit-padding-start:1.25rem;padding-inline-start:1.25rem}/*!@:host(:not([has-children])):host([scale=m]) > .node-container[data-selection-mode=ancestors] .checkbox*/.sc-calcite-tree-item-h:not([has-children]).sc-calcite-tree-item-h([scale=m])>.node-container[data-selection-mode=ancestors].sc-calcite-tree-item .checkbox.sc-calcite-tree-item{-webkit-padding-start:1.5rem;padding-inline-start:1.5rem}/*!@:host(:not([has-children])):host([scale=l]) > .node-container[data-selection-mode=ancestors] .checkbox*/.sc-calcite-tree-item-h:not([has-children]).sc-calcite-tree-item-h([scale=l])>.node-container[data-selection-mode=ancestors].sc-calcite-tree-item .checkbox.sc-calcite-tree-item{-webkit-padding-start:1.75rem;padding-inline-start:1.75rem}/*!@:host([has-children]) > .node-container[data-selection-mode=ancestors] .checkbox*/[has-children].sc-calcite-tree-item-h>.node-container[data-selection-mode=ancestors].sc-calcite-tree-item .checkbox.sc-calcite-tree-item{-webkit-margin-start:0;margin-inline-start:0}/*!@:host([has-children]) > .node-container .bullet-point, :host([has-children]) > .node-container .checkmark*/[has-children].sc-calcite-tree-item-h>.node-container.sc-calcite-tree-item .bullet-point.sc-calcite-tree-item,[has-children].sc-calcite-tree-item-h>.node-container.sc-calcite-tree-item .checkmark.sc-calcite-tree-item{display:none}/*!@:host([has-children][expanded]:not([selected])) > .node-container ::slotted(*)*/.sc-calcite-tree-item-h[has-children][expanded]:not([selected])>.node-container .sc-calcite-tree-item-s>*{font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1)}/*!@:host([has-children][selected]) > .node-container[data-selection-mode=children], :host([has-children][selected]) > .node-container[data-selection-mode=multi-children]*/[has-children][selected].sc-calcite-tree-item-h>.node-container[data-selection-mode=children].sc-calcite-tree-item,[has-children][selected].sc-calcite-tree-item-h>.node-container[data-selection-mode=multi-children].sc-calcite-tree-item{color:var(--calcite-ui-brand)}/*!@.chevron*/.chevron.sc-calcite-tree-item{position:relative;-ms-flex-item-align:center;align-self:center;color:var(--calcite-ui-text-3);-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-transform:rotate(0deg);transform:rotate(0deg)}/*!@.calcite--rtl .chevron*/.calcite--rtl.sc-calcite-tree-item .chevron.sc-calcite-tree-item{-webkit-transform:rotate(180deg);transform:rotate(180deg)}/*!@:host([expanded]) > .node-container > .chevron*/[expanded].sc-calcite-tree-item-h>.node-container.sc-calcite-tree-item>.chevron.sc-calcite-tree-item{-webkit-transform:rotate(90deg);transform:rotate(90deg)}/*!@:host([selected]) .checkmark,\n:host([selected]) .bullet-point*/[selected].sc-calcite-tree-item-h .checkmark.sc-calcite-tree-item,[selected].sc-calcite-tree-item-h .bullet-point.sc-calcite-tree-item{color:var(--calcite-ui-brand)}";
- /**
- * @slot - A slot for adding content to the item.
- * @slot children - A slot for adding nested calcite-tree elements.
- */
- class TreeItem {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteTreeItemSelect = createEvent(this, "calciteTreeItemSelect", 7);
- //--------------------------------------------------------------------------
- //
- // Properties
- //
- //--------------------------------------------------------------------------
- /** Selected state of the item. */
- this.selected = false;
- /** Expanded state of the item. */
- this.expanded = false;
- /** @internal Expanded state of the parent. */
- this.parentExpanded = false;
- /** @internal Level of depth of the item. */
- this.depth = -1;
- /** @internal Does this tree item have a tree inside it? */
- this.hasChildren = null;
- this.iconClickHandler = (event) => {
- event.stopPropagation();
- this.expanded = !this.expanded;
- };
- this.childrenClickHandler = (event) => event.stopPropagation();
- //--------------------------------------------------------------------------
- //
- // Private Methods
- //
- //--------------------------------------------------------------------------
- this.updateParentIsExpanded = (el, expanded) => {
- const items = getSlotted(el, SLOTS$1.children, {
- all: true,
- selector: "calcite-tree-item"
- });
- items.forEach((item) => (item.parentExpanded = expanded));
- };
- this.updateAncestorTree = () => {
- if (this.selected && this.selectionMode === TreeSelectionMode.Ancestors) {
- const ancestors = [];
- let parent = this.parentTreeItem;
- while (parent) {
- ancestors.push(parent);
- parent = parent.parentElement.closest("calcite-tree-item");
- }
- ancestors.forEach((item) => (item.indeterminate = true));
- return;
- }
- };
- }
- expandedHandler(newValue) {
- this.updateParentIsExpanded(this.el, newValue);
- }
- getselectionMode() {
- this.isSelectionMultiLike =
- this.selectionMode === TreeSelectionMode.Multi ||
- this.selectionMode === TreeSelectionMode.MultiChildren;
- }
- //--------------------------------------------------------------------------
- //
- // Lifecycle
- //
- //--------------------------------------------------------------------------
- connectedCallback() {
- this.parentTreeItem = this.el.parentElement.closest("calcite-tree-item");
- if (this.parentTreeItem) {
- const { expanded } = this.parentTreeItem;
- this.updateParentIsExpanded(this.parentTreeItem, expanded);
- }
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- disconnectConditionalSlotComponent(this);
- }
- componentWillRender() {
- this.hasChildren = !!this.el.querySelector("calcite-tree");
- this.depth = 0;
- let parentTree = this.el.closest("calcite-tree");
- if (!parentTree) {
- return;
- }
- this.selectionMode = parentTree.selectionMode;
- this.scale = parentTree.scale || "m";
- this.lines = parentTree.lines;
- let nextParentTree;
- while (parentTree) {
- nextParentTree = parentTree.parentElement.closest("calcite-tree");
- if (nextParentTree === parentTree) {
- break;
- }
- else {
- parentTree = nextParentTree;
- this.depth = this.depth + 1;
- }
- }
- }
- componentDidLoad() {
- this.updateAncestorTree();
- }
- render() {
- const rtl = getElementDir(this.el) === "rtl";
- const showBulletPoint = this.selectionMode === TreeSelectionMode.Single ||
- this.selectionMode === TreeSelectionMode.Children;
- const showCheckmark = this.selectionMode === TreeSelectionMode.Multi ||
- this.selectionMode === TreeSelectionMode.MultiChildren;
- const chevron = this.hasChildren ? (hAsync("calcite-icon", { class: {
- [CSS$1.chevron]: true,
- [CSS_UTILITY.rtl]: rtl
- }, "data-test-id": "icon", icon: ICONS$1.chevronRight, onClick: this.iconClickHandler, scale: "s" })) : null;
- const defaultSlotNode = hAsync("slot", { key: "default-slot" });
- const checkbox = this.selectionMode === TreeSelectionMode.Ancestors ? (hAsync("label", { class: CSS$1.checkboxLabel, key: "checkbox-label" }, hAsync("calcite-checkbox", { checked: this.selected, class: CSS$1.checkbox, "data-test-id": "checkbox", indeterminate: this.hasChildren && this.indeterminate, scale: this.scale, tabIndex: -1 }), defaultSlotNode)) : null;
- const selectedIcon = showBulletPoint
- ? ICONS$1.bulletPoint
- : showCheckmark
- ? ICONS$1.checkmark
- : null;
- const bulletOrCheckIcon = selectedIcon ? (hAsync("calcite-icon", { class: {
- [CSS$1.bulletPointIcon]: selectedIcon === ICONS$1.bulletPoint,
- [CSS$1.checkmarkIcon]: selectedIcon === ICONS$1.checkmark,
- [CSS_UTILITY.rtl]: rtl
- }, icon: selectedIcon, scale: "s" })) : null;
- const hidden = !(this.parentExpanded || this.depth === 1);
- return (hAsync(Host, { "aria-expanded": this.hasChildren ? toAriaBoolean(this.expanded) : undefined, "aria-hidden": toAriaBoolean(hidden), "aria-selected": this.selected ? "true" : showCheckmark ? "false" : undefined, "calcite-hydrated-hidden": hidden, role: "treeitem", tabindex: this.parentExpanded || this.depth === 1 ? "0" : "-1" }, hAsync("div", { class: {
- [CSS$1.nodeContainer]: true,
- [CSS_UTILITY.rtl]: rtl
- }, "data-selection-mode": this.selectionMode, ref: (el) => (this.defaultSlotWrapper = el) }, chevron, bulletOrCheckIcon, checkbox ? checkbox : defaultSlotNode), hAsync("div", { class: {
- [CSS$1.childrenContainer]: true,
- [CSS_UTILITY.rtl]: rtl
- }, "data-test-id": "calcite-tree-children", onClick: this.childrenClickHandler, ref: (el) => (this.childrenSlotWrapper = el), role: this.hasChildren ? "group" : undefined }, hAsync("slot", { name: SLOTS$1.children }))));
- }
- //--------------------------------------------------------------------------
- //
- // Event Listeners
- //
- //--------------------------------------------------------------------------
- onClick(e) {
- // Solve for if the item is clicked somewhere outside the slotted anchor.
- // Anchor is triggered anywhere you click
- const [link] = filterDirectChildren(this.el, "a");
- if (link && e.composedPath()[0].tagName.toLowerCase() !== "a") {
- const target = link.target === "" ? "_self" : link.target;
- window.open(link.href, target);
- }
- this.calciteTreeItemSelect.emit({
- modifyCurrentSelection: this.selectionMode === TreeSelectionMode.Ancestors || this.isSelectionMultiLike,
- forceToggle: false
- });
- }
- keyDownHandler(e) {
- let root;
- switch (e.key) {
- case " ":
- this.calciteTreeItemSelect.emit({
- modifyCurrentSelection: this.isSelectionMultiLike,
- forceToggle: false
- });
- e.preventDefault();
- break;
- case "Enter":
- // activates a node, i.e., performs its default action. For parent nodes, one possible default action is to open or close the node. In single-select trees where selection does not follow focus (see note below), the default action is typically to select the focused node.
- const link = nodeListToArray(this.el.children).find((e) => e.matches("a"));
- if (link) {
- link.click();
- this.selected = true;
- }
- else {
- this.calciteTreeItemSelect.emit({
- modifyCurrentSelection: this.isSelectionMultiLike,
- forceToggle: false
- });
- }
- e.preventDefault();
- break;
- case "Home":
- root = this.el.closest("calcite-tree:not([child])");
- const firstNode = root.querySelector("calcite-tree-item");
- firstNode.focus();
- break;
- case "End":
- root = this.el.closest("calcite-tree:not([child])");
- let currentNode = root.children[root.children.length - 1]; // last child
- let currentTree = nodeListToArray(currentNode.children).find((e) => e.matches("calcite-tree"));
- while (currentTree) {
- currentNode = currentTree.children[root.children.length - 1];
- currentTree = nodeListToArray(currentNode.children).find((e) => e.matches("calcite-tree"));
- }
- currentNode.focus();
- break;
- }
- }
- get el() { return getElement(this); }
- static get watchers() { return {
- "expanded": ["expandedHandler"],
- "selectionMode": ["getselectionMode"]
- }; }
- static get style() { return treeItemCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-tree-item",
- "$members$": {
- "selected": [1540],
- "expanded": [1540],
- "parentExpanded": [4, "parent-expanded"],
- "depth": [1538],
- "hasChildren": [1540, "has-children"],
- "lines": [1540],
- "inputEnabled": [4, "input-enabled"],
- "scale": [1537],
- "indeterminate": [516],
- "selectionMode": [1025, "selection-mode"]
- },
- "$listeners$": [[0, "click", "onClick"], [0, "keydown", "keyDownHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["selected", "selected"], ["expanded", "expanded"], ["depth", "depth"], ["hasChildren", "has-children"], ["lines", "lines"], ["scale", "scale"], ["indeterminate", "indeterminate"]]
- }; }
- }
- const CSS = {
- container: "container",
- handle: "handle"
- };
- var ICON_TYPES;
- (function (ICON_TYPES) {
- ICON_TYPES["grip"] = "grip";
- })(ICON_TYPES || (ICON_TYPES = {}));
- const valueListCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-value-list:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-value-list{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-value-list{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-value-list{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-value-list{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-value-list{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-value-list:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-value-list-h{display:none}/*!@:host*/.sc-calcite-value-list-h{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;-ms-flex-positive:0;flex-grow:0;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:stretch;align-items:stretch;background-color:transparent;font-size:var(--calcite-font-size--1);color:var(--calcite-ui-text-2)}/*!@:host **/.sc-calcite-value-list-h *.sc-calcite-value-list{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@:host([disabled])*/[disabled].sc-calcite-value-list-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-value-list-h[disabled] .sc-calcite-value-list-s>[calcite-hydrated][disabled],[disabled].sc-calcite-value-list-h [calcite-hydrated][disabled].sc-calcite-value-list{opacity:1}/*!@calcite-value-list-item:last-of-type*/calcite-value-list-item.sc-calcite-value-list:last-of-type{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@:host([filter-enabled]) header*/[filter-enabled].sc-calcite-value-list-h header.sc-calcite-value-list{margin-bottom:0.25rem;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end;background-color:var(--calcite-ui-foreground-1);--tw-shadow:0 1px 0 var(--calcite-ui-border-3);--tw-shadow-colored:0 1px 0 var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@:host([filter-enabled]) header.sticky-pos*/[filter-enabled].sc-calcite-value-list-h header.sticky-pos.sc-calcite-value-list{position:-webkit-sticky;position:sticky;top:0px;z-index:10}/*!@calcite-filter*/calcite-filter.sc-calcite-value-list{margin-bottom:1px}";
- /**
- * @slot - A slot for adding calcite-value-list-item elements. List items are displayed as a vertical list.
- * @slot menu-actions - A slot for adding a button and menu combination for performing actions, such as sorting.
- */
- class ValueList {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteListChange = createEvent(this, "calciteListChange", 7);
- this.calciteListOrderChange = createEvent(this, "calciteListOrderChange", 7);
- // --------------------------------------------------------------------------
- //
- // Properties
- //
- // --------------------------------------------------------------------------
- /**
- * When true, prevents user interaction. This state shows list items grayed out and with lower opacity.
- */
- this.disabled = false;
- /**
- * When true, list items are sortable via a draggable button.
- */
- this.dragEnabled = false;
- /**
- * When true, an input appears at the top of the list that can be used by end users to filter list items.
- */
- this.filterEnabled = false;
- /**
- * When true, content is waiting to be loaded. This state shows a busy indicator.
- */
- this.loading = false;
- /**
- * Similar to standard radio buttons and checkboxes.
- * When true, a user can select multiple list items at a time.
- * When false, only a single list item can be selected at a time,
- * and selecting a new list item will deselect any other selected list items.
- */
- this.multiple = false;
- /**
- * When true and single-selection is enabled, the selection changes when navigating list items via the keyboard.
- */
- this.selectionFollowsFocus = false;
- // --------------------------------------------------------------------------
- //
- // Private Properties
- //
- // --------------------------------------------------------------------------
- this.selectedValues = new Map();
- this.dataForFilter = [];
- this.lastSelectedItem = null;
- this.mutationObserver = createObserver("mutation", mutationObserverCallback.bind(this));
- this.setFilterEl = (el) => {
- this.filterEl = el;
- };
- this.deselectRemovedItems = deselectRemovedItems.bind(this);
- this.deselectSiblingItems = deselectSiblingItems.bind(this);
- this.selectSiblings = selectSiblings.bind(this);
- this.handleFilter = handleFilter.bind(this);
- this.getItemData = getItemData.bind(this);
- this.keyDownHandler = (event) => {
- const handleElement = event
- .composedPath()
- .find((item) => { var _a; return ((_a = item.dataset) === null || _a === void 0 ? void 0 : _a.jsHandle) !== undefined; });
- const item = event
- .composedPath()
- .find((item) => { var _a; return ((_a = item.tagName) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === "calcite-value-list-item"; });
- // Only trigger keyboard sorting when the internal drag handle is focused and activated
- if (!handleElement || !item.handleActivated) {
- keyDownHandler.call(this, event);
- return;
- }
- const { items } = this;
- if ((event.key !== "ArrowUp" && event.key !== "ArrowDown") || items.length <= 1) {
- return;
- }
- event.preventDefault();
- const { el } = this;
- const nextIndex = moveItemIndex(this, item, event.key === "ArrowUp" ? "up" : "down");
- if (nextIndex === items.length - 1) {
- el.appendChild(item);
- }
- else {
- const itemAtNextIndex = el.children[nextIndex];
- const insertionReferenceItem = itemAtNextIndex === item.nextElementSibling
- ? itemAtNextIndex.nextElementSibling
- : itemAtNextIndex;
- el.insertBefore(item, insertionReferenceItem);
- }
- this.items = this.getItems();
- this.calciteListOrderChange.emit(this.items.map(({ value }) => value));
- requestAnimationFrame(() => handleElement.focus());
- item.handleActivated = true;
- };
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- initialize.call(this);
- initializeObserver.call(this);
- }
- componentDidLoad() {
- this.setUpDragAndDrop();
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- disconnectedCallback() {
- cleanUpObserver.call(this);
- this.cleanUpDragAndDrop();
- }
- calciteListFocusOutHandler(event) {
- calciteListFocusOutHandler.call(this, event);
- }
- calciteListItemRemoveHandler(event) {
- removeItem.call(this, event);
- }
- calciteListItemChangeHandler(event) {
- calciteListItemChangeHandler.call(this, event);
- }
- calciteListItemPropsChangeHandler(event) {
- event.stopPropagation();
- this.setUpFilter();
- }
- calciteListItemValueChangeHandler(event) {
- calciteListItemValueChangeHandler.call(this, event);
- }
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- getItems() {
- return Array.from(this.el.querySelectorAll("calcite-value-list-item"));
- }
- setUpItems() {
- setUpItems.call(this, "calcite-value-list-item");
- }
- setUpFilter() {
- if (this.filterEnabled) {
- this.dataForFilter = this.getItemData();
- }
- }
- setUpDragAndDrop() {
- this.cleanUpDragAndDrop();
- if (!this.dragEnabled) {
- return;
- }
- this.sortable = Sortable.create(this.el, {
- dataIdAttr: "id",
- handle: `.${CSS.handle}`,
- draggable: "calcite-value-list-item",
- group: this.group,
- onSort: () => {
- this.items = Array.from(this.el.querySelectorAll("calcite-value-list-item"));
- const values = this.items.map((item) => item.value);
- this.calciteListOrderChange.emit(values);
- }
- });
- }
- cleanUpDragAndDrop() {
- var _a;
- (_a = this.sortable) === null || _a === void 0 ? void 0 : _a.destroy();
- this.sortable = null;
- }
- // --------------------------------------------------------------------------
- //
- // Public Methods
- //
- // --------------------------------------------------------------------------
- /** Returns the currently selected items */
- async getSelectedItems() {
- return this.selectedValues;
- }
- /** Sets focus on the component. */
- async setFocus(focusId) {
- return setFocus.call(this, focusId);
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- getIconType() {
- let type = null;
- if (this.dragEnabled) {
- type = ICON_TYPES.grip;
- }
- return type;
- }
- render() {
- return hAsync(List, { onKeyDown: this.keyDownHandler, props: this });
- }
- get el() { return getElement(this); }
- static get style() { return valueListCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-value-list",
- "$members$": {
- "disabled": [516],
- "dragEnabled": [516, "drag-enabled"],
- "filterEnabled": [516, "filter-enabled"],
- "filterPlaceholder": [513, "filter-placeholder"],
- "group": [1],
- "loading": [516],
- "multiple": [516],
- "selectionFollowsFocus": [4, "selection-follows-focus"],
- "selectedValues": [32],
- "dataForFilter": [32],
- "getSelectedItems": [64],
- "setFocus": [64]
- },
- "$listeners$": [[0, "focusout", "calciteListFocusOutHandler"], [0, "calciteListItemRemove", "calciteListItemRemoveHandler"], [0, "calciteListItemChange", "calciteListItemChangeHandler"], [0, "calciteListItemPropsChange", "calciteListItemPropsChangeHandler"], [0, "calciteListItemValueChange", "calciteListItemValueChangeHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["disabled", "disabled"], ["dragEnabled", "drag-enabled"], ["filterEnabled", "filter-enabled"], ["filterPlaceholder", "filter-placeholder"], ["loading", "loading"], ["multiple", "multiple"]]
- }; }
- }
- const ICONS = {
- drag: "drag"
- };
- const SLOTS = {
- actionsEnd: "actions-end",
- actionsStart: "actions-start"
- };
- const valueListItemCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}/*!@:root*/.sc-calcite-value-list-item:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}/*!@.calcite-animate*/.calcite-animate.sc-calcite-value-list-item{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}/*!@.calcite-animate__in*/.calcite-animate__in.sc-calcite-value-list-item{-webkit-animation-name:in;animation-name:in}/*!@.calcite-animate__in-down*/.calcite-animate__in-down.sc-calcite-value-list-item{-webkit-animation-name:in-down;animation-name:in-down}/*!@.calcite-animate__in-up*/.calcite-animate__in-up.sc-calcite-value-list-item{-webkit-animation-name:in-up;animation-name:in-up}/*!@.calcite-animate__in-scale*/.calcite-animate__in-scale.sc-calcite-value-list-item{-webkit-animation-name:in-scale;animation-name:in-scale}/*!@:root*/.sc-calcite-value-list-item:root{--calcite-popper-transition:var(--calcite-animation-timing)}/*!@:host([hidden])*/[hidden].sc-calcite-value-list-item-h{display:none}/*!@:host*/.sc-calcite-value-list-item-h{margin-bottom:1px;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;background-color:var(--calcite-ui-foreground-1);font-size:var(--calcite-font-size--1);color:var(--calcite-ui-text-2);--tw-shadow:0 1px 0 var(--calcite-ui-border-3);--tw-shadow-colored:0 1px 0 var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);-webkit-transition:background-color var(--calcite-animation-timing), -webkit-box-shadow var(--calcite-animation-timing);transition:background-color var(--calcite-animation-timing), -webkit-box-shadow var(--calcite-animation-timing);transition:background-color var(--calcite-animation-timing), box-shadow var(--calcite-animation-timing);transition:background-color var(--calcite-animation-timing), box-shadow var(--calcite-animation-timing), -webkit-box-shadow var(--calcite-animation-timing)}/*!@:host **/.sc-calcite-value-list-item-h *.sc-calcite-value-list-item{-webkit-box-sizing:border-box;box-sizing:border-box}/*!@calcite-pick-list-item*/calcite-pick-list-item.sc-calcite-value-list-item{position:relative;margin:0px;-ms-flex-positive:1;flex-grow:1;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@:host([active]), :host([selected])*/[active].sc-calcite-value-list-item-h,[selected].sc-calcite-value-list-item-h{--tw-shadow:0 0 0 1px var(--calcite-ui-brand);--tw-shadow-colored:0 0 0 1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@.handle*/.handle.sc-calcite-value-list-item{display:-ms-flexbox;display:flex;cursor:move;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border-style:none;background-color:transparent;padding-top:0px;padding-bottom:0px;padding-left:0.25rem;padding-right:0.25rem;color:var(--calcite-ui-text-1);color:var(--calcite-ui-border-1);outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}/*!@.handle:hover*/.handle.sc-calcite-value-list-item:hover{background-color:var(--calcite-ui-foreground-2);color:var(--calcite-ui-text-1)}/*!@.handle:focus*/.handle.sc-calcite-value-list-item:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}/*!@.handle--activated*/.handle--activated.sc-calcite-value-list-item{background-color:var(--calcite-ui-foreground-3);color:var(--calcite-ui-text-1)}/*!@.handle calcite-icon*/.handle.sc-calcite-value-list-item calcite-icon.sc-calcite-value-list-item{color:inherit}/*!@:host([disabled])*/[disabled].sc-calcite-value-list-item-h{pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-value-list-item-h[disabled] .sc-calcite-value-list-item-s>[calcite-hydrated][disabled],[disabled].sc-calcite-value-list-item-h [calcite-hydrated][disabled].sc-calcite-value-list-item{opacity:1}";
- /**
- * @slot actions-end - A slot for adding actions or content to the end side of the item.
- * @slot actions-start - A slot for adding actions or content to the start side of the item.
- */
- class ValueListItem {
- constructor(hostRef) {
- registerInstance(this, hostRef);
- this.calciteListItemRemove = createEvent(this, "calciteListItemRemove", 7);
- /**
- * When true, the list item cannot be clicked and is visually muted.
- */
- this.disabled = false;
- /**
- * @internal When false, the list item cannot be deselected by user interaction.
- */
- this.disableDeselect = false;
- /**
- * When true, prevents the content of the list item from user interaction.
- */
- this.nonInteractive = false;
- /**
- * @internal - Stores the activated state of the drag handle.
- */
- this.handleActivated = false;
- /**
- * Determines the icon SVG symbol that will be shown. Options are circle, square, grip or null.
- * @see [ICON_TYPES](https://github.com/Esri/calcite-components/blob/master/src/components/pick-list/resources.ts#L5)
- */
- this.icon = null;
- /**
- * When true, adds an action to remove the list item.
- */
- this.removable = false;
- /**
- * When true, preselects the list item. Toggles when an item is checked/unchecked.
- */
- this.selected = false;
- this.pickListItem = null;
- this.guid = `calcite-value-list-item-${guid()}`;
- // --------------------------------------------------------------------------
- //
- // Private Methods
- //
- // --------------------------------------------------------------------------
- this.getPickListRef = (el) => (this.pickListItem = el);
- this.handleKeyDown = (event) => {
- if (event.key === " ") {
- this.handleActivated = !this.handleActivated;
- }
- };
- this.handleBlur = () => {
- this.handleActivated = false;
- };
- this.handleSelectChange = (event) => {
- this.selected = event.detail.selected;
- };
- }
- // --------------------------------------------------------------------------
- //
- // Lifecycle
- //
- // --------------------------------------------------------------------------
- connectedCallback() {
- connectConditionalSlotComponent(this);
- }
- disconnectedCallback() {
- disconnectConditionalSlotComponent(this);
- }
- componentDidRender() {
- updateHostInteraction(this, this.el.closest("calcite-value-list") ? "managed" : false);
- }
- // --------------------------------------------------------------------------
- //
- // Public Methods
- //
- // --------------------------------------------------------------------------
- /**
- * Toggle the selection state. By default this won't trigger an event.
- * The first argument allows the value to be coerced, rather than swapping values.
- */
- async toggleSelected(coerce) {
- this.pickListItem.toggleSelected(coerce);
- }
- /** Set focus on the component. */
- async setFocus() {
- var _a;
- (_a = this.pickListItem) === null || _a === void 0 ? void 0 : _a.setFocus();
- }
- calciteListItemChangeHandler(event) {
- // adjust item payload from wrapped item before bubbling
- event.detail.item = this.el;
- }
- // --------------------------------------------------------------------------
- //
- // Render Methods
- //
- // --------------------------------------------------------------------------
- renderActionsEnd() {
- const { el } = this;
- const hasActionsEnd = getSlotted(el, SLOTS.actionsEnd);
- return hasActionsEnd ? (hAsync("slot", { name: SLOTS.actionsEnd, slot: SLOTS$9.actionsEnd })) : null;
- }
- renderActionsStart() {
- const { el } = this;
- const hasActionsStart = getSlotted(el, SLOTS.actionsStart);
- return hasActionsStart ? (hAsync("slot", { name: SLOTS.actionsStart, slot: SLOTS$9.actionsStart })) : null;
- }
- renderHandle() {
- const { icon } = this;
- if (icon === ICON_TYPES$1.grip) {
- return (hAsync("span", { "aria-pressed": toAriaBoolean(this.handleActivated), class: {
- [CSS$h.handle]: true,
- [CSS$h.handleActivated]: this.handleActivated
- }, "data-js-handle": true, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, role: "button", tabindex: "0" }, hAsync("calcite-icon", { icon: ICONS.drag, scale: "s" })));
- }
- }
- render() {
- return (hAsync(Host, { id: this.el.id || this.guid }, this.renderHandle(), hAsync("calcite-pick-list-item", { description: this.description, disableDeselect: this.disableDeselect, disabled: this.disabled, label: this.label, metadata: this.metadata, nonInteractive: this.nonInteractive, onCalciteListItemChange: this.handleSelectChange, ref: this.getPickListRef, removable: this.removable, selected: this.selected, value: this.value }, this.renderActionsStart(), this.renderActionsEnd())));
- }
- get el() { return getElement(this); }
- static get style() { return valueListItemCss; }
- static get cmpMeta() { return {
- "$flags$": 9,
- "$tagName$": "calcite-value-list-item",
- "$members$": {
- "description": [513],
- "disabled": [516],
- "disableDeselect": [4, "disable-deselect"],
- "nonInteractive": [516, "non-interactive"],
- "handleActivated": [1028, "handle-activated"],
- "icon": [513],
- "label": [513],
- "metadata": [16],
- "removable": [516],
- "selected": [1540],
- "value": [8],
- "toggleSelected": [64],
- "setFocus": [64]
- },
- "$listeners$": [[0, "calciteListItemChange", "calciteListItemChangeHandler"]],
- "$lazyBundleId$": "-",
- "$attrsToReflect$": [["description", "description"], ["disabled", "disabled"], ["nonInteractive", "non-interactive"], ["icon", "icon"], ["label", "label"], ["removable", "removable"], ["selected", "selected"]]
- }; }
- }
- registerComponents([
- Accordion,
- AccordionItem,
- Action,
- ActionBar,
- ActionGroup,
- ActionMenu,
- ActionPad,
- Alert,
- Avatar,
- Block,
- BlockSection,
- Button,
- Card,
- Checkbox,
- Chip,
- ColorPicker,
- ColorPickerHexInput,
- ColorPickerSwatch,
- Combobox,
- ComboboxItem,
- ComboboxItemGroup,
- DatePicker,
- DatePickerDay,
- DatePickerMonth,
- DatePickerMonthHeader,
- Dropdown,
- DropdownGroup,
- DropdownItem,
- Fab,
- Filter,
- Flow,
- Graph,
- Handle,
- Icon,
- InlineEditable,
- Input,
- InputDatePicker,
- InputMessage,
- InputTimePicker,
- Label,
- Link,
- List$1,
- ListItem,
- ListItemGroup,
- Loader,
- Modal,
- Notice,
- Option,
- OptionGroup,
- Pagination,
- Panel,
- PickList,
- PickListGroup,
- PickListItem,
- Popover,
- PopoverManager,
- Progress,
- RadioButton,
- RadioButtonGroup,
- RadioGroup,
- RadioGroupItem,
- Rating,
- Scrim,
- Select,
- Shell,
- ShellCenterRow,
- ShellPanel,
- Slider,
- SortableList,
- SplitButton,
- Stepper,
- StepperItem,
- Switch,
- Tab,
- TabNav,
- TabTitle,
- Tabs,
- Tile,
- TileSelect,
- TileSelectGroup,
- TimePicker,
- Tip,
- TipGroup,
- TipManager,
- Tooltip,
- TooltipManager,
- Tree,
- TreeItem,
- ValueList,
- ValueListItem,
- ]);
- exports.hydrateApp = hydrateApp;
- /*hydrateAppClosure end*/
- hydrateApp(window, $stencilHydrateOpts, $stencilHydrateResults, $stencilAfterHydrate, $stencilHydrateResolve);
- }
- hydrateAppClosure($stencilWindow);
- }
- function createWindowFromHtml(e, t) {
- let r = templateWindows.get(t);
- return null == r && (r = new MockWindow(e), templateWindows.set(t, r)), cloneWindow(r);
- }
- function normalizeHydrateOptions(e) {
- const t = Object.assign({
- serializeToHtml: !1,
- destroyWindow: !1,
- destroyDocument: !1
- }, e || {});
- return "boolean" != typeof t.clientHydrateAnnotations && (t.clientHydrateAnnotations = !0),
- "boolean" != typeof t.constrainTimeouts && (t.constrainTimeouts = !0), "number" != typeof t.maxHydrateCount && (t.maxHydrateCount = 300),
- "boolean" != typeof t.runtimeLogging && (t.runtimeLogging = !1), "number" != typeof t.timeout && (t.timeout = 15e3),
- Array.isArray(t.excludeComponents) ? t.excludeComponents = t.excludeComponents.filter(filterValidTags).map(mapValidTags) : t.excludeComponents = [],
- Array.isArray(t.staticComponents) ? t.staticComponents = t.staticComponents.filter(filterValidTags).map(mapValidTags) : t.staticComponents = [],
- t;
- }
- function filterValidTags(e) {
- return "string" == typeof e && e.includes("-");
- }
- function mapValidTags(e) {
- return e.trim().toLowerCase();
- }
- function generateHydrateResults(e) {
- "string" != typeof e.url && (e.url = "https://hydrate.stenciljs.com/"), "string" != typeof e.buildId && (e.buildId = createHydrateBuildId());
- const t = {
- buildId: e.buildId,
- diagnostics: [],
- url: e.url,
- host: null,
- hostname: null,
- href: null,
- pathname: null,
- port: null,
- search: null,
- hash: null,
- html: null,
- httpStatus: null,
- hydratedCount: 0,
- anchors: [],
- components: [],
- imgs: [],
- scripts: [],
- staticData: [],
- styles: [],
- title: null
- };
- try {
- const r = new URL(e.url, "https://hydrate.stenciljs.com/");
- t.url = r.href, t.host = r.host, t.hostname = r.hostname, t.href = r.href, t.port = r.port,
- t.pathname = r.pathname, t.search = r.search, t.hash = r.hash;
- } catch (e) {
- renderCatchError(t, e);
- }
- return t;
- }
- function renderBuildDiagnostic(e, t, r, s) {
- const n = {
- level: t,
- type: "build",
- header: r,
- messageText: s,
- relFilePath: null,
- absFilePath: null,
- lines: []
- };
- return e.pathname ? "/" !== e.pathname && (n.header += ": " + e.pathname) : e.url && (n.header += ": " + e.url),
- e.diagnostics.push(n), n;
- }
- function renderBuildError(e, t) {
- return renderBuildDiagnostic(e, "error", "Hydrate Error", t);
- }
- function renderCatchError(e, t) {
- const r = renderBuildError(e, null);
- return null != t && (null != t.stack ? r.messageText = t.stack.toString() : null != t.message ? r.messageText = t.message.toString() : r.messageText = t.toString()),
- r;
- }
- function runtimeLog(e, t, r) {
- global.console[t].apply(global.console, [ `[ ${e} ${t} ] `, ...r ]);
- }
- function inspectElement(e, t, r) {
- const s = t.children;
- for (let t = 0, n = s.length; t < n; t++) {
- const n = s[t], o = n.nodeName.toLowerCase();
- if (o.includes("-")) {
- const t = e.components.find((e => e.tag === o));
- null != t && (t.count++, r > t.depth && (t.depth = r));
- } else switch (o) {
- case "a":
- const t = collectAttributes(n);
- t.href = n.href, "string" == typeof t.href && (e.anchors.some((e => e.href === t.href)) || e.anchors.push(t));
- break;
- case "img":
- const r = collectAttributes(n);
- r.src = n.src, "string" == typeof r.src && (e.imgs.some((e => e.src === r.src)) || e.imgs.push(r));
- break;
- case "link":
- const s = collectAttributes(n);
- s.href = n.href, "string" == typeof s.rel && "stylesheet" === s.rel.toLowerCase() && "string" == typeof s.href && (e.styles.some((e => e.link === s.href)) || (delete s.rel,
- delete s.type, e.styles.push(s)));
- break;
- case "script":
- const o = collectAttributes(n);
- if (n.hasAttribute("src")) o.src = n.src, "string" == typeof o.src && (e.scripts.some((e => e.src === o.src)) || e.scripts.push(o)); else {
- const t = n.getAttribute("data-stencil-static");
- t && e.staticData.push({
- id: t,
- type: n.getAttribute("type"),
- content: n.textContent
- });
- }
- }
- inspectElement(e, n, ++r);
- }
- }
- function collectAttributes(e) {
- const t = {}, r = e.attributes;
- for (let e = 0, s = r.length; e < s; e++) {
- const s = r.item(e), n = s.nodeName.toLowerCase();
- if (SKIP_ATTRS.has(n)) continue;
- const o = s.nodeValue;
- "class" === n && "" === o || (t[n] = o);
- }
- return t;
- }
- function patchDomImplementation(e, t) {
- let r;
- if (null != e.defaultView ? (t.destroyWindow = !0, patchWindow(e.defaultView), r = e.defaultView) : (t.destroyWindow = !0,
- t.destroyDocument = !1, r = new MockWindow(!1)), r.document !== e && (r.document = e),
- e.defaultView !== r && (e.defaultView = r), "function" != typeof e.documentElement.constructor.prototype.getRootNode && (e.createElement("unknown-element").constructor.prototype.getRootNode = getRootNode),
- "function" == typeof e.createEvent) {
- const t = e.createEvent("CustomEvent").constructor;
- r.CustomEvent !== t && (r.CustomEvent = t);
- }
- try {
- e.baseURI;
- } catch (t) {
- Object.defineProperty(e, "baseURI", {
- get() {
- const t = e.querySelector("base[href]");
- return t ? new URL(t.getAttribute("href"), r.location.href).href : r.location.href;
- }
- });
- }
- return r;
- }
- function getRootNode(e) {
- const t = null != e && !0 === e.composed;
- let r = this;
- for (;null != r.parentNode; ) r = r.parentNode, !0 === t && null == r.parentNode && null != r.host && (r = r.host);
- return r;
- }
- function renderToString(e, t) {
- const r = normalizeHydrateOptions(t);
- return r.serializeToHtml = !0, new Promise((t => {
- let s;
- const n = generateHydrateResults(r);
- if (hasError(n.diagnostics)) t(n); else if ("string" == typeof e) try {
- r.destroyWindow = !0, r.destroyDocument = !0, s = new MockWindow(e), render(s, r, n, t);
- } catch (e) {
- s && s.close && s.close(), s = null, renderCatchError(n, e), t(n);
- } else if (isValidDocument(e)) try {
- r.destroyDocument = !1, s = patchDomImplementation(e, r), render(s, r, n, t);
- } catch (e) {
- s && s.close && s.close(), s = null, renderCatchError(n, e), t(n);
- } else renderBuildError(n, 'Invalid html or document. Must be either a valid "html" string, or DOM "document".'),
- t(n);
- }));
- }
- function hydrateDocument(e, t) {
- const r = normalizeHydrateOptions(t);
- return r.serializeToHtml = !1, new Promise((t => {
- let s;
- const n = generateHydrateResults(r);
- if (hasError(n.diagnostics)) t(n); else if ("string" == typeof e) try {
- r.destroyWindow = !0, r.destroyDocument = !0, s = new MockWindow(e), render(s, r, n, t);
- } catch (e) {
- s && s.close && s.close(), s = null, renderCatchError(n, e), t(n);
- } else if (isValidDocument(e)) try {
- r.destroyDocument = !1, s = patchDomImplementation(e, r), render(s, r, n, t);
- } catch (e) {
- s && s.close && s.close(), s = null, renderCatchError(n, e), t(n);
- } else renderBuildError(n, 'Invalid html or document. Must be either a valid "html" string, or DOM "document".'),
- t(n);
- }));
- }
- function render(e, t, r, s) {
- if (process.__stencilErrors || (process.__stencilErrors = !0, process.on("unhandledRejection", (e => {
- console.log("unhandledRejection", e);
- }))), function n(e, t, r, s) {
- try {
- e.location.href = r.url;
- } catch (e) {
- renderCatchError(s, e);
- }
- if ("string" == typeof r.userAgent) try {
- e.navigator.userAgent = r.userAgent;
- } catch (e) {}
- if ("string" == typeof r.cookie) try {
- t.cookie = r.cookie;
- } catch (e) {}
- if ("string" == typeof r.referrer) try {
- t.referrer = r.referrer;
- } catch (e) {}
- if ("string" == typeof r.direction) try {
- t.documentElement.setAttribute("dir", r.direction);
- } catch (e) {}
- if ("string" == typeof r.language) try {
- t.documentElement.setAttribute("lang", r.language);
- } catch (e) {}
- if ("string" == typeof r.buildId) try {
- t.documentElement.setAttribute("data-stencil-build", r.buildId);
- } catch (e) {}
- try {
- e.customElements = null;
- } catch (e) {}
- return r.constrainTimeouts && constrainTimeouts(e), function n(e, t, r) {
- try {
- const s = e.location.pathname;
- e.console.error = (...e) => {
- const n = e.reduce(((e, t) => {
- if (t) {
- if (null != t.stack) return e + " " + String(t.stack);
- if (null != t.message) return e + " " + String(t.message);
- }
- return String(t);
- }), "").trim();
- "" !== n && (renderCatchError(r, n), t.runtimeLogging && runtimeLog(s, "error", [ n ]));
- }, e.console.debug = (...e) => {
- renderBuildDiagnostic(r, "debug", "Hydrate Debug", [ ...e ].join(", ")), t.runtimeLogging && runtimeLog(s, "debug", e);
- }, t.runtimeLogging && [ "log", "warn", "assert", "info", "trace" ].forEach((t => {
- e.console[t] = (...e) => {
- runtimeLog(s, t, e);
- };
- }));
- } catch (e) {
- renderCatchError(r, e);
- }
- }(e, r, s), e;
- }(e, e.document, t, r), "function" == typeof t.beforeHydrate) try {
- const n = t.beforeHydrate(e.document);
- isPromise(n) ? n.then((() => {
- hydrateFactory(e, t, r, afterHydrate, s);
- })) : hydrateFactory(e, t, r, afterHydrate, s);
- } catch (n) {
- renderCatchError(r, n), finalizeHydrate(e, e.document, t, r, s);
- } else hydrateFactory(e, t, r, afterHydrate, s);
- }
- function afterHydrate(e, t, r, s) {
- if ("function" == typeof t.afterHydrate) try {
- const n = t.afterHydrate(e.document);
- isPromise(n) ? n.then((() => {
- finalizeHydrate(e, e.document, t, r, s);
- })) : finalizeHydrate(e, e.document, t, r, s);
- } catch (n) {
- renderCatchError(r, n), finalizeHydrate(e, e.document, t, r, s);
- } else finalizeHydrate(e, e.document, t, r, s);
- }
- function finalizeHydrate(e, t, r, s, n) {
- try {
- if (inspectElement(s, t.documentElement, 0), !1 !== r.removeUnusedStyles) try {
- ((e, t) => {
- try {
- const r = e.head.querySelectorAll("style[data-styles]"), s = r.length;
- if (s > 0) {
- const n = (e => {
- const t = {
- attrs: new Set,
- classNames: new Set,
- ids: new Set,
- tags: new Set
- };
- return collectUsedSelectors(t, e), t;
- })(e.documentElement);
- for (let e = 0; e < s; e++) removeUnusedStyleText(n, t, r[e]);
- }
- } catch (e) {
- ((e, t, r) => {
- const s = {
- level: "error",
- type: "build",
- header: "Build Error",
- messageText: "build error",
- relFilePath: null,
- absFilePath: null,
- lines: []
- };
- null != t && (null != t.stack ? s.messageText = t.stack.toString() : null != t.message ? s.messageText = t.message.length ? t.message : "UNKNOWN ERROR" : s.messageText = t.toString()),
- null == e || shouldIgnoreError(s.messageText) || e.push(s);
- })(t, e);
- }
- })(t, s.diagnostics);
- } catch (e) {
- renderCatchError(s, e);
- }
- if ("string" == typeof r.title) try {
- t.title = r.title;
- } catch (e) {
- renderCatchError(s, e);
- }
- s.title = t.title, r.removeScripts && removeScripts(t.documentElement);
- try {
- ((e, t) => {
- let r = e.head.querySelector('link[rel="canonical"]');
- "string" == typeof t ? (null == r && (r = e.createElement("link"), r.setAttribute("rel", "canonical"),
- e.head.appendChild(r)), r.setAttribute("href", t)) : null != r && (r.getAttribute("href") || r.parentNode.removeChild(r));
- })(t, r.canonicalUrl);
- } catch (e) {
- renderCatchError(s, e);
- }
- try {
- (e => {
- const t = e.head;
- let r = t.querySelector("meta[charset]");
- null == r ? (r = e.createElement("meta"), r.setAttribute("charset", "utf-8")) : r.remove(),
- t.insertBefore(r, t.firstChild);
- })(t);
- } catch (e) {}
- hasError(s.diagnostics) || (s.httpStatus = 200);
- try {
- const e = t.head.querySelector('meta[http-equiv="status"]');
- if (null != e) {
- const t = e.getAttribute("content");
- t && t.length > 0 && (s.httpStatus = parseInt(t, 10));
- }
- } catch (e) {}
- r.clientHydrateAnnotations && t.documentElement.classList.add("hydrated"), r.serializeToHtml && (s.html = serializeDocumentToString(t, r));
- } catch (e) {
- renderCatchError(s, e);
- }
- if (r.destroyWindow) try {
- r.destroyDocument || (e.document = null, t.defaultView = null), e.close && e.close();
- } catch (e) {
- renderCatchError(s, e);
- }
- n(s);
- }
- function serializeDocumentToString(e, t) {
- return serializeNodeToHtml(e, {
- approximateLineWidth: t.approximateLineWidth,
- outerHtml: !1,
- prettyHtml: t.prettyHtml,
- removeAttributeQuotes: t.removeAttributeQuotes,
- removeBooleanAttributeQuotes: t.removeBooleanAttributeQuotes,
- removeEmptyAttributes: t.removeEmptyAttributes,
- removeHtmlComments: t.removeHtmlComments,
- serializeShadowRoot: !1
- });
- }
- function isValidDocument(e) {
- return null != e && 9 === e.nodeType && null != e.documentElement && 1 === e.documentElement.nodeType && null != e.body && 1 === e.body.nodeType;
- }
- function removeScripts(e) {
- const t = e.children;
- for (let e = t.length - 1; e >= 0; e--) {
- const r = t[e];
- removeScripts(r), ("SCRIPT" === r.nodeName || "LINK" === r.nodeName && "modulepreload" === r.getAttribute("rel")) && r.remove();
- }
- }
- const templateWindows = new Map, createHydrateBuildId = () => {
- let e = "abcdefghijklmnopqrstuvwxyz", t = "";
- for (;t.length < 8; ) t += e[Math.floor(Math.random() * e.length)], 1 === t.length && (e += "0123456789");
- return t;
- }, isPromise = e => !!e && ("object" == typeof e || "function" == typeof e) && "function" == typeof e.then, hasError = e => null != e && 0 !== e.length && e.some((e => "error" === e.level && "runtime" !== e.type)), shouldIgnoreError = e => e === TASK_CANCELED_MSG, TASK_CANCELED_MSG = "task canceled", SKIP_ATTRS = new Set([ "s-id", "c-id" ]), collectUsedSelectors = (e, t) => {
- if (null != t && 1 === t.nodeType) {
- const r = t.children, s = t.nodeName.toLowerCase();
- e.tags.add(s);
- const n = t.attributes;
- for (let r = 0, s = n.length; r < s; r++) {
- const s = n.item(r), o = s.name.toLowerCase();
- if (e.attrs.add(o), "class" === o) {
- const r = t.classList;
- for (let t = 0, s = r.length; t < s; t++) e.classNames.add(r.item(t));
- } else "id" === o && e.ids.add(s.value);
- }
- if (r) for (let t = 0, s = r.length; t < s; t++) collectUsedSelectors(e, r[t]);
- }
- }, parseCss = (e, t) => {
- let r = 1, s = 1;
- const n = [], o = e => {
- const t = e.match(/\n/g);
- t && (r += t.length);
- const n = e.lastIndexOf("\n");
- s = ~n ? e.length - n : s + e.length;
- }, i = () => {
- const e = {
- line: r,
- column: s
- };
- return t => (t.position = new z(e), m(), t);
- }, a = o => {
- const i = e.split("\n"), a = {
- level: "error",
- type: "css",
- language: "css",
- header: "CSS Parse",
- messageText: o,
- absFilePath: t,
- lines: [ {
- lineIndex: r - 1,
- lineNumber: r,
- errorCharStart: s,
- text: e[r - 1]
- } ]
- };
- if (r > 1) {
- const t = {
- lineIndex: r - 1,
- lineNumber: r - 1,
- text: e[r - 2],
- errorCharStart: -1,
- errorLength: -1
- };
- a.lines.unshift(t);
- }
- if (r + 2 < i.length) {
- const e = {
- lineIndex: r,
- lineNumber: r + 1,
- text: i[r],
- errorCharStart: -1,
- errorLength: -1
- };
- a.lines.push(e);
- }
- return n.push(a), null;
- }, l = () => u(/^{\s*/), c = () => u(/^}/), u = t => {
- const r = t.exec(e);
- if (!r) return;
- const s = r[0];
- return o(s), e = e.slice(s.length), r;
- }, d = () => {
- let t;
- const r = [];
- for (m(), h(r); e.length && "}" !== e.charAt(0) && (t = w() || A()); ) !1 !== t && (r.push(t),
- h(r));
- return r;
- }, m = () => u(/^\s*/), h = e => {
- let t;
- for (e = e || []; t = p(); ) !1 !== t && e.push(t);
- return e;
- }, p = () => {
- const t = i();
- if ("/" !== e.charAt(0) || "*" !== e.charAt(1)) return null;
- let r = 2;
- for (;"" !== e.charAt(r) && ("*" !== e.charAt(r) || "/" !== e.charAt(r + 1)); ) ++r;
- if (r += 2, "" === e.charAt(r - 1)) return a("End of comment missing");
- const n = e.slice(2, r - 2);
- return s += 2, o(n), e = e.slice(r), s += 2, t({
- type: 1,
- comment: n
- });
- }, f = () => {
- const e = u(/^([^{]+)/);
- return e ? trim(e[0]).replace(/\/\*([^*]|[\r\n]|(\*+([^*/]|[\r\n])))*\*\/+/g, "").replace(/"(?:\\"|[^"])*"|'(?:\\'|[^'])*'/g, (function(e) {
- return e.replace(/,/g, "");
- })).split(/\s*(?![^(]*\)),\s*/).map((function(e) {
- return e.replace(/\u200C/g, ",");
- })) : null;
- }, g = () => {
- const e = i();
- let t = u(/^(\*?[-#\/\*\\\w]+(\[[0-9a-z_-]+\])?)\s*/);
- if (!t) return null;
- if (t = trim(t[0]), !u(/^:\s*/)) return a("property missing ':'");
- const r = u(/^((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|\([^\)]*?\)|[^};])+)/), s = e({
- type: 4,
- property: t.replace(commentre, ""),
- value: r ? trim(r[0]).replace(commentre, "") : ""
- });
- return u(/^[;\s]*/), s;
- }, y = () => {
- const e = [];
- if (!l()) return a("missing '{'");
- let t;
- for (h(e); t = g(); ) !1 !== t && (e.push(t), h(e));
- return c() ? e : a("missing '}'");
- }, C = () => {
- let e;
- const t = [], r = i();
- for (;e = u(/^((\d+\.\d+|\.\d+|\d+)%?|[a-z]+)\s*/); ) t.push(e[1]), u(/^,\s*/);
- return t.length ? r({
- type: 9,
- values: t,
- declarations: y()
- }) : null;
- }, S = (e, t) => {
- const r = new RegExp("^@" + e + "\\s*([^;]+);");
- return () => {
- const s = i(), n = u(r);
- if (!n) return null;
- const o = {
- type: t
- };
- return o[e] = n[1].trim(), s(o);
- };
- }, E = S("import", 7), b = S("charset", 0), T = S("namespace", 11), w = () => "@" !== e[0] ? null : (() => {
- const e = i();
- let t = u(/^@([-\w]+)?keyframes\s*/);
- if (!t) return null;
- const r = t[1];
- if (t = u(/^([-\w]+)\s*/), !t) return a("@keyframes missing name");
- const s = t[1];
- if (!l()) return a("@keyframes missing '{'");
- let n, o = h();
- for (;n = C(); ) o.push(n), o = o.concat(h());
- return c() ? e({
- type: 8,
- name: s,
- vendor: r,
- keyframes: o
- }) : a("@keyframes missing '}'");
- })() || (() => {
- const e = i(), t = u(/^@media *([^{]+)/);
- if (!t) return null;
- const r = trim(t[1]);
- if (!l()) return a("@media missing '{'");
- const s = h().concat(d());
- return c() ? e({
- type: 10,
- media: r,
- rules: s
- }) : a("@media missing '}'");
- })() || (() => {
- const e = i(), t = u(/^@custom-media\s+(--[^\s]+)\s*([^{;]+);/);
- return t ? e({
- type: 2,
- name: trim(t[1]),
- media: trim(t[2])
- }) : null;
- })() || (() => {
- const e = i(), t = u(/^@supports *([^{]+)/);
- if (!t) return null;
- const r = trim(t[1]);
- if (!l()) return a("@supports missing '{'");
- const s = h().concat(d());
- return c() ? e({
- type: 15,
- supports: r,
- rules: s
- }) : a("@supports missing '}'");
- })() || E() || b() || T() || (() => {
- const e = i(), t = u(/^@([-\w]+)?document *([^{]+)/);
- if (!t) return null;
- const r = trim(t[1]), s = trim(t[2]);
- if (!l()) return a("@document missing '{'");
- const n = h().concat(d());
- return c() ? e({
- type: 3,
- document: s,
- vendor: r,
- rules: n
- }) : a("@document missing '}'");
- })() || (() => {
- const e = i();
- if (!u(/^@page */)) return null;
- const t = f() || [];
- if (!l()) return a("@page missing '{'");
- let r, s = h();
- for (;r = g(); ) s.push(r), s = s.concat(h());
- return c() ? e({
- type: 12,
- selectors: t,
- declarations: s
- }) : a("@page missing '}'");
- })() || (() => {
- const e = i();
- if (!u(/^@host\s*/)) return null;
- if (!l()) return a("@host missing '{'");
- const t = h().concat(d());
- return c() ? e({
- type: 6,
- rules: t
- }) : a("@host missing '}'");
- })() || (() => {
- const e = i();
- if (!u(/^@font-face\s*/)) return null;
- if (!l()) return a("@font-face missing '{'");
- let t, r = h();
- for (;t = g(); ) r.push(t), r = r.concat(h());
- return c() ? e({
- type: 5,
- declarations: r
- }) : a("@font-face missing '}'");
- })(), A = () => {
- const e = i(), t = f();
- return t ? (h(), e({
- type: 13,
- selectors: t,
- declarations: y()
- })) : a("selector missing");
- };
- class z {
- constructor(e) {
- this.start = e, this.end = {
- line: r,
- column: s
- }, this.source = t;
- }
- }
- return z.prototype.content = e, {
- diagnostics: n,
- ...addParent((() => {
- const e = d();
- return {
- type: 14,
- stylesheet: {
- source: t,
- rules: e
- }
- };
- })())
- };
- }, trim = e => e ? e.trim() : "", addParent = (e, t) => {
- const r = e && "string" == typeof e.type, s = r ? e : t;
- for (const t in e) {
- const r = e[t];
- Array.isArray(r) ? r.forEach((function(e) {
- addParent(e, s);
- })) : r && "object" == typeof r && addParent(r, s);
- }
- return r && Object.defineProperty(e, "parent", {
- configurable: !0,
- writable: !0,
- enumerable: !1,
- value: t || null
- }), e;
- }, commentre = /\/\*[^*]*\*+([^/*][^*]*\*+)*\//g, getCssSelectors = e => {
- SELECTORS.all.length = SELECTORS.tags.length = SELECTORS.classNames.length = SELECTORS.ids.length = SELECTORS.attrs.length = 0;
- const t = (e = e.replace(/\./g, " .").replace(/\#/g, " #").replace(/\[/g, " [").replace(/\>/g, " > ").replace(/\+/g, " + ").replace(/\~/g, " ~ ").replace(/\*/g, " * ").replace(/\:not\((.*?)\)/g, " ")).split(" ");
- for (let e = 0, r = t.length; e < r; e++) t[e] = t[e].split(":")[0], 0 !== t[e].length && ("." === t[e].charAt(0) ? SELECTORS.classNames.push(t[e].slice(1)) : "#" === t[e].charAt(0) ? SELECTORS.ids.push(t[e].slice(1)) : "[" === t[e].charAt(0) ? (t[e] = t[e].slice(1).split("=")[0].split("]")[0].trim(),
- SELECTORS.attrs.push(t[e].toLowerCase())) : /[a-z]/g.test(t[e].charAt(0)) && SELECTORS.tags.push(t[e].toLowerCase()));
- return SELECTORS.classNames = SELECTORS.classNames.sort(((e, t) => e.length < t.length ? -1 : e.length > t.length ? 1 : 0)),
- SELECTORS;
- }, SELECTORS = {
- all: [],
- tags: [],
- classNames: [],
- ids: [],
- attrs: []
- }, serializeCssVisitNode = (e, t, r, s) => {
- const n = t.type;
- return 4 === n ? serializeCssDeclaration(t, r, s) : 13 === n ? serializeCssRule(e, t) : 1 === n ? "!" === t.comment[0] ? `/*${t.comment}*/` : "" : 10 === n ? serializeCssMedia(e, t) : 8 === n ? serializeCssKeyframes(e, t) : 9 === n ? serializeCssKeyframe(e, t) : 5 === n ? serializeCssFontFace(e, t) : 15 === n ? serializeCssSupports(e, t) : 7 === n ? "@import " + t.import + ";" : 0 === n ? "@charset " + t.charset + ";" : 12 === n ? serializeCssPage(e, t) : 6 === n ? "@host{" + serializeCssMapVisit(e, t.rules) + "}" : 2 === n ? "@custom-media " + t.name + " " + t.media + ";" : 3 === n ? serializeCssDocument(e, t) : 11 === n ? "@namespace " + t.namespace + ";" : "";
- }, serializeCssRule = (e, t) => {
- const r = t.declarations, s = e.usedSelectors, n = t.selectors.slice();
- if (null == r || 0 === r.length) return "";
- if (s) {
- let t, r, o = !0;
- for (t = n.length - 1; t >= 0; t--) {
- const i = getCssSelectors(n[t]);
- o = !0;
- let a = i.classNames.length;
- if (a > 0 && e.hasUsedClassNames) for (r = 0; r < a; r++) if (!s.classNames.has(i.classNames[r])) {
- o = !1;
- break;
- }
- if (o && e.hasUsedTags && (a = i.tags.length, a > 0)) for (r = 0; r < a; r++) if (!s.tags.has(i.tags[r])) {
- o = !1;
- break;
- }
- if (o && e.hasUsedAttrs && (a = i.attrs.length, a > 0)) for (r = 0; r < a; r++) if (!s.attrs.has(i.attrs[r])) {
- o = !1;
- break;
- }
- if (o && e.hasUsedIds && (a = i.ids.length, a > 0)) for (r = 0; r < a; r++) if (!s.ids.has(i.ids[r])) {
- o = !1;
- break;
- }
- o || n.splice(t, 1);
- }
- }
- if (0 === n.length) return "";
- const o = [];
- let i = "";
- for (const e of t.selectors) i = removeSelectorWhitespace(e), o.includes(i) || o.push(i);
- return `${o}{${serializeCssMapVisit(e, r)}}`;
- }, serializeCssDeclaration = (e, t, r) => "" === e.value ? "" : r - 1 === t ? e.property + ":" + e.value : e.property + ":" + e.value + ";", serializeCssMedia = (e, t) => {
- const r = serializeCssMapVisit(e, t.rules);
- return "" === r ? "" : "@media " + removeMediaWhitespace(t.media) + "{" + r + "}";
- }, serializeCssKeyframes = (e, t) => {
- const r = serializeCssMapVisit(e, t.keyframes);
- return "" === r ? "" : "@" + (t.vendor || "") + "keyframes " + t.name + "{" + r + "}";
- }, serializeCssKeyframe = (e, t) => t.values.join(",") + "{" + serializeCssMapVisit(e, t.declarations) + "}", serializeCssFontFace = (e, t) => {
- const r = serializeCssMapVisit(e, t.declarations);
- return "" === r ? "" : "@font-face{" + r + "}";
- }, serializeCssSupports = (e, t) => {
- const r = serializeCssMapVisit(e, t.rules);
- return "" === r ? "" : "@supports " + t.supports + "{" + r + "}";
- }, serializeCssPage = (e, t) => "@page " + t.selectors.join(", ") + "{" + serializeCssMapVisit(e, t.declarations) + "}", serializeCssDocument = (e, t) => {
- const r = serializeCssMapVisit(e, t.rules), s = "@" + (t.vendor || "") + "document " + t.document;
- return "" === r ? "" : s + "{" + r + "}";
- }, serializeCssMapVisit = (e, t) => {
- let r = "";
- if (t) for (let s = 0, n = t.length; s < n; s++) r += serializeCssVisitNode(e, t[s], s, n);
- return r;
- }, removeSelectorWhitespace = e => {
- let t = "", r = "", s = !1;
- for (let n = 0, o = (e = e.trim()).length; n < o; n++) if (r = e[n], "[" === r && "\\" !== t[t.length - 1] ? s = !0 : "]" === r && "\\" !== t[t.length - 1] && (s = !1),
- !s && CSS_WS_REG.test(r)) {
- if (CSS_NEXT_CHAR_REG.test(e[n + 1])) continue;
- if (CSS_PREV_CHAR_REG.test(t[t.length - 1])) continue;
- t += " ";
- } else t += r;
- return t;
- }, removeMediaWhitespace = e => {
- let t = "", r = "";
- for (let s = 0, n = (e = e.trim()).length; s < n; s++) if (r = e[s], CSS_WS_REG.test(r)) {
- if (CSS_WS_REG.test(t[t.length - 1])) continue;
- t += " ";
- } else t += r;
- return t;
- }, CSS_WS_REG = /\s/, CSS_NEXT_CHAR_REG = /[>\(\)\~\,\+\s]/, CSS_PREV_CHAR_REG = /[>\(\~\,\+]/, removeUnusedStyleText = (e, t, r) => {
- try {
- const s = parseCss(r.innerHTML);
- if (t.push(...s.diagnostics), hasError(t)) return;
- try {
- r.innerHTML = ((e, t) => {
- const r = t.usedSelectors || null, s = {
- usedSelectors: r || null,
- hasUsedAttrs: !!r && r.attrs.size > 0,
- hasUsedClassNames: !!r && r.classNames.size > 0,
- hasUsedIds: !!r && r.ids.size > 0,
- hasUsedTags: !!r && r.tags.size > 0
- }, n = e.rules;
- if (!n) return "";
- const o = n.length, i = [];
- for (let e = 0; e < o; e++) i.push(serializeCssVisitNode(s, n[e], e, o));
- return i.join("");
- })(s.stylesheet, {
- usedSelectors: e
- });
- } catch (e) {
- t.push({
- level: "warn",
- type: "css",
- header: "CSS Stringify",
- messageText: e
- });
- }
- } catch (e) {
- t.push({
- level: "warn",
- type: "css",
- header: "CSS Parse",
- messageText: e
- });
- }
- };
- exports.createWindowFromHtml = createWindowFromHtml;
- exports.hydrateDocument = hydrateDocument;
- exports.renderToString = renderToString;
- exports.serializeDocumentToString = serializeDocumentToString;
|