1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055305630573058305930603061306230633064306530663067306830693070307130723073307430753076307730783079308030813082308330843085308630873088308930903091309230933094309530963097309830993100310131023103310431053106310731083109311031113112311331143115311631173118311931203121312231233124312531263127312831293130313131323133313431353136313731383139314031413142314331443145314631473148314931503151315231533154315531563157315831593160316131623163316431653166316731683169317031713172317331743175317631773178317931803181318231833184318531863187318831893190319131923193319431953196319731983199320032013202320332043205320632073208320932103211321232133214321532163217321832193220322132223223322432253226322732283229323032313232323332343235323632373238323932403241324232433244324532463247324832493250325132523253325432553256325732583259326032613262326332643265326632673268326932703271327232733274327532763277327832793280328132823283328432853286328732883289329032913292329332943295329632973298329933003301330233033304330533063307330833093310331133123313331433153316331733183319332033213322332333243325332633273328332933303331333233333334333533363337333833393340334133423343334433453346334733483349335033513352335333543355335633573358335933603361336233633364336533663367336833693370337133723373337433753376337733783379338033813382338333843385338633873388338933903391339233933394339533963397339833993400340134023403340434053406340734083409341034113412341334143415341634173418341934203421342234233424342534263427342834293430343134323433343434353436343734383439344034413442344334443445344634473448344934503451345234533454345534563457345834593460346134623463346434653466346734683469347034713472347334743475347634773478347934803481348234833484348534863487348834893490349134923493349434953496349734983499350035013502350335043505350635073508350935103511351235133514351535163517351835193520352135223523352435253526352735283529353035313532353335343535353635373538353935403541354235433544354535463547354835493550355135523553355435553556355735583559356035613562356335643565356635673568356935703571357235733574357535763577357835793580358135823583358435853586358735883589359035913592359335943595359635973598359936003601360236033604360536063607360836093610361136123613361436153616361736183619362036213622362336243625362636273628362936303631363236333634363536363637363836393640364136423643364436453646364736483649365036513652365336543655365636573658365936603661366236633664366536663667366836693670367136723673367436753676367736783679368036813682368336843685368636873688368936903691369236933694369536963697369836993700370137023703370437053706370737083709371037113712371337143715371637173718371937203721372237233724372537263727372837293730373137323733373437353736373737383739374037413742374337443745374637473748374937503751375237533754375537563757375837593760376137623763376437653766376737683769377037713772377337743775377637773778377937803781378237833784378537863787378837893790379137923793379437953796379737983799380038013802380338043805380638073808380938103811381238133814381538163817381838193820382138223823382438253826382738283829383038313832383338343835383638373838383938403841384238433844384538463847384838493850385138523853385438553856385738583859386038613862386338643865386638673868386938703871387238733874387538763877387838793880388138823883388438853886388738883889389038913892389338943895389638973898389939003901390239033904390539063907390839093910391139123913391439153916391739183919392039213922392339243925392639273928392939303931393239333934393539363937393839393940394139423943394439453946394739483949395039513952395339543955395639573958395939603961396239633964396539663967396839693970397139723973397439753976397739783979398039813982398339843985398639873988398939903991399239933994399539963997399839994000400140024003400440054006400740084009401040114012401340144015401640174018401940204021402240234024402540264027402840294030403140324033403440354036403740384039404040414042404340444045404640474048404940504051405240534054405540564057405840594060406140624063406440654066406740684069407040714072407340744075407640774078407940804081408240834084408540864087408840894090409140924093409440954096409740984099410041014102410341044105410641074108410941104111411241134114411541164117411841194120412141224123412441254126412741284129413041314132413341344135413641374138413941404141414241434144414541464147414841494150415141524153415441554156415741584159416041614162416341644165416641674168416941704171417241734174417541764177417841794180418141824183418441854186418741884189419041914192419341944195419641974198419942004201420242034204420542064207420842094210421142124213421442154216421742184219422042214222422342244225422642274228422942304231423242334234423542364237423842394240424142424243424442454246424742484249425042514252425342544255425642574258425942604261426242634264426542664267426842694270427142724273427442754276427742784279428042814282428342844285428642874288428942904291429242934294429542964297429842994300430143024303430443054306430743084309431043114312431343144315431643174318431943204321432243234324432543264327432843294330433143324333433443354336433743384339434043414342434343444345434643474348434943504351435243534354435543564357435843594360436143624363436443654366436743684369437043714372437343744375437643774378437943804381438243834384438543864387438843894390439143924393439443954396439743984399440044014402440344044405440644074408440944104411441244134414441544164417441844194420442144224423442444254426442744284429443044314432443344344435443644374438443944404441444244434444444544464447444844494450445144524453445444554456445744584459446044614462446344644465446644674468446944704471447244734474447544764477447844794480448144824483448444854486448744884489449044914492449344944495449644974498449945004501450245034504450545064507450845094510451145124513451445154516451745184519452045214522452345244525452645274528452945304531453245334534453545364537453845394540454145424543454445454546454745484549455045514552455345544555455645574558455945604561456245634564456545664567456845694570457145724573457445754576457745784579458045814582458345844585458645874588458945904591459245934594459545964597459845994600460146024603460446054606460746084609461046114612461346144615461646174618461946204621462246234624462546264627462846294630463146324633463446354636463746384639464046414642464346444645464646474648464946504651465246534654465546564657465846594660466146624663466446654666466746684669467046714672467346744675467646774678467946804681468246834684468546864687468846894690469146924693469446954696469746984699470047014702470347044705470647074708470947104711471247134714471547164717471847194720472147224723472447254726472747284729473047314732473347344735473647374738473947404741474247434744474547464747474847494750475147524753475447554756475747584759476047614762476347644765476647674768476947704771477247734774477547764777477847794780478147824783478447854786478747884789479047914792479347944795479647974798479948004801480248034804480548064807480848094810481148124813481448154816481748184819482048214822482348244825482648274828482948304831483248334834483548364837483848394840484148424843484448454846484748484849485048514852485348544855485648574858485948604861486248634864486548664867486848694870487148724873487448754876487748784879488048814882488348844885488648874888488948904891489248934894489548964897489848994900490149024903490449054906490749084909491049114912491349144915491649174918491949204921492249234924492549264927492849294930493149324933493449354936493749384939494049414942494349444945494649474948494949504951495249534954495549564957495849594960496149624963496449654966496749684969497049714972497349744975497649774978497949804981498249834984498549864987498849894990499149924993499449954996499749984999500050015002500350045005500650075008500950105011501250135014501550165017501850195020502150225023502450255026502750285029503050315032503350345035503650375038503950405041504250435044504550465047504850495050505150525053505450555056505750585059506050615062506350645065506650675068506950705071507250735074507550765077507850795080508150825083508450855086508750885089509050915092509350945095509650975098509951005101510251035104510551065107510851095110511151125113511451155116511751185119512051215122512351245125512651275128512951305131513251335134513551365137513851395140514151425143514451455146514751485149515051515152515351545155515651575158515951605161516251635164516551665167516851695170517151725173517451755176517751785179518051815182518351845185518651875188518951905191519251935194519551965197519851995200520152025203520452055206520752085209521052115212521352145215521652175218521952205221522252235224522552265227522852295230523152325233523452355236523752385239524052415242524352445245524652475248524952505251525252535254525552565257525852595260526152625263526452655266526752685269527052715272527352745275527652775278527952805281528252835284528552865287528852895290529152925293529452955296529752985299530053015302530353045305530653075308530953105311531253135314531553165317531853195320532153225323532453255326532753285329533053315332533353345335533653375338533953405341534253435344534553465347534853495350535153525353535453555356535753585359536053615362536353645365536653675368536953705371537253735374537553765377537853795380538153825383538453855386538753885389539053915392539353945395539653975398539954005401540254035404540554065407540854095410541154125413541454155416541754185419542054215422542354245425542654275428542954305431543254335434543554365437543854395440544154425443544454455446544754485449545054515452545354545455545654575458545954605461546254635464546554665467546854695470547154725473547454755476547754785479548054815482548354845485548654875488548954905491549254935494549554965497549854995500550155025503550455055506550755085509551055115512551355145515551655175518551955205521552255235524552555265527552855295530553155325533553455355536553755385539554055415542554355445545554655475548554955505551555255535554555555565557555855595560556155625563556455655566556755685569557055715572557355745575557655775578557955805581558255835584558555865587558855895590559155925593559455955596559755985599560056015602560356045605560656075608560956105611561256135614561556165617561856195620562156225623562456255626562756285629563056315632563356345635563656375638563956405641564256435644564556465647564856495650565156525653565456555656565756585659566056615662566356645665566656675668566956705671567256735674567556765677567856795680568156825683568456855686568756885689569056915692569356945695569656975698569957005701570257035704570557065707570857095710571157125713571457155716571757185719572057215722572357245725572657275728572957305731573257335734573557365737573857395740574157425743574457455746574757485749575057515752575357545755575657575758575957605761576257635764576557665767576857695770577157725773577457755776577757785779578057815782578357845785578657875788578957905791579257935794579557965797579857995800580158025803580458055806580758085809581058115812581358145815581658175818581958205821582258235824582558265827582858295830583158325833583458355836583758385839584058415842584358445845584658475848584958505851585258535854585558565857585858595860586158625863586458655866586758685869587058715872587358745875587658775878587958805881588258835884588558865887588858895890589158925893589458955896589758985899590059015902590359045905590659075908590959105911591259135914591559165917591859195920592159225923592459255926592759285929593059315932593359345935593659375938593959405941594259435944594559465947594859495950595159525953595459555956595759585959596059615962596359645965596659675968596959705971597259735974597559765977597859795980598159825983598459855986598759885989599059915992599359945995599659975998599960006001600260036004600560066007600860096010601160126013601460156016601760186019602060216022602360246025602660276028602960306031603260336034603560366037603860396040604160426043604460456046604760486049605060516052605360546055605660576058605960606061606260636064606560666067606860696070607160726073607460756076607760786079608060816082608360846085608660876088608960906091609260936094609560966097609860996100610161026103610461056106610761086109611061116112611361146115611661176118611961206121612261236124612561266127612861296130613161326133613461356136613761386139614061416142614361446145614661476148614961506151615261536154615561566157615861596160616161626163616461656166616761686169617061716172617361746175617661776178617961806181618261836184618561866187618861896190619161926193619461956196619761986199620062016202620362046205620662076208620962106211621262136214621562166217621862196220622162226223622462256226622762286229623062316232623362346235623662376238623962406241624262436244624562466247624862496250625162526253625462556256625762586259626062616262626362646265626662676268626962706271627262736274627562766277627862796280628162826283628462856286628762886289629062916292629362946295629662976298629963006301630263036304630563066307630863096310631163126313631463156316631763186319632063216322632363246325632663276328632963306331633263336334633563366337633863396340634163426343634463456346634763486349635063516352635363546355635663576358635963606361636263636364636563666367636863696370637163726373637463756376637763786379638063816382638363846385638663876388638963906391639263936394639563966397639863996400640164026403640464056406640764086409641064116412641364146415641664176418641964206421642264236424642564266427642864296430643164326433643464356436643764386439644064416442644364446445644664476448644964506451645264536454645564566457645864596460646164626463646464656466646764686469647064716472647364746475647664776478647964806481648264836484648564866487648864896490649164926493649464956496649764986499650065016502650365046505650665076508650965106511651265136514651565166517651865196520652165226523652465256526652765286529653065316532653365346535653665376538653965406541654265436544654565466547654865496550655165526553655465556556655765586559656065616562656365646565656665676568656965706571657265736574657565766577657865796580658165826583658465856586658765886589659065916592659365946595659665976598659966006601660266036604660566066607660866096610661166126613661466156616661766186619662066216622662366246625662666276628662966306631663266336634663566366637663866396640664166426643664466456646664766486649665066516652665366546655665666576658665966606661666266636664666566666667666866696670667166726673667466756676667766786679668066816682668366846685668666876688668966906691669266936694669566966697669866996700670167026703670467056706670767086709671067116712671367146715671667176718671967206721672267236724672567266727672867296730673167326733673467356736673767386739674067416742674367446745674667476748674967506751675267536754675567566757675867596760676167626763676467656766676767686769677067716772677367746775677667776778677967806781678267836784678567866787678867896790679167926793679467956796679767986799680068016802680368046805680668076808680968106811681268136814681568166817681868196820682168226823682468256826682768286829683068316832683368346835683668376838683968406841684268436844684568466847684868496850685168526853685468556856685768586859686068616862686368646865686668676868686968706871687268736874687568766877687868796880688168826883688468856886688768886889689068916892689368946895689668976898689969006901690269036904690569066907690869096910691169126913691469156916691769186919692069216922692369246925692669276928692969306931693269336934693569366937693869396940694169426943694469456946694769486949695069516952695369546955695669576958695969606961696269636964696569666967696869696970697169726973697469756976697769786979698069816982698369846985698669876988698969906991699269936994699569966997699869997000700170027003700470057006700770087009701070117012701370147015701670177018701970207021702270237024702570267027702870297030703170327033703470357036703770387039704070417042704370447045704670477048704970507051705270537054705570567057705870597060706170627063706470657066706770687069707070717072707370747075707670777078707970807081708270837084708570867087708870897090709170927093709470957096709770987099710071017102710371047105710671077108710971107111711271137114711571167117711871197120712171227123712471257126712771287129713071317132713371347135713671377138713971407141714271437144714571467147714871497150715171527153715471557156715771587159716071617162716371647165716671677168716971707171717271737174717571767177717871797180718171827183718471857186718771887189719071917192719371947195719671977198719972007201720272037204720572067207720872097210721172127213721472157216721772187219722072217222722372247225722672277228722972307231723272337234723572367237723872397240724172427243724472457246724772487249725072517252725372547255725672577258725972607261726272637264726572667267726872697270727172727273727472757276727772787279728072817282728372847285728672877288728972907291729272937294729572967297729872997300730173027303730473057306730773087309731073117312731373147315731673177318731973207321732273237324732573267327732873297330733173327333733473357336733773387339734073417342734373447345734673477348734973507351735273537354735573567357735873597360736173627363736473657366736773687369737073717372737373747375737673777378737973807381738273837384738573867387738873897390739173927393739473957396739773987399740074017402740374047405740674077408740974107411741274137414741574167417741874197420742174227423742474257426742774287429743074317432743374347435743674377438743974407441744274437444744574467447744874497450745174527453745474557456745774587459746074617462746374647465746674677468746974707471747274737474747574767477747874797480748174827483748474857486748774887489749074917492749374947495749674977498749975007501750275037504750575067507750875097510751175127513751475157516751775187519752075217522752375247525752675277528752975307531753275337534753575367537753875397540754175427543754475457546754775487549755075517552755375547555755675577558755975607561756275637564756575667567756875697570757175727573757475757576757775787579758075817582758375847585758675877588758975907591759275937594759575967597759875997600760176027603760476057606760776087609761076117612761376147615761676177618761976207621762276237624762576267627762876297630763176327633763476357636763776387639764076417642764376447645764676477648764976507651765276537654765576567657765876597660766176627663766476657666766776687669767076717672767376747675767676777678767976807681768276837684768576867687768876897690769176927693769476957696769776987699770077017702770377047705770677077708770977107711771277137714771577167717771877197720772177227723772477257726772777287729773077317732773377347735773677377738773977407741774277437744774577467747774877497750775177527753775477557756775777587759776077617762776377647765776677677768776977707771777277737774777577767777777877797780778177827783778477857786778777887789779077917792779377947795779677977798779978007801780278037804780578067807780878097810781178127813781478157816781778187819782078217822782378247825782678277828782978307831783278337834783578367837783878397840784178427843784478457846784778487849785078517852785378547855785678577858785978607861786278637864786578667867786878697870787178727873787478757876787778787879788078817882788378847885788678877888788978907891789278937894789578967897789878997900790179027903790479057906790779087909791079117912791379147915791679177918791979207921792279237924792579267927792879297930793179327933793479357936793779387939794079417942794379447945794679477948794979507951795279537954795579567957795879597960796179627963796479657966796779687969797079717972797379747975797679777978797979807981798279837984798579867987798879897990799179927993799479957996799779987999800080018002800380048005800680078008800980108011801280138014801580168017801880198020802180228023802480258026802780288029803080318032803380348035803680378038803980408041804280438044804580468047804880498050805180528053805480558056805780588059806080618062806380648065806680678068806980708071807280738074807580768077807880798080808180828083808480858086808780888089809080918092809380948095809680978098809981008101810281038104810581068107810881098110811181128113811481158116811781188119812081218122812381248125812681278128812981308131813281338134813581368137813881398140814181428143814481458146814781488149815081518152815381548155815681578158815981608161816281638164816581668167816881698170817181728173817481758176817781788179818081818182818381848185818681878188818981908191819281938194819581968197819881998200820182028203820482058206820782088209821082118212821382148215821682178218821982208221822282238224822582268227822882298230823182328233823482358236823782388239824082418242824382448245824682478248824982508251825282538254825582568257825882598260826182628263826482658266826782688269827082718272827382748275827682778278827982808281828282838284828582868287828882898290829182928293829482958296829782988299830083018302830383048305830683078308830983108311831283138314831583168317831883198320832183228323832483258326832783288329833083318332833383348335833683378338833983408341834283438344834583468347834883498350835183528353835483558356835783588359836083618362836383648365836683678368836983708371837283738374837583768377837883798380838183828383838483858386838783888389839083918392839383948395839683978398839984008401840284038404840584068407840884098410841184128413841484158416841784188419842084218422842384248425842684278428842984308431843284338434843584368437843884398440844184428443844484458446844784488449845084518452845384548455845684578458845984608461846284638464846584668467846884698470847184728473847484758476847784788479848084818482848384848485848684878488848984908491849284938494849584968497849884998500850185028503850485058506850785088509851085118512851385148515851685178518851985208521852285238524852585268527852885298530853185328533853485358536853785388539854085418542854385448545854685478548854985508551855285538554855585568557855885598560856185628563856485658566856785688569857085718572857385748575857685778578857985808581858285838584858585868587858885898590859185928593859485958596859785988599860086018602860386048605860686078608860986108611861286138614861586168617861886198620862186228623862486258626862786288629863086318632863386348635863686378638863986408641864286438644864586468647864886498650865186528653865486558656865786588659866086618662866386648665866686678668866986708671867286738674867586768677867886798680868186828683868486858686868786888689869086918692869386948695869686978698869987008701870287038704870587068707870887098710871187128713871487158716871787188719872087218722872387248725872687278728872987308731873287338734873587368737873887398740874187428743874487458746874787488749875087518752875387548755875687578758875987608761876287638764876587668767876887698770877187728773877487758776877787788779878087818782878387848785878687878788878987908791879287938794879587968797879887998800880188028803880488058806880788088809881088118812881388148815881688178818881988208821882288238824882588268827882888298830883188328833883488358836883788388839884088418842884388448845884688478848884988508851885288538854885588568857885888598860886188628863886488658866886788688869887088718872887388748875887688778878887988808881888288838884888588868887888888898890889188928893889488958896889788988899890089018902890389048905890689078908890989108911891289138914891589168917891889198920892189228923892489258926892789288929893089318932893389348935893689378938893989408941894289438944894589468947894889498950895189528953895489558956895789588959896089618962896389648965896689678968896989708971897289738974897589768977897889798980898189828983898489858986898789888989899089918992899389948995899689978998899990009001900290039004900590069007900890099010901190129013901490159016901790189019902090219022902390249025902690279028902990309031903290339034903590369037903890399040904190429043904490459046904790489049905090519052905390549055905690579058905990609061906290639064906590669067906890699070907190729073907490759076907790789079908090819082908390849085908690879088908990909091909290939094909590969097909890999100910191029103910491059106910791089109911091119112911391149115911691179118911991209121912291239124912591269127912891299130913191329133913491359136913791389139914091419142914391449145914691479148914991509151915291539154915591569157915891599160916191629163916491659166916791689169917091719172917391749175917691779178917991809181918291839184918591869187918891899190919191929193919491959196919791989199920092019202920392049205920692079208920992109211921292139214921592169217921892199220922192229223922492259226922792289229923092319232923392349235923692379238923992409241924292439244924592469247924892499250925192529253925492559256925792589259926092619262926392649265926692679268926992709271927292739274927592769277927892799280928192829283928492859286928792889289929092919292929392949295929692979298929993009301930293039304930593069307930893099310931193129313931493159316931793189319932093219322932393249325932693279328932993309331933293339334933593369337933893399340934193429343934493459346934793489349935093519352935393549355935693579358935993609361936293639364936593669367936893699370937193729373937493759376937793789379938093819382938393849385938693879388938993909391939293939394939593969397939893999400940194029403940494059406940794089409941094119412941394149415941694179418941994209421942294239424942594269427942894299430943194329433943494359436943794389439944094419442944394449445944694479448944994509451945294539454945594569457945894599460946194629463946494659466946794689469947094719472947394749475947694779478947994809481948294839484948594869487948894899490949194929493949494959496949794989499950095019502950395049505950695079508950995109511951295139514951595169517951895199520952195229523952495259526952795289529953095319532953395349535953695379538953995409541954295439544954595469547954895499550955195529553955495559556955795589559956095619562956395649565956695679568956995709571957295739574957595769577957895799580958195829583958495859586958795889589959095919592959395949595959695979598959996009601960296039604960596069607960896099610961196129613961496159616961796189619962096219622962396249625962696279628962996309631963296339634963596369637963896399640964196429643964496459646964796489649965096519652965396549655965696579658965996609661966296639664966596669667966896699670967196729673967496759676967796789679968096819682968396849685968696879688968996909691969296939694969596969697969896999700970197029703970497059706970797089709971097119712971397149715971697179718971997209721972297239724972597269727972897299730973197329733973497359736973797389739974097419742974397449745974697479748974997509751975297539754975597569757975897599760976197629763976497659766976797689769977097719772977397749775977697779778977997809781978297839784978597869787978897899790979197929793979497959796979797989799980098019802980398049805980698079808980998109811981298139814981598169817981898199820982198229823982498259826982798289829983098319832983398349835983698379838983998409841984298439844984598469847984898499850985198529853985498559856985798589859986098619862986398649865986698679868986998709871987298739874987598769877987898799880988198829883988498859886988798889889989098919892989398949895989698979898989999009901990299039904990599069907990899099910991199129913991499159916991799189919992099219922992399249925992699279928992999309931993299339934993599369937993899399940994199429943994499459946994799489949995099519952995399549955995699579958995999609961996299639964996599669967996899699970997199729973997499759976997799789979998099819982998399849985998699879988998999909991999299939994999599969997999899991000010001100021000310004100051000610007100081000910010100111001210013100141001510016100171001810019100201002110022100231002410025100261002710028100291003010031100321003310034100351003610037100381003910040100411004210043100441004510046100471004810049100501005110052100531005410055100561005710058100591006010061100621006310064100651006610067100681006910070100711007210073100741007510076100771007810079100801008110082100831008410085100861008710088100891009010091100921009310094100951009610097100981009910100101011010210103101041010510106101071010810109101101011110112101131011410115101161011710118101191012010121101221012310124101251012610127101281012910130101311013210133101341013510136101371013810139101401014110142101431014410145101461014710148101491015010151101521015310154101551015610157101581015910160101611016210163101641016510166101671016810169101701017110172101731017410175101761017710178101791018010181101821018310184101851018610187101881018910190101911019210193101941019510196101971019810199102001020110202102031020410205102061020710208102091021010211102121021310214102151021610217102181021910220102211022210223102241022510226102271022810229102301023110232102331023410235102361023710238102391024010241102421024310244102451024610247102481024910250102511025210253102541025510256102571025810259102601026110262102631026410265102661026710268102691027010271102721027310274102751027610277102781027910280102811028210283102841028510286102871028810289102901029110292102931029410295102961029710298102991030010301103021030310304103051030610307103081030910310103111031210313103141031510316103171031810319103201032110322103231032410325103261032710328103291033010331103321033310334103351033610337103381033910340103411034210343103441034510346103471034810349103501035110352103531035410355103561035710358103591036010361103621036310364103651036610367103681036910370103711037210373103741037510376103771037810379103801038110382103831038410385103861038710388103891039010391103921039310394103951039610397103981039910400104011040210403104041040510406104071040810409104101041110412104131041410415104161041710418104191042010421104221042310424104251042610427104281042910430104311043210433104341043510436104371043810439104401044110442104431044410445104461044710448104491045010451104521045310454104551045610457104581045910460104611046210463104641046510466104671046810469104701047110472104731047410475104761047710478104791048010481104821048310484104851048610487104881048910490104911049210493104941049510496104971049810499105001050110502105031050410505105061050710508105091051010511105121051310514105151051610517105181051910520105211052210523105241052510526105271052810529105301053110532105331053410535105361053710538105391054010541105421054310544105451054610547105481054910550105511055210553105541055510556105571055810559105601056110562105631056410565105661056710568105691057010571105721057310574105751057610577105781057910580105811058210583105841058510586105871058810589105901059110592105931059410595105961059710598105991060010601106021060310604106051060610607106081060910610106111061210613106141061510616106171061810619106201062110622106231062410625106261062710628106291063010631106321063310634106351063610637106381063910640106411064210643106441064510646106471064810649106501065110652106531065410655106561065710658106591066010661106621066310664106651066610667106681066910670106711067210673106741067510676106771067810679106801068110682106831068410685106861068710688106891069010691106921069310694106951069610697106981069910700107011070210703107041070510706107071070810709107101071110712107131071410715107161071710718107191072010721107221072310724107251072610727107281072910730107311073210733107341073510736107371073810739107401074110742107431074410745107461074710748107491075010751107521075310754107551075610757107581075910760107611076210763107641076510766107671076810769107701077110772107731077410775107761077710778107791078010781107821078310784107851078610787107881078910790107911079210793107941079510796107971079810799108001080110802108031080410805108061080710808108091081010811108121081310814108151081610817108181081910820108211082210823108241082510826108271082810829108301083110832108331083410835108361083710838108391084010841108421084310844108451084610847108481084910850108511085210853108541085510856108571085810859108601086110862108631086410865108661086710868108691087010871108721087310874108751087610877108781087910880108811088210883108841088510886108871088810889108901089110892108931089410895108961089710898108991090010901109021090310904109051090610907109081090910910109111091210913109141091510916109171091810919109201092110922109231092410925109261092710928109291093010931109321093310934109351093610937109381093910940109411094210943109441094510946109471094810949109501095110952109531095410955109561095710958109591096010961109621096310964109651096610967109681096910970109711097210973109741097510976109771097810979109801098110982109831098410985109861098710988109891099010991109921099310994109951099610997109981099911000110011100211003110041100511006110071100811009110101101111012110131101411015110161101711018110191102011021110221102311024110251102611027110281102911030110311103211033110341103511036110371103811039110401104111042110431104411045110461104711048110491105011051110521105311054110551105611057110581105911060110611106211063110641106511066110671106811069110701107111072110731107411075110761107711078110791108011081110821108311084110851108611087110881108911090110911109211093110941109511096110971109811099111001110111102111031110411105111061110711108111091111011111111121111311114111151111611117111181111911120111211112211123111241112511126111271112811129111301113111132111331113411135111361113711138111391114011141111421114311144111451114611147111481114911150111511115211153111541115511156111571115811159111601116111162111631116411165111661116711168111691117011171111721117311174111751117611177111781117911180111811118211183111841118511186111871118811189111901119111192111931119411195111961119711198111991120011201112021120311204112051120611207112081120911210112111121211213112141121511216112171121811219112201122111222112231122411225112261122711228112291123011231112321123311234112351123611237112381123911240112411124211243112441124511246112471124811249112501125111252112531125411255112561125711258112591126011261112621126311264112651126611267112681126911270112711127211273112741127511276112771127811279112801128111282112831128411285112861128711288112891129011291112921129311294112951129611297112981129911300113011130211303113041130511306113071130811309113101131111312113131131411315113161131711318113191132011321113221132311324113251132611327113281132911330113311133211333113341133511336113371133811339113401134111342113431134411345113461134711348113491135011351113521135311354113551135611357113581135911360113611136211363113641136511366113671136811369113701137111372113731137411375113761137711378113791138011381113821138311384113851138611387113881138911390113911139211393113941139511396113971139811399114001140111402114031140411405114061140711408114091141011411114121141311414114151141611417114181141911420114211142211423114241142511426114271142811429114301143111432114331143411435114361143711438114391144011441114421144311444114451144611447114481144911450114511145211453114541145511456114571145811459114601146111462114631146411465114661146711468114691147011471114721147311474114751147611477114781147911480114811148211483114841148511486114871148811489114901149111492114931149411495114961149711498114991150011501115021150311504115051150611507115081150911510115111151211513115141151511516115171151811519115201152111522115231152411525115261152711528115291153011531115321153311534115351153611537115381153911540115411154211543115441154511546115471154811549115501155111552115531155411555115561155711558115591156011561115621156311564115651156611567115681156911570115711157211573115741157511576115771157811579115801158111582115831158411585115861158711588115891159011591115921159311594115951159611597115981159911600116011160211603116041160511606116071160811609116101161111612116131161411615116161161711618116191162011621116221162311624116251162611627116281162911630116311163211633116341163511636116371163811639116401164111642116431164411645116461164711648116491165011651116521165311654116551165611657116581165911660116611166211663116641166511666116671166811669116701167111672116731167411675116761167711678116791168011681116821168311684116851168611687116881168911690116911169211693116941169511696116971169811699117001170111702117031170411705117061170711708117091171011711117121171311714117151171611717117181171911720117211172211723117241172511726117271172811729117301173111732117331173411735117361173711738117391174011741117421174311744117451174611747117481174911750117511175211753117541175511756117571175811759117601176111762117631176411765117661176711768117691177011771117721177311774117751177611777117781177911780117811178211783117841178511786117871178811789117901179111792117931179411795117961179711798117991180011801118021180311804118051180611807118081180911810118111181211813118141181511816118171181811819118201182111822118231182411825118261182711828118291183011831118321183311834118351183611837118381183911840118411184211843118441184511846118471184811849118501185111852118531185411855118561185711858118591186011861118621186311864118651186611867118681186911870118711187211873118741187511876118771187811879118801188111882118831188411885118861188711888118891189011891118921189311894118951189611897118981189911900119011190211903119041190511906119071190811909119101191111912119131191411915119161191711918119191192011921119221192311924119251192611927119281192911930119311193211933119341193511936119371193811939119401194111942119431194411945119461194711948119491195011951119521195311954119551195611957119581195911960119611196211963119641196511966119671196811969119701197111972119731197411975119761197711978119791198011981119821198311984119851198611987119881198911990119911199211993119941199511996119971199811999120001200112002120031200412005120061200712008120091201012011120121201312014120151201612017120181201912020120211202212023120241202512026120271202812029120301203112032120331203412035120361203712038120391204012041120421204312044120451204612047120481204912050120511205212053120541205512056120571205812059120601206112062120631206412065120661206712068120691207012071120721207312074120751207612077120781207912080120811208212083120841208512086120871208812089120901209112092120931209412095120961209712098120991210012101121021210312104121051210612107121081210912110121111211212113121141211512116121171211812119121201212112122121231212412125121261212712128121291213012131121321213312134121351213612137121381213912140121411214212143121441214512146121471214812149121501215112152121531215412155121561215712158121591216012161121621216312164121651216612167121681216912170121711217212173121741217512176121771217812179121801218112182121831218412185121861218712188121891219012191121921219312194121951219612197121981219912200122011220212203122041220512206122071220812209122101221112212122131221412215122161221712218122191222012221122221222312224122251222612227122281222912230122311223212233122341223512236122371223812239122401224112242122431224412245122461224712248122491225012251122521225312254122551225612257122581225912260122611226212263122641226512266122671226812269122701227112272122731227412275122761227712278122791228012281122821228312284122851228612287122881228912290122911229212293122941229512296122971229812299123001230112302123031230412305123061230712308123091231012311123121231312314123151231612317123181231912320123211232212323123241232512326123271232812329123301233112332123331233412335123361233712338123391234012341123421234312344123451234612347123481234912350123511235212353123541235512356123571235812359123601236112362123631236412365123661236712368123691237012371123721237312374123751237612377123781237912380123811238212383123841238512386123871238812389123901239112392123931239412395123961239712398123991240012401124021240312404124051240612407124081240912410124111241212413124141241512416124171241812419124201242112422124231242412425124261242712428124291243012431124321243312434124351243612437124381243912440124411244212443124441244512446124471244812449124501245112452124531245412455124561245712458124591246012461124621246312464124651246612467124681246912470124711247212473124741247512476124771247812479124801248112482124831248412485124861248712488124891249012491124921249312494124951249612497124981249912500125011250212503125041250512506125071250812509125101251112512125131251412515125161251712518125191252012521125221252312524125251252612527125281252912530125311253212533125341253512536125371253812539125401254112542125431254412545125461254712548125491255012551125521255312554125551255612557125581255912560125611256212563125641256512566125671256812569125701257112572125731257412575125761257712578125791258012581125821258312584125851258612587125881258912590125911259212593125941259512596125971259812599126001260112602126031260412605126061260712608126091261012611126121261312614126151261612617126181261912620126211262212623126241262512626126271262812629126301263112632126331263412635126361263712638126391264012641126421264312644126451264612647126481264912650126511265212653126541265512656126571265812659126601266112662126631266412665126661266712668126691267012671126721267312674126751267612677126781267912680126811268212683126841268512686126871268812689126901269112692126931269412695126961269712698126991270012701127021270312704127051270612707127081270912710127111271212713127141271512716127171271812719127201272112722127231272412725127261272712728127291273012731127321273312734127351273612737127381273912740127411274212743127441274512746127471274812749127501275112752127531275412755127561275712758127591276012761127621276312764127651276612767127681276912770127711277212773127741277512776127771277812779127801278112782127831278412785127861278712788127891279012791127921279312794127951279612797127981279912800128011280212803128041280512806128071280812809128101281112812128131281412815128161281712818128191282012821128221282312824128251282612827128281282912830128311283212833128341283512836128371283812839128401284112842128431284412845128461284712848128491285012851128521285312854128551285612857128581285912860128611286212863128641286512866128671286812869128701287112872128731287412875128761287712878128791288012881128821288312884128851288612887128881288912890128911289212893128941289512896128971289812899129001290112902129031290412905129061290712908129091291012911129121291312914129151291612917129181291912920129211292212923129241292512926129271292812929129301293112932129331293412935129361293712938129391294012941129421294312944129451294612947129481294912950129511295212953129541295512956129571295812959129601296112962129631296412965129661296712968129691297012971129721297312974129751297612977129781297912980129811298212983129841298512986129871298812989129901299112992129931299412995129961299712998129991300013001130021300313004130051300613007130081300913010130111301213013130141301513016130171301813019130201302113022130231302413025130261302713028130291303013031130321303313034130351303613037130381303913040130411304213043130441304513046130471304813049130501305113052130531305413055130561305713058130591306013061130621306313064130651306613067130681306913070130711307213073130741307513076130771307813079130801308113082130831308413085130861308713088130891309013091130921309313094130951309613097130981309913100131011310213103131041310513106131071310813109131101311113112131131311413115131161311713118131191312013121131221312313124131251312613127131281312913130131311313213133131341313513136131371313813139131401314113142131431314413145131461314713148131491315013151131521315313154131551315613157131581315913160131611316213163131641316513166131671316813169131701317113172131731317413175131761317713178131791318013181131821318313184131851318613187131881318913190131911319213193131941319513196131971319813199132001320113202132031320413205132061320713208132091321013211132121321313214132151321613217132181321913220132211322213223132241322513226132271322813229132301323113232132331323413235132361323713238132391324013241132421324313244132451324613247132481324913250132511325213253132541325513256132571325813259132601326113262132631326413265132661326713268132691327013271132721327313274132751327613277132781327913280132811328213283132841328513286132871328813289132901329113292132931329413295132961329713298132991330013301133021330313304133051330613307133081330913310133111331213313133141331513316133171331813319133201332113322133231332413325133261332713328133291333013331133321333313334133351333613337133381333913340133411334213343133441334513346133471334813349133501335113352133531335413355133561335713358133591336013361133621336313364133651336613367133681336913370133711337213373133741337513376133771337813379133801338113382133831338413385133861338713388133891339013391133921339313394133951339613397133981339913400134011340213403134041340513406134071340813409134101341113412134131341413415134161341713418134191342013421134221342313424134251342613427134281342913430134311343213433134341343513436134371343813439134401344113442134431344413445134461344713448134491345013451134521345313454134551345613457134581345913460134611346213463134641346513466134671346813469134701347113472134731347413475134761347713478134791348013481134821348313484134851348613487134881348913490134911349213493134941349513496134971349813499135001350113502135031350413505135061350713508135091351013511135121351313514135151351613517135181351913520135211352213523135241352513526135271352813529135301353113532135331353413535135361353713538135391354013541135421354313544135451354613547135481354913550135511355213553135541355513556135571355813559135601356113562135631356413565135661356713568135691357013571135721357313574135751357613577135781357913580135811358213583135841358513586135871358813589135901359113592135931359413595135961359713598135991360013601136021360313604136051360613607136081360913610136111361213613136141361513616136171361813619136201362113622136231362413625136261362713628136291363013631136321363313634136351363613637136381363913640136411364213643136441364513646136471364813649136501365113652136531365413655136561365713658136591366013661136621366313664136651366613667136681366913670136711367213673136741367513676136771367813679136801368113682136831368413685136861368713688136891369013691136921369313694136951369613697136981369913700137011370213703137041370513706137071370813709137101371113712137131371413715137161371713718137191372013721137221372313724137251372613727137281372913730137311373213733137341373513736137371373813739137401374113742137431374413745137461374713748137491375013751137521375313754137551375613757137581375913760137611376213763137641376513766137671376813769137701377113772137731377413775137761377713778137791378013781137821378313784137851378613787137881378913790137911379213793137941379513796137971379813799138001380113802138031380413805138061380713808138091381013811138121381313814138151381613817138181381913820138211382213823138241382513826138271382813829138301383113832138331383413835138361383713838138391384013841138421384313844138451384613847138481384913850138511385213853138541385513856138571385813859138601386113862138631386413865138661386713868138691387013871138721387313874138751387613877138781387913880138811388213883138841388513886138871388813889138901389113892138931389413895138961389713898138991390013901139021390313904139051390613907139081390913910139111391213913139141391513916139171391813919139201392113922139231392413925139261392713928139291393013931139321393313934139351393613937139381393913940139411394213943139441394513946139471394813949139501395113952139531395413955139561395713958139591396013961139621396313964139651396613967139681396913970139711397213973139741397513976139771397813979139801398113982139831398413985139861398713988139891399013991139921399313994139951399613997139981399914000140011400214003140041400514006140071400814009140101401114012140131401414015140161401714018140191402014021140221402314024140251402614027140281402914030140311403214033140341403514036140371403814039140401404114042140431404414045140461404714048140491405014051140521405314054140551405614057140581405914060140611406214063140641406514066140671406814069140701407114072140731407414075140761407714078140791408014081140821408314084140851408614087140881408914090140911409214093140941409514096140971409814099141001410114102141031410414105141061410714108141091411014111141121411314114141151411614117141181411914120141211412214123141241412514126141271412814129141301413114132141331413414135141361413714138141391414014141141421414314144141451414614147141481414914150141511415214153141541415514156141571415814159141601416114162141631416414165141661416714168141691417014171141721417314174141751417614177141781417914180141811418214183141841418514186141871418814189141901419114192141931419414195141961419714198141991420014201142021420314204142051420614207142081420914210142111421214213142141421514216142171421814219142201422114222142231422414225142261422714228142291423014231142321423314234142351423614237142381423914240142411424214243142441424514246142471424814249142501425114252142531425414255142561425714258142591426014261142621426314264142651426614267142681426914270142711427214273142741427514276142771427814279142801428114282142831428414285142861428714288142891429014291142921429314294142951429614297142981429914300143011430214303143041430514306143071430814309143101431114312143131431414315143161431714318143191432014321143221432314324143251432614327143281432914330143311433214333143341433514336143371433814339143401434114342143431434414345143461434714348143491435014351143521435314354143551435614357143581435914360143611436214363143641436514366143671436814369143701437114372143731437414375143761437714378143791438014381143821438314384143851438614387143881438914390143911439214393143941439514396143971439814399144001440114402144031440414405144061440714408144091441014411144121441314414144151441614417144181441914420144211442214423144241442514426144271442814429144301443114432144331443414435144361443714438144391444014441144421444314444144451444614447144481444914450144511445214453144541445514456144571445814459144601446114462144631446414465144661446714468144691447014471144721447314474144751447614477144781447914480144811448214483144841448514486144871448814489144901449114492144931449414495144961449714498144991450014501145021450314504145051450614507145081450914510145111451214513145141451514516145171451814519145201452114522145231452414525145261452714528145291453014531145321453314534145351453614537145381453914540145411454214543145441454514546145471454814549145501455114552145531455414555145561455714558145591456014561145621456314564145651456614567145681456914570145711457214573145741457514576145771457814579145801458114582145831458414585145861458714588145891459014591145921459314594145951459614597145981459914600146011460214603146041460514606146071460814609146101461114612146131461414615146161461714618146191462014621146221462314624146251462614627146281462914630146311463214633146341463514636146371463814639146401464114642146431464414645146461464714648146491465014651146521465314654146551465614657146581465914660146611466214663146641466514666146671466814669146701467114672146731467414675146761467714678146791468014681146821468314684146851468614687146881468914690146911469214693146941469514696146971469814699147001470114702147031470414705147061470714708147091471014711147121471314714147151471614717147181471914720147211472214723147241472514726147271472814729147301473114732147331473414735147361473714738147391474014741147421474314744147451474614747147481474914750147511475214753147541475514756147571475814759147601476114762147631476414765147661476714768147691477014771147721477314774147751477614777147781477914780147811478214783147841478514786147871478814789147901479114792147931479414795147961479714798147991480014801148021480314804148051480614807148081480914810148111481214813148141481514816148171481814819148201482114822148231482414825148261482714828148291483014831148321483314834148351483614837148381483914840148411484214843148441484514846148471484814849148501485114852148531485414855148561485714858148591486014861148621486314864148651486614867148681486914870148711487214873148741487514876148771487814879148801488114882148831488414885148861488714888148891489014891148921489314894148951489614897148981489914900149011490214903149041490514906149071490814909149101491114912149131491414915149161491714918149191492014921149221492314924149251492614927149281492914930149311493214933149341493514936149371493814939149401494114942149431494414945149461494714948149491495014951149521495314954149551495614957149581495914960149611496214963149641496514966149671496814969149701497114972149731497414975149761497714978149791498014981149821498314984149851498614987149881498914990149911499214993149941499514996149971499814999150001500115002150031500415005150061500715008150091501015011150121501315014150151501615017150181501915020150211502215023150241502515026150271502815029150301503115032150331503415035150361503715038150391504015041150421504315044150451504615047150481504915050150511505215053150541505515056150571505815059150601506115062150631506415065150661506715068150691507015071150721507315074150751507615077150781507915080150811508215083150841508515086150871508815089150901509115092150931509415095150961509715098150991510015101151021510315104151051510615107151081510915110151111511215113151141511515116151171511815119151201512115122151231512415125151261512715128151291513015131151321513315134151351513615137151381513915140151411514215143151441514515146151471514815149151501515115152151531515415155151561515715158151591516015161151621516315164151651516615167151681516915170151711517215173151741517515176151771517815179151801518115182151831518415185151861518715188151891519015191151921519315194151951519615197151981519915200152011520215203152041520515206152071520815209152101521115212152131521415215152161521715218152191522015221152221522315224152251522615227152281522915230152311523215233152341523515236152371523815239152401524115242152431524415245152461524715248152491525015251152521525315254152551525615257152581525915260152611526215263152641526515266152671526815269152701527115272152731527415275152761527715278152791528015281152821528315284152851528615287152881528915290152911529215293152941529515296152971529815299153001530115302153031530415305153061530715308153091531015311153121531315314153151531615317153181531915320153211532215323153241532515326153271532815329153301533115332153331533415335153361533715338153391534015341153421534315344153451534615347153481534915350153511535215353153541535515356153571535815359153601536115362153631536415365153661536715368153691537015371153721537315374153751537615377153781537915380153811538215383153841538515386153871538815389153901539115392153931539415395153961539715398153991540015401154021540315404154051540615407154081540915410154111541215413154141541515416154171541815419154201542115422154231542415425154261542715428154291543015431154321543315434154351543615437154381543915440154411544215443154441544515446154471544815449154501545115452154531545415455154561545715458154591546015461154621546315464154651546615467154681546915470154711547215473154741547515476154771547815479154801548115482154831548415485154861548715488154891549015491154921549315494154951549615497154981549915500155011550215503155041550515506155071550815509155101551115512155131551415515155161551715518155191552015521155221552315524155251552615527155281552915530155311553215533155341553515536155371553815539155401554115542155431554415545155461554715548155491555015551155521555315554155551555615557155581555915560155611556215563155641556515566155671556815569155701557115572155731557415575155761557715578155791558015581155821558315584155851558615587155881558915590155911559215593155941559515596155971559815599156001560115602156031560415605156061560715608156091561015611156121561315614156151561615617156181561915620156211562215623156241562515626156271562815629156301563115632156331563415635156361563715638156391564015641156421564315644156451564615647156481564915650156511565215653156541565515656156571565815659156601566115662156631566415665156661566715668156691567015671156721567315674156751567615677156781567915680156811568215683156841568515686156871568815689156901569115692156931569415695156961569715698156991570015701157021570315704157051570615707157081570915710157111571215713157141571515716157171571815719157201572115722157231572415725157261572715728157291573015731157321573315734157351573615737157381573915740157411574215743157441574515746157471574815749157501575115752157531575415755157561575715758157591576015761157621576315764157651576615767157681576915770157711577215773157741577515776157771577815779157801578115782157831578415785157861578715788157891579015791157921579315794157951579615797157981579915800158011580215803158041580515806158071580815809158101581115812158131581415815158161581715818158191582015821158221582315824158251582615827158281582915830158311583215833158341583515836158371583815839158401584115842158431584415845158461584715848158491585015851158521585315854158551585615857158581585915860158611586215863158641586515866158671586815869158701587115872158731587415875158761587715878158791588015881158821588315884158851588615887158881588915890158911589215893158941589515896158971589815899159001590115902159031590415905159061590715908159091591015911159121591315914159151591615917159181591915920159211592215923159241592515926159271592815929159301593115932159331593415935159361593715938159391594015941159421594315944159451594615947159481594915950159511595215953159541595515956159571595815959159601596115962159631596415965159661596715968159691597015971159721597315974159751597615977159781597915980159811598215983159841598515986159871598815989159901599115992159931599415995159961599715998159991600016001160021600316004160051600616007160081600916010160111601216013160141601516016160171601816019160201602116022160231602416025160261602716028160291603016031160321603316034160351603616037160381603916040160411604216043160441604516046160471604816049160501605116052160531605416055160561605716058160591606016061160621606316064160651606616067160681606916070160711607216073160741607516076160771607816079160801608116082160831608416085160861608716088160891609016091160921609316094160951609616097160981609916100161011610216103161041610516106161071610816109161101611116112161131611416115161161611716118161191612016121161221612316124161251612616127161281612916130161311613216133161341613516136161371613816139161401614116142161431614416145161461614716148161491615016151161521615316154161551615616157161581615916160161611616216163161641616516166161671616816169161701617116172161731617416175161761617716178161791618016181161821618316184161851618616187161881618916190161911619216193161941619516196161971619816199162001620116202162031620416205162061620716208162091621016211162121621316214162151621616217162181621916220162211622216223162241622516226162271622816229162301623116232162331623416235162361623716238162391624016241162421624316244162451624616247162481624916250162511625216253162541625516256162571625816259162601626116262162631626416265162661626716268162691627016271162721627316274162751627616277162781627916280162811628216283162841628516286162871628816289162901629116292162931629416295162961629716298162991630016301163021630316304163051630616307163081630916310163111631216313163141631516316163171631816319163201632116322163231632416325163261632716328163291633016331163321633316334163351633616337163381633916340163411634216343163441634516346163471634816349163501635116352163531635416355163561635716358163591636016361163621636316364163651636616367163681636916370163711637216373163741637516376163771637816379163801638116382163831638416385163861638716388163891639016391163921639316394163951639616397163981639916400164011640216403164041640516406164071640816409164101641116412164131641416415164161641716418164191642016421164221642316424164251642616427164281642916430164311643216433164341643516436164371643816439164401644116442164431644416445164461644716448164491645016451164521645316454164551645616457164581645916460164611646216463164641646516466164671646816469164701647116472164731647416475164761647716478164791648016481164821648316484164851648616487164881648916490164911649216493164941649516496164971649816499165001650116502165031650416505165061650716508165091651016511165121651316514165151651616517165181651916520165211652216523165241652516526165271652816529165301653116532165331653416535165361653716538165391654016541165421654316544165451654616547165481654916550165511655216553165541655516556165571655816559165601656116562165631656416565165661656716568165691657016571165721657316574165751657616577165781657916580165811658216583165841658516586165871658816589165901659116592165931659416595165961659716598165991660016601166021660316604166051660616607166081660916610166111661216613166141661516616166171661816619166201662116622166231662416625166261662716628166291663016631166321663316634166351663616637166381663916640166411664216643166441664516646166471664816649166501665116652166531665416655166561665716658166591666016661166621666316664166651666616667166681666916670166711667216673166741667516676166771667816679166801668116682166831668416685166861668716688166891669016691166921669316694166951669616697166981669916700167011670216703167041670516706167071670816709167101671116712167131671416715167161671716718167191672016721167221672316724167251672616727167281672916730167311673216733167341673516736167371673816739167401674116742167431674416745167461674716748167491675016751167521675316754167551675616757167581675916760167611676216763167641676516766167671676816769167701677116772167731677416775167761677716778167791678016781167821678316784167851678616787167881678916790167911679216793167941679516796167971679816799168001680116802168031680416805168061680716808168091681016811168121681316814168151681616817168181681916820168211682216823168241682516826168271682816829168301683116832168331683416835168361683716838168391684016841168421684316844168451684616847168481684916850168511685216853168541685516856168571685816859168601686116862168631686416865168661686716868168691687016871168721687316874168751687616877168781687916880168811688216883168841688516886168871688816889168901689116892168931689416895168961689716898168991690016901169021690316904169051690616907169081690916910169111691216913169141691516916169171691816919169201692116922169231692416925169261692716928169291693016931169321693316934169351693616937169381693916940169411694216943169441694516946169471694816949169501695116952169531695416955169561695716958169591696016961169621696316964169651696616967169681696916970169711697216973169741697516976169771697816979169801698116982169831698416985169861698716988169891699016991169921699316994169951699616997169981699917000170011700217003170041700517006170071700817009170101701117012170131701417015170161701717018170191702017021170221702317024170251702617027170281702917030170311703217033170341703517036170371703817039170401704117042170431704417045170461704717048170491705017051170521705317054170551705617057170581705917060170611706217063170641706517066170671706817069170701707117072170731707417075170761707717078170791708017081170821708317084170851708617087170881708917090170911709217093170941709517096170971709817099171001710117102171031710417105171061710717108171091711017111171121711317114171151711617117171181711917120171211712217123171241712517126171271712817129171301713117132171331713417135171361713717138171391714017141171421714317144171451714617147171481714917150171511715217153171541715517156171571715817159171601716117162171631716417165171661716717168171691717017171171721717317174171751717617177171781717917180171811718217183171841718517186171871718817189171901719117192171931719417195171961719717198171991720017201172021720317204172051720617207172081720917210172111721217213172141721517216172171721817219172201722117222172231722417225172261722717228172291723017231172321723317234172351723617237172381723917240172411724217243172441724517246172471724817249172501725117252172531725417255172561725717258172591726017261172621726317264172651726617267172681726917270172711727217273172741727517276172771727817279172801728117282172831728417285172861728717288172891729017291172921729317294172951729617297172981729917300173011730217303173041730517306173071730817309173101731117312173131731417315173161731717318173191732017321173221732317324173251732617327173281732917330173311733217333173341733517336173371733817339173401734117342173431734417345173461734717348173491735017351173521735317354173551735617357173581735917360173611736217363173641736517366173671736817369173701737117372173731737417375173761737717378173791738017381173821738317384173851738617387173881738917390173911739217393173941739517396173971739817399174001740117402174031740417405174061740717408174091741017411174121741317414174151741617417174181741917420174211742217423174241742517426174271742817429174301743117432174331743417435174361743717438174391744017441174421744317444174451744617447174481744917450174511745217453174541745517456174571745817459174601746117462174631746417465174661746717468174691747017471174721747317474174751747617477174781747917480174811748217483174841748517486174871748817489174901749117492174931749417495174961749717498174991750017501175021750317504175051750617507175081750917510175111751217513175141751517516175171751817519175201752117522175231752417525175261752717528175291753017531175321753317534175351753617537175381753917540175411754217543175441754517546175471754817549175501755117552175531755417555175561755717558175591756017561175621756317564175651756617567175681756917570175711757217573175741757517576175771757817579175801758117582175831758417585175861758717588175891759017591175921759317594175951759617597175981759917600176011760217603176041760517606176071760817609176101761117612176131761417615176161761717618176191762017621176221762317624176251762617627176281762917630176311763217633176341763517636176371763817639176401764117642176431764417645176461764717648176491765017651176521765317654176551765617657176581765917660176611766217663176641766517666176671766817669176701767117672176731767417675176761767717678176791768017681176821768317684176851768617687176881768917690176911769217693176941769517696176971769817699177001770117702177031770417705177061770717708177091771017711177121771317714177151771617717177181771917720177211772217723177241772517726177271772817729177301773117732177331773417735177361773717738177391774017741177421774317744177451774617747177481774917750177511775217753177541775517756177571775817759177601776117762177631776417765177661776717768177691777017771177721777317774177751777617777177781777917780177811778217783177841778517786177871778817789177901779117792177931779417795177961779717798177991780017801178021780317804178051780617807178081780917810178111781217813178141781517816178171781817819178201782117822178231782417825178261782717828178291783017831178321783317834178351783617837178381783917840178411784217843178441784517846178471784817849178501785117852178531785417855178561785717858178591786017861178621786317864178651786617867178681786917870178711787217873178741787517876178771787817879178801788117882178831788417885178861788717888178891789017891178921789317894178951789617897178981789917900179011790217903179041790517906179071790817909179101791117912179131791417915179161791717918179191792017921179221792317924179251792617927179281792917930179311793217933179341793517936179371793817939179401794117942179431794417945179461794717948179491795017951179521795317954179551795617957179581795917960179611796217963179641796517966179671796817969179701797117972179731797417975179761797717978179791798017981179821798317984179851798617987179881798917990179911799217993179941799517996179971799817999180001800118002180031800418005180061800718008180091801018011180121801318014180151801618017180181801918020180211802218023180241802518026180271802818029180301803118032180331803418035180361803718038180391804018041180421804318044180451804618047180481804918050180511805218053180541805518056180571805818059180601806118062180631806418065180661806718068180691807018071180721807318074180751807618077180781807918080180811808218083180841808518086180871808818089180901809118092180931809418095180961809718098180991810018101181021810318104181051810618107181081810918110181111811218113181141811518116181171811818119181201812118122181231812418125181261812718128181291813018131181321813318134181351813618137181381813918140181411814218143181441814518146181471814818149181501815118152181531815418155181561815718158181591816018161181621816318164181651816618167181681816918170181711817218173181741817518176181771817818179181801818118182181831818418185181861818718188181891819018191181921819318194181951819618197181981819918200182011820218203182041820518206182071820818209182101821118212182131821418215182161821718218182191822018221182221822318224182251822618227182281822918230182311823218233182341823518236182371823818239182401824118242182431824418245182461824718248182491825018251182521825318254182551825618257182581825918260182611826218263182641826518266182671826818269182701827118272182731827418275182761827718278182791828018281182821828318284182851828618287182881828918290182911829218293182941829518296182971829818299183001830118302183031830418305183061830718308183091831018311183121831318314183151831618317183181831918320183211832218323183241832518326183271832818329183301833118332183331833418335183361833718338183391834018341183421834318344183451834618347183481834918350183511835218353183541835518356183571835818359183601836118362183631836418365183661836718368183691837018371183721837318374183751837618377183781837918380183811838218383183841838518386183871838818389183901839118392183931839418395183961839718398183991840018401184021840318404184051840618407184081840918410184111841218413184141841518416184171841818419184201842118422184231842418425184261842718428184291843018431184321843318434184351843618437184381843918440184411844218443184441844518446184471844818449184501845118452184531845418455184561845718458184591846018461184621846318464184651846618467184681846918470184711847218473184741847518476184771847818479184801848118482184831848418485184861848718488184891849018491184921849318494184951849618497184981849918500185011850218503185041850518506185071850818509185101851118512185131851418515185161851718518185191852018521185221852318524185251852618527185281852918530185311853218533185341853518536185371853818539185401854118542185431854418545185461854718548185491855018551185521855318554185551855618557185581855918560185611856218563185641856518566185671856818569185701857118572185731857418575185761857718578185791858018581185821858318584185851858618587185881858918590185911859218593185941859518596185971859818599186001860118602186031860418605186061860718608186091861018611186121861318614186151861618617186181861918620186211862218623186241862518626186271862818629186301863118632186331863418635186361863718638186391864018641186421864318644186451864618647186481864918650186511865218653186541865518656186571865818659186601866118662186631866418665186661866718668186691867018671186721867318674186751867618677186781867918680186811868218683186841868518686186871868818689186901869118692186931869418695186961869718698186991870018701187021870318704187051870618707187081870918710187111871218713187141871518716187171871818719187201872118722187231872418725187261872718728187291873018731187321873318734187351873618737187381873918740187411874218743187441874518746187471874818749187501875118752187531875418755187561875718758187591876018761187621876318764187651876618767187681876918770187711877218773187741877518776187771877818779187801878118782187831878418785187861878718788187891879018791187921879318794187951879618797187981879918800188011880218803188041880518806188071880818809188101881118812188131881418815188161881718818188191882018821188221882318824188251882618827188281882918830188311883218833188341883518836188371883818839188401884118842188431884418845188461884718848188491885018851188521885318854188551885618857188581885918860188611886218863188641886518866188671886818869188701887118872188731887418875188761887718878188791888018881188821888318884188851888618887188881888918890188911889218893188941889518896188971889818899189001890118902189031890418905189061890718908189091891018911189121891318914189151891618917189181891918920189211892218923189241892518926189271892818929189301893118932189331893418935189361893718938189391894018941189421894318944189451894618947189481894918950189511895218953189541895518956189571895818959189601896118962189631896418965189661896718968189691897018971189721897318974189751897618977189781897918980189811898218983189841898518986189871898818989189901899118992189931899418995189961899718998189991900019001190021900319004190051900619007190081900919010190111901219013190141901519016190171901819019190201902119022190231902419025190261902719028190291903019031190321903319034190351903619037190381903919040190411904219043190441904519046190471904819049190501905119052190531905419055190561905719058190591906019061190621906319064190651906619067190681906919070190711907219073190741907519076190771907819079190801908119082190831908419085190861908719088190891909019091190921909319094190951909619097190981909919100191011910219103191041910519106191071910819109191101911119112191131911419115191161911719118191191912019121191221912319124191251912619127191281912919130191311913219133191341913519136191371913819139191401914119142191431914419145191461914719148191491915019151191521915319154191551915619157191581915919160191611916219163191641916519166191671916819169191701917119172191731917419175191761917719178191791918019181191821918319184191851918619187191881918919190191911919219193191941919519196191971919819199192001920119202192031920419205192061920719208192091921019211192121921319214192151921619217192181921919220192211922219223192241922519226192271922819229192301923119232192331923419235192361923719238192391924019241192421924319244192451924619247192481924919250192511925219253192541925519256192571925819259192601926119262192631926419265192661926719268192691927019271192721927319274192751927619277192781927919280192811928219283192841928519286192871928819289192901929119292192931929419295192961929719298192991930019301193021930319304193051930619307193081930919310193111931219313193141931519316193171931819319193201932119322193231932419325193261932719328193291933019331193321933319334193351933619337193381933919340193411934219343193441934519346193471934819349193501935119352193531935419355193561935719358193591936019361193621936319364193651936619367193681936919370193711937219373193741937519376193771937819379193801938119382193831938419385193861938719388193891939019391193921939319394193951939619397193981939919400194011940219403194041940519406194071940819409194101941119412194131941419415194161941719418194191942019421194221942319424194251942619427194281942919430194311943219433194341943519436194371943819439194401944119442194431944419445194461944719448194491945019451194521945319454194551945619457194581945919460194611946219463194641946519466194671946819469194701947119472194731947419475194761947719478194791948019481194821948319484194851948619487194881948919490194911949219493194941949519496194971949819499195001950119502195031950419505195061950719508195091951019511195121951319514195151951619517195181951919520195211952219523195241952519526195271952819529195301953119532195331953419535195361953719538195391954019541195421954319544195451954619547195481954919550195511955219553195541955519556195571955819559195601956119562195631956419565195661956719568195691957019571195721957319574195751957619577195781957919580195811958219583195841958519586195871958819589195901959119592195931959419595195961959719598195991960019601196021960319604196051960619607196081960919610196111961219613196141961519616196171961819619196201962119622196231962419625196261962719628196291963019631196321963319634196351963619637196381963919640196411964219643196441964519646196471964819649196501965119652196531965419655196561965719658196591966019661196621966319664196651966619667196681966919670196711967219673196741967519676196771967819679196801968119682196831968419685196861968719688196891969019691196921969319694196951969619697196981969919700197011970219703197041970519706197071970819709197101971119712197131971419715197161971719718197191972019721197221972319724197251972619727197281972919730197311973219733197341973519736197371973819739197401974119742197431974419745197461974719748197491975019751197521975319754197551975619757197581975919760197611976219763197641976519766197671976819769197701977119772197731977419775197761977719778197791978019781197821978319784197851978619787197881978919790197911979219793197941979519796197971979819799198001980119802198031980419805198061980719808198091981019811198121981319814198151981619817198181981919820198211982219823198241982519826198271982819829198301983119832198331983419835198361983719838198391984019841198421984319844198451984619847198481984919850198511985219853198541985519856198571985819859198601986119862198631986419865198661986719868198691987019871198721987319874198751987619877198781987919880198811988219883198841988519886198871988819889198901989119892198931989419895198961989719898198991990019901199021990319904199051990619907199081990919910199111991219913199141991519916199171991819919199201992119922199231992419925199261992719928199291993019931199321993319934199351993619937199381993919940199411994219943199441994519946199471994819949199501995119952199531995419955199561995719958199591996019961199621996319964199651996619967199681996919970199711997219973199741997519976199771997819979199801998119982199831998419985199861998719988199891999019991199921999319994199951999619997199981999920000200012000220003200042000520006200072000820009200102001120012200132001420015200162001720018200192002020021200222002320024200252002620027200282002920030200312003220033200342003520036200372003820039200402004120042200432004420045200462004720048200492005020051200522005320054200552005620057200582005920060200612006220063200642006520066200672006820069200702007120072200732007420075200762007720078200792008020081200822008320084200852008620087200882008920090200912009220093200942009520096200972009820099201002010120102201032010420105201062010720108201092011020111201122011320114201152011620117201182011920120201212012220123201242012520126201272012820129201302013120132201332013420135201362013720138201392014020141201422014320144201452014620147201482014920150201512015220153201542015520156201572015820159201602016120162201632016420165201662016720168201692017020171201722017320174201752017620177201782017920180201812018220183201842018520186201872018820189201902019120192201932019420195201962019720198201992020020201202022020320204202052020620207202082020920210202112021220213202142021520216202172021820219202202022120222 |
- {
- "timestamp": "2022-05-10T19:59:52",
- "compiler": {
- "name": "@stencil/core",
- "version": "2.15.1",
- "typescriptVersion": "4.5.4"
- },
- "components": [
- {
- "filePath": "./src/components/accordion/accordion.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-accordion",
- "readme": "# calcite-accordion\n\n`calcite-accordion` can be used to present content in collapsible sections. Configuration options exist for visual style (icon-position, scale, appearance), and selection functionality. Selection modes include \"multi\", \"single\", and \"single-persist\".\n",
- "docs": "`calcite-accordion` can be used to present content in collapsible sections. Configuration options exist for visual style (icon-position, scale, appearance), and selection functionality. Selection modes include \"multi\", \"single\", and \"single-persist\".",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-accordion-item`s. `calcite-accordion` cannot be nested, however calcite-accordion-item`s can."
- }
- ],
- "usage": {
- "Basic": "```html\n<calcite-accordion>\n <calcite-accordion-item item-title=\"Accordion Item\">Accordion Section Content </calcite-accordion-item>\n <calcite-accordion-item item-title=\"Accordion Item 2\" active>Accordion Section Content </calcite-accordion-item>\n <calcite-accordion-item item-title=\"Accordion Item 3\">Accordion Section Content </calcite-accordion-item>\n</calcite-accordion>\n```\n"
- },
- "props": [
- {
- "name": "appearance",
- "type": "\"default\" | \"minimal\" | \"transparent\"",
- "mutable": false,
- "attr": "appearance",
- "reflectToAttr": true,
- "docs": "specify the appearance - default (containing border), or minimal (no containing border), defaults to default",
- "docsTags": [],
- "default": "\"default\"",
- "values": [
- {
- "value": "default",
- "type": "string"
- },
- {
- "value": "minimal",
- "type": "string"
- },
- {
- "value": "transparent",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "iconPosition",
- "type": "\"end\" | \"start\"",
- "mutable": false,
- "attr": "icon-position",
- "reflectToAttr": true,
- "docs": "specify the placement of the icon in the header, defaults to end",
- "docsTags": [],
- "default": "\"end\"",
- "values": [
- {
- "value": "end",
- "type": "string"
- },
- {
- "value": "start",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "iconType",
- "type": "\"caret\" | \"chevron\" | \"plus-minus\"",
- "mutable": false,
- "attr": "icon-type",
- "reflectToAttr": true,
- "docs": "specify the type of the icon in the header, defaults to chevron",
- "docsTags": [],
- "default": "\"chevron\"",
- "values": [
- {
- "value": "caret",
- "type": "string"
- },
- {
- "value": "chevron",
- "type": "string"
- },
- {
- "value": "plus-minus",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of accordion, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selectionMode",
- "type": "\"multi\" | \"single\" | \"single-persist\"",
- "mutable": false,
- "attr": "selection-mode",
- "reflectToAttr": true,
- "docs": "specify the selection mode - multi (allow any number of open items), single (allow one open item),\nor single-persist (allow and require one open item), defaults to multi",
- "docsTags": [],
- "default": "\"multi\"",
- "values": [
- {
- "value": "multi",
- "type": "string"
- },
- {
- "value": "single",
- "type": "string"
- },
- {
- "value": "single-persist",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [
- {
- "event": "calciteAccordionItemKeyEvent",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteAccordionItemRegister",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteAccordionItemSelect",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-accordion-item`s. `calcite-accordion` cannot be nested, however calcite-accordion-item`s can."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/accordion-item/accordion-item.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-accordion-item",
- "readme": "# calcite-accordion-item\n\nindividual `calcite-accordion` item\n",
- "docs": "individual `calcite-accordion` item",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding custom content, including nested `calcite-accordion-item`s."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": true,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "Indicates whether the item is active.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "icon",
- "type": "string",
- "mutable": false,
- "attr": "icon",
- "reflectToAttr": true,
- "docs": "optionally pass an icon to display - accepts Calcite UI icon names",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "itemSubtitle",
- "type": "string",
- "mutable": false,
- "attr": "item-subtitle",
- "reflectToAttr": false,
- "docs": "pass a title for the accordion item",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "itemTitle",
- "type": "string",
- "mutable": false,
- "attr": "item-title",
- "reflectToAttr": false,
- "docs": "pass a title for the accordion item",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [
- {
- "event": "keydown",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteAccordionChange",
- "target": "body",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding custom content, including nested `calcite-accordion-item`s."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-accordion-item": [
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/action/action.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-action",
- "readme": "# calcite-action\n\nThe `calcite-action` component lives in either a `calcite-action-bar` or `calcite-action-pad`. Actions look like an icon with a text description option of the component that will be revealed when the icon/ text is clicked or selected.\n",
- "docs": "The `calcite-action` component lives in either a `calcite-action-bar` or `calcite-action-pad`. Actions look like an icon with a text description option of the component that will be revealed when the icon/ text is clicked or selected.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding a `calcite-icon`."
- }
- ],
- "usage": {
- "Clear-appearance": "Renders a `calcite-action` that has a clear background.\n\n```html\n<calcite-action appearance=\"clear\" text=\"Layers\" icon=\"layers\"></calcite-action>\n```\n",
- "With-text-displayed": "Renders a `calcite-action` that displays text along side an icon and a tooltip label.\n\n```html\n<calcite-action label=\"Performs my custom action\" text=\"Perform Action!\" text-enabled icon=\"save\"></calcite-action>\n```\n",
- "Without-text-displayed": "Renders a `calcite-action` that displays only an icon and a tooltip label.\n\n```html\n<calcite-action label=\"Performs my custom action\" text=\"My Custom Action\" icon=\"plus\"></calcite-action>\n```\n"
- },
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": false,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "Indicates whether the action is highlighted.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "alignment",
- "type": "\"center\" | \"end\" | \"start\"",
- "mutable": false,
- "attr": "alignment",
- "reflectToAttr": true,
- "docs": "Optionally specify the horizontal alignment of button elements with text content.",
- "docsTags": [],
- "values": [
- {
- "value": "center",
- "type": "string"
- },
- {
- "value": "end",
- "type": "string"
- },
- {
- "value": "start",
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "appearance",
- "type": "\"clear\" | \"solid\"",
- "mutable": false,
- "attr": "appearance",
- "reflectToAttr": true,
- "docs": "Specify the appearance style of the action, defaults to solid.",
- "docsTags": [],
- "default": "\"solid\"",
- "values": [
- {
- "value": "clear",
- "type": "string"
- },
- {
- "value": "solid",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "compact",
- "type": "boolean",
- "mutable": false,
- "attr": "compact",
- "reflectToAttr": true,
- "docs": "Compact mode is used internally by components to reduce side padding, e.g. calcite-block-section.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, disabled prevents interaction. This state shows items with lower opacity/grayed.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "icon",
- "type": "string",
- "mutable": false,
- "attr": "icon",
- "reflectToAttr": false,
- "docs": "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/.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "indicator",
- "type": "boolean",
- "mutable": false,
- "attr": "indicator",
- "reflectToAttr": true,
- "docs": "Indicates unread changes.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlLoading",
- "type": "string",
- "mutable": false,
- "attr": "intl-loading",
- "reflectToAttr": false,
- "docs": "string to override English loading text",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Loading\""
- }
- ],
- "default": "TEXT.loading",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "The label of the action. If no label is provided, the label inherits what's provided for the `text` prop.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "loading",
- "type": "boolean",
- "mutable": false,
- "attr": "loading",
- "reflectToAttr": true,
- "docs": "When true, content is waiting to be loaded. This state shows a busy indicator.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "Specifies the size of the action.",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "text",
- "type": "string",
- "mutable": false,
- "attr": "text",
- "reflectToAttr": false,
- "docs": "Text that accompanies the action icon.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": true
- },
- {
- "name": "textEnabled",
- "type": "boolean",
- "mutable": false,
- "attr": "text-enabled",
- "reflectToAttr": true,
- "docs": "Indicates whether the text is displayed.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteActionClick",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the action has been clicked.",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use onClick instead."
- }
- ],
- "deprecation": "use onClick instead."
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding a `calcite-icon`."
- }
- ],
- "parts": [],
- "dependents": [
- "calcite-action-bar",
- "calcite-action-group",
- "calcite-action-menu",
- "calcite-action-pad",
- "calcite-panel",
- "calcite-pick-list-item",
- "calcite-popover",
- "calcite-tip",
- "calcite-tip-manager"
- ],
- "dependencies": [
- "calcite-loader",
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-action": [
- "calcite-loader",
- "calcite-icon"
- ],
- "calcite-action-bar": [
- "calcite-action"
- ],
- "calcite-action-group": [
- "calcite-action"
- ],
- "calcite-action-menu": [
- "calcite-action"
- ],
- "calcite-action-pad": [
- "calcite-action"
- ],
- "calcite-panel": [
- "calcite-action"
- ],
- "calcite-pick-list-item": [
- "calcite-action"
- ],
- "calcite-popover": [
- "calcite-action"
- ],
- "calcite-tip": [
- "calcite-action"
- ],
- "calcite-tip-manager": [
- "calcite-action"
- ]
- }
- },
- {
- "filePath": "./src/components/action-bar/action-bar.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-action-bar",
- "readme": "# calcite-action-bar\n\n## Description\n\nThe `calcite-action-bar` component is made up of multiple `calcite-action`s in the form of clickable icons. The action bar can be expanded to view actions with descriptive text or made smaller to view with just icons.\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-action`s that will appear at the top of the action bar."
- },
- {
- "name": "slot",
- "text": "bottom-actions - A slot for adding `calcite-action`s that will appear at the bottom of the action bar, above the collapse/expand button."
- },
- {
- "name": "slot",
- "text": "expand-tooltip - Used to set the tooltip for the expand toggle."
- }
- ],
- "usage": {
- "Basic": "Renders `calcite-action`s that stick to the top of the bar.\n\n```html\n<calcite-action-bar>\n <calcite-action text=\"Add\" icon=\"plus\"></calcite-action>\n <calcite-action text=\"Save\" icon=\"save\"></calcite-action>\n</calcite-action-bar>\n```\n",
- "Bottom-actions": "The bottom-actions slot renders `calcite-action`s that stick to the bottom of the bar above the expand/collapse icon.\n\n```html\n<calcite-action-bar>\n <calcite-action text=\"Information\" icon=\"information\"></calcite-action>\n <calcite-action text=\"Feedback\" slot=\"bottom-actions\" icon=\"mega-phone\"></calcite-action>\n</calcite-action-bar>\n```\n",
- "Tooltip": "Renders with a tooltip on the expand action.\n\n```html\n<calcite-action-bar id=\"action-bar-test\">\n <calcite-tooltip slot=\"expand-tooltip\">Expand</calcite-tooltip>\n <calcite-action text=\"Add\" icon=\"plus\"></calcite-action>\n</calcite-action-bar>\n```\n",
- "With-grouping": "Renders a group of `calcite-action`s contained in a `calcite-action-group`. Actions in a group are visually separated from other groups or actions in the bar.\n\n```html\n<calcite-action-bar>\n <calcite-action-group>\n <calcite-action text=\"Add\" icon=\"plus\"></calcite-action>\n <calcite-action text=\"Save\" icon=\"save\"></calcite-action>\n </calcite-action-group>\n\n <calcite-action-group>\n <calcite-action text=\"Layers\" icon=\"layers\"></calcite-action>\n <calcite-action text=\"Basemaps\" icon=\"layer-basemap\"></calcite-action>\n </calcite-action-group>\n</calcite-action-bar>\n```\n"
- },
- "props": [
- {
- "name": "expandDisabled",
- "type": "boolean",
- "mutable": false,
- "attr": "expand-disabled",
- "reflectToAttr": true,
- "docs": "When set to true, the expand-toggling behavior will be disabled.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "expanded",
- "type": "boolean",
- "mutable": true,
- "attr": "expanded",
- "reflectToAttr": true,
- "docs": "Indicates whether widget is expanded.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlCollapse",
- "type": "string",
- "mutable": false,
- "attr": "intl-collapse",
- "reflectToAttr": false,
- "docs": "Updates the label of the collapse icon when the component is expanded.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlExpand",
- "type": "string",
- "mutable": false,
- "attr": "intl-expand",
- "reflectToAttr": false,
- "docs": "Updates the label of the expand icon when the component is not expanded.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "overflowActionsDisabled",
- "type": "boolean",
- "mutable": false,
- "attr": "overflow-actions-disabled",
- "reflectToAttr": false,
- "docs": "Disables automatically overflowing actions that won't fit into menus.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "position",
- "type": "\"end\" | \"start\"",
- "mutable": false,
- "attr": "position",
- "reflectToAttr": true,
- "docs": "Arranges the component depending on the elements 'dir' property.",
- "docsTags": [],
- "values": [
- {
- "value": "end",
- "type": "string"
- },
- {
- "value": "start",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "Specifies the size of the expand action.",
- "docsTags": [],
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus(focusId?: \"expand-toggle\") => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteActionBarToggle",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when expanded has been toggled.",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-action`s that will appear at the top of the action bar."
- },
- {
- "name": "bottom-actions",
- "docs": "A slot for adding `calcite-action`s that will appear at the bottom of the action bar, above the collapse/expand button."
- },
- {
- "name": "expand-tooltip",
- "docs": "Used to set the tooltip for the expand toggle."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-action-group",
- "calcite-action"
- ],
- "dependencyGraph": {
- "calcite-action-bar": [
- "calcite-action-group",
- "calcite-action"
- ],
- "calcite-action-group": [
- "calcite-action-menu",
- "calcite-action"
- ],
- "calcite-action-menu": [
- "calcite-action",
- "calcite-popover"
- ],
- "calcite-action": [
- "calcite-loader",
- "calcite-icon"
- ],
- "calcite-popover": [
- "calcite-action",
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/action-group/action-group.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-action-group",
- "readme": "# calcite-action-group\n\nThe `calcite-action-group` is a wrapper for multiple `calcite-action`s and housed in `calcite-action-bar` and `calcite-action-pad`.\n",
- "docs": "The `calcite-action-group` is a wrapper for multiple `calcite-action`s and housed in `calcite-action-bar` and `calcite-action-pad`.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding a group of `calcite-action`s."
- },
- {
- "name": "slot",
- "text": "menu-actions - a slot for adding an overflow menu with actions inside a dropdown."
- },
- {
- "name": "slot",
- "text": "menu-tooltip - a slot for adding an tooltip for the menu."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "columns",
- "type": "1 | 2 | 3 | 4 | 5 | 6",
- "mutable": false,
- "attr": "columns",
- "reflectToAttr": true,
- "docs": "Indicates number of columns.",
- "docsTags": [],
- "values": [
- {
- "value": "1",
- "type": "number"
- },
- {
- "value": "2",
- "type": "number"
- },
- {
- "value": "3",
- "type": "number"
- },
- {
- "value": "4",
- "type": "number"
- },
- {
- "value": "5",
- "type": "number"
- },
- {
- "value": "6",
- "type": "number"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "expanded",
- "type": "boolean",
- "mutable": false,
- "attr": "expanded",
- "reflectToAttr": true,
- "docs": "Indicates whether widget is expanded.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlMore",
- "type": "string",
- "mutable": false,
- "attr": "intl-more",
- "reflectToAttr": false,
- "docs": "Text string for the actions menu.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "layout",
- "type": "\"grid\" | \"horizontal\" | \"vertical\"",
- "mutable": false,
- "attr": "layout",
- "reflectToAttr": true,
- "docs": "Indicates the horizontal, vertical, or grid layout of the component.",
- "docsTags": [],
- "default": "\"vertical\"",
- "values": [
- {
- "value": "grid",
- "type": "string"
- },
- {
- "value": "horizontal",
- "type": "string"
- },
- {
- "value": "vertical",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "menuOpen",
- "type": "boolean",
- "mutable": true,
- "attr": "menu-open",
- "reflectToAttr": true,
- "docs": "Opens the action menu.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "Specifies the size of the action-menu.",
- "docsTags": [],
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [
- {
- "name": "--calcite-action-group-columns",
- "annotation": "prop",
- "docs": "sets number of grid-template-columns when layout is grid"
- }
- ],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding a group of `calcite-action`s."
- },
- {
- "name": "menu-actions",
- "docs": "a slot for adding an overflow menu with actions inside a dropdown."
- },
- {
- "name": "menu-tooltip",
- "docs": "a slot for adding an tooltip for the menu."
- }
- ],
- "parts": [],
- "dependents": [
- "calcite-action-bar",
- "calcite-action-pad"
- ],
- "dependencies": [
- "calcite-action-menu",
- "calcite-action"
- ],
- "dependencyGraph": {
- "calcite-action-group": [
- "calcite-action-menu",
- "calcite-action"
- ],
- "calcite-action-menu": [
- "calcite-action",
- "calcite-popover"
- ],
- "calcite-action": [
- "calcite-loader",
- "calcite-icon"
- ],
- "calcite-popover": [
- "calcite-action",
- "calcite-icon"
- ],
- "calcite-action-bar": [
- "calcite-action-group"
- ],
- "calcite-action-pad": [
- "calcite-action-group"
- ]
- }
- },
- {
- "filePath": "./src/components/action-menu/action-menu.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-action-menu",
- "readme": "# calcite-action-menu\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-action`s."
- },
- {
- "name": "slot",
- "text": "trigger - A slot for adding a `calcite-action` to trigger opening the menu."
- },
- {
- "name": "slot",
- "text": "tooltip - A slot for adding an tooltip for the menu."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "expanded",
- "type": "boolean",
- "mutable": false,
- "attr": "expanded",
- "reflectToAttr": true,
- "docs": "Indicates whether widget is expanded.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "flipPlacements",
- "type": "ComputedPlacement[]",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Defines the available placements that can be used when a flip occurs.",
- "docsTags": [],
- "values": [
- {
- "type": "ComputedPlacement[]"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "Text string for the actions menu.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": true
- },
- {
- "name": "open",
- "type": "boolean",
- "mutable": true,
- "attr": "open",
- "reflectToAttr": true,
- "docs": "Opens the action menu.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "overlayPositioning",
- "type": "\"absolute\" | \"fixed\"",
- "mutable": false,
- "attr": "overlay-positioning",
- "reflectToAttr": false,
- "docs": "Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value.",
- "docsTags": [],
- "default": "\"absolute\"",
- "values": [
- {
- "value": "absolute",
- "type": "string"
- },
- {
- "value": "fixed",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "placement",
- "type": "Placement | PlacementRtl | VariationRtl",
- "mutable": false,
- "attr": "placement",
- "reflectToAttr": true,
- "docs": "Determines where the component will be positioned relative to the referenceElement.",
- "docsTags": [
- {
- "name": "see",
- "text": "[PopperPlacement](https://github.com/Esri/calcite-components/blob/master/src/utils/popper.ts#L25)"
- }
- ],
- "default": "\"auto\"",
- "values": [
- {
- "type": "Placement"
- },
- {
- "type": "PlacementRtl"
- },
- {
- "type": "VariationRtl"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "Specifies the size of the menu trigger action.",
- "docsTags": [],
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteActionMenuOpenChange",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the open property has changed.",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "click",
- "target": "window",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-action`s."
- },
- {
- "name": "tooltip",
- "docs": "A slot for adding an tooltip for the menu."
- },
- {
- "name": "trigger",
- "docs": "A slot for adding a `calcite-action` to trigger opening the menu."
- }
- ],
- "parts": [],
- "dependents": [
- "calcite-action-group",
- "calcite-block",
- "calcite-panel"
- ],
- "dependencies": [
- "calcite-action",
- "calcite-popover"
- ],
- "dependencyGraph": {
- "calcite-action-menu": [
- "calcite-action",
- "calcite-popover"
- ],
- "calcite-action": [
- "calcite-loader",
- "calcite-icon"
- ],
- "calcite-popover": [
- "calcite-action",
- "calcite-icon"
- ],
- "calcite-action-group": [
- "calcite-action-menu"
- ],
- "calcite-block": [
- "calcite-action-menu"
- ],
- "calcite-panel": [
- "calcite-action-menu"
- ]
- }
- },
- {
- "filePath": "./src/components/action-pad/action-pad.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-action-pad",
- "readme": "# calcite-action-pad\n\nThe `calcite-action-pad` component is made up of `calcite-action`s in the form of clickable icons. This does not have an expandable option and is a smaller and simpler component than `calcite-action-bar`.\n",
- "docs": "The `calcite-action-pad` component is made up of `calcite-action`s in the form of clickable icons. This does not have an expandable option and is a smaller and simpler component than `calcite-action-bar`.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-action`s to the action pad."
- },
- {
- "name": "slot",
- "text": "expand-tooltip - Used to set the tooltip for the expand toggle."
- }
- ],
- "usage": {
- "Basic": "Renders a basic action pad with `calcite-action`s.\n\n```html\n<calcite-action-pad>\n <calcite-action text=\"Undo\" icon=\"undo\"></calcite-action>\n <calcite-action text=\"Redo\" icon=\"redo\"></calcite-action>\n</calcite-action-pad>\n```\n",
- "Tooltip": "Renders an action pad with a tooltip on the expand action.\n\n```html\n<calcite-action-pad id=\"action-pad-test\">\n <calcite-action text=\"Add\" icon=\"plus\"></calcite-action>\n</calcite-action-pad>\n<calcite-tooltip id=\"tooltip\">Expand</calcite-tooltip>\n<script>\n var actionPad = document.getElementById(\"action-pad-test\");\n var tooltip = document.getElementById(\"tooltip\");\n actionPad.tooltipExpand = tooltip;\n</script>\n```\n",
- "With-grouping": "Renders a group of `calcite-action`s contained in a `calcite-action-group`. Actions in a group are visually separated from other groups or actions in the pad.\n\n```html\n<calcite-action-pad>\n <calcite-action-group>\n <calcite-action text=\"Home\" icon=\"home\"></calcite-action>\n <calcite-action text=\"Styles\" icon=\"add-in-edit\"></calcite-action>\n </calcite-action-group>\n\n <calcite-action text=\"Tips\" icon=\"lightbulb\"></calcite-action>\n</calcite-action-pad>\n```\n"
- },
- "props": [
- {
- "name": "expandDisabled",
- "type": "boolean",
- "mutable": false,
- "attr": "expand-disabled",
- "reflectToAttr": true,
- "docs": "When set to true, the expand-toggling behavior will be disabled.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "expanded",
- "type": "boolean",
- "mutable": true,
- "attr": "expanded",
- "reflectToAttr": true,
- "docs": "Indicates whether widget is expanded.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlCollapse",
- "type": "string",
- "mutable": false,
- "attr": "intl-collapse",
- "reflectToAttr": false,
- "docs": "Updates the label of the collapse icon when the component is expanded.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlExpand",
- "type": "string",
- "mutable": false,
- "attr": "intl-expand",
- "reflectToAttr": false,
- "docs": "Updates the label of the expand icon when the component is not expanded.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "layout",
- "type": "\"grid\" | \"horizontal\" | \"vertical\"",
- "mutable": false,
- "attr": "layout",
- "reflectToAttr": true,
- "docs": "Indicates the horizontal or vertical layout of the component.",
- "docsTags": [],
- "default": "\"vertical\"",
- "values": [
- {
- "value": "grid",
- "type": "string"
- },
- {
- "value": "horizontal",
- "type": "string"
- },
- {
- "value": "vertical",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "position",
- "type": "\"end\" | \"start\"",
- "mutable": false,
- "attr": "position",
- "reflectToAttr": true,
- "docs": "Arranges the component depending on the elements 'dir' property.",
- "docsTags": [],
- "values": [
- {
- "value": "end",
- "type": "string"
- },
- {
- "value": "start",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "Specifies the size of the expand action.",
- "docsTags": [],
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus(focusId?: \"expand-toggle\") => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteActionPadToggle",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when expanded has been toggled.",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-action`s to the action pad."
- },
- {
- "name": "expand-tooltip",
- "docs": "Used to set the tooltip for the expand toggle."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-action-group",
- "calcite-action"
- ],
- "dependencyGraph": {
- "calcite-action-pad": [
- "calcite-action-group",
- "calcite-action"
- ],
- "calcite-action-group": [
- "calcite-action-menu",
- "calcite-action"
- ],
- "calcite-action-menu": [
- "calcite-action",
- "calcite-popover"
- ],
- "calcite-action": [
- "calcite-loader",
- "calcite-icon"
- ],
- "calcite-popover": [
- "calcite-action",
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/alert/alert.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-alert",
- "readme": "# calcite-alert\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "title - Title of the alert (optional)"
- },
- {
- "name": "slot",
- "text": "message - Main text of the alert"
- },
- {
- "name": "slot",
- "text": "link - Optional action to take from the alert (undo, try again, link to page, etc.)"
- }
- ],
- "usage": {
- "Basic": "A single instance of an alert. Multiple alerts will aggregate in a queue.\n\n```html\n<calcite-alert active>\n <div slot=\"title\">Title of alert</div>\n <div slot=\"message\">Message text of the alert</div>\n <a slot=\"link\" href=\"#\">Retry</a>\n</calcite-alert>\n```\n"
- },
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": true,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "Is the alert currently active or not",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "autoDismiss",
- "type": "boolean",
- "mutable": false,
- "attr": "auto-dismiss",
- "reflectToAttr": false,
- "docs": "Close the alert automatically (recommended for passive, non-blocking alerts)",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "autoDismissDuration",
- "type": "\"fast\" | \"medium\" | \"slow\"",
- "mutable": false,
- "attr": "auto-dismiss-duration",
- "reflectToAttr": true,
- "docs": "Duration of autoDismiss (only used with `autoDismiss`)",
- "docsTags": [],
- "default": "this.autoDismiss ? \"medium\" : null",
- "values": [
- {
- "value": "fast",
- "type": "string"
- },
- {
- "value": "medium",
- "type": "string"
- },
- {
- "value": "slow",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "color",
- "type": "\"blue\" | \"green\" | \"red\" | \"yellow\"",
- "mutable": false,
- "attr": "color",
- "reflectToAttr": true,
- "docs": "Color for the alert (will apply to top border and icon)",
- "docsTags": [],
- "default": "\"blue\"",
- "values": [
- {
- "value": "blue",
- "type": "string"
- },
- {
- "value": "green",
- "type": "string"
- },
- {
- "value": "red",
- "type": "string"
- },
- {
- "value": "yellow",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "icon",
- "type": "boolean | string",
- "mutable": false,
- "attr": "icon",
- "reflectToAttr": true,
- "docs": "when used as a boolean set to true, show a default recommended icon. You can\nalso pass a calcite-ui-icon name to this prop to display a requested icon",
- "docsTags": [],
- "values": [
- {
- "type": "boolean"
- },
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlClose",
- "type": "string",
- "mutable": false,
- "attr": "intl-close",
- "reflectToAttr": false,
- "docs": "string to override English close text",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Close\""
- }
- ],
- "default": "TEXT.intlClose",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "Accessible name for the component",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": true
- },
- {
- "name": "placement",
- "type": "\"bottom\" | \"bottom-end\" | \"bottom-start\" | \"top\" | \"top-end\" | \"top-start\"",
- "mutable": false,
- "attr": "placement",
- "reflectToAttr": false,
- "docs": "specify the placement of the alert",
- "docsTags": [],
- "default": "\"bottom\"",
- "values": [
- {
- "value": "bottom",
- "type": "string"
- },
- {
- "value": "bottom-end",
- "type": "string"
- },
- {
- "value": "bottom-start",
- "type": "string"
- },
- {
- "value": "top",
- "type": "string"
- },
- {
- "value": "top-end",
- "type": "string"
- },
- {
- "value": "top-start",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of the alert, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteAlertClose",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fired when an alert is closed",
- "docsTags": []
- },
- {
- "event": "calciteAlertOpen",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fired when an alert is opened",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "calciteAlertSync",
- "target": "window",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteAlertRegister",
- "target": "window",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [
- {
- "name": "--calcite-alert-width",
- "annotation": "prop",
- "docs": "the width of the alert"
- }
- ],
- "slots": [
- {
- "name": "link",
- "docs": "Optional action to take from the alert (undo, try again, link to page, etc.)"
- },
- {
- "name": "message",
- "docs": "Main text of the alert"
- },
- {
- "name": "title",
- "docs": "Title of the alert (optional)"
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-icon",
- "calcite-chip"
- ],
- "dependencyGraph": {
- "calcite-alert": [
- "calcite-icon",
- "calcite-chip"
- ],
- "calcite-chip": [
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/avatar/avatar.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-avatar",
- "readme": "# calcite-avatar\n\nThe avatar component provides a unique (but consistent) visual for a user. It's built\nto work with users returned from the ArcGIS REST API.\n",
- "docs": "The avatar component provides a unique (but consistent) visual for a user. It's built\nto work with users returned from the ArcGIS REST API.",
- "docsTags": [],
- "usage": {
- "Basic": "The JSON sample user below is returned from a [search for users](https://developers.arcgis.com/rest/users-groups-and-items/user-search.htm). You can create an avatar for Ron by passing these properties directly to the avatar component.\n\nWhen no thumbnail is provided, the avatar component will construct a useful placeholder, leveraging the user's information to construct a unique background-color with initials.\n\n**Note:** if your user is private, remember to append a token to the end of the thumbnail using the form `thumbnail.jpg?token=YOUR_LOGGED_IN_USER_TOKEN`.\n\n```json\n{\n \"username\": \"ron_swanson_pawnee\",\n \"id\": \"a81470986eaeee1833b74b7d8abcd5b2\",\n \"fullName\": \"Ron Swanson\",\n \"firstName\": \"Ron\",\n \"lastName\": \"Swanson\",\n \"thumbnail\": \"mySelf.jpg\",\n ...\n}\n```\n\n```html\n<calcite-avatar\n username=\"ron_swanson_pawnee\"\n user-id=\"a81470986eaeee1833b74b7d8abcd5b2\"\n full-name=\"Ron Swanson\"\n thumbnail=\"mySelf.jpg\"\n>\n</calcite-avatar>\n```\n"
- },
- "props": [
- {
- "name": "fullName",
- "type": "string",
- "mutable": false,
- "attr": "full-name",
- "reflectToAttr": false,
- "docs": "full name of the user",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of the avatar, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "thumbnail",
- "type": "string",
- "mutable": false,
- "attr": "thumbnail",
- "reflectToAttr": false,
- "docs": "src to an image (remember to add a token if the user is private)",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "userId",
- "type": "string",
- "mutable": false,
- "attr": "user-id",
- "reflectToAttr": false,
- "docs": "unique id for user",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "username",
- "type": "string",
- "mutable": false,
- "attr": "username",
- "reflectToAttr": false,
- "docs": "user name",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-avatar": [
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/block/block.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-block",
- "readme": "# calcite-block\n\nThe `calcite-block` component is intended for displaying a heading and content. Content can also include stacked, collapsible `calcite-block-section`s typically housed in a panel.\n",
- "docs": "The `calcite-block` component is intended for displaying a heading and content. Content can also include stacked, collapsible `calcite-block-section`s typically housed in a panel.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding content to the block."
- },
- {
- "name": "slot",
- "text": "icon - A slot for adding a leading header icon."
- },
- {
- "name": "slot",
- "text": "control - A slot for adding a single HTML input element in a header."
- },
- {
- "name": "slot",
- "text": "header-menu-actions - a slot for adding an overflow menu with actions inside a dropdown."
- }
- ],
- "usage": {
- "Always-open": "Renders a header and content that remains open - no collapsible option.\n\n```html\n<calcite-block heading=\"When your son becomes a priest, do you call him...\" open>\n <div>Father or Son?</div>\n</calcite-block>\n```\n",
- "Basic": "Renders a basic, non-collapsible block.\n\n```html\n<calcite-block heading=\"Fruit\" summary=\"It's nature's candy\"> </calcite-block>\n```\n",
- "Collapsible": "Renders a header with a clickable icon to toggle the block open and closed.\n\n```html\n<calcite-block heading=\"Domestic pets\" open collapsible>\n <calcite-block-section text=\"puppers rool, kittehs drule\"> </calcite-block-section>\n</calcite-block>\n```\n",
- "Header-with-control": "Renders a header and control with a slot for adding a single HTML element (in the header).\n\n```html\n<calcite-block heading=\"This header\" summary=\"it has an input\">\n <calcite-action icon=\"pencil\" text=\"edit\" slot=\"control\"></calcite-action>\n</calcite-block>\n```\n",
- "Header-with-icon": "Renders a header and icon with the icon.\n\n```html\n<calcite-block heading=\"Icon't believe it!\">\n <div slot=\"icon\">🤯</div>\n</calcite-block>\n```\n"
- },
- "props": [
- {
- "name": "collapsible",
- "type": "boolean",
- "mutable": false,
- "attr": "collapsible",
- "reflectToAttr": false,
- "docs": "When true, this block will be collapsible.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, disabled prevents interaction. This state shows items with lower opacity/grayed.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "dragHandle",
- "type": "boolean",
- "mutable": false,
- "attr": "drag-handle",
- "reflectToAttr": true,
- "docs": "When true, displays a drag handle in the header.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "heading",
- "type": "string",
- "mutable": false,
- "attr": "heading",
- "reflectToAttr": false,
- "docs": "Block heading.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": true
- },
- {
- "name": "headingLevel",
- "type": "1 | 2 | 3 | 4 | 5 | 6",
- "mutable": false,
- "attr": "heading-level",
- "reflectToAttr": false,
- "docs": "Number at which section headings should start for this component.",
- "docsTags": [],
- "values": [
- {
- "value": "1",
- "type": "number"
- },
- {
- "value": "2",
- "type": "number"
- },
- {
- "value": "3",
- "type": "number"
- },
- {
- "value": "4",
- "type": "number"
- },
- {
- "value": "5",
- "type": "number"
- },
- {
- "value": "6",
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlCollapse",
- "type": "string",
- "mutable": false,
- "attr": "intl-collapse",
- "reflectToAttr": false,
- "docs": "Aria-label for collapsing the toggle and tooltip used for the toggle when expanded.",
- "docsTags": [],
- "default": "TEXT.collapse",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlExpand",
- "type": "string",
- "mutable": false,
- "attr": "intl-expand",
- "reflectToAttr": false,
- "docs": "Aria-label for expanding the toggle and tooltip used for the toggle when collapsed.",
- "docsTags": [],
- "default": "TEXT.expand",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlLoading",
- "type": "string",
- "mutable": false,
- "attr": "intl-loading",
- "reflectToAttr": false,
- "docs": "string to override English loading text",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Loading\""
- }
- ],
- "default": "TEXT.loading",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlOptions",
- "type": "string",
- "mutable": false,
- "attr": "intl-options",
- "reflectToAttr": false,
- "docs": "Text string used for the actions menu",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Options\""
- }
- ],
- "default": "TEXT.options",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "loading",
- "type": "boolean",
- "mutable": false,
- "attr": "loading",
- "reflectToAttr": true,
- "docs": "When true, content is waiting to be loaded. This state shows a busy indicator.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "open",
- "type": "boolean",
- "mutable": true,
- "attr": "open",
- "reflectToAttr": true,
- "docs": "When true, the block's content will be displayed.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "status",
- "type": "\"idle\" | \"invalid\" | \"valid\"",
- "mutable": false,
- "attr": "status",
- "reflectToAttr": true,
- "docs": "Block status. Updates or adds icon to show related icon and color.",
- "docsTags": [],
- "values": [
- {
- "value": "idle",
- "type": "string"
- },
- {
- "value": "invalid",
- "type": "string"
- },
- {
- "value": "valid",
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "summary",
- "type": "string",
- "mutable": false,
- "attr": "summary",
- "reflectToAttr": false,
- "docs": "Block summary.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [
- {
- "event": "calciteBlockToggle",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the header has been clicked.",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding content to the block."
- },
- {
- "name": "control",
- "docs": "A slot for adding a single HTML input element in a header."
- },
- {
- "name": "header-menu-actions",
- "docs": "a slot for adding an overflow menu with actions inside a dropdown."
- },
- {
- "name": "icon",
- "docs": "A slot for adding a leading header icon."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-scrim",
- "calcite-icon",
- "calcite-handle",
- "calcite-loader",
- "calcite-action-menu"
- ],
- "dependencyGraph": {
- "calcite-block": [
- "calcite-scrim",
- "calcite-icon",
- "calcite-handle",
- "calcite-loader",
- "calcite-action-menu"
- ],
- "calcite-scrim": [
- "calcite-loader"
- ],
- "calcite-handle": [
- "calcite-icon"
- ],
- "calcite-action-menu": [
- "calcite-action",
- "calcite-popover"
- ],
- "calcite-action": [
- "calcite-loader",
- "calcite-icon"
- ],
- "calcite-popover": [
- "calcite-action",
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/block-section/block-section.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-block-section",
- "readme": "# calcite-block-section\n\nThe `calcite-block-section` component is a child element of `calcite-block`. Sections can have their own header and content and can be toggled open or closed.\n",
- "docs": "The `calcite-block-section` component is a child element of `calcite-block`. Sections can have their own header and content and can be toggled open or closed.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding content to the block section."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "intlCollapse",
- "type": "string",
- "mutable": false,
- "attr": "intl-collapse",
- "reflectToAttr": false,
- "docs": "Tooltip used for the toggle when expanded.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlExpand",
- "type": "string",
- "mutable": false,
- "attr": "intl-expand",
- "reflectToAttr": false,
- "docs": "Tooltip used for the toggle when collapsed.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "open",
- "type": "boolean",
- "mutable": true,
- "attr": "open",
- "reflectToAttr": true,
- "docs": "When true, the block's section content will be displayed.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "status",
- "type": "\"idle\" | \"invalid\" | \"valid\"",
- "mutable": false,
- "attr": "status",
- "reflectToAttr": true,
- "docs": "BlockSection status. Adds indicator to show valid or invalid status.",
- "docsTags": [],
- "values": [
- {
- "value": "idle",
- "type": "string"
- },
- {
- "value": "invalid",
- "type": "string"
- },
- {
- "value": "valid",
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "text",
- "type": "string",
- "mutable": false,
- "attr": "text",
- "reflectToAttr": false,
- "docs": "Text displayed in the button.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "toggleDisplay",
- "type": "\"button\" | \"switch\"",
- "mutable": false,
- "attr": "toggle-display",
- "reflectToAttr": true,
- "docs": "This property determines the look of the section toggle.\nIf the value is \"switch\", a toggle-switch will be displayed.\nIf the value is \"button\", a clickable header is displayed.",
- "docsTags": [],
- "default": "\"button\"",
- "values": [
- {
- "value": "button",
- "type": "string"
- },
- {
- "value": "switch",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [
- {
- "event": "calciteBlockSectionToggle",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the header has been clicked.",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding content to the block section."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-icon",
- "calcite-switch"
- ],
- "dependencyGraph": {
- "calcite-block-section": [
- "calcite-icon",
- "calcite-switch"
- ]
- }
- },
- {
- "filePath": "./src/components/button/button.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-button",
- "readme": "# calcite-button\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding text."
- }
- ],
- "usage": {
- "Basic": "```html\n<calcite-button icon-start=\"plus\" color=\"red\">Go!</calcite-button>\n```\n",
- "Focusing": "You can programmatically focus a `calcite-button` with the `setFocus()` method:\n\n```html\n<div onclick=\"document.querySelector('#my-button').setFocus()\">Focus!</div>\n```\n",
- "Internals": "Any additional attributes set on `<calcite-button>` are passed to the internal `<a>` or `<button>` tag. For example, the first button below sets `target=\"_blank` On the internal `<a>`. The second button sets `type=\"submit\"` on the internal `<button>`.\n\n- ```html\n <calcite-button href=\"https://github.com/esri/calcite-components\" target=\"_blank\">\n Calcite Components on GitHub\n </calcite-button>\n\n <calcite-button type=\"submit\">Submit</calcite-button>\n ```\n",
- "With-icons": "```html\n<calcite-button appearance=\"solid\" icon-start=\"arrow-left\">Back</calcite-button>\n<calcite-button icon-end=\"map\" color=\"red\">Map Options</calcite-button>\n<calcite-button icon-end=\"plus\" appearance=\"outline\" color=\"inverse\">Add to favorites</calcite-button>\n```\n",
- "With-loader-disabled": "```html\n<calcite-button loading color=\"neutral\">Fetching data...</calcite-button>\n<calcite-button disabled>Can't touch this</calcite-button>\n```\n",
- "Within-form": "```html\n<form name=\"sign-up\">\n <calcite-label>\n First name\n <calcite-input name=\"first-name\" required value=\"Jane\"></calcite-input>\n </calcite-label>\n <calcite-button type=\"reset\">I should reset the form (type reset)</calcite-button>\n <calcite-button type=\"button\">I should not submit the form (type button)</calcite-button>\n <calcite-button>Submit</calcite-button>\n</form>\n```\n"
- },
- "props": [
- {
- "name": "alignment",
- "type": "\"center\" | \"end\" | \"icon-end-space-between\" | \"icon-start-space-between\" | \"space-between\" | \"start\"",
- "mutable": false,
- "attr": "alignment",
- "reflectToAttr": true,
- "docs": "optionally specify alignment of button elements.",
- "docsTags": [],
- "default": "\"center\"",
- "values": [
- {
- "value": "center",
- "type": "string"
- },
- {
- "value": "end",
- "type": "string"
- },
- {
- "value": "icon-end-space-between",
- "type": "string"
- },
- {
- "value": "icon-start-space-between",
- "type": "string"
- },
- {
- "value": "space-between",
- "type": "string"
- },
- {
- "value": "start",
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "appearance",
- "type": "\"clear\" | \"outline\" | \"solid\" | \"transparent\"",
- "mutable": false,
- "attr": "appearance",
- "reflectToAttr": true,
- "docs": "specify the appearance style of the button, defaults to solid.",
- "docsTags": [],
- "default": "\"solid\"",
- "values": [
- {
- "value": "clear",
- "type": "string"
- },
- {
- "value": "outline",
- "type": "string"
- },
- {
- "value": "solid",
- "type": "string"
- },
- {
- "value": "transparent",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "color",
- "type": "\"blue\" | \"inverse\" | \"neutral\" | \"red\"",
- "mutable": false,
- "attr": "color",
- "reflectToAttr": true,
- "docs": "specify the color of the button, defaults to blue",
- "docsTags": [],
- "default": "\"blue\"",
- "values": [
- {
- "value": "blue",
- "type": "string"
- },
- {
- "value": "inverse",
- "type": "string"
- },
- {
- "value": "neutral",
- "type": "string"
- },
- {
- "value": "red",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "is the button disabled",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "form",
- "type": "string",
- "mutable": false,
- "attr": "form",
- "reflectToAttr": false,
- "docs": "The form ID to associate with the component",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "– this property is no longer needed if placed inside a form."
- }
- ],
- "deprecation": "– this property is no longer needed if placed inside a form.",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "href",
- "type": "string",
- "mutable": false,
- "attr": "href",
- "reflectToAttr": true,
- "docs": "optionally pass a href - used to determine if the component should render as a button or an anchor",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "iconEnd",
- "type": "string",
- "mutable": false,
- "attr": "icon-end",
- "reflectToAttr": true,
- "docs": "optionally pass an icon to display at the end of a button - accepts calcite ui icon names",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "iconFlipRtl",
- "type": "\"both\" | \"end\" | \"start\"",
- "mutable": false,
- "attr": "icon-flip-rtl",
- "reflectToAttr": true,
- "docs": "flip the icon(s) in rtl",
- "docsTags": [],
- "values": [
- {
- "value": "both",
- "type": "string"
- },
- {
- "value": "end",
- "type": "string"
- },
- {
- "value": "start",
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "iconStart",
- "type": "string",
- "mutable": false,
- "attr": "icon-start",
- "reflectToAttr": true,
- "docs": "optionally pass an icon to display at the start of a button - accepts calcite ui icon names",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlLoading",
- "type": "string",
- "mutable": false,
- "attr": "intl-loading",
- "reflectToAttr": false,
- "docs": "string to override English loading text",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Loading\""
- }
- ],
- "default": "TEXT.loading",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "Applies to the aria-label attribute on the button or hyperlink",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "loading",
- "type": "boolean",
- "mutable": false,
- "attr": "loading",
- "reflectToAttr": true,
- "docs": "optionally add a calcite-loader component to the button, disabling interaction.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "name",
- "type": "string",
- "mutable": false,
- "attr": "name",
- "reflectToAttr": false,
- "docs": "The name attribute to apply to the button",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "rel",
- "type": "string",
- "mutable": false,
- "attr": "rel",
- "reflectToAttr": false,
- "docs": "The rel attribute to apply to the hyperlink",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "round",
- "type": "boolean",
- "mutable": false,
- "attr": "round",
- "reflectToAttr": true,
- "docs": "optionally add a round style to the button",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of the button, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "splitChild",
- "type": "\"primary\" | \"secondary\" | boolean",
- "mutable": false,
- "attr": "split-child",
- "reflectToAttr": true,
- "docs": "is the button a child of a calcite-split-button",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "value": "primary",
- "type": "string"
- },
- {
- "value": "secondary",
- "type": "string"
- },
- {
- "type": "boolean"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "target",
- "type": "string",
- "mutable": false,
- "attr": "target",
- "reflectToAttr": false,
- "docs": "The target attribute to apply to the hyperlink",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "type",
- "type": "string",
- "mutable": true,
- "attr": "type",
- "reflectToAttr": false,
- "docs": "The type attribute to apply to the button",
- "docsTags": [],
- "default": "\"button\"",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "width",
- "type": "\"auto\" | \"full\" | \"half\"",
- "mutable": false,
- "attr": "width",
- "reflectToAttr": true,
- "docs": "specify the width of the button, defaults to auto",
- "docsTags": [],
- "default": "\"auto\"",
- "values": [
- {
- "value": "auto",
- "type": "string"
- },
- {
- "value": "full",
- "type": "string"
- },
- {
- "value": "half",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding text."
- }
- ],
- "parts": [],
- "dependents": [
- "calcite-color-picker",
- "calcite-fab",
- "calcite-inline-editable",
- "calcite-split-button"
- ],
- "dependencies": [
- "calcite-loader",
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-button": [
- "calcite-loader",
- "calcite-icon"
- ],
- "calcite-color-picker": [
- "calcite-button"
- ],
- "calcite-fab": [
- "calcite-button"
- ],
- "calcite-inline-editable": [
- "calcite-button"
- ],
- "calcite-split-button": [
- "calcite-button"
- ]
- }
- },
- {
- "filePath": "./src/components/card/card.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-card",
- "readme": "# calcite-card\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding subheader/description content."
- },
- {
- "name": "slot",
- "text": "thumbnail - A slot for adding a thumbnail to the card."
- },
- {
- "name": "slot",
- "text": "title - A slot for adding a card title."
- },
- {
- "name": "slot",
- "text": "subtitle - A slot for adding a card subtitle or short summary."
- },
- {
- "name": "slot",
- "text": "footer-leading - A slot for adding a leading footer."
- },
- {
- "name": "slot",
- "text": "footer-trailing - A slot for adding a trailing footer."
- }
- ],
- "usage": {
- "Basic": "```html\n<div style=\"width:260px\">\n <calcite-card>\n <h3 slot=\"title\">ArcGIS Online: Gallery and Organization pages</h3>\n <span slot=\"subtitle\">\n A great example of a study description that might wrap to a line or two, but isn't overly verbose.\n </span>\n </calcite-card>\n</div>\n```\n"
- },
- "props": [
- {
- "name": "intlDeselect",
- "type": "string",
- "mutable": false,
- "attr": "intl-deselect",
- "reflectToAttr": false,
- "docs": "string to override English deselect text for checkbox when selectable is true",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Deselect\""
- }
- ],
- "default": "TEXT.deselect",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlLoading",
- "type": "string",
- "mutable": false,
- "attr": "intl-loading",
- "reflectToAttr": false,
- "docs": "string to override English loading text",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Loading\""
- }
- ],
- "default": "TEXT.loading",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlSelect",
- "type": "string",
- "mutable": false,
- "attr": "intl-select",
- "reflectToAttr": false,
- "docs": "string to override English select text for checkbox when selectable is true",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Select\""
- }
- ],
- "default": "TEXT.select",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "loading",
- "type": "boolean",
- "mutable": false,
- "attr": "loading",
- "reflectToAttr": true,
- "docs": "When true, the cards content is waiting to be loaded. This state shows a busy indicator.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selectable",
- "type": "boolean",
- "mutable": false,
- "attr": "selectable",
- "reflectToAttr": true,
- "docs": "Indicates whether the card is selectable.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selected",
- "type": "boolean",
- "mutable": true,
- "attr": "selected",
- "reflectToAttr": true,
- "docs": "Indicates whether the card is selected.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [
- {
- "event": "calciteCardSelect",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fired when a selectable card is selected",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding subheader/description content."
- },
- {
- "name": "footer-leading",
- "docs": "A slot for adding a leading footer."
- },
- {
- "name": "footer-trailing",
- "docs": "A slot for adding a trailing footer."
- },
- {
- "name": "subtitle",
- "docs": "A slot for adding a card subtitle or short summary."
- },
- {
- "name": "thumbnail",
- "docs": "A slot for adding a thumbnail to the card."
- },
- {
- "name": "title",
- "docs": "A slot for adding a card title."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-loader",
- "calcite-label",
- "calcite-checkbox"
- ],
- "dependencyGraph": {
- "calcite-card": [
- "calcite-loader",
- "calcite-label",
- "calcite-checkbox"
- ]
- }
- },
- {
- "filePath": "./src/components/checkbox/checkbox.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-checkbox",
- "readme": "# calcite-checkbox\n",
- "docs": "",
- "docsTags": [],
- "usage": {
- "Basic": "```html\n<calcite-checkbox id=\"first-name\" name=\"first-name\"></calcite-checkbox>\n```\n",
- "Checked-with-calcite-label": "```html\n<calcite-label layout=\"inline\" for=\"checked-item\">\n To do\n <calcite-checkbox checked id=\"checked-item\" name=\"checked-item\"></calcite-checkbox>\n</calcite-label>\n```\n",
- "Hovered-with-calcite-label": "```html\n<calcite-label layout=\"inline\" for=\"hovered-item\">\n <calcite-checkbox hovered id=\"hovered-item\" name=\"hovered-item\"></calcite-checkbox>\n To do\n</calcite-label>\n```\n",
- "Indeterminate-with-native-label": "```html\n<label for=\"checked-indeterminate\">\n Status\n <calcite-checkbox checked indeterminate id=\"checked-indeterminate\" name=\"checked-indeterminate\"></calcite-checkbox>\n</label>\n```\n"
- },
- "props": [
- {
- "name": "checked",
- "type": "boolean",
- "mutable": true,
- "attr": "checked",
- "reflectToAttr": true,
- "docs": "The checked state of the checkbox.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "True if the checkbox is disabled",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "guid",
- "type": "string",
- "mutable": true,
- "attr": "guid",
- "reflectToAttr": true,
- "docs": "The id attribute of the checkbox. When omitted, a globally unique identifier is used.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "indeterminate",
- "type": "boolean",
- "mutable": true,
- "attr": "indeterminate",
- "reflectToAttr": true,
- "docs": "True if the checkbox is initially indeterminate,\nwhich is independent from its checked state\nhttps://css-tricks.com/indeterminate-checkboxes/",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "name",
- "type": "any",
- "mutable": false,
- "attr": "name",
- "reflectToAttr": true,
- "docs": "The name of the checkbox input",
- "docsTags": [],
- "values": [
- {
- "type": "any"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of the checkbox, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "any",
- "mutable": false,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "The value of the checkbox input",
- "docsTags": [],
- "values": [
- {
- "type": "any"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteCheckboxChange",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the checkbox checked status changes",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [
- {
- "name": "--calcite-checkbox-size",
- "annotation": "prop",
- "docs": "the width and height of the checkbox"
- }
- ],
- "slots": [],
- "parts": [],
- "dependents": [
- "calcite-card",
- "calcite-tree-item"
- ],
- "dependencies": [],
- "dependencyGraph": {
- "calcite-card": [
- "calcite-checkbox"
- ],
- "calcite-tree-item": [
- "calcite-checkbox"
- ]
- }
- },
- {
- "filePath": "./src/components/chip/chip.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-chip",
- "readme": "# calcite-chip\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding text."
- },
- {
- "name": "slot",
- "text": "image - A slot for adding an image."
- }
- ],
- "usage": {
- "Basic": "```html\n<calcite-chip value=\"Global\" dismissible icon=\"globe\" appearance=\"clear\" color=\"green\">Global</calcite-chip>\n```\n"
- },
- "props": [
- {
- "name": "appearance",
- "type": "\"clear\" | \"solid\"",
- "mutable": false,
- "attr": "appearance",
- "reflectToAttr": true,
- "docs": "specify the appearance style of the button, defaults to solid.",
- "docsTags": [],
- "default": "\"solid\"",
- "values": [
- {
- "value": "clear",
- "type": "string"
- },
- {
- "value": "solid",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "color",
- "type": "\"blue\" | \"green\" | \"grey\" | \"red\" | \"yellow\"",
- "mutable": false,
- "attr": "color",
- "reflectToAttr": true,
- "docs": "specify the color of the button, defaults to blue",
- "docsTags": [],
- "default": "\"grey\"",
- "values": [
- {
- "value": "blue",
- "type": "string"
- },
- {
- "value": "green",
- "type": "string"
- },
- {
- "value": "grey",
- "type": "string"
- },
- {
- "value": "red",
- "type": "string"
- },
- {
- "value": "yellow",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "dismissLabel",
- "type": "string",
- "mutable": false,
- "attr": "dismiss-label",
- "reflectToAttr": false,
- "docs": "Aria label for the \"x\" button",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Close\""
- }
- ],
- "default": "TEXT.close",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "dismissible",
- "type": "boolean",
- "mutable": false,
- "attr": "dismissible",
- "reflectToAttr": true,
- "docs": "Optionally show a button the user can click to dismiss the chip",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "icon",
- "type": "string",
- "mutable": false,
- "attr": "icon",
- "reflectToAttr": true,
- "docs": "optionally pass an icon to display - accepts Calcite UI icon names",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "iconFlipRtl",
- "type": "boolean",
- "mutable": false,
- "attr": "icon-flip-rtl",
- "reflectToAttr": true,
- "docs": "flip the icon in rtl",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of the chip, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "any",
- "mutable": false,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "The assigned value for the chip",
- "docsTags": [],
- "values": [
- {
- "type": "any"
- }
- ],
- "optional": false,
- "required": true
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteChipDismiss",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the dismiss button is clicked",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding text."
- },
- {
- "name": "image",
- "docs": "A slot for adding an image."
- }
- ],
- "parts": [],
- "dependents": [
- "calcite-alert",
- "calcite-combobox",
- "calcite-rating"
- ],
- "dependencies": [
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-chip": [
- "calcite-icon"
- ],
- "calcite-alert": [
- "calcite-chip"
- ],
- "calcite-combobox": [
- "calcite-chip"
- ],
- "calcite-rating": [
- "calcite-chip"
- ]
- }
- },
- {
- "filePath": "./src/components/color-picker/color-picker.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-color-picker",
- "readme": "# calcite-color-picker\n",
- "docs": "",
- "docsTags": [],
- "usage": {
- "Basic": "```html\n<calcite-color-picker dir=\"ltr\" scale=\"m\" value=\"#b33f33\" appearance=\"default\"></calcite-color-picker>\n```\n",
- "Minimal": "For a minimal design, you can hide unused color formats and options:\n\n```html\n<calcite-color-picker appearance=\"minimal\" value=\"\" allow-empty hide-saved hide-channels></calcite-color-picker>\n```\n"
- },
- "props": [
- {
- "name": "allowEmpty",
- "type": "boolean",
- "mutable": false,
- "attr": "allow-empty",
- "reflectToAttr": false,
- "docs": "When false, empty color (null) will be allowed as a value. Otherwise, a color value is always enforced by the component.\n\nWhen true, clearing the input and blurring will restore the last valid color set. When false, it will set it to empty.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "appearance",
- "type": "\"default\" | \"minimal\"",
- "mutable": false,
- "attr": "appearance",
- "reflectToAttr": true,
- "docs": "specify the appearance - default (containing border), or minimal (no containing border)",
- "docsTags": [],
- "default": "\"default\"",
- "values": [
- {
- "value": "default",
- "type": "string"
- },
- {
- "value": "minimal",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, disabled prevents user interaction.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "format",
- "type": "\"auto\" | \"hex\" | \"hexa\" | \"hsl\" | \"hsl-css\" | \"hsla\" | \"hsla-css\" | \"hsv\" | \"hsva\" | \"rgb\" | \"rgb-css\" | \"rgba\" | \"rgba-css\"",
- "mutable": false,
- "attr": "format",
- "reflectToAttr": false,
- "docs": "The format of the value property.\n\nWhen \"auto\", the format will be inferred from `value` when set.",
- "docsTags": [
- {
- "name": "default",
- "text": "\"auto\""
- }
- ],
- "default": "defaultFormat",
- "values": [
- {
- "value": "auto",
- "type": "string"
- },
- {
- "value": "hex",
- "type": "string"
- },
- {
- "value": "hexa",
- "type": "string"
- },
- {
- "value": "hsl",
- "type": "string"
- },
- {
- "value": "hsl-css",
- "type": "string"
- },
- {
- "value": "hsla",
- "type": "string"
- },
- {
- "value": "hsla-css",
- "type": "string"
- },
- {
- "value": "hsv",
- "type": "string"
- },
- {
- "value": "hsva",
- "type": "string"
- },
- {
- "value": "rgb",
- "type": "string"
- },
- {
- "value": "rgb-css",
- "type": "string"
- },
- {
- "value": "rgba",
- "type": "string"
- },
- {
- "value": "rgba-css",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "hideChannels",
- "type": "boolean",
- "mutable": false,
- "attr": "hide-channels",
- "reflectToAttr": false,
- "docs": "When true, hides the RGB/HSV channel inputs",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "hideHex",
- "type": "boolean",
- "mutable": false,
- "attr": "hide-hex",
- "reflectToAttr": false,
- "docs": "When true, hides the hex input",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "hideSaved",
- "type": "boolean",
- "mutable": false,
- "attr": "hide-saved",
- "reflectToAttr": false,
- "docs": "When true, hides the saved colors section",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlB",
- "type": "string",
- "mutable": false,
- "attr": "intl-b",
- "reflectToAttr": false,
- "docs": "Label used for the blue channel",
- "docsTags": [
- {
- "name": "default",
- "text": "\"B\""
- }
- ],
- "default": "TEXT.b",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlBlue",
- "type": "string",
- "mutable": false,
- "attr": "intl-blue",
- "reflectToAttr": false,
- "docs": "Label used for the blue channel description",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Blue\""
- }
- ],
- "default": "TEXT.blue",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlDeleteColor",
- "type": "string",
- "mutable": false,
- "attr": "intl-delete-color",
- "reflectToAttr": false,
- "docs": "Label used for the delete color button.",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Delete color\""
- }
- ],
- "default": "TEXT.deleteColor",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlG",
- "type": "string",
- "mutable": false,
- "attr": "intl-g",
- "reflectToAttr": false,
- "docs": "Label used for the green channel",
- "docsTags": [
- {
- "name": "default",
- "text": "\"G\""
- }
- ],
- "default": "TEXT.g",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlGreen",
- "type": "string",
- "mutable": false,
- "attr": "intl-green",
- "reflectToAttr": false,
- "docs": "Label used for the green channel description",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Green\""
- }
- ],
- "default": "TEXT.green",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlH",
- "type": "string",
- "mutable": false,
- "attr": "intl-h",
- "reflectToAttr": false,
- "docs": "Label used for the hue channel",
- "docsTags": [
- {
- "name": "default",
- "text": "\"H\""
- }
- ],
- "default": "TEXT.h",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlHex",
- "type": "string",
- "mutable": false,
- "attr": "intl-hex",
- "reflectToAttr": false,
- "docs": "Label used for the hex input",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Hex\""
- }
- ],
- "default": "TEXT.hex",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlHsv",
- "type": "string",
- "mutable": false,
- "attr": "intl-hsv",
- "reflectToAttr": false,
- "docs": "Label used for the HSV mode",
- "docsTags": [
- {
- "name": "default",
- "text": "\"HSV\""
- }
- ],
- "default": "TEXT.hsv",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlHue",
- "type": "string",
- "mutable": false,
- "attr": "intl-hue",
- "reflectToAttr": false,
- "docs": "Label used for the hue channel description",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Hue\""
- }
- ],
- "default": "TEXT.hue",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlNoColor",
- "type": "string",
- "mutable": false,
- "attr": "intl-no-color",
- "reflectToAttr": false,
- "docs": "Label used for the hex input when there is no color selected.",
- "docsTags": [
- {
- "name": "default",
- "text": "\"No color\""
- }
- ],
- "default": "TEXT.noColor",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlR",
- "type": "string",
- "mutable": false,
- "attr": "intl-r",
- "reflectToAttr": false,
- "docs": "Label used for the red channel",
- "docsTags": [
- {
- "name": "default",
- "text": "\"R\""
- }
- ],
- "default": "TEXT.r",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlRed",
- "type": "string",
- "mutable": false,
- "attr": "intl-red",
- "reflectToAttr": false,
- "docs": "Label used for the red channel description",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Red\""
- }
- ],
- "default": "TEXT.red",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlRgb",
- "type": "string",
- "mutable": false,
- "attr": "intl-rgb",
- "reflectToAttr": false,
- "docs": "Label used for the RGB mode",
- "docsTags": [
- {
- "name": "default",
- "text": "\"RGB\""
- }
- ],
- "default": "TEXT.rgb",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlS",
- "type": "string",
- "mutable": false,
- "attr": "intl-s",
- "reflectToAttr": false,
- "docs": "Label used for the saturation channel",
- "docsTags": [
- {
- "name": "default",
- "text": "\"S\""
- }
- ],
- "default": "TEXT.s",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlSaturation",
- "type": "string",
- "mutable": false,
- "attr": "intl-saturation",
- "reflectToAttr": false,
- "docs": "Label used for the saturation channel description",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Saturation\""
- }
- ],
- "default": "TEXT.saturation",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlSaveColor",
- "type": "string",
- "mutable": false,
- "attr": "intl-save-color",
- "reflectToAttr": false,
- "docs": "Label used for the save color button.",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Save color\""
- }
- ],
- "default": "TEXT.saveColor",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlSaved",
- "type": "string",
- "mutable": false,
- "attr": "intl-saved",
- "reflectToAttr": false,
- "docs": "Label used for the saved colors section",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Saved\""
- }
- ],
- "default": "TEXT.saved",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlV",
- "type": "string",
- "mutable": false,
- "attr": "intl-v",
- "reflectToAttr": false,
- "docs": "Label used for the value channel",
- "docsTags": [
- {
- "name": "default",
- "text": "\"V\""
- }
- ],
- "default": "TEXT.v",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlValue",
- "type": "string",
- "mutable": false,
- "attr": "intl-value",
- "reflectToAttr": false,
- "docs": "Label used for the",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Value\""
- }
- ],
- "default": "TEXT.value",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "The scale of the color picker.",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "storageId",
- "type": "string",
- "mutable": false,
- "attr": "storage-id",
- "reflectToAttr": false,
- "docs": "Storage ID for colors.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "HSL | HSL & ObjectWithAlpha | HSV | HSV & ObjectWithAlpha | RGB | RGB & ObjectWithAlpha | string",
- "mutable": true,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "The color value.\n\nThis value can be either a {@link https ://developer.mozilla.org/en-US/docs/Web/CSS/color|CSS string}\na RGB, HSL or HSV object.\n\nThe type will be preserved as the color is updated.",
- "docsTags": [
- {
- "name": "default",
- "text": "\"#007ac2\""
- },
- {
- "name": "see",
- "text": "[ColorValue](https://github.com/Esri/calcite-components/blob/master/src/components/color-picker/interfaces.ts#L10)"
- }
- ],
- "default": "defaultValue",
- "values": [
- {
- "type": "HSL"
- },
- {
- "type": "HSL & ObjectWithAlpha"
- },
- {
- "type": "HSV"
- },
- {
- "type": "HSV & ObjectWithAlpha"
- },
- {
- "type": "RGB"
- },
- {
- "type": "RGB & ObjectWithAlpha"
- },
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteColorPickerChange",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fires when the color value has changed.",
- "docsTags": []
- },
- {
- "event": "calciteColorPickerInput",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fires as the color value changes.\n\nThis is similar to the change event with the exception of dragging. When dragging the color field or hue slider thumb, this event fires as the thumb is moved.",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "keydown",
- "capture": true,
- "passive": false
- },
- {
- "event": "keyup",
- "capture": true,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-tab-title",
- "calcite-tab",
- "calcite-input",
- "calcite-color-picker-hex-input",
- "calcite-tabs",
- "calcite-tab-nav",
- "calcite-button",
- "calcite-color-picker-swatch"
- ],
- "dependencyGraph": {
- "calcite-color-picker": [
- "calcite-tab-title",
- "calcite-tab",
- "calcite-input",
- "calcite-color-picker-hex-input",
- "calcite-tabs",
- "calcite-tab-nav",
- "calcite-button",
- "calcite-color-picker-swatch"
- ],
- "calcite-tab-title": [
- "calcite-icon"
- ],
- "calcite-input": [
- "calcite-progress",
- "calcite-icon"
- ],
- "calcite-color-picker-hex-input": [
- "calcite-input",
- "calcite-color-picker-swatch"
- ],
- "calcite-button": [
- "calcite-loader",
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/color-picker-hex-input/color-picker-hex-input.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-color-picker-hex-input",
- "readme": "# calcite-hex-input\n",
- "docs": "",
- "docsTags": [],
- "usage": {},
- "props": [
- {
- "name": "allowEmpty",
- "type": "boolean",
- "mutable": false,
- "attr": "allow-empty",
- "reflectToAttr": false,
- "docs": "When false, empty color (null) will be allowed as a value. Otherwise, a color value is always enforced by the component.\n\nWhen true, clearing the input and blurring will restore the last valid color set. When false, it will set it to empty.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlHex",
- "type": "string",
- "mutable": false,
- "attr": "intl-hex",
- "reflectToAttr": false,
- "docs": "Label used for the hex input.",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Hex\""
- }
- ],
- "default": "TEXT.hex",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlNoColor",
- "type": "string",
- "mutable": false,
- "attr": "intl-no-color",
- "reflectToAttr": false,
- "docs": "Label used for the hex input when there is no color selected.",
- "docsTags": [
- {
- "name": "default",
- "text": "\"No color\""
- }
- ],
- "default": "TEXT.noColor",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "The component's scale.",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "string",
- "mutable": true,
- "attr": "value",
- "reflectToAttr": true,
- "docs": "The hex value.",
- "docsTags": [],
- "default": "normalizeHex(DEFAULT_COLOR.hex())",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteColorPickerHexInputChange",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the hex value changes.",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "keydown",
- "capture": true,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [
- "calcite-color-picker"
- ],
- "dependencies": [
- "calcite-input",
- "calcite-color-picker-swatch"
- ],
- "dependencyGraph": {
- "calcite-color-picker-hex-input": [
- "calcite-input",
- "calcite-color-picker-swatch"
- ],
- "calcite-input": [
- "calcite-progress",
- "calcite-icon"
- ],
- "calcite-color-picker": [
- "calcite-color-picker-hex-input"
- ]
- }
- },
- {
- "filePath": "./src/components/color-picker-swatch/color-picker-swatch.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-color-picker-swatch",
- "readme": "# my-component\n",
- "docs": "",
- "docsTags": [],
- "usage": {},
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": false,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "Used to display whether the swatch is active or not.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "color",
- "type": "string",
- "mutable": false,
- "attr": "color",
- "reflectToAttr": false,
- "docs": "The color value.",
- "docsTags": [
- {
- "name": "see",
- "text": "https://developer.mozilla.org/en-US/docs/Web/CSS/color_value"
- }
- ],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "The component scale.",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [
- "calcite-color-picker",
- "calcite-color-picker-hex-input"
- ],
- "dependencies": [],
- "dependencyGraph": {
- "calcite-color-picker": [
- "calcite-color-picker-swatch"
- ],
- "calcite-color-picker-hex-input": [
- "calcite-color-picker-swatch"
- ]
- }
- },
- {
- "filePath": "./src/components/combobox/combobox.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-combobox",
- "readme": "# calcite-combobox\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-combobox-item`s."
- }
- ],
- "usage": {
- "Ancestors": "```html\n<calcite-combobox label=\"Ancestors selection-mode combobox\" selection-mode=\"ancestors\">\n <calcite-combobox-item value=\"Trees\" text-label=\"Trees\">\n <calcite-combobox-item\n value=\"CommercialDamageAssessment - Damage to Commercial Buildings & Damage to Commercial Buildings\"\n text-label=\"CommercialDamageAssessment - Damage to Commercial Buildings & Damage to Commercial Buildings\"\n selected\n ></calcite-combobox-item>\n <calcite-combobox-item value=\"Sequoia\" disabled text-label=\"Sequoia\"></calcite-combobox-item>\n <calcite-combobox-item value=\"Douglas Fir\" text-label=\"Douglas Fir\"></calcite-combobox-item>\n </calcite-combobox-item>\n</calcite-combobox>\n```\n",
- "Multi": "```html\n<calcite-combobox label=\"Mulit selection-mode combobox\" selection-mode=\"multi\">\n <calcite-combobox-item value=\"Trees\" text-label=\"Trees\">\n <calcite-combobox-item\n value=\"CommercialDamageAssessment - Damage to Commercial Buildings & Damage to Commercial Buildings\"\n text-label=\"CommercialDamageAssessment - Damage to Commercial Buildings & Damage to Commercial Buildings\"\n selected\n ></calcite-combobox-item>\n <calcite-combobox-item value=\"Sequoia\" disabled text-label=\"Sequoia\"></calcite-combobox-item>\n <calcite-combobox-item value=\"Douglas Fir\" text-label=\"Douglas Fir\"></calcite-combobox-item>\n </calcite-combobox-item>\n</calcite-combobox>\n```\n",
- "Single": "```html\n<calcite-combobox label=\"Single selection-mode combobox\" selection-mode=\"single\">\n <calcite-combobox-item value=\"Trees\" text-label=\"Trees\">\n <calcite-combobox-item\n value=\"CommercialDamageAssessment - Damage to Commercial Buildings\"\n text-label=\"CommercialDamageAssessment - Damage to Commercial Buildings\"\n selected\n ></calcite-combobox-item>\n <calcite-combobox-item value=\"Sequoia\" disabled text-label=\"Sequoia\"></calcite-combobox-item>\n <calcite-combobox-item value=\"Douglas Fir\" text-label=\"Douglas Fir\"></calcite-combobox-item>\n </calcite-combobox-item>\n <calcite-combobox-item value=\"Rivers\" text-label=\"Rivers\"></calcite-combobox-item>\n</calcite-combobox>\n```\n"
- },
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": true,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "Opens or closes the combobox",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "allowCustomValues",
- "type": "boolean",
- "mutable": false,
- "attr": "allow-custom-values",
- "reflectToAttr": false,
- "docs": "Allow entry of custom values which are not in the original set of items",
- "docsTags": [],
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "Disable combobox input",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "flipPlacements",
- "type": "ComputedPlacement[]",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Defines the available placements that can be used when a flip occurs.",
- "docsTags": [],
- "values": [
- {
- "type": "ComputedPlacement[]"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlRemoveTag",
- "type": "string",
- "mutable": false,
- "attr": "intl-remove-tag",
- "reflectToAttr": false,
- "docs": "string to override the English \"Remove tag\" text for when an item is selected.",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Remove tag\""
- }
- ],
- "default": "TEXT.removeTag",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "Aria label for combobox (required)",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": true
- },
- {
- "name": "maxItems",
- "type": "number",
- "mutable": false,
- "attr": "max-items",
- "reflectToAttr": false,
- "docs": "Specify the maximum number of combobox items (including nested children) to display before showing the scroller",
- "docsTags": [],
- "default": "0",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "name",
- "type": "string",
- "mutable": false,
- "attr": "name",
- "reflectToAttr": true,
- "docs": "The name of the switch input",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "overlayPositioning",
- "type": "\"absolute\" | \"fixed\"",
- "mutable": false,
- "attr": "overlay-positioning",
- "reflectToAttr": false,
- "docs": "Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value.",
- "docsTags": [],
- "default": "\"absolute\"",
- "values": [
- {
- "value": "absolute",
- "type": "string"
- },
- {
- "value": "fixed",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "placeholder",
- "type": "string",
- "mutable": false,
- "attr": "placeholder",
- "reflectToAttr": false,
- "docs": "Placeholder text for input",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "Specify the scale of the combobox, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selectionMode",
- "type": "\"ancestors\" | \"multi\" | \"single\"",
- "mutable": false,
- "attr": "selection-mode",
- "reflectToAttr": true,
- "docs": "specify the selection mode\n- multi: allow any number of selected items (default)\n- single: only one selection)\n- ancestors: like multi, but show ancestors of selected items as selected, only deepest children shown in chips",
- "docsTags": [],
- "default": "\"multi\"",
- "values": [
- {
- "value": "ancestors",
- "type": "string"
- },
- {
- "value": "multi",
- "type": "string"
- },
- {
- "value": "single",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "string | string[]",
- "mutable": true,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "The value(s) of the selectedItem(s)",
- "docsTags": [],
- "default": "null",
- "values": [
- {
- "type": "string"
- },
- {
- "type": "string[]"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "reposition",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "reposition() => Promise<void>",
- "parameters": [],
- "docs": "Updates the position of the component.",
- "docsTags": []
- },
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteComboboxChange",
- "detail": "{ selectedItems: HTMLCalciteComboboxItemElement[]; }",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Called when the selected item(s) changes.",
- "docsTags": []
- },
- {
- "event": "calciteComboboxChipDismiss",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Called when a selected item in the combobox is dismissed via its chip *",
- "docsTags": []
- },
- {
- "event": "calciteComboboxFilterChange",
- "detail": "{ visibleItems: HTMLCalciteComboboxItemElement[]; text: string; }",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Called when the user has entered text to filter the options list",
- "docsTags": []
- },
- {
- "event": "calciteLookupChange",
- "detail": "HTMLCalciteComboboxItemElement[]",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Called when the selected items set changes",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use calciteComboboxChange instead"
- }
- ],
- "deprecation": "use calciteComboboxChange instead"
- }
- ],
- "listeners": [
- {
- "event": "click",
- "target": "document",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteComboboxItemChange",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [
- {
- "name": "--calcite-combobox-input-height",
- "annotation": "prop",
- "docs": "the height of the combobox input"
- }
- ],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-combobox-item`s."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-chip",
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-combobox": [
- "calcite-chip",
- "calcite-icon"
- ],
- "calcite-chip": [
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/combobox-item/combobox-item.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-combobox-item",
- "readme": "# calcite-combobox-item\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding nested `calcite-combobox-item`s."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": false,
- "attr": "active",
- "reflectToAttr": false,
- "docs": "True when item is highlighted either from keyboard or mouse hover",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "ancestors",
- "type": "ComboboxChildElement[]",
- "mutable": true,
- "reflectToAttr": false,
- "docs": "Parent and grandparent combobox items, this is set internally for use from combobox",
- "docsTags": [],
- "values": [
- {
- "type": "ComboboxChildElement[]"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "constant",
- "type": "boolean",
- "mutable": false,
- "attr": "constant",
- "reflectToAttr": true,
- "docs": "Don't filter this item based on the search text",
- "docsTags": [],
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, the item cannot be clicked and is visually muted.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "guid",
- "type": "string",
- "mutable": false,
- "attr": "guid",
- "reflectToAttr": false,
- "docs": "Unique identifier, used for accessibility",
- "docsTags": [],
- "default": "guid()",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "icon",
- "type": "string",
- "mutable": false,
- "attr": "icon",
- "reflectToAttr": false,
- "docs": "Custom icon to display both in combobox chips and next to combobox item text",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "selected",
- "type": "boolean",
- "mutable": true,
- "attr": "selected",
- "reflectToAttr": true,
- "docs": "Set this to true to pre-select an item. Toggles when an item is checked/unchecked.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "textLabel",
- "type": "string",
- "mutable": false,
- "attr": "text-label",
- "reflectToAttr": true,
- "docs": "The main label for this item.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": true
- },
- {
- "name": "value",
- "type": "any",
- "mutable": false,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "The item's associated value",
- "docsTags": [],
- "values": [
- {
- "type": "any"
- }
- ],
- "optional": false,
- "required": true
- }
- ],
- "methods": [
- {
- "name": "toggleSelected",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "toggleSelected(coerce?: boolean) => Promise<void>",
- "parameters": [],
- "docs": "Used to toggle the selection state. By default this won't trigger an event.\nThe first argument allows the value to be coerced, rather than swapping values.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteComboboxItemChange",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted whenever the item is selected or unselected.",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding nested `calcite-combobox-item`s."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-combobox-item": [
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/combobox-item-group/combobox-item-group.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-combobox-item-group",
- "readme": "# calcite-combobox-item-group\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-combobox-item`s."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "ancestors",
- "type": "ComboboxChildElement[]",
- "mutable": true,
- "reflectToAttr": false,
- "docs": "Parent and grandparent combobox items, this is set internally for use from combobox",
- "docsTags": [],
- "values": [
- {
- "type": "ComboboxChildElement[]"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "Title of the group",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": true
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-combobox-item`s."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/date-picker/date-picker.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-date-picker",
- "readme": "# calcite-date-picker\n\nThe `calcite-date-picker` component allows for selecting a date via a calendar or text input. It supports multiple locales, languages, right to left, and is fully keyboard accessible.\n",
- "docs": "The `calcite-date-picker` component allows for selecting a date via a calendar or text input. It supports multiple locales, languages, right to left, and is fully keyboard accessible.",
- "docsTags": [],
- "usage": {
- "Basic": "You can set a min and max range, as well as an initial value with ISO 8601 formatted strings:\n\n```html\n<calcite-date-picker value=\"2020-03-27\" min=\"2020-02-01\" max=\"2021-01-01\"></calcite-date-picker>\n```\n",
- "Range": "You can also add range property to activate date range mode. In this mode, you can specify start and end instead of the single value property.\n\n```html\n<calcite-date-picker range start=\"2020-03-15\" end=\"2020-03-27\" min=\"2020-02-01\" max=\"2021-01-01\" />\n```\n"
- },
- "props": [
- {
- "name": "activeRange",
- "type": "\"end\" | \"start\"",
- "mutable": false,
- "attr": "active-range",
- "reflectToAttr": false,
- "docs": "Active range",
- "docsTags": [],
- "values": [
- {
- "value": "end",
- "type": "string"
- },
- {
- "value": "start",
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "end",
- "type": "string",
- "mutable": true,
- "attr": "end",
- "reflectToAttr": false,
- "docs": "Selected end date",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use value instead"
- }
- ],
- "deprecation": "use value instead",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "endAsDate",
- "type": "Date",
- "mutable": true,
- "reflectToAttr": false,
- "docs": "Selected end date as full date object",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use valueAsDate instead"
- }
- ],
- "deprecation": "use valueAsDate instead",
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "headingLevel",
- "type": "1 | 2 | 3 | 4 | 5 | 6",
- "mutable": false,
- "attr": "heading-level",
- "reflectToAttr": false,
- "docs": "Number at which section headings should start for this component.",
- "docsTags": [],
- "values": [
- {
- "value": "1",
- "type": "number"
- },
- {
- "value": "2",
- "type": "number"
- },
- {
- "value": "3",
- "type": "number"
- },
- {
- "value": "4",
- "type": "number"
- },
- {
- "value": "5",
- "type": "number"
- },
- {
- "value": "6",
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlNextMonth",
- "type": "string",
- "mutable": false,
- "attr": "intl-next-month",
- "reflectToAttr": false,
- "docs": "Localized string for \"next month\" (used for aria label)",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Next month\""
- }
- ],
- "default": "TEXT.nextMonth",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlPrevMonth",
- "type": "string",
- "mutable": false,
- "attr": "intl-prev-month",
- "reflectToAttr": false,
- "docs": "Localized string for \"previous month\" (used for aria label)",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Previous month\""
- }
- ],
- "default": "TEXT.prevMonth",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlYear",
- "type": "string",
- "mutable": false,
- "attr": "intl-year",
- "reflectToAttr": false,
- "docs": "Localized string for \"year\" (used for aria label)",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Year\""
- }
- ],
- "default": "TEXT.year",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "locale",
- "type": "string",
- "mutable": false,
- "attr": "locale",
- "reflectToAttr": false,
- "docs": "BCP 47 language tag for desired language and country format",
- "docsTags": [],
- "default": "document.documentElement.lang || \"en\"",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "max",
- "type": "string",
- "mutable": true,
- "attr": "max",
- "reflectToAttr": false,
- "docs": "Latest allowed date (\"yyyy-mm-dd\")",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "maxAsDate",
- "type": "Date",
- "mutable": true,
- "reflectToAttr": false,
- "docs": "Latest allowed date as full date object",
- "docsTags": [],
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "min",
- "type": "string",
- "mutable": true,
- "attr": "min",
- "reflectToAttr": false,
- "docs": "Earliest allowed date (\"yyyy-mm-dd\")",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "minAsDate",
- "type": "Date",
- "mutable": true,
- "reflectToAttr": false,
- "docs": "Earliest allowed date as full date object",
- "docsTags": [],
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "proximitySelectionDisabled",
- "type": "boolean",
- "mutable": false,
- "attr": "proximity-selection-disabled",
- "reflectToAttr": false,
- "docs": "Disables the default behaviour on the third click of narrowing or extending the range and instead starts a new range.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "range",
- "type": "boolean",
- "mutable": false,
- "attr": "range",
- "reflectToAttr": true,
- "docs": "Range mode activation",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of the date picker",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "start",
- "type": "string",
- "mutable": true,
- "attr": "start",
- "reflectToAttr": false,
- "docs": "Selected start date",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use value instead"
- }
- ],
- "deprecation": "use value instead",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "startAsDate",
- "type": "Date",
- "mutable": true,
- "reflectToAttr": false,
- "docs": "Selected start date as full date object",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use valueAsDate instead"
- }
- ],
- "deprecation": "use valueAsDate instead",
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "value",
- "type": "string | string[]",
- "mutable": true,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "Selected date",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- },
- {
- "type": "string[]"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "valueAsDate",
- "type": "Date | Date[]",
- "mutable": true,
- "reflectToAttr": false,
- "docs": "Selected date as full date object",
- "docsTags": [],
- "values": [
- {
- "type": "Date"
- },
- {
- "type": "Date[]"
- }
- ],
- "optional": true,
- "required": false
- }
- ],
- "methods": [],
- "events": [
- {
- "event": "calciteDatePickerChange",
- "detail": "Date",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Trigger calcite date change when a user changes the date.",
- "docsTags": []
- },
- {
- "event": "calciteDatePickerRangeChange",
- "detail": "DateRangeChange",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Trigger calcite date change when a user changes the date range.",
- "docsTags": [
- {
- "name": "see",
- "text": "[DateRangeChange](https://github.com/Esri/calcite-components/blob/master/src/components/date-picker/interfaces.ts#L1)"
- }
- ]
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [
- "calcite-input-date-picker"
- ],
- "dependencies": [
- "calcite-date-picker-month-header",
- "calcite-date-picker-month"
- ],
- "dependencyGraph": {
- "calcite-date-picker": [
- "calcite-date-picker-month-header",
- "calcite-date-picker-month"
- ],
- "calcite-date-picker-month-header": [
- "calcite-icon"
- ],
- "calcite-date-picker-month": [
- "calcite-date-picker-day"
- ],
- "calcite-input-date-picker": [
- "calcite-date-picker"
- ]
- }
- },
- {
- "filePath": "./src/components/date-picker-day/date-picker-day.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-date-picker-day",
- "readme": "# calcite-date-day\n",
- "docs": "",
- "docsTags": [],
- "usage": {},
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": false,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "Date is actively in focus for keyboard navigation",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "currentMonth",
- "type": "boolean",
- "mutable": false,
- "attr": "current-month",
- "reflectToAttr": true,
- "docs": "Date is in the current month.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "day",
- "type": "number",
- "mutable": false,
- "attr": "day",
- "reflectToAttr": false,
- "docs": "Day of the month to be shown.",
- "docsTags": [],
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "Date is outside of range and can't be selected",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "endOfRange",
- "type": "boolean",
- "mutable": false,
- "attr": "end-of-range",
- "reflectToAttr": true,
- "docs": "Date is the end of date range",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "highlighted",
- "type": "boolean",
- "mutable": false,
- "attr": "highlighted",
- "reflectToAttr": true,
- "docs": "Date is currently highlighted as part of the range",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "localeData",
- "type": "DateLocaleData",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "CLDR data for current locale",
- "docsTags": [],
- "values": [
- {
- "type": "DateLocaleData"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "range",
- "type": "boolean",
- "mutable": false,
- "attr": "range",
- "reflectToAttr": true,
- "docs": "Showing date range",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "rangeHover",
- "type": "boolean",
- "mutable": false,
- "attr": "range-hover",
- "reflectToAttr": true,
- "docs": "Date is being hovered and within the set range",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of the date picker",
- "docsTags": [],
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selected",
- "type": "boolean",
- "mutable": false,
- "attr": "selected",
- "reflectToAttr": true,
- "docs": "Date is the current selected date of the picker",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "startOfRange",
- "type": "boolean",
- "mutable": false,
- "attr": "start-of-range",
- "reflectToAttr": true,
- "docs": "Date is the start of date range",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "Date",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Date value for the day.",
- "docsTags": [],
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [
- {
- "event": "calciteDaySelect",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when user selects day",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "mouseover",
- "capture": false,
- "passive": true
- }
- ],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [
- "calcite-date-picker-month"
- ],
- "dependencies": [],
- "dependencyGraph": {
- "calcite-date-picker-month": [
- "calcite-date-picker-day"
- ]
- }
- },
- {
- "filePath": "./src/components/date-picker-month/date-picker-month.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-date-picker-month",
- "readme": "# calcite-date-month\n",
- "docs": "",
- "docsTags": [],
- "usage": {},
- "props": [
- {
- "name": "activeDate",
- "type": "Date",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Date currently active.",
- "docsTags": [],
- "default": "new Date()",
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "endDate",
- "type": "Date",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "End date currently active",
- "docsTags": [],
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "hoverRange",
- "type": "HoverRange",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "The range of dates currently being hovered",
- "docsTags": [],
- "values": [
- {
- "type": "HoverRange"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "max",
- "type": "Date",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Maximum date of the calendar above which is disabled.",
- "docsTags": [],
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "min",
- "type": "Date",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Minimum date of the calendar below which is disabled.",
- "docsTags": [],
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of the date picker",
- "docsTags": [],
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selectedDate",
- "type": "Date",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Already selected date.",
- "docsTags": [],
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "startDate",
- "type": "Date",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Start date currently active.",
- "docsTags": [],
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": true,
- "required": false
- }
- ],
- "methods": [],
- "events": [
- {
- "event": "calciteDatePickerActiveDateChange",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Active date for the user keyboard access.",
- "docsTags": []
- },
- {
- "event": "calciteDatePickerSelect",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Event emitted when user selects the date.",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "mouseout",
- "capture": false,
- "passive": true
- }
- ],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [
- "calcite-date-picker"
- ],
- "dependencies": [
- "calcite-date-picker-day"
- ],
- "dependencyGraph": {
- "calcite-date-picker-month": [
- "calcite-date-picker-day"
- ],
- "calcite-date-picker": [
- "calcite-date-picker-month"
- ]
- }
- },
- {
- "filePath": "./src/components/date-picker-month-header/date-picker-month-header.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-date-picker-month-header",
- "readme": "# calcite-date-month-header\n",
- "docs": "",
- "docsTags": [],
- "usage": {},
- "props": [
- {
- "name": "activeDate",
- "type": "Date",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Focused date with indicator (will become selected date if user proceeds)",
- "docsTags": [],
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "headingLevel",
- "type": "1 | 2 | 3 | 4 | 5 | 6",
- "mutable": false,
- "attr": "heading-level",
- "reflectToAttr": false,
- "docs": "Number at which section headings should start for this component.",
- "docsTags": [],
- "values": [
- {
- "value": "1",
- "type": "number"
- },
- {
- "value": "2",
- "type": "number"
- },
- {
- "value": "3",
- "type": "number"
- },
- {
- "value": "4",
- "type": "number"
- },
- {
- "value": "5",
- "type": "number"
- },
- {
- "value": "6",
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlNextMonth",
- "type": "string",
- "mutable": false,
- "attr": "intl-next-month",
- "reflectToAttr": false,
- "docs": "Localized string for next month.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlPrevMonth",
- "type": "string",
- "mutable": false,
- "attr": "intl-prev-month",
- "reflectToAttr": false,
- "docs": "Localized string for previous month.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlYear",
- "type": "string",
- "mutable": false,
- "attr": "intl-year",
- "reflectToAttr": false,
- "docs": "Localized string for year.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "locale",
- "type": "string",
- "mutable": false,
- "attr": "locale",
- "reflectToAttr": false,
- "docs": "User's language and region as BCP 47 formatted string.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "localeData",
- "type": "DateLocaleData",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "CLDR locale data for translated calendar info",
- "docsTags": [],
- "values": [
- {
- "type": "DateLocaleData"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "max",
- "type": "Date",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Maximum date of the calendar above which is disabled.",
- "docsTags": [],
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "min",
- "type": "Date",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Minimum date of the calendar below which is disabled.",
- "docsTags": [],
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of the date picker",
- "docsTags": [],
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selectedDate",
- "type": "Date",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Already selected date.",
- "docsTags": [],
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [
- {
- "event": "calciteDatePickerSelect",
- "detail": "Date",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Changes to active date",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [
- "calcite-date-picker"
- ],
- "dependencies": [
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-date-picker-month-header": [
- "calcite-icon"
- ],
- "calcite-date-picker": [
- "calcite-date-picker-month-header"
- ]
- }
- },
- {
- "filePath": "./src/components/dropdown/dropdown.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-dropdown",
- "readme": "# calcite-dropdown\n\nA `calcite-dropdown` can be used to provide an absolutely positioned set of selectable items. You can combine multiple groups of items and selection modes, and optionally pass a title for each group. All `<calcite-dropdown-item>` must have a parent `<calcite-dropdown-group>`, even if `group-title` attribute is not set.\n",
- "docs": "A `calcite-dropdown` can be used to provide an absolutely positioned set of selectable items. You can combine multiple groups of items and selection modes, and optionally pass a title for each group. All `<calcite-dropdown-item>` must have a parent `<calcite-dropdown-group>`, even if `group-title` attribute is not set.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-dropdown-group`s or `calcite-dropdown-item`s."
- },
- {
- "name": "slot",
- "text": "dropdown-trigger - A slot for the element that triggers the dropdown."
- }
- ],
- "usage": {
- "Basic": "```html\n<calcite-dropdown>\n <calcite-button slot=\"dropdown-trigger\">Open Dropdown</calcite-button>\n <calcite-dropdown-group>\n <calcite-dropdown-item>Relevance</calcite-dropdown-item>\n <calcite-dropdown-item active>Date modified</calcite-dropdown-item>\n <calcite-dropdown-item>Title</calcite-dropdown-item>\n </calcite-dropdown-group>\n</calcite-dropdown>\n```\n",
- "Disabling-close-on-select": "You can choose to leave the dropdown open when an item is selected with the `disable-close-on-select` attribute. Note that this will only apply when the `calcite-dropdown-group` selection mode is set to `single` or `multi` - dropdowns will always close when an item in `none` selection mode is selected.\n\n```html\n<calcite-dropdown disable-close-on-select>\n <calcite-button id=\"trigger\" slot=\"dropdown-trigger\">Open dropdown</calcite-button>\n <calcite-dropdown-group id=\"group-1\" selection-mode=\"single\">\n <calcite-dropdown-item id=\"item-1\"> Dropdown Item Content </calcite-dropdown-item>\n <calcite-dropdown-item id=\"item-2\" active> Dropdown Item Content </calcite-dropdown-item>\n <calcite-dropdown-item id=\"item-3\"> Dropdown Item Content </calcite-dropdown-item>\n </calcite-dropdown-group>\n</calcite-dropdown>\n```\n",
- "Groups": "You can combine groups in a single dropdown, with varying selection modes:\n\n```html\n<calcite-dropdown>\n <calcite-button slot=\"dropdown-trigger\">Open Dropdown</calcite-button>\n <calcite-dropdown-group group-title=\"Select one\">\n <calcite-dropdown-item>Apple</calcite-dropdown-item>\n <calcite-dropdown-item active>Orange</calcite-dropdown-item>\n <calcite-dropdown-item>Grape</calcite-dropdown-item>\n </calcite-dropdown-group>\n <calcite-dropdown-group group-title=\"Select multi\" selection-mode=\"multi\">\n <calcite-dropdown-item>Asparagus</calcite-dropdown-item>\n <calcite-dropdown-item active>Potato</calcite-dropdown-item>\n <calcite-dropdown-item>Yam</calcite-dropdown-item>\n </calcite-dropdown-group>\n <calcite-dropdown-group group-title=\"Select none (useful for actions)\" selection-mode=\"none\">\n <calcite-dropdown-item>Plant beans</calcite-dropdown-item>\n <calcite-dropdown-item active>Add peas</calcite-dropdown-item>\n </calcite-dropdown-group>\n</calcite-dropdown>\n```\n"
- },
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": true,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "Opens or closes the dropdown",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disableCloseOnSelect",
- "type": "boolean",
- "mutable": false,
- "attr": "disable-close-on-select",
- "reflectToAttr": true,
- "docs": "allow the dropdown to remain open after a selection is made\nif the selection-mode of the selected item's containing group is \"none\", the dropdown will always close",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "is the dropdown disabled",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "flipPlacements",
- "type": "ComputedPlacement[]",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Defines the available placements that can be used when a flip occurs.",
- "docsTags": [],
- "values": [
- {
- "type": "ComputedPlacement[]"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "maxItems",
- "type": "number",
- "mutable": false,
- "attr": "max-items",
- "reflectToAttr": false,
- "docs": "specify the maximum number of calcite-dropdown-items to display before showing the scroller, must be greater than 0 -\nthis value does not include groupTitles passed to calcite-dropdown-group",
- "docsTags": [],
- "default": "0",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "overlayPositioning",
- "type": "\"absolute\" | \"fixed\"",
- "mutable": false,
- "attr": "overlay-positioning",
- "reflectToAttr": false,
- "docs": "Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value.",
- "docsTags": [],
- "default": "\"absolute\"",
- "values": [
- {
- "value": "absolute",
- "type": "string"
- },
- {
- "value": "fixed",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "placement",
- "type": "\"bottom\" | \"bottom-end\" | \"bottom-leading\" | \"bottom-start\" | \"bottom-trailing\" | \"top\" | \"top-end\" | \"top-leading\" | \"top-start\" | \"top-trailing\"",
- "mutable": false,
- "attr": "placement",
- "reflectToAttr": true,
- "docs": "Determines where the dropdown will be positioned relative to the button.",
- "docsTags": [
- {
- "name": "default",
- "text": "\"bottom-leading\""
- }
- ],
- "default": "defaultMenuPlacement",
- "values": [
- {
- "value": "bottom",
- "type": "string"
- },
- {
- "value": "bottom-end",
- "type": "string"
- },
- {
- "value": "bottom-leading",
- "type": "string"
- },
- {
- "value": "bottom-start",
- "type": "string"
- },
- {
- "value": "bottom-trailing",
- "type": "string"
- },
- {
- "value": "top",
- "type": "string"
- },
- {
- "value": "top-end",
- "type": "string"
- },
- {
- "value": "top-leading",
- "type": "string"
- },
- {
- "value": "top-start",
- "type": "string"
- },
- {
- "value": "top-trailing",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of dropdown, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selectedItems",
- "type": "HTMLCalciteDropdownItemElement[]",
- "mutable": true,
- "reflectToAttr": false,
- "docs": "**read-only** The currently selected items",
- "docsTags": [
- {
- "name": "readonly"
- }
- ],
- "default": "[]",
- "values": [
- {
- "type": "HTMLCalciteDropdownItemElement[]"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "type",
- "type": "\"click\" | \"hover\"",
- "mutable": false,
- "attr": "type",
- "reflectToAttr": true,
- "docs": "specify whether the dropdown is opened by hover or click of a trigger element",
- "docsTags": [],
- "default": "\"click\"",
- "values": [
- {
- "value": "click",
- "type": "string"
- },
- {
- "value": "hover",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "width",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "width",
- "reflectToAttr": true,
- "docs": "specify the width of dropdown, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "reposition",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "reposition() => Promise<void>",
- "parameters": [],
- "docs": "Updates the position of the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteDropdownClose",
- "detail": "void",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "fires when a dropdown has been closed *",
- "docsTags": []
- },
- {
- "event": "calciteDropdownOpen",
- "detail": "void",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "fires when a dropdown has been opened *",
- "docsTags": []
- },
- {
- "event": "calciteDropdownSelect",
- "detail": "void",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "fires when a dropdown item has been selected or deselected *",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "click",
- "target": "window",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteDropdownCloseRequest",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteDropdownOpen",
- "target": "window",
- "capture": false,
- "passive": false
- },
- {
- "event": "mouseenter",
- "capture": false,
- "passive": true
- },
- {
- "event": "mouseleave",
- "capture": false,
- "passive": true
- },
- {
- "event": "calciteDropdownItemKeyEvent",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteDropdownItemSelect",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [
- {
- "name": "--calcite-dropdown-width",
- "annotation": "prop",
- "docs": "the width of the dropdown wrapper"
- }
- ],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-dropdown-group`s or `calcite-dropdown-item`s."
- },
- {
- "name": "dropdown-trigger",
- "docs": "A slot for the element that triggers the dropdown."
- }
- ],
- "parts": [],
- "dependents": [
- "calcite-split-button"
- ],
- "dependencies": [],
- "dependencyGraph": {
- "calcite-split-button": [
- "calcite-dropdown"
- ]
- }
- },
- {
- "filePath": "./src/components/dropdown-group/dropdown-group.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-dropdown-group",
- "readme": "# calcite-dropdown-group\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-dropdown-item`s."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "groupTitle",
- "type": "string",
- "mutable": false,
- "attr": "group-title",
- "reflectToAttr": true,
- "docs": "optionally set a group title for display",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "Specifies the size of the action.",
- "docsTags": [],
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selectionMode",
- "type": "\"multi\" | \"none\" | \"single\"",
- "mutable": false,
- "attr": "selection-mode",
- "reflectToAttr": true,
- "docs": "specify the selection mode - multi (allow any number of (or no) active items), single (allow and require one active item),\nnone (no active items), defaults to single",
- "docsTags": [],
- "default": "\"single\"",
- "values": [
- {
- "value": "multi",
- "type": "string"
- },
- {
- "value": "none",
- "type": "string"
- },
- {
- "value": "single",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [
- {
- "event": "calciteDropdownItemSelect",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-dropdown-item`s."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/dropdown-item/dropdown-item.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-dropdown-item",
- "readme": "# calcite-dropdown-item\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding text."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": true,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "Indicates whether the item is active.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "href",
- "type": "string",
- "mutable": false,
- "attr": "href",
- "reflectToAttr": true,
- "docs": "optionally pass a href - used to determine if the component should render as anchor",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "iconEnd",
- "type": "string",
- "mutable": false,
- "attr": "icon-end",
- "reflectToAttr": true,
- "docs": "optionally pass an icon to display at the end of an item - accepts calcite ui icon names",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "iconFlipRtl",
- "type": "\"both\" | \"end\" | \"start\"",
- "mutable": false,
- "attr": "icon-flip-rtl",
- "reflectToAttr": true,
- "docs": "flip the icon(s) in rtl",
- "docsTags": [],
- "values": [
- {
- "value": "both",
- "type": "string"
- },
- {
- "value": "end",
- "type": "string"
- },
- {
- "value": "start",
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "iconStart",
- "type": "string",
- "mutable": false,
- "attr": "icon-start",
- "reflectToAttr": true,
- "docs": "optionally pass an icon to display at the start of an item - accepts calcite ui icon names",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "Applies to the aria-label attribute on the button or hyperlink",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "rel",
- "type": "string",
- "mutable": false,
- "attr": "rel",
- "reflectToAttr": false,
- "docs": "The rel attribute to apply to the hyperlink",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "target",
- "type": "string",
- "mutable": false,
- "attr": "target",
- "reflectToAttr": false,
- "docs": "The target attribute to apply to the hyperlink",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [],
- "listeners": [
- {
- "event": "click",
- "capture": false,
- "passive": false
- },
- {
- "event": "keydown",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteDropdownItemChange",
- "target": "body",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding text."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-dropdown-item": [
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/fab/fab.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-fab",
- "readme": "# calcite-fab\n",
- "docs": "",
- "docsTags": [],
- "usage": {
- "Basic": "Renders a `calcite-fab` that displays only an icon and a tooltip label.\n\n```html\n<calcite-fab label=\"Performs my custom action\"></calcite-fab>\n```\n",
- "Loading-and-disabled": "Renders a `calcite-fab` that is loading and disabled.\n\n```html\n<calcite-fab loading disabled></calcite-fab>\n```\n",
- "With-text": "Renders a `calcite-fab` that displays text along side an icon and a tooltip label.\n\n```html\n<calcite-fab label=\"Performs my custom action\" text=\"Perform Action!\" text-enabled></calcite-fab>\n```\n"
- },
- "props": [
- {
- "name": "appearance",
- "type": "\"outline\" | \"solid\"",
- "mutable": false,
- "attr": "appearance",
- "reflectToAttr": true,
- "docs": "Used to set the button's appearance. Default is outline.",
- "docsTags": [],
- "default": "\"outline\"",
- "values": [
- {
- "value": "outline",
- "type": "string"
- },
- {
- "value": "solid",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "color",
- "type": "\"blue\" | \"inverse\" | \"neutral\" | \"red\"",
- "mutable": false,
- "attr": "color",
- "reflectToAttr": true,
- "docs": "Used to set the button's color. Default is light.",
- "docsTags": [],
- "default": "\"neutral\"",
- "values": [
- {
- "value": "blue",
- "type": "string"
- },
- {
- "value": "inverse",
- "type": "string"
- },
- {
- "value": "neutral",
- "type": "string"
- },
- {
- "value": "red",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, disabled prevents interaction. This state shows items with lower opacity/grayed.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "icon",
- "type": "string",
- "mutable": false,
- "attr": "icon",
- "reflectToAttr": false,
- "docs": "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/.",
- "docsTags": [
- {
- "name": "default",
- "text": "\"plus\""
- }
- ],
- "default": "ICONS.plus",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "Label of the FAB, exposed on hover when textEnabled is false. If no label is provided, the label inherits what's provided for the `text` prop.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "loading",
- "type": "boolean",
- "mutable": false,
- "attr": "loading",
- "reflectToAttr": true,
- "docs": "When true, content is waiting to be loaded. This state shows a busy indicator.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "Specifies the size of the fab.",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "text",
- "type": "string",
- "mutable": false,
- "attr": "text",
- "reflectToAttr": false,
- "docs": "Text that accompanies the FAB icon.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "textEnabled",
- "type": "boolean",
- "mutable": false,
- "attr": "text-enabled",
- "reflectToAttr": true,
- "docs": "Indicates whether the text is displayed.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-button"
- ],
- "dependencyGraph": {
- "calcite-fab": [
- "calcite-button"
- ],
- "calcite-button": [
- "calcite-loader",
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/filter/filter.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-filter",
- "readme": "# calcite-filter\n",
- "docs": "",
- "docsTags": [],
- "usage": {},
- "props": [
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, disabled prevents interaction. This state shows items with lower opacity/grayed.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "filteredItems",
- "type": "object[]",
- "mutable": true,
- "reflectToAttr": false,
- "docs": "The resulting items after filtering.",
- "docsTags": [
- {
- "name": "readonly"
- }
- ],
- "default": "[]",
- "values": [
- {
- "type": "object[]"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlClear",
- "type": "string",
- "mutable": false,
- "attr": "intl-clear",
- "reflectToAttr": false,
- "docs": "A text label that will appear on the clear button.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlLabel",
- "type": "string",
- "mutable": false,
- "attr": "intl-label",
- "reflectToAttr": false,
- "docs": "A text label that will appear next to the input field.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "items",
- "type": "object[]",
- "mutable": true,
- "reflectToAttr": false,
- "docs": "The items to filter through. The filter uses this as the starting point, and returns items\nthat contain the string entered in the input, using a partial match and recursive search.\n\nThis property is required.",
- "docsTags": [],
- "default": "[]",
- "values": [
- {
- "type": "object[]"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "placeholder",
- "type": "string",
- "mutable": false,
- "attr": "placeholder",
- "reflectToAttr": false,
- "docs": "Placeholder text for the input element's placeholder attribute",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of filter, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "string",
- "mutable": true,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "Filter value.",
- "docsTags": [],
- "default": "\"\"",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteFilterChange",
- "detail": "void",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "This event fires when the filter text changes.",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [
- "calcite-pick-list",
- "calcite-value-list"
- ],
- "dependencies": [
- "calcite-input"
- ],
- "dependencyGraph": {
- "calcite-filter": [
- "calcite-input"
- ],
- "calcite-input": [
- "calcite-progress",
- "calcite-icon"
- ],
- "calcite-pick-list": [
- "calcite-filter"
- ],
- "calcite-value-list": [
- "calcite-filter"
- ]
- }
- },
- {
- "filePath": "./src/components/flow/flow.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-flow",
- "readme": "# calcite-flow\n\nThe `calcite-flow` component is a series of panels that provides a user with a workflow (eg. editing experience), by which the user can switch from panel to panel of `calcite-panel`s.\n",
- "docs": "The `calcite-flow` component is a series of panels that provides a user with a workflow (eg. editing experience), by which the user can switch from panel to panel of `calcite-panel`s.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-panel`s to the flow."
- }
- ],
- "usage": {
- "Basic": "Renders a basic flow with a couple `calcite-panel`s.\n\n```html\n<calcite-flow>\n <calcite-panel heading=\"one, two, three, four\">\n <!-- image -->\n </calcite-panel>\n <calcite-panel heading=\"tell me that you love me more\">\n <!-- image -->\n </calcite-panel>\n</calcite-flow>\n```\n",
- "Menu-actions-and-footer-actions": "Renders a flow with menu-actions and footer-actions in the form of buttons.\n\n```html\n<calcite-flow>\n <calcite-panel heading=\"What are the most popular commute alternatives?\">\n <button slot=\"header-menu-actions\">Reset</button>\n <button slot=\"header-menu-actions\">Rename</button>\n <button slot=\"footer-actions\">Save</button>\n <button slot=\"footer-actions\">Cancel</button>\n </calcite-panel>\n</calcite-flow>\n```\n"
- },
- "props": [],
- "methods": [
- {
- "name": "back",
- "returns": {
- "type": "Promise<HTMLCalcitePanelElement>",
- "docs": ""
- },
- "signature": "back() => Promise<HTMLCalcitePanelElement>",
- "parameters": [],
- "docs": "Removes the currently active `calcite-panel`.",
- "docsTags": []
- }
- ],
- "events": [],
- "listeners": [
- {
- "event": "calcitePanelBackClick",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-panel`s to the flow."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/graph/graph.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-graph",
- "readme": "# calcite-graph\n\nThe graph component is used to show small, lightweight graphs in places where a full interactive chart is not needed. This includes sparklines, histograms, and small trend plots.\n",
- "docs": "The graph component is used to show small, lightweight graphs in places where a full interactive chart is not needed. This includes sparklines, histograms, and small trend plots.",
- "docsTags": [],
- "usage": {},
- "props": [
- {
- "name": "colorStops",
- "type": "ColorStop[]",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Array of values describing a single color stop ([offset, color, opacity])\nThese color stops should be sorted by offset value",
- "docsTags": [],
- "values": [
- {
- "type": "ColorStop[]"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "data",
- "type": "Point[]",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Array of tuples describing a single data point ([x, y])\nThese data points should be sorted by x-axis value",
- "docsTags": [],
- "default": "[]",
- "values": [
- {
- "type": "Point[]"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "highlightMax",
- "type": "number",
- "mutable": false,
- "attr": "highlight-max",
- "reflectToAttr": false,
- "docs": "End of highlight color if highlighting range",
- "docsTags": [],
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "highlightMin",
- "type": "number",
- "mutable": false,
- "attr": "highlight-min",
- "reflectToAttr": false,
- "docs": "Start of highlight color if highlighting range",
- "docsTags": [],
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "max",
- "type": "number",
- "mutable": false,
- "attr": "max",
- "reflectToAttr": false,
- "docs": "Highest point of the range",
- "docsTags": [],
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": true
- },
- {
- "name": "min",
- "type": "number",
- "mutable": false,
- "attr": "min",
- "reflectToAttr": false,
- "docs": "Lowest point of the range",
- "docsTags": [],
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": true
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [
- "calcite-slider"
- ],
- "dependencies": [],
- "dependencyGraph": {
- "calcite-slider": [
- "calcite-graph"
- ]
- }
- },
- {
- "filePath": "./src/components/handle/handle.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-handle",
- "readme": "# calcite-handle\n",
- "docs": "",
- "docsTags": [],
- "usage": {},
- "props": [
- {
- "name": "textTitle",
- "type": "string",
- "mutable": false,
- "attr": "text-title",
- "reflectToAttr": true,
- "docs": "Value for the button title attribute",
- "docsTags": [],
- "default": "\"handle\"",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteHandleNudge",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the the handle is activated and the up or down arrow key is pressed.",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [
- "calcite-block"
- ],
- "dependencies": [
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-handle": [
- "calcite-icon"
- ],
- "calcite-block": [
- "calcite-handle"
- ]
- }
- },
- {
- "filePath": "./src/components/icon/icon.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-icon",
- "readme": "# calcite-icon\n",
- "docs": "",
- "docsTags": [],
- "usage": {
- "Custom-icon-color": "To use a custom color for the icon fill, you can add a class to the `calcite-icon` component with the desired color.\n\n```html\n<calcite-icon class=\"my-icon-color-class\" icon=\"arrowBoldLeft\"></calcite-icon>\n```\n\n```css\n.my-icon-color-class {\n color: #007ac2;\n}\n```\n"
- },
- "props": [
- {
- "name": "flipRtl",
- "type": "boolean",
- "mutable": false,
- "attr": "flip-rtl",
- "reflectToAttr": true,
- "docs": "When true, the icon will be flipped when the element direction is 'rtl'.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "icon",
- "type": "string",
- "mutable": false,
- "attr": "icon",
- "reflectToAttr": true,
- "docs": "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/.",
- "docsTags": [],
- "default": "null",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "Icon scale.",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "textLabel",
- "type": "string",
- "mutable": false,
- "attr": "text-label",
- "reflectToAttr": false,
- "docs": "The icon label.\n\nIt is recommended to set this value if your icon is semantic.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [
- {
- "name": "--calcite-ui-icon-color",
- "annotation": "prop",
- "docs": "the color of the icon. Defaults to 'currentColor'."
- }
- ],
- "slots": [],
- "parts": [],
- "dependents": [
- "calcite-accordion-item",
- "calcite-action",
- "calcite-alert",
- "calcite-avatar",
- "calcite-block",
- "calcite-block-section",
- "calcite-button",
- "calcite-chip",
- "calcite-combobox",
- "calcite-combobox-item",
- "calcite-date-picker-month-header",
- "calcite-dropdown-item",
- "calcite-handle",
- "calcite-input",
- "calcite-input-date-picker",
- "calcite-input-message",
- "calcite-link",
- "calcite-modal",
- "calcite-notice",
- "calcite-pagination",
- "calcite-pick-list-item",
- "calcite-popover",
- "calcite-radio-group-item",
- "calcite-rating",
- "calcite-select",
- "calcite-stepper-item",
- "calcite-tab-title",
- "calcite-tile",
- "calcite-time-picker",
- "calcite-tip-manager",
- "calcite-tree-item",
- "calcite-value-list-item"
- ],
- "dependencies": [],
- "dependencyGraph": {
- "calcite-accordion-item": [
- "calcite-icon"
- ],
- "calcite-action": [
- "calcite-icon"
- ],
- "calcite-alert": [
- "calcite-icon"
- ],
- "calcite-avatar": [
- "calcite-icon"
- ],
- "calcite-block": [
- "calcite-icon"
- ],
- "calcite-block-section": [
- "calcite-icon"
- ],
- "calcite-button": [
- "calcite-icon"
- ],
- "calcite-chip": [
- "calcite-icon"
- ],
- "calcite-combobox": [
- "calcite-icon"
- ],
- "calcite-combobox-item": [
- "calcite-icon"
- ],
- "calcite-date-picker-month-header": [
- "calcite-icon"
- ],
- "calcite-dropdown-item": [
- "calcite-icon"
- ],
- "calcite-handle": [
- "calcite-icon"
- ],
- "calcite-input": [
- "calcite-icon"
- ],
- "calcite-input-date-picker": [
- "calcite-icon"
- ],
- "calcite-input-message": [
- "calcite-icon"
- ],
- "calcite-link": [
- "calcite-icon"
- ],
- "calcite-modal": [
- "calcite-icon"
- ],
- "calcite-notice": [
- "calcite-icon"
- ],
- "calcite-pagination": [
- "calcite-icon"
- ],
- "calcite-pick-list-item": [
- "calcite-icon"
- ],
- "calcite-popover": [
- "calcite-icon"
- ],
- "calcite-radio-group-item": [
- "calcite-icon"
- ],
- "calcite-rating": [
- "calcite-icon"
- ],
- "calcite-select": [
- "calcite-icon"
- ],
- "calcite-stepper-item": [
- "calcite-icon"
- ],
- "calcite-tab-title": [
- "calcite-icon"
- ],
- "calcite-tile": [
- "calcite-icon"
- ],
- "calcite-time-picker": [
- "calcite-icon"
- ],
- "calcite-tip-manager": [
- "calcite-icon"
- ],
- "calcite-tree-item": [
- "calcite-icon"
- ],
- "calcite-value-list-item": [
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/inline-editable/inline-editable.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-inline-editable",
- "readme": "# calcite-inline-editable\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding a `calcite-input`."
- }
- ],
- "usage": {
- "Basic": "There is no need to set a theme or scale on the `<calcite-inline-editable>` component, as it inherits these values from the wrapped `<calcite-input>`, or the closest parent component where these props are set.\n\n```html\n<calcite-inline-editable>\n <calcite-input value=\"Entered value\" placeholder=\"My placeholder\"></calcite-input>\n</calcite-inline-editable>\n```\n",
- "With-label": "```html\n<calcite-label>\n My great label\n <calcite-inline-editable controls>\n <calcite-input value=\"Entered value\" placeholder=\"My placeholder\"></calcite-input>\n </calcite-inline-editable>\n</calcite-label>\n```\n",
- "With-save-and-cancel-controls": "```html\n<calcite-inline-editable controls>\n <calcite-input value=\"Entered value\" placeholder=\"My placeholder\"></calcite-input>\n</calcite-inline-editable>\n```\n"
- },
- "props": [
- {
- "name": "afterConfirm",
- "type": "() => Promise<void>",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "when controls, specify a callback to be executed prior to disabling editing. when provided, loading state will be handled automatically.",
- "docsTags": [],
- "values": [
- {
- "type": "() => Promise<void>"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "controls",
- "type": "boolean",
- "mutable": false,
- "attr": "controls",
- "reflectToAttr": true,
- "docs": "specify whether save/cancel controls should be displayed when editingEnabled is true, defaults to false",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "specify whether editing can be enabled",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "editingEnabled",
- "type": "boolean",
- "mutable": true,
- "attr": "editing-enabled",
- "reflectToAttr": true,
- "docs": "specify whether the wrapped input element is editable, defaults to false",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlCancelEditing",
- "type": "string",
- "mutable": false,
- "attr": "intl-cancel-editing",
- "reflectToAttr": true,
- "docs": "specify text to be user for the cancel editing button's aria-label, defaults to `Cancel`",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Cancel\""
- }
- ],
- "default": "TEXT.intlCancelEditing",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlConfirmChanges",
- "type": "string",
- "mutable": false,
- "attr": "intl-confirm-changes",
- "reflectToAttr": true,
- "docs": "specify text to be user for the confirm changes button's aria-label, defaults to `Save`",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Save\""
- }
- ],
- "default": "TEXT.intlConfirmChanges",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlEnableEditing",
- "type": "string",
- "mutable": false,
- "attr": "intl-enable-editing",
- "reflectToAttr": true,
- "docs": "specify text to be user for the enable editing button's aria-label, defaults to `Click to edit`",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Click to edit\""
- }
- ],
- "default": "TEXT.intlEnablingEditing",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "loading",
- "type": "boolean",
- "mutable": true,
- "attr": "loading",
- "reflectToAttr": true,
- "docs": "specify whether the confirm button should display a loading state, defaults to false",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": true,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of the inline-editable component, defaults to the scale of the wrapped calcite-input or the scale of the closest wrapping component with a set scale",
- "docsTags": [],
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteInlineEditableEditCancel",
- "detail": "void",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the cancel button gets clicked.",
- "docsTags": []
- },
- {
- "event": "calciteInlineEditableEditConfirm",
- "detail": "void",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the check button gets clicked.",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "calciteInputBlur",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding a `calcite-input`."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-button"
- ],
- "dependencyGraph": {
- "calcite-inline-editable": [
- "calcite-button"
- ],
- "calcite-button": [
- "calcite-loader",
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/input/input.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-input",
- "readme": "# calcite-input\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "action - A slot for positioning a button next to an input"
- }
- ],
- "usage": {
- "Basic": "```html\n<calcite-input value=\"Entered value\" placeholder=\"My placeholder\"></calcite-input>\n```\n",
- "Clearable": "```html\n<calcite-label>\n Clearable item\n <calcite-input clearable value=\"My great name\" placeholder=\"John Doe\"></calcite-input>\n</calcite-label>\n```\n",
- "Native-events": "You can also listen for native events emitted from `<calcite-input>`.\n\nYou must use `focusin`/`focusout` instead of `focus`/`blur` because these events bubble up from the rendered child element rendered inside of `<calcite-input>`\n\nAll events return an element and a value:\n\n```js\ninput.addEventListener(\"focusin\", logFocus);\ninput.addEventListener(\"focusout\", logBlur);\n\nfunction logChange() {\n console.log(event.target.element);\n console.log(event.target.value);\n}\n```\n",
- "With-label": "Using a wrapping `calcite-label` component lets consumers set the status attribute once and have it propagate to child `calcite-input` and `calcite-input-message` elements\n\n```html\n<calcite-label status=\"invalid\" for=\"invalid-input\">\n Invalid input\n <calcite-input id=\"invalid-input\" placeholder=\"Filter your files\" value=\"adfo2h2\"></calcite-input>\n <calcite-input-message active icon> Something doesn't look right </calcite-input-message>\n</calcite-label>\n```\n",
- "With-message": "```html\n<calcite-label for=\"info\">\n My great label\n <calcite-input id=\"info\" placeholder=\"Enter your information\"></calcite-input>\n <calcite-input-message icon=\"3d-glasses\" active>\n Here's something you should know about this input\n </calcite-input-message>\n</calcite-label>\n```\n"
- },
- "props": [
- {
- "name": "alignment",
- "type": "\"end\" | \"start\"",
- "mutable": false,
- "attr": "alignment",
- "reflectToAttr": true,
- "docs": "specify the alignment of the value of the input",
- "docsTags": [],
- "default": "\"start\"",
- "values": [
- {
- "value": "end",
- "type": "string"
- },
- {
- "value": "start",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "autofocus",
- "type": "boolean",
- "mutable": false,
- "attr": "autofocus",
- "reflectToAttr": false,
- "docs": "should the input autofocus",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "clearable",
- "type": "boolean",
- "mutable": false,
- "attr": "clearable",
- "reflectToAttr": true,
- "docs": "optionally display a clear button that displays when field has a value\nshows by default for search, time, date\nwill not display for type=\"textarea\"",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "is the input disabled",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "groupSeparator",
- "type": "boolean",
- "mutable": false,
- "attr": "group-separator",
- "reflectToAttr": false,
- "docs": "for number values, displays the locale's group separator",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "hidden",
- "type": "boolean",
- "mutable": false,
- "attr": "hidden",
- "reflectToAttr": false,
- "docs": "when true, the component will not be visible",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "icon",
- "type": "boolean | string",
- "mutable": false,
- "attr": "icon",
- "reflectToAttr": true,
- "docs": "when used as a boolean set to true, show a default recommended icon for certain\ninput types (tel, password, email, date, time, search). You can also pass a\ncalcite-ui-icon name to this prop to display a requested icon for any input type",
- "docsTags": [],
- "values": [
- {
- "type": "boolean"
- },
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "iconFlipRtl",
- "type": "boolean",
- "mutable": false,
- "attr": "icon-flip-rtl",
- "reflectToAttr": true,
- "docs": "flip the icon in rtl",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlClear",
- "type": "string",
- "mutable": false,
- "attr": "intl-clear",
- "reflectToAttr": false,
- "docs": "A text label that will appear on the clear button for screen readers.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlLoading",
- "type": "string",
- "mutable": false,
- "attr": "intl-loading",
- "reflectToAttr": false,
- "docs": "string to override English loading text",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Loading\""
- }
- ],
- "default": "COMMON_TEXT.loading",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "Applies to the aria-label attribute on the button or hyperlink",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "loading",
- "type": "boolean",
- "mutable": false,
- "attr": "loading",
- "reflectToAttr": true,
- "docs": "specify if the input is in loading state",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "locale",
- "type": "string",
- "mutable": false,
- "attr": "locale",
- "reflectToAttr": false,
- "docs": "BCP 47 language tag for desired language and country format",
- "docsTags": [],
- "default": "document.documentElement.lang || \"en\"",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "max",
- "type": "number",
- "mutable": false,
- "attr": "max",
- "reflectToAttr": true,
- "docs": "input max",
- "docsTags": [],
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "maxLength",
- "type": "number",
- "mutable": false,
- "attr": "max-length",
- "reflectToAttr": true,
- "docs": "Maximum length of the input value",
- "docsTags": [],
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "maxlength",
- "type": "number",
- "mutable": false,
- "attr": "maxlength",
- "reflectToAttr": true,
- "docs": "Maximum length of text input.",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use maxLength instead"
- }
- ],
- "deprecation": "use maxLength instead",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "min",
- "type": "number",
- "mutable": false,
- "attr": "min",
- "reflectToAttr": true,
- "docs": "input min",
- "docsTags": [],
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "minLength",
- "type": "number",
- "mutable": false,
- "attr": "min-length",
- "reflectToAttr": true,
- "docs": "Minimum length of the text input",
- "docsTags": [],
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "name",
- "type": "string",
- "mutable": false,
- "attr": "name",
- "reflectToAttr": true,
- "docs": "The name of the input",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "numberButtonType",
- "type": "\"horizontal\" | \"none\" | \"vertical\"",
- "mutable": false,
- "attr": "number-button-type",
- "reflectToAttr": true,
- "docs": "specify the placement of the number buttons",
- "docsTags": [],
- "default": "\"vertical\"",
- "values": [
- {
- "value": "horizontal",
- "type": "string"
- },
- {
- "value": "none",
- "type": "string"
- },
- {
- "value": "vertical",
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "placeholder",
- "type": "string",
- "mutable": false,
- "attr": "placeholder",
- "reflectToAttr": false,
- "docs": "explicitly whitelist placeholder attribute",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "prefixText",
- "type": "string",
- "mutable": false,
- "attr": "prefix-text",
- "reflectToAttr": false,
- "docs": "optionally add prefix",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "readOnly",
- "type": "boolean",
- "mutable": false,
- "attr": "read-only",
- "reflectToAttr": false,
- "docs": "When true, a field cannot be modified.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "required",
- "type": "boolean",
- "mutable": false,
- "attr": "required",
- "reflectToAttr": false,
- "docs": "is the input required",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": true,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of the input, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "status",
- "type": "\"idle\" | \"invalid\" | \"valid\"",
- "mutable": true,
- "attr": "status",
- "reflectToAttr": true,
- "docs": "specify the status of the input field, determines message and icons",
- "docsTags": [],
- "default": "\"idle\"",
- "values": [
- {
- "value": "idle",
- "type": "string"
- },
- {
- "value": "invalid",
- "type": "string"
- },
- {
- "value": "valid",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "step",
- "type": "\"any\" | number",
- "mutable": false,
- "attr": "step",
- "reflectToAttr": true,
- "docs": "input step",
- "docsTags": [],
- "values": [
- {
- "value": "any",
- "type": "string"
- },
- {
- "type": "number"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "suffixText",
- "type": "string",
- "mutable": false,
- "attr": "suffix-text",
- "reflectToAttr": false,
- "docs": "optionally add suffix *",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "type",
- "type": "\"color\" | \"date\" | \"datetime-local\" | \"email\" | \"file\" | \"image\" | \"month\" | \"number\" | \"password\" | \"search\" | \"tel\" | \"text\" | \"textarea\" | \"time\" | \"url\" | \"week\"",
- "mutable": false,
- "attr": "type",
- "reflectToAttr": true,
- "docs": "specify the input type\n\nNote that the following types add type-specific icons by default: `date`, `email`, `password`, `search`, `tel`, `time`",
- "docsTags": [],
- "default": "\"text\"",
- "values": [
- {
- "value": "color",
- "type": "string"
- },
- {
- "value": "date",
- "type": "string"
- },
- {
- "value": "datetime-local",
- "type": "string"
- },
- {
- "value": "email",
- "type": "string"
- },
- {
- "value": "file",
- "type": "string"
- },
- {
- "value": "image",
- "type": "string"
- },
- {
- "value": "month",
- "type": "string"
- },
- {
- "value": "number",
- "type": "string"
- },
- {
- "value": "password",
- "type": "string"
- },
- {
- "value": "search",
- "type": "string"
- },
- {
- "value": "tel",
- "type": "string"
- },
- {
- "value": "text",
- "type": "string"
- },
- {
- "value": "textarea",
- "type": "string"
- },
- {
- "value": "time",
- "type": "string"
- },
- {
- "value": "url",
- "type": "string"
- },
- {
- "value": "week",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "string",
- "mutable": true,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "input value",
- "docsTags": [],
- "default": "\"\"",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteInputChange",
- "detail": "void",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "This event fires each time a new value is typed and committed.",
- "docsTags": []
- },
- {
- "event": "calciteInputInput",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "This event fires each time a new value is typed.",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "action",
- "docs": "A slot for positioning a button next to an input"
- }
- ],
- "parts": [],
- "dependents": [
- "calcite-color-picker",
- "calcite-color-picker-hex-input",
- "calcite-filter",
- "calcite-input-date-picker",
- "calcite-input-time-picker"
- ],
- "dependencies": [
- "calcite-progress",
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-input": [
- "calcite-progress",
- "calcite-icon"
- ],
- "calcite-color-picker": [
- "calcite-input"
- ],
- "calcite-color-picker-hex-input": [
- "calcite-input"
- ],
- "calcite-filter": [
- "calcite-input"
- ],
- "calcite-input-date-picker": [
- "calcite-input"
- ],
- "calcite-input-time-picker": [
- "calcite-input"
- ]
- }
- },
- {
- "filePath": "./src/components/input-date-picker/input-date-picker.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-input-date-picker",
- "readme": "# calcite-input-date-picker\n",
- "docs": "",
- "docsTags": [],
- "usage": {
- "Basic": "```html\n<div style=\"width: 400px\">\n <calcite-label layout=\"inline\">\n Date\n <calcite-input-date-picker\n min=\"2016-08-09\"\n max=\"2023-12-18\"\n locale=\"en\"\n intl-next-month=\"Next month\"\n intl-prev-month=\"Previous month\"\n role=\"application\"\n layout=\"horizontal\"\n ></calcite-input-date-picker>\n </calcite-label>\n</div>\n```\n"
- },
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": true,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "Expand or collapse when calendar does not have input",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When false, the component won't be interactive.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "end",
- "type": "string",
- "mutable": true,
- "attr": "end",
- "reflectToAttr": false,
- "docs": "Selected end date",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use value instead"
- }
- ],
- "deprecation": "use value instead",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "endAsDate",
- "type": "Date",
- "mutable": true,
- "reflectToAttr": false,
- "docs": "Selected end date as full date object",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use valueAsDate instead"
- }
- ],
- "deprecation": "use valueAsDate instead",
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "flipPlacements",
- "type": "ComputedPlacement[]",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Defines the available placements that can be used when a flip occurs.",
- "docsTags": [],
- "values": [
- {
- "type": "ComputedPlacement[]"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "headingLevel",
- "type": "1 | 2 | 3 | 4 | 5 | 6",
- "mutable": false,
- "attr": "heading-level",
- "reflectToAttr": false,
- "docs": "Number at which section headings should start for this component.",
- "docsTags": [],
- "values": [
- {
- "value": "1",
- "type": "number"
- },
- {
- "value": "2",
- "type": "number"
- },
- {
- "value": "3",
- "type": "number"
- },
- {
- "value": "4",
- "type": "number"
- },
- {
- "value": "5",
- "type": "number"
- },
- {
- "value": "6",
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlNextMonth",
- "type": "string",
- "mutable": false,
- "attr": "intl-next-month",
- "reflectToAttr": false,
- "docs": "Localized string for \"next month\" (used for aria label)",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Next month\""
- }
- ],
- "default": "TEXT.nextMonth",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlPrevMonth",
- "type": "string",
- "mutable": false,
- "attr": "intl-prev-month",
- "reflectToAttr": false,
- "docs": "Localized string for \"previous month\" (used for aria label)",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Previous month\""
- }
- ],
- "default": "TEXT.prevMonth",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlYear",
- "type": "string",
- "mutable": false,
- "attr": "intl-year",
- "reflectToAttr": false,
- "docs": "Localized string for \"year\" (used for aria label)",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Year\""
- }
- ],
- "default": "TEXT.year",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "layout",
- "type": "\"horizontal\" | \"vertical\"",
- "mutable": false,
- "attr": "layout",
- "reflectToAttr": true,
- "docs": "Layout",
- "docsTags": [],
- "default": "\"horizontal\"",
- "values": [
- {
- "value": "horizontal",
- "type": "string"
- },
- {
- "value": "vertical",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "locale",
- "type": "string",
- "mutable": false,
- "attr": "locale",
- "reflectToAttr": false,
- "docs": "BCP 47 language tag for desired language and country format",
- "docsTags": [],
- "default": "document.documentElement.lang || \"en\"",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "max",
- "type": "string",
- "mutable": true,
- "attr": "max",
- "reflectToAttr": false,
- "docs": "Latest allowed date (\"yyyy-mm-dd\")",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "maxAsDate",
- "type": "Date",
- "mutable": true,
- "reflectToAttr": false,
- "docs": "Latest allowed date as full date object",
- "docsTags": [],
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "min",
- "type": "string",
- "mutable": true,
- "attr": "min",
- "reflectToAttr": false,
- "docs": "Earliest allowed date (\"yyyy-mm-dd\")",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "minAsDate",
- "type": "Date",
- "mutable": true,
- "reflectToAttr": false,
- "docs": "Earliest allowed date as full date object",
- "docsTags": [],
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "name",
- "type": "string",
- "mutable": false,
- "attr": "name",
- "reflectToAttr": false,
- "docs": "The picker's name. Gets submitted with the form.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "overlayPositioning",
- "type": "\"absolute\" | \"fixed\"",
- "mutable": false,
- "attr": "overlay-positioning",
- "reflectToAttr": false,
- "docs": "Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value.",
- "docsTags": [],
- "default": "\"absolute\"",
- "values": [
- {
- "value": "absolute",
- "type": "string"
- },
- {
- "value": "fixed",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "placement",
- "type": "\"bottom\" | \"bottom-end\" | \"bottom-leading\" | \"bottom-start\" | \"bottom-trailing\" | \"top\" | \"top-end\" | \"top-leading\" | \"top-start\" | \"top-trailing\"",
- "mutable": false,
- "attr": "placement",
- "reflectToAttr": true,
- "docs": "Determines where the date-picker component will be positioned relative to the input.",
- "docsTags": [
- {
- "name": "default",
- "text": "\"bottom-leading\""
- }
- ],
- "default": "defaultMenuPlacement",
- "values": [
- {
- "value": "bottom",
- "type": "string"
- },
- {
- "value": "bottom-end",
- "type": "string"
- },
- {
- "value": "bottom-leading",
- "type": "string"
- },
- {
- "value": "bottom-start",
- "type": "string"
- },
- {
- "value": "bottom-trailing",
- "type": "string"
- },
- {
- "value": "top",
- "type": "string"
- },
- {
- "value": "top-end",
- "type": "string"
- },
- {
- "value": "top-leading",
- "type": "string"
- },
- {
- "value": "top-start",
- "type": "string"
- },
- {
- "value": "top-trailing",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "proximitySelectionDisabled",
- "type": "boolean",
- "mutable": false,
- "attr": "proximity-selection-disabled",
- "reflectToAttr": false,
- "docs": "Disables the default behaviour on the third click of narrowing or extending the range and instead starts a new range.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "range",
- "type": "boolean",
- "mutable": false,
- "attr": "range",
- "reflectToAttr": true,
- "docs": "Range mode activation",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of the date picker",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "start",
- "type": "string",
- "mutable": true,
- "attr": "start",
- "reflectToAttr": false,
- "docs": "Selected start date",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use value instead"
- }
- ],
- "deprecation": "use value instead",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "startAsDate",
- "type": "Date",
- "mutable": true,
- "reflectToAttr": false,
- "docs": "Selected start date as full date object",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use valueAsDate instead"
- }
- ],
- "deprecation": "use valueAsDate instead",
- "values": [
- {
- "type": "Date"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "value",
- "type": "string | string[]",
- "mutable": true,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "Selected date",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- },
- {
- "type": "string[]"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "valueAsDate",
- "type": "Date | Date[]",
- "mutable": true,
- "reflectToAttr": false,
- "docs": "Selected date as full date object",
- "docsTags": [],
- "values": [
- {
- "type": "Date"
- },
- {
- "type": "Date[]"
- }
- ],
- "optional": true,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "reposition",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "reposition() => Promise<void>",
- "parameters": [],
- "docs": "Updates the position of the component.",
- "docsTags": []
- },
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Updates the position of the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteDatePickerChange",
- "detail": "Date",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Trigger calcite date change when a user changes the date.",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use `calciteInputDatePickerChange` instead."
- }
- ],
- "deprecation": "use `calciteInputDatePickerChange` instead."
- },
- {
- "event": "calciteDatePickerRangeChange",
- "detail": "DateRangeChange",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Trigger calcite date change when a user changes the date range.",
- "docsTags": [
- {
- "name": "see",
- "text": "[DateRangeChange](https://github.com/Esri/calcite-components/blob/master/src/components/calcite-date-picker/interfaces.ts#L1)"
- },
- {
- "name": "deprecated",
- "text": "use `calciteInputDatePickerChange` instead."
- }
- ],
- "deprecation": "use `calciteInputDatePickerChange` instead."
- },
- {
- "event": "calciteInputDatePickerChange",
- "detail": "void",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "This event fires when the input date picker value changes.",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "calciteDatePickerChange",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteDatePickerRangeChange",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteDaySelect",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-input",
- "calcite-date-picker",
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-input-date-picker": [
- "calcite-input",
- "calcite-date-picker",
- "calcite-icon"
- ],
- "calcite-input": [
- "calcite-progress",
- "calcite-icon"
- ],
- "calcite-date-picker": [
- "calcite-date-picker-month-header",
- "calcite-date-picker-month"
- ],
- "calcite-date-picker-month-header": [
- "calcite-icon"
- ],
- "calcite-date-picker-month": [
- "calcite-date-picker-day"
- ]
- }
- },
- {
- "filePath": "./src/components/input-message/input-message.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-input-message",
- "readme": "# calcite-input-message\n\nDisplays a contextual message to a user. Allows the passing of content, links, etc.\n",
- "docs": "Displays a contextual message to a user. Allows the passing of content, links, etc.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding text."
- }
- ],
- "usage": {
- "Basic": "```html\n<calcite-label status=\"“invalid”\">\n My great label\n <calcite-input placeholder=\"“Enter\" your information”></calcite-input>\n <calcite-input-message active\n >That's not going to work out.\n <calcite-button appearance=\"inline\" href=\"\">Learn more</calcite-button></calcite-input-message\n >\n</calcite-label>\n```\n"
- },
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": false,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "Indicates whether the message is displayed.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "icon",
- "type": "boolean | string",
- "mutable": false,
- "attr": "icon",
- "reflectToAttr": true,
- "docs": "when used as a boolean set to true, show a default icon based on status. You can\nalso pass a calcite-ui-icon name to this prop to display a custom icon",
- "docsTags": [],
- "values": [
- {
- "type": "boolean"
- },
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": true,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of the input, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "status",
- "type": "\"idle\" | \"invalid\" | \"valid\"",
- "mutable": true,
- "attr": "status",
- "reflectToAttr": true,
- "docs": "specify the status of the input field, determines message and icons",
- "docsTags": [],
- "default": "\"idle\"",
- "values": [
- {
- "value": "idle",
- "type": "string"
- },
- {
- "value": "invalid",
- "type": "string"
- },
- {
- "value": "valid",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "type",
- "type": "\"default\"",
- "mutable": false,
- "attr": "type",
- "reflectToAttr": true,
- "docs": "specify the appearance of any slotted message - default (displayed under input), or floating (positioned absolutely under input)",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "\"floating\" type is no longer supported"
- }
- ],
- "deprecation": "\"floating\" type is no longer supported",
- "values": [
- {
- "value": "default",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [
- {
- "name": "--calcite-input-message-spacing-value",
- "annotation": "prop",
- "docs": "the top margin above the input-message."
- }
- ],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding text."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-input-message": [
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/input-time-picker/input-time-picker.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-input-time-picker",
- "readme": "# calcite-input-time-picker\n",
- "docs": "",
- "docsTags": [],
- "usage": {
- "Basic": "```html\n<calcite-input-time-picker\n hour-display-format=\"12\"\n name=\"light\"\n scale=\"m\"\n step=\"1\"\n value=\"12:21\"\n></calcite-input-time-picker>\n```\n"
- },
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": true,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "The active state of the time input",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "The disabled state of the time input",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlHour",
- "type": "string",
- "mutable": false,
- "attr": "intl-hour",
- "reflectToAttr": false,
- "docs": "aria-label for the hour input",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlHourDown",
- "type": "string",
- "mutable": false,
- "attr": "intl-hour-down",
- "reflectToAttr": false,
- "docs": "aria-label for the hour down button",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlHourUp",
- "type": "string",
- "mutable": false,
- "attr": "intl-hour-up",
- "reflectToAttr": false,
- "docs": "aria-label for the hour up button",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlMeridiem",
- "type": "string",
- "mutable": false,
- "attr": "intl-meridiem",
- "reflectToAttr": false,
- "docs": "aria-label for the meridiem (am/pm) input",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlMeridiemDown",
- "type": "string",
- "mutable": false,
- "attr": "intl-meridiem-down",
- "reflectToAttr": false,
- "docs": "aria-label for the meridiem (am/pm) down button",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlMeridiemUp",
- "type": "string",
- "mutable": false,
- "attr": "intl-meridiem-up",
- "reflectToAttr": false,
- "docs": "aria-label for the meridiem (am/pm) up button",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlMinute",
- "type": "string",
- "mutable": false,
- "attr": "intl-minute",
- "reflectToAttr": false,
- "docs": "aria-label for the minute input",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlMinuteDown",
- "type": "string",
- "mutable": false,
- "attr": "intl-minute-down",
- "reflectToAttr": false,
- "docs": "aria-label for the minute down button",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlMinuteUp",
- "type": "string",
- "mutable": false,
- "attr": "intl-minute-up",
- "reflectToAttr": false,
- "docs": "aria-label for the minute up button",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlSecond",
- "type": "string",
- "mutable": false,
- "attr": "intl-second",
- "reflectToAttr": false,
- "docs": "aria-label for the second input",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlSecondDown",
- "type": "string",
- "mutable": false,
- "attr": "intl-second-down",
- "reflectToAttr": false,
- "docs": "aria-label for the second down button",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlSecondUp",
- "type": "string",
- "mutable": false,
- "attr": "intl-second-up",
- "reflectToAttr": false,
- "docs": "aria-label for the second up button",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "name",
- "type": "string",
- "mutable": false,
- "attr": "name",
- "reflectToAttr": false,
- "docs": "The name of the time input",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "placement",
- "type": "Placement | PlacementRtl | VariationRtl",
- "mutable": false,
- "attr": "placement",
- "reflectToAttr": true,
- "docs": "Determines where the popover will be positioned relative to the input.",
- "docsTags": [
- {
- "name": "see",
- "text": "[PopperPlacement](https://github.com/Esri/calcite-components/blob/master/src/utils/popper.ts#L25)"
- }
- ],
- "default": "\"auto\"",
- "values": [
- {
- "type": "Placement"
- },
- {
- "type": "PlacementRtl"
- },
- {
- "type": "VariationRtl"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "The scale (size) of the time input",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "step",
- "type": "number",
- "mutable": false,
- "attr": "step",
- "reflectToAttr": false,
- "docs": "number (seconds) that specifies the granularity that the value must adhere to",
- "docsTags": [],
- "default": "60",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "string",
- "mutable": true,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "The selected time in UTC (always 24-hour format)",
- "docsTags": [],
- "default": "null",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "reposition",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "reposition() => Promise<void>",
- "parameters": [],
- "docs": "Updates the position of the component.",
- "docsTags": []
- },
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteInputTimePickerChange",
- "detail": "string",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fires when the time value is changed as a result of user input.",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "click",
- "capture": false,
- "passive": false
- },
- {
- "event": "keyup",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteTimePickerBlur",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteTimePickerFocus",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-input",
- "calcite-popover",
- "calcite-time-picker"
- ],
- "dependencyGraph": {
- "calcite-input-time-picker": [
- "calcite-input",
- "calcite-popover",
- "calcite-time-picker"
- ],
- "calcite-input": [
- "calcite-progress",
- "calcite-icon"
- ],
- "calcite-popover": [
- "calcite-action",
- "calcite-icon"
- ],
- "calcite-action": [
- "calcite-loader",
- "calcite-icon"
- ],
- "calcite-time-picker": [
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/label/label.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-label",
- "readme": "# calcite-label\n\nRenders a `<label>` around its children and can be used with any [labelable native](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Form_labelable) or labelable calcite element.\n",
- "docs": "Renders a `<label>` around its children and can be used with any [labelable native](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Form_labelable) or labelable calcite element.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding text and a component that can be labeled."
- }
- ],
- "usage": {
- "Basic": "It also allows consumers to set a `status` attribute for child `calcite-input` and `calcite-input-message` components to use to set their own properties.\n\n```html\n<calcite-label status=\"invalid\">\n Invalid input\n <calcite-input type=\"search\" placeholder=\"Filter your files\" value=\"adfo2h2\"></calcite-input>\n <calcite-input-message active icon> Something doesn't look right </calcite-input-message>\n</calcite-label>\n```\n",
- "Browser-caveat": "When using the `default`, `inline` or `inline-space-between` layout option with [browsers that do not support the CSS `gap` property when used with flexbox](https://caniuse.com/flexbox-gap), you will need to use the `disable-spacing` attribute and apply spacing manually to the label by wrapping it in a styled span like so:\n\n```html\n<calcite-label layout=\"inline\" disable-spacing>\n <span style=\"margin-right: 0.75rem\">Text leading inline</span>\n <calcite-checkbox></calcite-checkbox>\n</calcite-label>\n```\n"
- },
- "props": [
- {
- "name": "alignment",
- "type": "\"center\" | \"end\" | \"start\"",
- "mutable": false,
- "attr": "alignment",
- "reflectToAttr": true,
- "docs": "specify the text alignment of the label",
- "docsTags": [],
- "default": "\"start\"",
- "values": [
- {
- "value": "center",
- "type": "string"
- },
- {
- "value": "end",
- "type": "string"
- },
- {
- "value": "start",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disableSpacing",
- "type": "boolean",
- "mutable": false,
- "attr": "disable-spacing",
- "reflectToAttr": false,
- "docs": "eliminates any space around the label",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "is the label disabled",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use the `disabled` property on the interactive components instead"
- }
- ],
- "default": "false",
- "deprecation": "use the `disabled` property on the interactive components instead",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "for",
- "type": "string",
- "mutable": false,
- "attr": "for",
- "reflectToAttr": true,
- "docs": "The id of the input associated with the label",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "layout",
- "type": "\"default\" | \"inline\" | \"inline-space-between\"",
- "mutable": false,
- "attr": "layout",
- "reflectToAttr": true,
- "docs": "is the wrapped element positioned inline with the label slotted text",
- "docsTags": [],
- "default": "\"default\"",
- "values": [
- {
- "value": "default",
- "type": "string"
- },
- {
- "value": "inline",
- "type": "string"
- },
- {
- "value": "inline-space-between",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of the label, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "status",
- "type": "\"idle\" | \"invalid\" | \"valid\"",
- "mutable": false,
- "attr": "status",
- "reflectToAttr": true,
- "docs": "specify the status of the label and any child input / input messages",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "set directly on child element instead"
- }
- ],
- "default": "\"idle\"",
- "deprecation": "set directly on child element instead",
- "values": [
- {
- "value": "idle",
- "type": "string"
- },
- {
- "value": "invalid",
- "type": "string"
- },
- {
- "value": "valid",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding text and a component that can be labeled."
- }
- ],
- "parts": [],
- "dependents": [
- "calcite-card"
- ],
- "dependencies": [],
- "dependencyGraph": {
- "calcite-card": [
- "calcite-label"
- ]
- }
- },
- {
- "filePath": "./src/components/link/link.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-link",
- "readme": "# calcite-link\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding text."
- }
- ],
- "usage": {
- "Basic": "```html\n<div style=\"font-size: 16px; font-weight: 400;\">\n Some wrapping text\n <calcite-link href=\"#\">link text here</calcite-link>\n around the link\n</div>\n```\n",
- "Focusing": "You can programmatically focus a `calcite-link` with the `setFocus()` method:\n\n```html\n<div onclick=document.querySelector('#my-link').setFocus()>Focus!</div>\n```\n"
- },
- "props": [
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "is the link disabled",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "download",
- "type": "boolean | string",
- "mutable": false,
- "attr": "download",
- "reflectToAttr": true,
- "docs": "Prompts the user to save the linked URL instead of navigating to it. Can be used with or without a value:\nWithout a value, the browser will suggest a filename/extension\nSee: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-download",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- },
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "href",
- "type": "string",
- "mutable": false,
- "attr": "href",
- "reflectToAttr": true,
- "docs": "optionally pass a href - used to determine if the component should render as a link or an anchor",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "iconEnd",
- "type": "string",
- "mutable": false,
- "attr": "icon-end",
- "reflectToAttr": true,
- "docs": "optionally pass an icon to display at the end of a button - accepts calcite ui icon names",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "iconFlipRtl",
- "type": "\"both\" | \"end\" | \"start\"",
- "mutable": false,
- "attr": "icon-flip-rtl",
- "reflectToAttr": true,
- "docs": "flip the icon(s) in rtl",
- "docsTags": [],
- "values": [
- {
- "value": "both",
- "type": "string"
- },
- {
- "value": "end",
- "type": "string"
- },
- {
- "value": "start",
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "iconStart",
- "type": "string",
- "mutable": false,
- "attr": "icon-start",
- "reflectToAttr": true,
- "docs": "optionally pass an icon to display at the start of a button - accepts calcite ui icon names",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "rel",
- "type": "string",
- "mutable": false,
- "attr": "rel",
- "reflectToAttr": false,
- "docs": "The rel attribute to apply to the hyperlink",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "target",
- "type": "string",
- "mutable": false,
- "attr": "target",
- "reflectToAttr": false,
- "docs": "The target attribute to apply to the hyperlink",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding text."
- }
- ],
- "parts": [],
- "dependents": [
- "calcite-tile"
- ],
- "dependencies": [
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-link": [
- "calcite-icon"
- ],
- "calcite-tile": [
- "calcite-link"
- ]
- }
- },
- {
- "filePath": "./src/components/list/list.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-list",
- "readme": "# calcite-list\n",
- "docs": "A general purpose list that enables users to construct list items that conform to Calcite styling.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-list-item` elements."
- }
- ],
- "usage": {
- "Advanced": "```html\n<calcite-list>\n <calcite-list-item label=\"Princess Bubblegum\" description=\"Ruler of The Candy Kingdom\">\n <calcite-action icon=\"drag\" label=\"drag\" scale=\"s\" slot=\"actions-start\"></calcite-action>\n <calcite-icon scale=\"l\" icon=\"effects\" slot=\"content-start\"></calcite-icon>\n <calcite-avatar\n scale=\"l\"\n slot=\"content-start\"\n thumbnail=\"https://slm-assets.secondlife.com/assets/19947929/view_large/Capture_du_2018-03-04_20-40-56.jpg?1520192584\"\n ></calcite-avatar>\n <calcite-icon scale=\"s\" icon=\"check\" slot=\"content-end\" style=\"color: var(--calcite-ui-success)\"></calcite-icon>\n <calcite-action icon=\"ellipsis\" label=\"menu\" slot=\"actions-end\"></calcite-action>\n <calcite-action icon=\"x\" label=\"remove\" slot=\"actions-end\"></calcite-action>\n </calcite-list-item>\n <calcite-list-item label=\"Finn Mertens\" description=\"Part owner of the Tree House\">\n <calcite-action icon=\"drag\" label=\"drag\" scale=\"s\" slot=\"actions-start\"></calcite-action>\n <calcite-icon scale=\"l\" icon=\"running\" slot=\"content-start\"></calcite-icon>\n <calcite-avatar\n scale=\"l\"\n slot=\"content-start\"\n thumbnail=\"https://www.seekpng.com/png/detail/90-906849_89kib-1024x631-finn-finn-adventure-time-face.png\"\n ></calcite-avatar>\n <calcite-icon scale=\"s\" icon=\"check\" slot=\"content-end\" style=\"color: var(--calcite-ui-success)\"></calcite-icon>\n <calcite-action icon=\"ellipsis\" label=\"menu\" slot=\"actions-end\"></calcite-action>\n <calcite-action icon=\"x\" label=\"remove\" slot=\"actions-end\"></calcite-action>\n </calcite-list-item>\n <calcite-list-item label=\"Jake T. Dog\" description=\"Part owner of the Tree House\">\n <calcite-action icon=\"drag\" label=\"drag\" scale=\"s\" slot=\"actions-start\"></calcite-action>\n <calcite-icon scale=\"l\" icon=\"walking\" slot=\"content-start\"></calcite-icon>\n <calcite-avatar\n scale=\"l\"\n slot=\"content-start\"\n thumbnail=\"https://static.wikia.nocookie.net/adventuretimewithfinnandjake/images/c/c9/603138_454321168018988_647044807_n.png/revision/latest/scale-to-width-down/250?cb=20140624024310\"\n ></calcite-avatar>\n <calcite-icon\n scale=\"s\"\n icon=\"exclamation-mark-triangle\"\n slot=\"content-end\"\n style=\"color: var(--calcite-ui-danger)\"\n ></calcite-icon>\n <calcite-action icon=\"ellipsis\" label=\"menu\" slot=\"actions-end\"></calcite-action>\n <calcite-action icon=\"x\" label=\"remove\" slot=\"actions-end\"></calcite-action>\n </calcite-list-item>\n</calcite-list>\n```\n",
- "Basic": "```html\n<calcite-list>\n <calcite-list-item\n label=\"Cras iaculis ultricies nulla.\"\n description=\"Lorem ipsum dolor sit amet, consectetuer adipiscing elit.\"\n ></calcite-list-item>\n <calcite-list-item\n label=\"Ut aliquam sollicitudin leo.\"\n description=\"Aliquam tincidunt mauris eu risus.\"\n ></calcite-list-item>\n <calcite-list-item\n label=\"Vestibulum commodo felis quis tortor.\n \"\n description=\"Vestibulum auctor dapibus neque.\n \"\n ></calcite-list-item>\n</calcite-list>\n```\n",
- "Grouped": "```html\n<calcite-list>\n <calcite-list-item-group heading=\"Digits\">\n <calcite-list-item\n label=\"One\"\n description=\"Lorem ipsum dolor sit amet, consectetuer adipiscing elit.\"\n ></calcite-list-item>\n <calcite-list-item label=\"Two\" description=\"Aliquam tincidunt mauris eu risus.\"></calcite-list-item>\n <calcite-list-item label=\"Three\" description=\"Vestibulum auctor dapibus neque.\"></calcite-list-item>\n </calcite-list-item-group>\n <calcite-list-item-group heading=\"Letters\">\n <calcite-list-item\n label=\"A\"\n description=\"Lorem ipsum dolor sit amet, consectetuer adipiscing elit.\"\n ></calcite-list-item>\n <calcite-list-item label=\"B\" description=\"Aliquam tincidunt mauris eu risus.\"></calcite-list-item>\n <calcite-list-item\n label=\"C\"\n description=\"Lorem ipsum dolor sit amet, consectetuer adipiscing elit.\"\n ></calcite-list-item>\n </calcite-list-item-group>\n</calcite-list>\n```\n",
- "Nested": "```html\n<calcite-list>\n <calcite-list-item\n label=\"Cras iaculis ultricies nulla.\"\n description=\"Lorem ipsum dolor sit amet, consectetuer adipiscing elit.\"\n >\n <calcite-list-item label=\"Ut aliquam sollicitudin leo.\" description=\"Aliquam tincidunt mauris eu risus.\">\n <calcite-list-item\n label=\"Vestibulum commodo felis quis tortor.\"\n description=\"Vestibulum auctor dapibus neque.\"\n ></calcite-list-item></calcite-list-item\n ></calcite-list-item>\n</calcite-list>\n```\n"
- },
- "props": [
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, disabled prevents user interaction.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "headingLevel",
- "type": "1 | 2 | 3 | 4 | 5 | 6",
- "mutable": false,
- "attr": "heading-level",
- "reflectToAttr": false,
- "docs": "Number at which section headings should start for this component.",
- "docsTags": [],
- "values": [
- {
- "value": "1",
- "type": "number"
- },
- {
- "value": "2",
- "type": "number"
- },
- {
- "value": "3",
- "type": "number"
- },
- {
- "value": "4",
- "type": "number"
- },
- {
- "value": "5",
- "type": "number"
- },
- {
- "value": "6",
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-list-item` elements."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/list-item/list-item.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-list-item",
- "readme": "# calcite-list-item\n\nA general purpose list that enables users to construct list items that conform to Calcite styling.\n\nIf you are looking for a list that handles more advanced usage like selection, see the documentation for 'calcite-pick-list' or 'calcite-value-list'.\n",
- "docs": "A general purpose list that enables users to construct list items that conform to Calcite styling.\n\nIf you are looking for a list that handles more advanced usage like selection, see the documentation for 'calcite-pick-list' or 'calcite-value-list'.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-list-item` and `calcite-list-item-group` elements."
- },
- {
- "name": "slot",
- "text": "actions-start - A slot for adding actionable `calcite-action` elements before the content of the list item."
- },
- {
- "name": "slot",
- "text": "content-start - A slot for adding non-actionable elements before the label and description of the list item."
- },
- {
- "name": "slot",
- "text": "content-end - A slot for adding non-actionable elements after the label and description of the list item."
- },
- {
- "name": "slot",
- "text": "actions-end - A slot for adding actionable `calcite-action` elements after the content of the list item."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "description",
- "type": "string",
- "mutable": false,
- "attr": "description",
- "reflectToAttr": false,
- "docs": "An optional description for this item. This will appear below the label text.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, disabled prevents interaction.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "The label text of the list item. This will appear above the description text.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "nonInteractive",
- "type": "boolean",
- "mutable": false,
- "attr": "non-interactive",
- "reflectToAttr": true,
- "docs": "When true, prevents the content of the list item from user interaction.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-list-item` and `calcite-list-item-group` elements."
- },
- {
- "name": "actions-end",
- "docs": "A slot for adding actionable `calcite-action` elements after the content of the list item."
- },
- {
- "name": "actions-start",
- "docs": "A slot for adding actionable `calcite-action` elements before the content of the list item."
- },
- {
- "name": "content-end",
- "docs": "A slot for adding non-actionable elements after the label and description of the list item."
- },
- {
- "name": "content-start",
- "docs": "A slot for adding non-actionable elements before the label and description of the list item."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/list-item-group/list-item-group.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-list-item-group",
- "readme": "# calcite-list-item-group\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-list-item` and `calcite-list-item-group` elements."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "heading",
- "type": "string",
- "mutable": false,
- "attr": "heading",
- "reflectToAttr": true,
- "docs": "The title used for all nested `calcite-list-item` rows.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "headingLevel",
- "type": "1 | 2 | 3 | 4 | 5 | 6",
- "mutable": false,
- "attr": "heading-level",
- "reflectToAttr": false,
- "docs": "Number at which section headings should start for this component.",
- "docsTags": [],
- "values": [
- {
- "value": "1",
- "type": "number"
- },
- {
- "value": "2",
- "type": "number"
- },
- {
- "value": "3",
- "type": "number"
- },
- {
- "value": "4",
- "type": "number"
- },
- {
- "value": "5",
- "type": "number"
- },
- {
- "value": "6",
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-list-item` and `calcite-list-item-group` elements."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/loader/loader.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-loader",
- "readme": "# calcite-loader\n\nThe `calcite-loader` component can act as a determinate or indeterminate loading indicator.\n",
- "docs": "The `calcite-loader` component can act as a determinate or indeterminate loading indicator.",
- "docsTags": [],
- "usage": {
- "Basic": "You can use the `active` attribute to toggle visibility:\n\n```html\n<calcite-loader text=\"Fetching data...\" active></calcite-loader>\n```\n",
- "Compact": "For instances when you don't have room for the full loader, you can use the smaller `inline` version of the loader. The inline version is meant to sit to the left of text:\n\n```html\n<p><calcite-loader active inline></calcite-loader> Inline loader</p>\n```\n",
- "Determinate": "If you can calculate your progress, it's best to use the determinate version of the loader. Update the `value` of the element when progress is made. This will display a progress bar along the perimeter of the loader showing 32% complete:\n\n```html\n<calcite-loader type=\"determinate\" value=\"32\" active></calcite-loader>\n```\n"
- },
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": false,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "Show the loader",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "inline",
- "type": "boolean",
- "mutable": false,
- "attr": "inline",
- "reflectToAttr": true,
- "docs": "Inline loaders are smaller and will appear to the left of the text",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "Accessible name for the component",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": true
- },
- {
- "name": "noPadding",
- "type": "boolean",
- "mutable": false,
- "attr": "no-padding",
- "reflectToAttr": false,
- "docs": "Turn off spacing around the loader",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "Speficy the scale of the loader. Defaults to \"m\"",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "text",
- "type": "string",
- "mutable": false,
- "attr": "text",
- "reflectToAttr": false,
- "docs": "Text which should appear under the loading indicator (optional)",
- "docsTags": [],
- "default": "\"\"",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "type",
- "type": "\"determinate\" | \"indeterminate\"",
- "mutable": false,
- "attr": "type",
- "reflectToAttr": true,
- "docs": "Use indeterminate if finding actual progress value is impossible",
- "docsTags": [],
- "values": [
- {
- "value": "determinate",
- "type": "string"
- },
- {
- "value": "indeterminate",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "number",
- "mutable": false,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "Percent complete of 100, only valid for determinate indicators",
- "docsTags": [],
- "default": "0",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [
- {
- "name": "--calcite-loader-font-size",
- "annotation": "prop",
- "docs": "when type is determinate, the font-size of the loader percentage"
- },
- {
- "name": "--calcite-loader-size",
- "annotation": "prop",
- "docs": "the width and height of a non-inline loader"
- },
- {
- "name": "--calcite-loader-size-inline",
- "annotation": "prop",
- "docs": "the width and height of an inline loader"
- }
- ],
- "slots": [],
- "parts": [],
- "dependents": [
- "calcite-action",
- "calcite-block",
- "calcite-button",
- "calcite-card",
- "calcite-scrim"
- ],
- "dependencies": [],
- "dependencyGraph": {
- "calcite-action": [
- "calcite-loader"
- ],
- "calcite-block": [
- "calcite-loader"
- ],
- "calcite-button": [
- "calcite-loader"
- ],
- "calcite-card": [
- "calcite-loader"
- ],
- "calcite-scrim": [
- "calcite-loader"
- ]
- }
- },
- {
- "filePath": "./src/components/modal/modal.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-modal",
- "readme": "# calcite-modal\n\n`calcite-modal` allows you to show a modal/dialog to your users. The modal handles fencing focus and animating in/out.\n\n<style>\n html {\n overflow:auto !important;\n }\n</style>",
- "docs": "`calcite-modal` allows you to show a modal/dialog to your users. The modal handles fencing focus and animating in/out.\n\n<style>\n html {\n overflow:auto !important;\n }\n</style>",
- "docsTags": [
- {
- "name": "slot",
- "text": "header - a slot for adding a modal header"
- },
- {
- "name": "slot",
- "text": "content - a slot for adding modal content"
- },
- {
- "name": "slot",
- "text": "primary - a slot for adding a primary button"
- },
- {
- "name": "slot",
- "text": "secondary - a slot for adding a secondary button"
- },
- {
- "name": "slot",
- "text": "back - a slot for adding a back button"
- }
- ],
- "usage": {
- "Basic": "Customize the modal by passing your content into multiple named slots: `header` (title-area of the modal), `content` (main body of the modal), and up to three modal actions: primary, secondary, and back. Notice below we use the `aria-labelledby` attribute, relating it to the title of the modal. In order to ensure good accessibility, it's recommended that you use either an `aria-label` or `aria-labelledby` attribute so screen readers can infer what the subject matter of your modal is.\n\n```html\n<calcite-modal aria-labelledby=\"modal-title\" active>\n <h3 slot=\"header\" id=\"modal-title\">Title of the modal</h3>\n <div slot=\"content\">The actual content of the modal</div>\n <calcite-button slot=\"back\" color=\"neutral\" appearance=\"outline\" icon=\"chevron-left\" width=\"full\">\n Back\n </calcite-button>\n <calcite-button slot=\"secondary\" width=\"full\" appearance=\"outline\"> Cancel </calcite-button>\n <calcite-button slot=\"primary\" width=\"full\"> Save </calcite-button>\n</calcite-modal>\n```\n",
- "Open": "To open a modal, add the `active` prop. Once the opening animation is complete, the `calciteModalOpen` event will be fired.\n\nTo close the modal, simply remove the attribute. This will run your before close method (if provided, see below) and fire the `calciteModalClose` event after the animation and teardown is complete.\n\n```html\n<calcite-modal active></calcite-modal>\n```\n",
- "Reacting-before-close": "If you'd like to perform some actions prior to closing (ie. warning users they will lose their changes) you can pass a function to the `beforeClose` property. This method will be called prior to close and should return a [`Promise`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise):\n\n```js\nfunction beforeClose() {\n return new Promise((resolve) => {\n // do something async\n resolve(); // this will trigger the close animation\n });\n}\n\nconst modal = document.getElementById(\"my-modal\");\nmodal.beforeClose = beforeClose;\n```\n"
- },
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": true,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "Add the active attribute to open the modal",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "backgroundColor",
- "type": "\"grey\" | \"white\"",
- "mutable": false,
- "attr": "background-color",
- "reflectToAttr": true,
- "docs": "Background color of modal content",
- "docsTags": [],
- "default": "\"white\"",
- "values": [
- {
- "value": "grey",
- "type": "string"
- },
- {
- "value": "white",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "beforeClose",
- "type": "(el: HTMLElement) => Promise<void>",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Optionally pass a function to run before close",
- "docsTags": [],
- "default": "() => Promise.resolve()",
- "values": [
- {
- "type": "(el: HTMLElement) => Promise<void>"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "color",
- "type": "\"blue\" | \"red\"",
- "mutable": false,
- "attr": "color",
- "reflectToAttr": true,
- "docs": "Adds a color bar at the top for visual impact,\nUse color to add importance to destructive/workflow dialogs.",
- "docsTags": [],
- "values": [
- {
- "value": "blue",
- "type": "string"
- },
- {
- "value": "red",
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "disableCloseButton",
- "type": "boolean",
- "mutable": false,
- "attr": "disable-close-button",
- "reflectToAttr": false,
- "docs": "Disables the display a close button within the Modal",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disableEscape",
- "type": "boolean",
- "mutable": false,
- "attr": "disable-escape",
- "reflectToAttr": false,
- "docs": "Flag to disable the default close on escape behavior",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disableOutsideClose",
- "type": "boolean",
- "mutable": false,
- "attr": "disable-outside-close",
- "reflectToAttr": false,
- "docs": "Disables the closing of the Modal when clicked outside.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "docked",
- "type": "boolean",
- "mutable": false,
- "attr": "docked",
- "reflectToAttr": true,
- "docs": "Prevent the modal from taking up the entire screen on mobile",
- "docsTags": [],
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "firstFocus",
- "type": "HTMLElement",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Specify an element to focus when the modal is first opened",
- "docsTags": [],
- "values": [
- {
- "type": "HTMLElement"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "fullscreen",
- "type": "boolean",
- "mutable": false,
- "attr": "fullscreen",
- "reflectToAttr": true,
- "docs": "Set the modal to always be fullscreen (overrides width)",
- "docsTags": [],
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlClose",
- "type": "string",
- "mutable": false,
- "attr": "intl-close",
- "reflectToAttr": false,
- "docs": "Aria label for the close button",
- "docsTags": [],
- "default": "TEXT.close",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "noPadding",
- "type": "boolean",
- "mutable": false,
- "attr": "no-padding",
- "reflectToAttr": false,
- "docs": "Turn off spacing around the content area slot",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of modal, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "width",
- "type": "\"l\" | \"m\" | \"s\" | number",
- "mutable": false,
- "attr": "width",
- "reflectToAttr": true,
- "docs": "Set the width of the modal. Can use stock sizes or pass a number (in pixels)",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- },
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "focusElement",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "focusElement(el?: HTMLElement) => Promise<void>",
- "parameters": [],
- "docs": "Focus first interactive element",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use `setFocus` instead."
- }
- ],
- "deprecation": "use `setFocus` instead."
- },
- {
- "name": "scrollContent",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "scrollContent(top?: number, left?: number) => Promise<void>",
- "parameters": [],
- "docs": "Set the scroll top of the modal content",
- "docsTags": []
- },
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus(focusId?: \"close-button\") => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.\n\nBy default, will try to focus on any focusable content. If there is none, it will focus on the close button.\nIf you want to focus on the close button, you can use the `close-button` focus ID.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteModalClose",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fired when the modal finishes the close animation",
- "docsTags": []
- },
- {
- "event": "calciteModalOpen",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fired when the modal finishes the open animation",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "keyup",
- "target": "window",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [
- {
- "name": "--calcite-modal-content-text",
- "annotation": "prop",
- "docs": "the font-size of the modal content"
- },
- {
- "name": "--calcite-modal-padding",
- "annotation": "prop",
- "docs": "the top/bottom padding around items in the modal"
- },
- {
- "name": "--calcite-modal-padding-large",
- "annotation": "prop",
- "docs": "the left/right padding around items in the modal"
- },
- {
- "name": "--calcite-modal-title-text",
- "annotation": "prop",
- "docs": "the font-size of the modal title"
- },
- {
- "name": "--calcite-scrim-background",
- "annotation": "prop",
- "docs": "the semi-transparent background color behind modal"
- }
- ],
- "slots": [
- {
- "name": "back",
- "docs": "a slot for adding a back button"
- },
- {
- "name": "content",
- "docs": "a slot for adding modal content"
- },
- {
- "name": "header",
- "docs": "a slot for adding a modal header"
- },
- {
- "name": "primary",
- "docs": "a slot for adding a primary button"
- },
- {
- "name": "secondary",
- "docs": "a slot for adding a secondary button"
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-scrim",
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-modal": [
- "calcite-scrim",
- "calcite-icon"
- ],
- "calcite-scrim": [
- "calcite-loader"
- ]
- }
- },
- {
- "filePath": "./src/components/notice/notice.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-notice",
- "readme": "# calcite-notice\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "title - Title of the notice (optional)"
- },
- {
- "name": "slot",
- "text": "message - Main text of the notice"
- },
- {
- "name": "slot",
- "text": "link - Optional action to take from the notice (undo, try again, link to page, etc.)"
- },
- {
- "name": "slot",
- "text": "actions-end - Allows adding a `calcite-action` at the end of the notice. It is recommended to use 2 or less actions."
- }
- ],
- "usage": {
- "Basic": "```html\n<calcite-notice scale=\"l\" width=\"half\" active>\n <div slot=\"title\">Something failed</div>\n <div slot=\"message\">That thing you wanted to do didn't work as expected</div>\n <calcite-link slot=\"link\" href=\"/\">View details</calcite-link>\n <calcite-action id=\"retry-action\" slot=\"actions-end\" title=\"Retry\" icon=\"reset\"></calcite-action>\n</calcite-notice>\n```\n",
- "Set-focus": "You can programmatically focus the close button of a `dismissible` `calcite-notice` with the `setFocus()` method:\n\n```html\n<div onclick=\"document.querySelector('#my-notice').setFocus();\">Focus!</div>\n```\n"
- },
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": true,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "Is the notice currently active or not",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "color",
- "type": "\"blue\" | \"green\" | \"red\" | \"yellow\"",
- "mutable": false,
- "attr": "color",
- "reflectToAttr": true,
- "docs": "Color for the notice (will apply to top border and icon)",
- "docsTags": [],
- "default": "\"blue\"",
- "values": [
- {
- "value": "blue",
- "type": "string"
- },
- {
- "value": "green",
- "type": "string"
- },
- {
- "value": "red",
- "type": "string"
- },
- {
- "value": "yellow",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "dismissible",
- "type": "boolean",
- "mutable": false,
- "attr": "dismissible",
- "reflectToAttr": true,
- "docs": "Optionally show a button the user can click to dismiss the notice",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "icon",
- "type": "boolean | string",
- "mutable": false,
- "attr": "icon",
- "reflectToAttr": true,
- "docs": "when used as a boolean set to true, show a default recommended icon. You can\nalso pass a calcite-ui-icon name to this prop to display a requested icon",
- "docsTags": [],
- "values": [
- {
- "type": "boolean"
- },
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlClose",
- "type": "string",
- "mutable": false,
- "attr": "intl-close",
- "reflectToAttr": false,
- "docs": "String for the close button.",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Close\""
- }
- ],
- "default": "TEXT.close",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of the notice, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "width",
- "type": "\"auto\" | \"full\" | \"half\"",
- "mutable": false,
- "attr": "width",
- "reflectToAttr": true,
- "docs": "specify the width of the notice, defaults to auto",
- "docsTags": [],
- "default": "\"auto\"",
- "values": [
- {
- "value": "auto",
- "type": "string"
- },
- {
- "value": "full",
- "type": "string"
- },
- {
- "value": "half",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteNoticeClose",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fired when an notice is closed",
- "docsTags": []
- },
- {
- "event": "calciteNoticeOpen",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fired when an Notice is opened",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [
- {
- "name": "--calcite-notice-width",
- "annotation": "prop",
- "docs": "the width of the notice"
- }
- ],
- "slots": [
- {
- "name": "actions-end",
- "docs": "Allows adding a `calcite-action` at the end of the notice. It is recommended to use 2 or less actions."
- },
- {
- "name": "link",
- "docs": "Optional action to take from the notice (undo, try again, link to page, etc.)"
- },
- {
- "name": "message",
- "docs": "Main text of the notice"
- },
- {
- "name": "title",
- "docs": "Title of the notice (optional)"
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-notice": [
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/option/option.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-option",
- "readme": "# calcite-option\n",
- "docs": "",
- "docsTags": [],
- "usage": {},
- "props": [
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, it prevents the option from being selected.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": true,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "The option label.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selected",
- "type": "boolean",
- "mutable": false,
- "attr": "selected",
- "reflectToAttr": true,
- "docs": "When true, this option is selected. Otherwise, false.",
- "docsTags": [],
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "any",
- "mutable": true,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "The value associated with this option.",
- "docsTags": [],
- "values": [
- {
- "type": "any"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/option-group/option-group.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-option-group",
- "readme": "# calcite-option-group\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-option`s."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, it prevents selection from any of its associated options.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "The group label. This property is required.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": true
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-option`s."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/pagination/pagination.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-pagination",
- "readme": "# calcite-pagination\n\n`calcite-pagination` allows users to select a page from a paginated API.\n",
- "docs": "`calcite-pagination` allows users to select a page from a paginated API.",
- "docsTags": [],
- "usage": {
- "Basic": "The component is meant to interface with responses from ArcGIS REST services, so the props share names with [response properties](https://developers.arcgis.com/rest/users-groups-and-items/search.htm) from various search endpoints.\n\nFor example, after querying the search API, you'll get back a response similar to JSON below. The response can be passed straight to the `calcite-pagination` component.\n\n```JSON\n{\n \"total\": 2021,\n \"start\": 1,\n \"num\": 100,\n \"results\": []\n}\n```\n\n```html\n<calcite-pagination start=\"1\" num=\"100\" total=\"2021\"></calcite-pagination>\n```\n"
- },
- "props": [
- {
- "name": "num",
- "type": "number",
- "mutable": false,
- "attr": "num",
- "reflectToAttr": false,
- "docs": "number of items per page",
- "docsTags": [],
- "default": "20",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "The scale of the pagination",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "start",
- "type": "number",
- "mutable": true,
- "attr": "start",
- "reflectToAttr": false,
- "docs": "index of item that should begin the page",
- "docsTags": [],
- "default": "1",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "textLabelNext",
- "type": "string",
- "mutable": false,
- "attr": "text-label-next",
- "reflectToAttr": false,
- "docs": "Used as an accessible label (aria-label) for the next button",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Next\""
- }
- ],
- "default": "TEXT.nextLabel",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "textLabelPrevious",
- "type": "string",
- "mutable": false,
- "attr": "text-label-previous",
- "reflectToAttr": false,
- "docs": "Used as an accessible label (aria-label) of the previous button",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Previous\""
- }
- ],
- "default": "TEXT.previousLabel",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "total",
- "type": "number",
- "mutable": false,
- "attr": "total",
- "reflectToAttr": false,
- "docs": "total number of items",
- "docsTags": [],
- "default": "0",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "nextPage",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "nextPage() => Promise<void>",
- "parameters": [],
- "docs": "Go to the next page of results",
- "docsTags": []
- },
- {
- "name": "previousPage",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "previousPage() => Promise<void>",
- "parameters": [],
- "docs": "Go to the previous page of results",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calcitePaginationChange",
- "detail": "PaginationDetail",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted whenever the selected page changes.",
- "docsTags": [
- {
- "name": "see",
- "text": "[PaginationDetail](https://github.com/Esri/calcite-components/blob/master/src/components/pagination/calcite-pagination.tsx#L18)"
- }
- ]
- },
- {
- "event": "calcitePaginationUpdate",
- "detail": "PaginationDetail",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted whenever the selected page changes.",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use calcitePaginationChange instead"
- }
- ],
- "deprecation": "use calcitePaginationChange instead"
- }
- ],
- "listeners": [],
- "styles": [
- {
- "name": "--calcite-pagination-spacing",
- "annotation": "prop",
- "docs": "the amount of padding around each pagination item"
- }
- ],
- "slots": [],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-pagination": [
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/panel/panel.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-panel",
- "readme": "# calcite-panel\n\nThe `calcite-panel` component is a container for a header, content and optional footer. The header will have centered content as well as optional leading and trailing content. The panel can also be setup to be dismissible which allows it to be closed by a user.\n",
- "docs": "The `calcite-panel` component is a container for a header, content and optional footer. The header will have centered content as well as optional leading and trailing content. The panel can also be setup to be dismissible which allows it to be closed by a user.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding custom content."
- },
- {
- "name": "slot",
- "text": "header-actions-start - A slot for adding actions or content to the start side of the panel header."
- },
- {
- "name": "slot",
- "text": "header-actions-end - A slot for adding actions or content to the end side of the panel header."
- },
- {
- "name": "slot",
- "text": "header-content - A slot for adding custom content to the header."
- },
- {
- "name": "slot",
- "text": "header-menu-actions - A slot for adding an overflow menu with actions inside a dropdown."
- },
- {
- "name": "slot",
- "text": "fab - A slot for adding a `calcite-fab` (floating action button) to perform an action."
- },
- {
- "name": "slot",
- "text": "footer-actions - A slot for adding buttons to the footer."
- },
- {
- "name": "slot",
- "text": "footer - A slot for adding custom content to the footer."
- }
- ],
- "usage": {
- "Basic": "Renders a basic panel with a header.\n\n```html\n<calcite-panel>\n <div slot=\"header-content\">Header!</div>\n <p>Slotted content!</p>\n</calcite-panel>\n```\n",
- "Dismissible": "Renders a panel that is dismissible with a click of the \"x\".\n\n```html\n<calcite-panel dismissible id=\"dismissible-panel\">\n <div slot=\"header-content\">Dismissible Header</div>\n <p>Click the X and I go away!</p>\n</calcite-panel>\n```\n",
- "Header-with-actions": "Renders a panel with leading and trailing `calcite-action`s.\n\n```html\n<calcite-panel>\n <calcite-action\n label=\"Performs my custom action\"\n text=\"Perform Action!\"\n text-enabled\n icon=\"home\"\n slot=\"header-actions-start\"\n ></calcite-action>\n <div slot=\"header-content\">Header!</div>\n <calcite-action\n label=\"Performs another custom action\"\n text=\"Perform Another Action!\"\n text-enabled\n icon=\"blog\"\n slot=\"header-actions-end\"\n ></calcite-action>\n <p>Actions are in the top left and right.</p>\n</calcite-panel>\n```\n",
- "With-footer": "Renders a panel with a header and a footer.\n\n```html\n<calcite-panel>\n <div slot=\"header-content\">Header!</div>\n <p>I have a footer.</p>\n <div slot=\"footer\">Footer!</div>\n</calcite-panel>\n```\n"
- },
- "props": [
- {
- "name": "beforeBack",
- "type": "() => Promise<void>",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "When provided, this method will be called before it is removed from the parent flow.",
- "docsTags": [],
- "values": [
- {
- "type": "() => Promise<void>"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, disabled prevents interaction. This state shows items with lower opacity/grayed.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "dismissed",
- "type": "boolean",
- "mutable": true,
- "attr": "dismissed",
- "reflectToAttr": true,
- "docs": "Hides the panel.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "dismissible",
- "type": "boolean",
- "mutable": false,
- "attr": "dismissible",
- "reflectToAttr": true,
- "docs": "Displays a close button in the trailing side of the header.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "heading",
- "type": "string",
- "mutable": false,
- "attr": "heading",
- "reflectToAttr": false,
- "docs": "Heading text.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "headingLevel",
- "type": "1 | 2 | 3 | 4 | 5 | 6",
- "mutable": false,
- "attr": "heading-level",
- "reflectToAttr": false,
- "docs": "Number at which section headings should start for this component.",
- "docsTags": [],
- "values": [
- {
- "value": "1",
- "type": "number"
- },
- {
- "value": "2",
- "type": "number"
- },
- {
- "value": "3",
- "type": "number"
- },
- {
- "value": "4",
- "type": "number"
- },
- {
- "value": "5",
- "type": "number"
- },
- {
- "value": "6",
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "heightScale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "height-scale",
- "reflectToAttr": true,
- "docs": "Specifies the maximum height of the panel.",
- "docsTags": [],
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlBack",
- "type": "string",
- "mutable": false,
- "attr": "intl-back",
- "reflectToAttr": false,
- "docs": "'Back' text string.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlClose",
- "type": "string",
- "mutable": false,
- "attr": "intl-close",
- "reflectToAttr": false,
- "docs": "'Close' text string for the close button. The close button will only be shown when 'dismissible' is true.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlOptions",
- "type": "string",
- "mutable": false,
- "attr": "intl-options",
- "reflectToAttr": false,
- "docs": "'Options' text string for the actions menu.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "loading",
- "type": "boolean",
- "mutable": false,
- "attr": "loading",
- "reflectToAttr": true,
- "docs": "When true, content is waiting to be loaded. This state shows a busy indicator.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "menuOpen",
- "type": "boolean",
- "mutable": false,
- "attr": "menu-open",
- "reflectToAttr": true,
- "docs": "Opens the action menu.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "showBackButton",
- "type": "boolean",
- "mutable": false,
- "attr": "show-back-button",
- "reflectToAttr": true,
- "docs": "Shows a back button in the header.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "summary",
- "type": "string",
- "mutable": false,
- "attr": "summary",
- "reflectToAttr": false,
- "docs": "Summary text. A description displayed underneath the heading.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "widthScale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "width-scale",
- "reflectToAttr": true,
- "docs": "This sets width of the panel.",
- "docsTags": [],
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "scrollContentTo",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "scrollContentTo(options?: ScrollToOptions) => Promise<void>",
- "parameters": [],
- "docs": "Scrolls panel content to a particular set of coordinates.\n\n```\n myCalcitePanel.scrollContentTo({\n left: 0, // Specifies the number of pixels along the X axis to scroll the window or element.\n top: 0, // Specifies the number of pixels along the Y axis to scroll the window or element\n behavior: \"auto\" // Specifies whether the scrolling should animate smoothly (smooth), or happen instantly in a single jump (auto, the default value).\n });\n```",
- "docsTags": []
- },
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus(focusId?: \"dismiss-button\" | \"back-button\") => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calcitePanelBackClick",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the back button has been clicked.",
- "docsTags": []
- },
- {
- "event": "calcitePanelDismiss",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the close button has been clicked.",
- "docsTags": []
- },
- {
- "event": "calcitePanelDismissedChange",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the close button has been clicked.",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use calcitePanelDismiss instead."
- }
- ],
- "deprecation": "use calcitePanelDismiss instead."
- },
- {
- "event": "calcitePanelScroll",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the content has been scrolled.",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [
- {
- "name": "--calcite-panel-max-height",
- "annotation": "prop",
- "docs": "the maximum height of the panel"
- },
- {
- "name": "--calcite-panel-max-width",
- "annotation": "prop",
- "docs": "the maximum width of the panel"
- },
- {
- "name": "--calcite-panel-min-width",
- "annotation": "prop",
- "docs": "the minimum width of the panel"
- }
- ],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding custom content."
- },
- {
- "name": "fab",
- "docs": "A slot for adding a `calcite-fab` (floating action button) to perform an action."
- },
- {
- "name": "footer",
- "docs": "A slot for adding custom content to the footer."
- },
- {
- "name": "footer-actions",
- "docs": "A slot for adding buttons to the footer."
- },
- {
- "name": "header-actions-end",
- "docs": "A slot for adding actions or content to the end side of the panel header."
- },
- {
- "name": "header-actions-start",
- "docs": "A slot for adding actions or content to the start side of the panel header."
- },
- {
- "name": "header-content",
- "docs": "A slot for adding custom content to the header."
- },
- {
- "name": "header-menu-actions",
- "docs": "A slot for adding an overflow menu with actions inside a dropdown."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-action",
- "calcite-action-menu",
- "calcite-scrim"
- ],
- "dependencyGraph": {
- "calcite-panel": [
- "calcite-action",
- "calcite-action-menu",
- "calcite-scrim"
- ],
- "calcite-action": [
- "calcite-loader",
- "calcite-icon"
- ],
- "calcite-action-menu": [
- "calcite-action",
- "calcite-popover"
- ],
- "calcite-popover": [
- "calcite-action",
- "calcite-icon"
- ],
- "calcite-scrim": [
- "calcite-loader"
- ]
- }
- },
- {
- "filePath": "./src/components/pick-list/pick-list.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-pick-list",
- "readme": "# calcite-pick-list\n\n`calcite-pick-list` lives in a panel and contains `calcite-pick-list-item`s. Each item is able to be be selected via radio button or checkboxes (which have a multiselect and shift-click capability). There is also an option for a filter at the top of the list for searching.\n",
- "docs": "`calcite-pick-list` lives in a panel and contains `calcite-pick-list-item`s. Each item is able to be be selected via radio button or checkboxes (which have a multiselect and shift-click capability). There is also an option for a filter at the top of the list for searching.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-pick-list-item` elements or `calcite-pick-list-group` elements. Items are displayed as a vertical list."
- },
- {
- "name": "slot",
- "text": "menu-actions - A slot for adding a button + menu combo for performing actions like sorting."
- }
- ],
- "usage": {
- "Basic": "Renders a basic pick list with radio buttons on the left and actions on the right side.\n\n```html\n<calcite-pick-list>\n <calcite-pick-list-item label=\"T. Rex\" description=\"Arm strength impaired\" value=\"trex\">\n <calcite-action slot=\"actions-end\" icon=\"circle\"></calcite-action>\n </calcite-pick-list-item>\n <calcite-pick-list-item label=\"Triceratops\" description=\"3 horn\" value=\"triceratops\" selected>\n <calcite-action slot=\"actions-end\" icon=\"circle\"></calcite-action>\n </calcite-pick-list-item>\n <calcite-pick-list-item label=\"Velociraptor\" description=\"Swift seizer\" value=\"velociraptor\">\n <calcite-action slot=\"actions-end\" icon=\"circle\"></calcite-action>\n </calcite-pick-list-item>\n</calcite-pick-list>\n```\n",
- "Multi-select-and-filter-enabled": "Renders a pick list with a sticky filter and checkboxes for multiple selection of items.\n\n```html\n<calcite-pick-list multiple filter-enabled>\n <calcite-pick-list-item label=\"Chocolate\" value=\"chocolate\">\n <calcite-action slot=\"actions-end\" icon=\"ellipsis-circle\"></calcite-action>\n </calcite-pick-list-item>\n <calcite-pick-list-item label=\"Vanilla\" description=\"Oldie but goodie\" value=\"vanilla\">\n <calcite-action slot=\"actions-end\" icon=\"ellipsis-circle\"></calcite-action>\n </calcite-pick-list-item>\n <calcite-pick-list-item label=\"Strawberry\" description=\"no metadata on this one\" value=\"strawberry\">\n <calcite-action slot=\"actions-end\" icon=\"ellipsis-circle\"></calcite-action>\n </calcite-pick-list-item>\n</calcite-pick-list>\n```\n",
- "Sub-groups": "Renders groups of pick list items that are visually separated.\n\n```html\n<calcite-pick-list>\n <calcite-pick-list-group group-title=\"numbers\">\n <calcite-pick-list-item label=\"one\" description=\"fish\" value=\"one\" icon=\"grip\">\n <calcite-action slot=\"actions-end\" icon=\"ellipsis\"></calcite-action>\n </calcite-pick-list-item>\n <calcite-pick-list-item label=\"two\" description=\"fish\" value=\"two\" icon=\"grip\">\n <calcite-action slot=\"actions-end\" icon=\"ellipsis\"></calcite-action>\n </calcite-pick-list-item>\n </calcite-pick-list-group>\n <calcite-pick-list-group group-title=\"colors\">\n <calcite-pick-list-item label=\"red\" description=\"fish\" value=\"red\" icon=\"grip\">\n <calcite-action slot=\"actions-end\" icon=\"ellipsis\"></calcite-action>\n </calcite-pick-list-item>\n <calcite-pick-list-item label=\"blue\" description=\"fish\" value=\"blue\" icon=\"grip\">\n <calcite-action slot=\"actions-end\" icon=\"ellipsis\"></calcite-action>\n </calcite-pick-list-item>\n </calcite-pick-list-group>\n</calcite-pick-list>\n```\n"
- },
- "props": [
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, disabled prevents interaction. This state shows items with lower opacity/grayed.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "filterEnabled",
- "type": "boolean",
- "mutable": false,
- "attr": "filter-enabled",
- "reflectToAttr": true,
- "docs": "When true, an input appears at the top of the list that can be used by end users to filter items in the list.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "filterPlaceholder",
- "type": "string",
- "mutable": false,
- "attr": "filter-placeholder",
- "reflectToAttr": true,
- "docs": "Placeholder text for the filter input field.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "headingLevel",
- "type": "1 | 2 | 3 | 4 | 5 | 6",
- "mutable": false,
- "attr": "heading-level",
- "reflectToAttr": false,
- "docs": "Number at which section headings should start for this component.",
- "docsTags": [],
- "values": [
- {
- "value": "1",
- "type": "number"
- },
- {
- "value": "2",
- "type": "number"
- },
- {
- "value": "3",
- "type": "number"
- },
- {
- "value": "4",
- "type": "number"
- },
- {
- "value": "5",
- "type": "number"
- },
- {
- "value": "6",
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "loading",
- "type": "boolean",
- "mutable": false,
- "attr": "loading",
- "reflectToAttr": true,
- "docs": "When true, content is waiting to be loaded. This state shows a busy indicator.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "multiple",
- "type": "boolean",
- "mutable": false,
- "attr": "multiple",
- "reflectToAttr": true,
- "docs": "Multiple works similar to standard radio buttons and checkboxes.\nWhen true, a user can select multiple items at a time.\nWhen false, only a single item can be selected at a time\nand selecting a new item will deselect any other selected items.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selectionFollowsFocus",
- "type": "boolean",
- "mutable": false,
- "attr": "selection-follows-focus",
- "reflectToAttr": false,
- "docs": "When true and single-selection is enabled, the selection will change when navigating items via the keyboard.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "getSelectedItems",
- "returns": {
- "type": "Promise<Map<string, HTMLCalcitePickListItemElement>>",
- "docs": ""
- },
- "signature": "getSelectedItems() => Promise<Map<string, HTMLCalcitePickListItemElement>>",
- "parameters": [],
- "docs": "Returns the currently selected items",
- "docsTags": []
- },
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus(focusId?: ListFocusId) => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteListChange",
- "detail": "Map<string, HTMLCalcitePickListItemElement>",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when any of the item selections have changed.",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "calciteListItemRemove",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteListItemChange",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteListItemPropsChange",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteListItemValueChange",
- "capture": false,
- "passive": false
- },
- {
- "event": "focusout",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-pick-list-item` elements or `calcite-pick-list-group` elements. Items are displayed as a vertical list."
- },
- {
- "name": "menu-actions",
- "docs": "A slot for adding a button + menu combo for performing actions like sorting."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-filter",
- "calcite-scrim"
- ],
- "dependencyGraph": {
- "calcite-pick-list": [
- "calcite-filter",
- "calcite-scrim"
- ],
- "calcite-filter": [
- "calcite-input"
- ],
- "calcite-input": [
- "calcite-progress",
- "calcite-icon"
- ],
- "calcite-scrim": [
- "calcite-loader"
- ]
- }
- },
- {
- "filePath": "./src/components/pick-list-group/pick-list-group.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-pick-list-group",
- "readme": "# calcite-pick-list-group\n\n`calcite-pick-list-group` is a wrapper for multiple `calcite-pick-list-item`s and lives in `calcite-pick-list`.\n",
- "docs": "`calcite-pick-list-group` is a wrapper for multiple `calcite-pick-list-item`s and lives in `calcite-pick-list`.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-pick-list-item` elements."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "groupTitle",
- "type": "string",
- "mutable": false,
- "attr": "group-title",
- "reflectToAttr": true,
- "docs": "The title used for all nested `calcite-pick-list` rows.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "headingLevel",
- "type": "1 | 2 | 3 | 4 | 5 | 6",
- "mutable": false,
- "attr": "heading-level",
- "reflectToAttr": false,
- "docs": "Number at which section headings should start for this component.",
- "docsTags": [],
- "values": [
- {
- "value": "1",
- "type": "number"
- },
- {
- "value": "2",
- "type": "number"
- },
- {
- "value": "3",
- "type": "number"
- },
- {
- "value": "4",
- "type": "number"
- },
- {
- "value": "5",
- "type": "number"
- },
- {
- "value": "6",
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-pick-list-item` elements."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/pick-list-item/pick-list-item.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-pick-list-item",
- "readme": "# calcite-pick-list-item\n\n`calcite-pick-list-item`s are cards contained in a `calcite-pick-list`. They each can have a label and description, an icon, and be set to compact. The developer can disable or preselect each list item and give it a value.\n",
- "docs": "`calcite-pick-list-item`s are cards contained in a `calcite-pick-list`. They each can have a label and description, an icon, and be set to compact. The developer can disable or preselect each list item and give it a value.",
- "docsTags": [
- {
- "name": "slot",
- "text": "actions-end - a slot for adding actions or content to the end side of the item."
- },
- {
- "name": "slot",
- "text": "actions-start - a slot for adding actions or content to the start side of the item."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "description",
- "type": "string",
- "mutable": false,
- "attr": "description",
- "reflectToAttr": true,
- "docs": "An optional description for this item. This will appear below the label text.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "disableDeselect",
- "type": "boolean",
- "mutable": false,
- "attr": "disable-deselect",
- "reflectToAttr": false,
- "docs": "When false, the item cannot be deselected by user interaction.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, the item cannot be clicked and is visually muted.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "icon",
- "type": "ICON_TYPES.circle | ICON_TYPES.grip | ICON_TYPES.square",
- "mutable": false,
- "attr": "icon",
- "reflectToAttr": true,
- "docs": "Determines the icon SVG symbol that will be shown. Options are circle, square, grip or null.",
- "docsTags": [
- {
- "name": "see",
- "text": "[ICON_TYPES](https://github.com/Esri/calcite-components/blob/master/src/components/pick-list/resources.ts#L5)"
- }
- ],
- "default": "null",
- "values": [
- {
- "type": "ICON_TYPES.circle"
- },
- {
- "type": "ICON_TYPES.grip"
- },
- {
- "type": "ICON_TYPES.square"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlRemove",
- "type": "string",
- "mutable": false,
- "attr": "intl-remove",
- "reflectToAttr": true,
- "docs": "Used as an accessible label (aria-label) for the \"remove item\" action. Only applicable if removable is true.",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Remove\""
- }
- ],
- "default": "TEXT.remove",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": true,
- "docs": "The main label for this item. This will appear next to the icon.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "metadata",
- "type": "{ [x: string]: unknown; }",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Used to provide additional metadata to an item, primarily used when the parent list has a filter.",
- "docsTags": [],
- "values": [
- {
- "type": "{ [x: string]: unknown; }"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "removable",
- "type": "boolean",
- "mutable": false,
- "attr": "removable",
- "reflectToAttr": true,
- "docs": "Set this to true to display a remove action that removes the item from the list.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "selected",
- "type": "boolean",
- "mutable": true,
- "attr": "selected",
- "reflectToAttr": true,
- "docs": "Set this to true to pre-select an item. Toggles when an item is checked/unchecked.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "any",
- "mutable": false,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "The item's associated value.",
- "docsTags": [],
- "values": [
- {
- "type": "any"
- }
- ],
- "optional": false,
- "required": true
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- },
- {
- "name": "toggleSelected",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "toggleSelected(coerce?: boolean) => Promise<void>",
- "parameters": [],
- "docs": "Used to toggle the selection state. By default this won't trigger an event.\nThe first argument allows the value to be coerced, rather than swapping values.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteListItemChange",
- "detail": "{ item: HTMLCalcitePickListItemElement; value: any; selected: boolean; shiftPressed: boolean; }",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted whenever the item is selected or unselected.",
- "docsTags": []
- },
- {
- "event": "calciteListItemRemove",
- "detail": "void",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted whenever the remove button is pressed.",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "actions-end",
- "docs": "a slot for adding actions or content to the end side of the item."
- },
- {
- "name": "actions-start",
- "docs": "a slot for adding actions or content to the start side of the item."
- }
- ],
- "parts": [],
- "dependents": [
- "calcite-value-list-item"
- ],
- "dependencies": [
- "calcite-icon",
- "calcite-action"
- ],
- "dependencyGraph": {
- "calcite-pick-list-item": [
- "calcite-icon",
- "calcite-action"
- ],
- "calcite-action": [
- "calcite-loader",
- "calcite-icon"
- ],
- "calcite-value-list-item": [
- "calcite-pick-list-item"
- ]
- }
- },
- {
- "filePath": "./src/components/popover/popover.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-popover",
- "readme": "# calcite-popover\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding custom content."
- }
- ],
- "usage": {
- "Manager": "```html\n<calcite-popover reference-element=\"popover-button\">Hello! I am some popover content!</calcite-popover>\n\n<calcite-popover-manager\n ><calcite-button id=\"popover-button\">Clickable popover</calcite-button></calcite-popover-manager\n>\n```\n"
- },
- "props": [
- {
- "name": "autoClose",
- "type": "boolean",
- "mutable": false,
- "attr": "auto-close",
- "reflectToAttr": true,
- "docs": "Automatically closes any currently open popovers when clicking outside of a popover.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "closeButton",
- "type": "boolean",
- "mutable": false,
- "attr": "close-button",
- "reflectToAttr": true,
- "docs": "Display a close button within the Popover.",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use dismissible instead."
- }
- ],
- "default": "false",
- "deprecation": "use dismissible instead.",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disableFlip",
- "type": "boolean",
- "mutable": false,
- "attr": "disable-flip",
- "reflectToAttr": true,
- "docs": "Prevents flipping the popover's placement when it starts to overlap its reference element.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disablePointer",
- "type": "boolean",
- "mutable": false,
- "attr": "disable-pointer",
- "reflectToAttr": true,
- "docs": "Removes the caret pointer.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "dismissible",
- "type": "boolean",
- "mutable": false,
- "attr": "dismissible",
- "reflectToAttr": true,
- "docs": "Display a close button within the Popover.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "flipPlacements",
- "type": "ComputedPlacement[]",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Defines the available placements that can be used when a flip occurs.",
- "docsTags": [],
- "values": [
- {
- "type": "ComputedPlacement[]"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "heading",
- "type": "string",
- "mutable": false,
- "attr": "heading",
- "reflectToAttr": false,
- "docs": "Heading text.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "headingLevel",
- "type": "1 | 2 | 3 | 4 | 5 | 6",
- "mutable": false,
- "attr": "heading-level",
- "reflectToAttr": false,
- "docs": "Number at which section headings should start for this component.",
- "docsTags": [],
- "values": [
- {
- "value": "1",
- "type": "number"
- },
- {
- "value": "2",
- "type": "number"
- },
- {
- "value": "3",
- "type": "number"
- },
- {
- "value": "4",
- "type": "number"
- },
- {
- "value": "5",
- "type": "number"
- },
- {
- "value": "6",
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlClose",
- "type": "string",
- "mutable": false,
- "attr": "intl-close",
- "reflectToAttr": false,
- "docs": "Text for close button.",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Close\""
- }
- ],
- "default": "TEXT.close",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "Accessible name for the component",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": true
- },
- {
- "name": "offsetDistance",
- "type": "number",
- "mutable": false,
- "attr": "offset-distance",
- "reflectToAttr": true,
- "docs": "Offset the position of the popover away from the reference element.",
- "docsTags": [
- {
- "name": "default",
- "text": "6"
- }
- ],
- "default": "defaultOffsetDistance",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "offsetSkidding",
- "type": "number",
- "mutable": false,
- "attr": "offset-skidding",
- "reflectToAttr": true,
- "docs": "Offset the position of the popover along the reference element.",
- "docsTags": [],
- "default": "0",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "open",
- "type": "boolean",
- "mutable": true,
- "attr": "open",
- "reflectToAttr": true,
- "docs": "Display and position the component.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "overlayPositioning",
- "type": "\"absolute\" | \"fixed\"",
- "mutable": false,
- "attr": "overlay-positioning",
- "reflectToAttr": false,
- "docs": "Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value.",
- "docsTags": [],
- "default": "\"absolute\"",
- "values": [
- {
- "value": "absolute",
- "type": "string"
- },
- {
- "value": "fixed",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "placement",
- "type": "Placement | PlacementRtl | VariationRtl",
- "mutable": false,
- "attr": "placement",
- "reflectToAttr": true,
- "docs": "Determines where the component will be positioned relative to the referenceElement.",
- "docsTags": [
- {
- "name": "see",
- "text": "[PopperPlacement](https://github.com/Esri/calcite-components/blob/master/src/utils/popper.ts#L25)"
- }
- ],
- "default": "defaultPopoverPlacement",
- "values": [
- {
- "type": "Placement"
- },
- {
- "type": "PlacementRtl"
- },
- {
- "type": "VariationRtl"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "referenceElement",
- "type": "HTMLElement | string",
- "mutable": false,
- "attr": "reference-element",
- "reflectToAttr": false,
- "docs": "Reference HTMLElement used to position this component according to the placement property. As a convenience, a string ID of the reference element can be used. However, setting this property to use an HTMLElement is preferred so that the component does not need to query the DOM for the referenceElement.",
- "docsTags": [],
- "values": [
- {
- "type": "HTMLElement"
- },
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": true
- }
- ],
- "methods": [
- {
- "name": "reposition",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "reposition() => Promise<void>",
- "parameters": [],
- "docs": "Updates the position of the component.",
- "docsTags": []
- },
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus(focusId?: \"close-button\") => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- },
- {
- "name": "toggle",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "toggle(value?: boolean) => Promise<void>",
- "parameters": [],
- "docs": "Toggles the popover's open property.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calcitePopoverClose",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fired when the popover is closed",
- "docsTags": []
- },
- {
- "event": "calcitePopoverOpen",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fired when the popover is opened",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding custom content."
- }
- ],
- "parts": [],
- "dependents": [
- "calcite-action-menu",
- "calcite-input-time-picker"
- ],
- "dependencies": [
- "calcite-action",
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-popover": [
- "calcite-action",
- "calcite-icon"
- ],
- "calcite-action": [
- "calcite-loader",
- "calcite-icon"
- ],
- "calcite-action-menu": [
- "calcite-popover"
- ],
- "calcite-input-time-picker": [
- "calcite-popover"
- ]
- }
- },
- {
- "filePath": "./src/components/popover-manager/popover-manager.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-popover-manager",
- "readme": "# calcite-popover-manager\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding elements that reference a 'calcite-popover' by the 'selector' property."
- },
- {
- "name": "deprecated",
- "text": "No longer required for popover usage."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "autoClose",
- "type": "boolean",
- "mutable": false,
- "attr": "auto-close",
- "reflectToAttr": true,
- "docs": "Automatically closes any currently open popovers when clicking outside of a popover.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selector",
- "type": "string",
- "mutable": false,
- "attr": "selector",
- "reflectToAttr": false,
- "docs": "CSS Selector to match reference elements for popovers. Reference elements will be identified by this selector in order to open their associated popover.",
- "docsTags": [
- {
- "name": "default",
- "text": "`[data-calcite-popover-reference]`"
- }
- ],
- "default": "\"[data-calcite-popover-reference]\"",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding elements that reference a 'calcite-popover' by the 'selector' property."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {},
- "deprecation": "No longer required for popover usage."
- },
- {
- "filePath": "./src/components/progress/progress.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-progress",
- "readme": "# calcite-progress\n\nThe `calcite-progress` component is used to show progress on some async task to the user.\n",
- "docs": "The `calcite-progress` component is used to show progress on some async task to the user.",
- "docsTags": [],
- "usage": {
- "Basic": "```html\n<calcite-progress type=\"indeterminate\"></calcite-progress>\n```\n"
- },
- "props": [
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "Label for the progress indicator",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "reversed",
- "type": "boolean",
- "mutable": false,
- "attr": "reversed",
- "reflectToAttr": false,
- "docs": "For indeterminate progress bars, reverse the animation direction",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "text",
- "type": "string",
- "mutable": false,
- "attr": "text",
- "reflectToAttr": false,
- "docs": "Text to display for the progress indicator",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "type",
- "type": "\"determinate\" | \"indeterminate\"",
- "mutable": false,
- "attr": "type",
- "reflectToAttr": false,
- "docs": "Use indeterminate if finding actual progress value is impossible",
- "docsTags": [],
- "default": "\"determinate\"",
- "values": [
- {
- "value": "determinate",
- "type": "string"
- },
- {
- "value": "indeterminate",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "number",
- "mutable": false,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "Fraction completed, in the range of 0 - 1.0",
- "docsTags": [],
- "default": "0",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [
- "calcite-input"
- ],
- "dependencies": [],
- "dependencyGraph": {
- "calcite-input": [
- "calcite-progress"
- ]
- }
- },
- {
- "filePath": "./src/components/radio-button/radio-button.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-radio-button",
- "readme": "# calcite-radio-button\n",
- "docs": "",
- "docsTags": [],
- "usage": {
- "Basic": "```html\n<calcite-label for=\"item-a\" layout=\"inline\">\n <calcite-radio-button id=\"item-a\" name=\"preferred-feature\" value=\"Maps\" checked></calcite-radio-button>\n Maps\n</calcite-label>\n```\n"
- },
- "props": [
- {
- "name": "checked",
- "type": "boolean",
- "mutable": true,
- "attr": "checked",
- "reflectToAttr": true,
- "docs": "The checked state of the radio button.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "The disabled state of the radio button.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "guid",
- "type": "string",
- "mutable": true,
- "attr": "guid",
- "reflectToAttr": true,
- "docs": "The id attribute of the radio button. When omitted, a globally unique identifier is used.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "hidden",
- "type": "boolean",
- "mutable": false,
- "attr": "hidden",
- "reflectToAttr": true,
- "docs": "The radio button's hidden status. When a radio button is hidden it is not focusable or checkable.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "name",
- "type": "string",
- "mutable": false,
- "attr": "name",
- "reflectToAttr": true,
- "docs": "The name of the radio button. `name` is passed as a property automatically from `calcite-radio-button-group`.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "required",
- "type": "boolean",
- "mutable": false,
- "attr": "required",
- "reflectToAttr": true,
- "docs": "Requires that a value is selected for the radio button group before the parent form will submit.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "The scale (size) of the radio button. `scale` is passed as a property automatically from `calcite-radio-button-group`.",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "any",
- "mutable": true,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "The value of the radio button.",
- "docsTags": [],
- "values": [
- {
- "type": "any"
- }
- ],
- "optional": false,
- "required": true
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteRadioButtonChange",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fires only when the radio button is checked. This behavior is identical to the native HTML input element.\nSince this event does not fire when the radio button is unchecked, it's not recommended to attach a listener for this event\ndirectly on the element, but instead either attach it to a node that contains all of the radio buttons in the group\nor use the calciteRadioButtonGroupChange event if using this with calcite-radio-button-group.",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "mouseenter",
- "capture": false,
- "passive": true
- },
- {
- "event": "mouseleave",
- "capture": false,
- "passive": true
- }
- ],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/radio-button-group/radio-button-group.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-radio-button-group",
- "readme": "# calcite-radio-button-group\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-radio-button`s."
- }
- ],
- "usage": {
- "Basic": "Renders the radio button group with default horizontal layout\n\n```html\n<calcite-radio-button-group name=\"basic-group\">\n <calcite-label layout=\"inline\">\n <calcite-radio-button></calcite-radio-button>\n Maps\n </calcite-label>\n <calcite-label layout=\"inline\">\n <calcite-radio-button></calcite-radio-button>\n Layers\n </calcite-label>\n <calcite-label layout=\"inline\">\n <calcite-radio-button></calcite-radio-button>\n Data\n </calcite-label>\n <calcite-label layout=\"inline\">\n <calcite-radio-button></calcite-radio-button>\n Geography\n </calcite-label>\n</calcite-radio-button-group>\n```\n",
- "Disabled-checked": "Renders all radio button inputs disabled, first one checked\n\n```html\n<calcite-radio-button-group name=\"disabled-group\" disabled>\n <calcite-label layout=\"inline\">\n <calcite-radio-button checked></calcite-radio-button>\n A\n </calcite-label>\n <calcite-label layout=\"inline\">\n <calcite-radio-button></calcite-radio-button>\n B\n </calcite-label>\n <calcite-label layout=\"inline\">\n <calcite-radio-button></calcite-radio-button>\n C\n </calcite-label>\n</calcite-radio-button-group>\n```\n",
- "With-vertical-layout": "```html\n<calcite-radio-button-group name=\"vertical-group\" layout=\"vertical\">\n <calcite-label layout=\"inline\">\n <calcite-radio-button></calcite-radio-button>\n Maps\n </calcite-label>\n <calcite-label layout=\"inline\">\n <calcite-radio-button></calcite-radio-button>\n Layers\n </calcite-label>\n <calcite-label layout=\"inline\">\n <calcite-radio-button></calcite-radio-button>\n Data\n </calcite-label>\n <calcite-label layout=\"inline\">\n <calcite-radio-button></calcite-radio-button>\n Geography\n </calcite-label>\n</calcite-radio-button-group>\n```\n"
- },
- "props": [
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "The disabled state of the radio button group.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "hidden",
- "type": "boolean",
- "mutable": false,
- "attr": "hidden",
- "reflectToAttr": true,
- "docs": "The radio button group's hidden status. When a radio button group is hidden none of its options are focusable or checkable.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "layout",
- "type": "\"grid\" | \"horizontal\" | \"vertical\"",
- "mutable": false,
- "attr": "layout",
- "reflectToAttr": true,
- "docs": "The layout direction of the radio buttons in a group.",
- "docsTags": [],
- "default": "\"horizontal\"",
- "values": [
- {
- "value": "grid",
- "type": "string"
- },
- {
- "value": "horizontal",
- "type": "string"
- },
- {
- "value": "vertical",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "name",
- "type": "string",
- "mutable": false,
- "attr": "name",
- "reflectToAttr": true,
- "docs": "The name of the radio button group. `name` must be unique to other radio button group instances.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": true
- },
- {
- "name": "required",
- "type": "boolean",
- "mutable": false,
- "attr": "required",
- "reflectToAttr": true,
- "docs": "Requires that a value is selected for the radio button group before the parent form will submit.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "The scale (size) of the radio button group.",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [
- {
- "event": "calciteRadioButtonGroupChange",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the radio button group has changed.",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "calciteRadioButtonChange",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-radio-button`s."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/radio-group/radio-group.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-radio-group",
- "readme": "# calcite-radio-group\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-radio-group-item`s."
- }
- ],
- "usage": {
- "Basic": "```html\n<calcite-radio-group layout=\"horizontal\" appearance=\"solid\" scale=\"m\" width=\"auto\">\n <calcite-radio-group-item value=\"apple\" checked>Apple</calcite-radio-group-item>\n <calcite-radio-group-item value=\"mango\">Mango</calcite-radio-group-item>\n <calcite-radio-group-item value=\"tomato\">Tomato</calcite-radio-group-item>\n <calcite-radio-group-item value=\"banana\">Banana</calcite-radio-group-item>\n</calcite-radio-group>\n```\n"
- },
- "props": [
- {
- "name": "appearance",
- "type": "\"outline\" | \"solid\"",
- "mutable": false,
- "attr": "appearance",
- "reflectToAttr": true,
- "docs": "specify the appearance style of the radio group, defaults to solid.",
- "docsTags": [],
- "default": "\"solid\"",
- "values": [
- {
- "value": "outline",
- "type": "string"
- },
- {
- "value": "solid",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "is the radio group disabled",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "layout",
- "type": "\"grid\" | \"horizontal\" | \"vertical\"",
- "mutable": false,
- "attr": "layout",
- "reflectToAttr": true,
- "docs": "specify the layout of the radio group, defaults to horizontal",
- "docsTags": [],
- "default": "\"horizontal\"",
- "values": [
- {
- "value": "grid",
- "type": "string"
- },
- {
- "value": "horizontal",
- "type": "string"
- },
- {
- "value": "vertical",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "name",
- "type": "string",
- "mutable": false,
- "attr": "name",
- "reflectToAttr": false,
- "docs": "The group's name. Gets submitted with the form.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "The scale of the radio group",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selectedItem",
- "type": "HTMLCalciteRadioGroupItemElement",
- "mutable": true,
- "reflectToAttr": false,
- "docs": "The group's selected item.",
- "docsTags": [],
- "values": [
- {
- "type": "HTMLCalciteRadioGroupItemElement"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "string",
- "mutable": true,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "The value of the selectedItem",
- "docsTags": [],
- "default": "null",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "width",
- "type": "\"auto\" | \"full\"",
- "mutable": false,
- "attr": "width",
- "reflectToAttr": true,
- "docs": "specify the width of the group, defaults to auto",
- "docsTags": [],
- "default": "\"auto\"",
- "values": [
- {
- "value": "auto",
- "type": "string"
- },
- {
- "value": "full",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteRadioGroupChange",
- "detail": "string",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fired when the selected option changes, event detail is the new value",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "calciteRadioGroupItemChange",
- "capture": false,
- "passive": false
- },
- {
- "event": "keydown",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-radio-group-item`s."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/radio-group-item/radio-group-item.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-radio-group-item",
- "readme": "# calcite-radio-group-item\n",
- "docs": "",
- "docsTags": [],
- "usage": {},
- "props": [
- {
- "name": "checked",
- "type": "boolean",
- "mutable": true,
- "attr": "checked",
- "reflectToAttr": true,
- "docs": "Indicates whether the control is checked.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "icon",
- "type": "string",
- "mutable": false,
- "attr": "icon",
- "reflectToAttr": true,
- "docs": "optionally pass an icon to display - accepts Calcite UI icon names",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "iconFlipRtl",
- "type": "boolean",
- "mutable": false,
- "attr": "icon-flip-rtl",
- "reflectToAttr": true,
- "docs": "flip the icon in rtl",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "iconPosition",
- "type": "\"end\" | \"start\"",
- "mutable": false,
- "attr": "icon-position",
- "reflectToAttr": true,
- "docs": "optionally used with icon, select where to position the icon",
- "docsTags": [],
- "default": "\"start\"",
- "values": [
- {
- "value": "end",
- "type": "string"
- },
- {
- "value": "start",
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "value",
- "type": "any",
- "mutable": true,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "The control's value.",
- "docsTags": [],
- "values": [
- {
- "type": "any"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-radio-group-item": [
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/rating/rating.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-rating",
- "readme": "# calcite-rating\n",
- "docs": "",
- "docsTags": [],
- "usage": {
- "Basic": "```html\n<calcite-rating\n show-chip\n scale=\"m\"\n value=\"0\"\n average=\"4.4\"\n count=\"10\"\n intl-rating=\"Rating\"\n intl-stars=\"Rating\"\n></calcite-rating>\n```\n"
- },
- "props": [
- {
- "name": "average",
- "type": "number",
- "mutable": false,
- "attr": "average",
- "reflectToAttr": true,
- "docs": "optionally pass a cumulative average rating to display",
- "docsTags": [],
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "count",
- "type": "number",
- "mutable": false,
- "attr": "count",
- "reflectToAttr": true,
- "docs": "optionally pass a number of previous ratings to display",
- "docsTags": [],
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "is the rating component in a selectable mode",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlRating",
- "type": "string",
- "mutable": false,
- "attr": "intl-rating",
- "reflectToAttr": false,
- "docs": "Localized string for \"Rating\" (used for aria label)",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Rating\""
- }
- ],
- "default": "TEXT.rating",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlStars",
- "type": "string",
- "mutable": false,
- "attr": "intl-stars",
- "reflectToAttr": false,
- "docs": "Localized string for labelling each star, `${num}` in the string will be replaced by the number",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Stars: ${num}\""
- }
- ],
- "default": "TEXT.stars",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "name",
- "type": "string",
- "mutable": false,
- "attr": "name",
- "reflectToAttr": true,
- "docs": "The name of the rating",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "readOnly",
- "type": "boolean",
- "mutable": false,
- "attr": "read-only",
- "reflectToAttr": true,
- "docs": "is the rating component in a selectable mode",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of the component, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "showChip",
- "type": "boolean",
- "mutable": false,
- "attr": "show-chip",
- "reflectToAttr": true,
- "docs": "Show average and count data summary chip (if available)",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "number",
- "mutable": true,
- "attr": "value",
- "reflectToAttr": true,
- "docs": "the value of the rating component",
- "docsTags": [],
- "default": "0",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteRatingChange",
- "detail": "{ value: number; }",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fires when the rating value has changed.",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "blur",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [
- {
- "name": "--calcite-rating-spacing-unit",
- "annotation": "prop",
- "docs": "the amount of left/right margin between each rating star"
- }
- ],
- "slots": [],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-icon",
- "calcite-chip"
- ],
- "dependencyGraph": {
- "calcite-rating": [
- "calcite-icon",
- "calcite-chip"
- ],
- "calcite-chip": [
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/scrim/scrim.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-scrim",
- "readme": "# calcite-scrim\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding custom content, primarily loading information."
- }
- ],
- "usage": {
- "Basic": "```html\n<div style=\"position: relative; width: 200px; height: 200px; overflow: auto;\">\n <calcite-scrim>\n <p>I'm a panel that is not loading.</p>\n <p>This content can have any zIndex and it will not be placed above</p>\n <p>.</p>\n <p>.</p>\n <p>.</p>\n <p>.</p>\n </calcite-scrim>\n</div>\n```\n",
- "Loading-scrim-panel": "```html\n<div style=\"position: relative; width: 200px; height: 200px; overflow: auto;\">\n <calcite-scrim loading>\n <p>I'm a panel that is not loading.</p>\n <p>I have a loading spinner over my content.</p>\n <p>.</p>\n <p>.</p>\n <p>.</p>\n <p>.</p>\n </calcite-scrim>\n</div>\n```\n"
- },
- "props": [
- {
- "name": "intlLoading",
- "type": "string",
- "mutable": false,
- "attr": "intl-loading",
- "reflectToAttr": false,
- "docs": "string to override English loading text",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Loading\""
- }
- ],
- "default": "TEXT.loading",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "loading",
- "type": "boolean",
- "mutable": false,
- "attr": "loading",
- "reflectToAttr": true,
- "docs": "Determines if the component will have the loader overlay.\nOtherwise, will render opaque disabled state.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding custom content, primarily loading information."
- }
- ],
- "parts": [],
- "dependents": [
- "calcite-block",
- "calcite-modal",
- "calcite-panel",
- "calcite-pick-list",
- "calcite-value-list"
- ],
- "dependencies": [
- "calcite-loader"
- ],
- "dependencyGraph": {
- "calcite-scrim": [
- "calcite-loader"
- ],
- "calcite-block": [
- "calcite-scrim"
- ],
- "calcite-modal": [
- "calcite-scrim"
- ],
- "calcite-panel": [
- "calcite-scrim"
- ],
- "calcite-pick-list": [
- "calcite-scrim"
- ],
- "calcite-value-list": [
- "calcite-scrim"
- ]
- }
- },
- {
- "filePath": "./src/components/select/select.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-select",
- "readme": "# calcite-select\n\nThis component represents a menu of options.\n",
- "docs": "This component represents a menu of options.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-option`s."
- }
- ],
- "usage": {
- "Basic": "```html\n<calcite-select>\n <calcite-option>high</calcite-option>\n <calcite-option>medium</calcite-option>\n <calcite-option>low</calcite-option>\n</calcite-select>\n```\n",
- "Content": "Specify the underlying value and content for each option.\n\n```html\n<calcite-select>\n <calcite-option label=\"high\">1</calcite-option>\n <calcite-option label=\"medium\">2</calcite-option>\n <calcite-option label=\"low\">3</calcite-option>\n</calcite-select>\n```\n",
- "Disable": "Disable specific items or groups.\n\n```html\n<calcite-select>\n <calcite-option-group label=\"letters\">\n <calcite-option>a</calcite-option>\n <calcite-option>b</calcite-option>\n <calcite-option>c</calcite-option>\n <calcite-option disabled>d (disabled)</calcite-option>\n </calcite-option-group>\n <calcite-option-group label=\"numbers\">\n <calcite-option disabled>1 (disabled)</calcite-option>\n <calcite-option>2</calcite-option>\n <calcite-option selected>2</calcite-option>\n </calcite-option-group>\n <calcite-option-group label=\"non-selectable\" disabled>\n <calcite-option>You-Know-Who</calcite-option>\n <calcite-option selected>Tom Marvolo Riddle</calcite-option>\n <calcite-option>He-Who-Must-Not-Be-Named</calcite-option>\n <calcite-option>Voldemort</calcite-option>\n </calcite-option-group>\n</calcite-select>\n```\n",
- "Grouped": "Separate the options into groups.\n\n```html\n<calcite-select>\n <calcite-option-group label=\"letters\">\n <calcite-option>a</calcite-option>\n <calcite-option>b</calcite-option>\n <calcite-option>c</calcite-option>\n </calcite-option-group>\n <calcite-option-group label=\"numbers\">\n <calcite-option>1</calcite-option>\n <calcite-option selected>2</calcite-option>\n <calcite-option>3</calcite-option>\n </calcite-option-group>\n</calcite-select>\n```\n",
- "Side-by-side": "Separate the options side by side using a flex-box container.\n\n```html\n<div class=\"demo-side-by-side\">\n <calcite-select width=\"half\" label=\"half width\">\n <calcite-option>☕️</calcite-option>\n <calcite-option>🍵</calcite-option>\n <calcite-option selected>🍻</calcite-option>\n </calcite-select>\n <calcite-select width=\"half\" label=\"half width\">\n <calcite-option selected>🌮</calcite-option>\n <calcite-option>🍔</calcite-option>\n <calcite-option>🌯</calcite-option>\n </calcite-select>\n</div>\n```\n",
- "Value": "Specify the underlying value for each option.\n\n```html\n<calcite-select>\n <calcite-option value=\"high\">😃</calcite-option>\n <calcite-option value=\"medium\">😶</calcite-option>\n <calcite-option value=\"low\">😭</calcite-option>\n</calcite-select>\n```\n"
- },
- "props": [
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, it prevents the option from being selected.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "The component's label. This is required for accessibility purposes.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": true
- },
- {
- "name": "name",
- "type": "string",
- "mutable": false,
- "attr": "name",
- "reflectToAttr": false,
- "docs": "The select's name. Gets submitted with the form.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "The component scale.",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selectedOption",
- "type": "HTMLCalciteOptionElement",
- "mutable": true,
- "reflectToAttr": false,
- "docs": "The currently selected option.",
- "docsTags": [
- {
- "name": "readonly"
- }
- ],
- "values": [
- {
- "type": "HTMLCalciteOptionElement"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "string",
- "mutable": true,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "The value of the selectedOption",
- "docsTags": [],
- "default": "null",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "width",
- "type": "\"auto\" | \"full\" | \"half\"",
- "mutable": false,
- "attr": "width",
- "reflectToAttr": true,
- "docs": "The component width.",
- "docsTags": [],
- "default": "\"auto\"",
- "values": [
- {
- "value": "auto",
- "type": "string"
- },
- {
- "value": "full",
- "type": "string"
- },
- {
- "value": "half",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteSelectChange",
- "detail": "void",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "This event will fire whenever the selected option changes.",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "calciteOptionChange",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteOptionGroupChange",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [
- {
- "name": "--calcite-select-font-size",
- "annotation": "prop",
- "docs": "the font-size of items in the select"
- },
- {
- "name": "--calcite-select-spacing",
- "annotation": "prop",
- "docs": "the padding around the selected option text"
- }
- ],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-option`s."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-select": [
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/shell/shell.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-shell",
- "readme": "# calcite-shell\n\nThe `calcite-shell` component is used for application layout management. It is a container for the view as well as other calcite components like `calcite-shell-panel` and `calcite-tip-manager`.\n\n_note: calcite-shell supports tablet as the smallest screen size_\n",
- "docs": "The `calcite-shell` component is used for application layout management. It is a container for the view as well as other calcite components like `calcite-shell-panel` and `calcite-tip-manager`.\n\n_note: calcite-shell supports tablet as the smallest screen size_",
- "docsTags": [
- {
- "name": "slot",
- "text": "- 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)"
- },
- {
- "name": "slot",
- "text": "header - A slot for adding header content. This content will be positioned at the top of the shell."
- },
- {
- "name": "slot",
- "text": "footer - A slot for adding footer content. This content will be positioned at the bottom of the shell."
- },
- {
- "name": "slot",
- "text": "primary-panel - A slot for adding the leading `calcite-shell-panel`."
- },
- {
- "name": "slot",
- "text": "contextual-panel - A slot for adding the trailing `calcite-shell-panel`."
- },
- {
- "name": "slot",
- "text": "center-row - A slot for adding custom content in the center row."
- }
- ],
- "usage": {
- "Advanced": "Renders a shell with leading and trailing floating panels, action bar/pad, block, flow, tip manager, footer.\n\n```html\n<calcite-shell>\n <calcite-shell-panel slot=\"primary-panel\" position=\"start\" detached>\n <calcite-action-bar slot=\"action-bar\">\n <calcite-action-group>\n <calcite-action text=\"Add\" icon=\"plus\"></calcite-action>\n <calcite-action text=\"Save\" disabled icon=\"save\"></calcite-action>\n <calcite-action text=\"Layers\" active indicator icon=\"layers\"></calcite-action>\n </calcite-action-group>\n <calcite-action-group>\n <calcite-action text=\"Add\" icon=\"plus\"></calcite-action>\n <calcite-action text=\"Layers\" indicator icon=\"layers\"></calcite-action>\n </calcite-action-group>\n </calcite-action-bar>\n <calcite-block collapsible heading=\"Primary Content\" summary=\"This is the primary.\">\n <calcite-block-content>\n <calcite-action text=\"Puppies\" text-enabled indicator icon=\"plus\"></calcite-action>\n <calcite-action text=\"Kittens\" text-enabled icon=\"save\"></calcite-action>\n <calcite-action text=\"Birds?\" text-enabled icon=\"banana\"></calcite-action>\n </calcite-block-content>\n </calcite-block>\n <calcite-block collapsible heading=\"Additional Block\" summary=\"Baby shark doo doo doo doo.\">\n <calcite-block-content>\n <p>Cool thing.</p>\n </calcite-block-content>\n </calcite-block>\n </calcite-shell-panel>\n\n <calcite-shell-panel slot=\"contextual-panel\" position=\"end\" detached height-scale=\"l\">\n <calcite-action-bar slot=\"action-bar\">\n <calcite-action-group>\n <calcite-action text=\"Add\" active icon=\"plus\"></calcite-action>\n <calcite-action text=\"Save\" disabled icon=\"save\"></calcite-action>\n <calcite-action text=\"Layers\" icon=\"layers\"></calcite-action>\n </calcite-action-group>\n <calcite-action-group>\n <calcite-action text=\"Add\" icon=\"plus\"></calcite-action>\n <calcite-action text=\"Save\" disabled icon=\"save\"></calcite-action>\n <calcite-action text=\"Layers\" icon=\"layers\"></calcite-action>\n </calcite-action-group>\n <calcite-action slot=\"bottom-actions\" text=\"Tips\" icon=\"lightbulb\"></calcite-action>\n </calcite-action-bar>\n <calcite-flow>\n <calcite-panel heading=\"Layer settings\">\n <calcite-block collapsible open heading=\"Contextual Content\" summary=\"Select goodness\">\n <calcite-value-list multiple filter-enabled>\n <calcite-value-list-item label=\"2018 Population Density (Esri)\" description=\"{POPDENS_CY}\" value=\"POPDENS_CY\">\n <calcite-action slot=\"actions-end\" icon=\"camera-flash-on\"></calcite-action>\n </calcite-value-list-item>\n <calcite-value-list-item label=\"2018 Population Density [Updated]\" description=\"{POPDENS_CY}\" value=\"POPDENS_CY2\">\n <calcite-action slot=\"actions-end\" icon=\"banana\"></calcite-action>\n </calcite-value-list-item>\n <calcite-value-list-item label=\"2018 Total Households (Esri)\" description=\"{TOTHH_CY}\" value=\"TOTHH_CY\">\n <calcite-action slot=\"actions-end\" icon=\"person2\"></calcite-action>\n </calcite-value-list-item>\n </calcite-value-list>\n </calcite-block>\n </calcite-panel>\n </calcite-flow>\n </calcite-shell-panel>\n <calcite-tip-manager slot=\"center-row\">\n <calcite-tip heading=\"The Red Rocks and Blue Water\" thumbnail=\"https://placeimg.com/1000/600\" text-thumbnail=\"This is an image of nature.\">\n <calcite-tip heading=\"The Long Trees\" thumbnail=\"https://placeimg.com/1000/600\" text-thumbnail=\"This is an image of trees.\">\n </calcite-tip-manager>\n <footer slot=\"footer\">Footer</footer>\n</calcite-shell>\n```\n",
- "Basic": "Renders a basic shell with a header and a footer.\n\n```html\n<calcite-shell>\n <div slot=\"header\">\n <header>\n <h2>Shell Header: My App</h2>\n </header>\n </div>\n <p>Shell Content</p>\n <!-- insert map or fillable content here -->\n <footer slot=\"footer\">Footer</footer>\n</calcite-shell>\n```\n",
- "With-panel-and-action-bar": "Renders a single panel with actions in an action bar.\n\n```html\n<calcite-shell>\n <calcite-shell-panel slot=\"primary-panel\" position=\"start\">\n <img src=\"https://via.placeholder.com/300x200\" alt=\"placeholder\" />\n <calcite-action-bar slot=\"action-bar\">\n <calcite-action text=\"Add\" active icon=\"plus\"></calcite-action>\n <calcite-action text=\"Save\" disabled icon=\"save\"></calcite-action>\n <calcite-action text=\"Layers\" icon=\"layers\"></calcite-action>\n </calcite-action-bar>\n </calcite-shell-panel>\n</calcite-shell>\n```\n",
- "With-panels": "Renders a shell with a header and panels on the left and right sides of the app.\n\n```html\n<calcite-shell>\n <calcite-shell-panel slot=\"primary-panel\" position=\"start\">\n Leading panel! (on the left side, since this is a LTR app)\n </calcite-shell-panel>\n <calcite-shell-panel slot=\"contextual-panel\" position=\"end\"> Trailing panel! (right side) </calcite-shell-panel>\n <calcite-shell-center-row slot=\"center-row\" position=\"end\" height-scale=\"m\">\n Center Row! (center bottom)\n </calcite-shell-center-row>\n <div slot=\"header\">\n <header>\n <h2>Shell Header: My App</h2>\n </header>\n </div>\n <p>Shell Content</p>\n <!-- insert map or fillable content here -->\n</calcite-shell>\n```\n"
- },
- "props": [
- {
- "name": "contentBehind",
- "type": "boolean",
- "mutable": false,
- "attr": "content-behind",
- "reflectToAttr": true,
- "docs": "Positions the center content behind any calcite-shell-panels.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [
- {
- "name": "--calcite-shell-tip-spacing",
- "annotation": "prop",
- "docs": "the left/right positioning of the tip-manager when slotted within a shell"
- }
- ],
- "slots": [
- {
- "name": "",
- "docs": "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)"
- },
- {
- "name": "center-row",
- "docs": "A slot for adding custom content in the center row."
- },
- {
- "name": "contextual-panel",
- "docs": "A slot for adding the trailing `calcite-shell-panel`."
- },
- {
- "name": "footer",
- "docs": "A slot for adding footer content. This content will be positioned at the bottom of the shell."
- },
- {
- "name": "header",
- "docs": "A slot for adding header content. This content will be positioned at the top of the shell."
- },
- {
- "name": "primary-panel",
- "docs": "A slot for adding the leading `calcite-shell-panel`."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/shell-center-row/shell-center-row.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-shell-center-row",
- "readme": "# calcite-shell-center-row\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding content to the shell panel."
- },
- {
- "name": "slot",
- "text": "action-bar - A slot for adding a `calcite-action-bar` to the panel."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "detached",
- "type": "boolean",
- "mutable": false,
- "attr": "detached",
- "reflectToAttr": true,
- "docs": "This property makes the content area appear like a \"floating\" panel.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "heightScale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "height-scale",
- "reflectToAttr": true,
- "docs": "Specifies the maximum height of the row.",
- "docsTags": [],
- "default": "\"s\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "position",
- "type": "\"end\" | \"start\"",
- "mutable": false,
- "attr": "position",
- "reflectToAttr": true,
- "docs": "Arranges the component depending on the elements 'dir' property.",
- "docsTags": [],
- "default": "\"end\"",
- "values": [
- {
- "value": "end",
- "type": "string"
- },
- {
- "value": "start",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding content to the shell panel."
- },
- {
- "name": "action-bar",
- "docs": "A slot for adding a `calcite-action-bar` to the panel."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/shell-panel/shell-panel.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-shell-panel",
- "readme": "# calcite-shell-panel\n\nThe `calcite-shell-panel` is a child component of `calcite-shell` used as a container to display other components like `calcite-block` and `calcite-flow`.\n",
- "docs": "The `calcite-shell-panel` is a child component of `calcite-shell` used as a container to display other components like `calcite-block` and `calcite-flow`.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding content to the shell panel."
- },
- {
- "name": "slot",
- "text": "action-bar - A slot for adding a `calcite-action-bar` to the panel."
- }
- ],
- "usage": {
- "Basic": "Renders a basic shell panel with text content.\n\n```html\n<calcite-shell-panel>\n <p>Primary Content</p>\n</calcite-shell-panel>\n```\n",
- "With-action-bar": "Renders a panel with an action bar.\n\n```html\n<calcite-shell-panel>\n <calcite-action-bar slot=\"action-bar\">\n <calcite-action text=\"Add\" icon=\"plus\"></calcite-action>\n <calcite-action text=\"Save\" icon=\"save\"></calcite-action>\n <calcite-action text=\"Layers\" icon=\"layers\"></calcite-action>\n </calcite-action-bar>\n</calcite-shell-panel>\n```\n",
- "With-custom-element": "Add `calcite-match-height` to a wrapping element to ensure proper height, scrolling, and sticky behavior (header, footer, fab). Note that multiple levels of nesting is not supported.\n\n```html\n<calcite-shell-panel>\n <calcite-action-bar slot=\"action-bar\">\n <calcite-action text=\"Add\" icon=\"plus\"></calcite-action>\n <calcite-action text=\"Save\" icon=\"save\"></calcite-action>\n <calcite-action text=\"Layers\" icon=\"layers\"></calcite-action>\n </calcite-action-bar>\n <your-custom-element class=\"calcite-match-height\">\n <calcite-panel> ... </calcite-panel>\n </your-custom-element>\n</calcite-shell-panel>\n```\n",
- "With-flow": "```html\n<calcite-shell-panel>\n <calcite-action-bar slot=\"action-bar\">\n <calcite-action text=\"Add\" icon=\"plus\"></calcite-action>\n <calcite-action text=\"Save\" icon=\"save\"></calcite-action>\n <calcite-action text=\"Layers\" icon=\"layers\"></calcite-action>\n </calcite-action-bar>\n <calcite-flow>\n <calcite-panel> ... </calcite-panel>\n <calcite-panel> ... </calcite-panel>\n </calcite-flow>\n</calcite-shell-panel>\n```\n",
- "With-panel": "```html\n<calcite-shell-panel>\n <calcite-action-bar slot=\"action-bar\">\n <calcite-action text=\"Add\" icon=\"plus\"></calcite-action>\n <calcite-action text=\"Save\" icon=\"save\"></calcite-action>\n <calcite-action text=\"Layers\" icon=\"layers\"></calcite-action>\n </calcite-action-bar>\n <calcite-panel> ... </calcite-panel>\n</calcite-shell-panel>\n```\n"
- },
- "props": [
- {
- "name": "collapsed",
- "type": "boolean",
- "mutable": false,
- "attr": "collapsed",
- "reflectToAttr": true,
- "docs": "Hide the content panel.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "detached",
- "type": "boolean",
- "mutable": false,
- "attr": "detached",
- "reflectToAttr": true,
- "docs": "This property makes the content area appear like a \"floating\" panel.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "detachedHeightScale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "detached-height-scale",
- "reflectToAttr": true,
- "docs": "Specifies the maximum height of the contents when detached.",
- "docsTags": [],
- "default": "\"l\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlResize",
- "type": "string",
- "mutable": false,
- "attr": "intl-resize",
- "reflectToAttr": false,
- "docs": "Accessible label for resize separator.",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Resize\""
- }
- ],
- "default": "TEXT.resize",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "position",
- "type": "\"end\" | \"start\"",
- "mutable": false,
- "attr": "position",
- "reflectToAttr": true,
- "docs": "Arranges the component depending on the elements 'dir' property.",
- "docsTags": [],
- "values": [
- {
- "value": "end",
- "type": "string"
- },
- {
- "value": "start",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "resizable",
- "type": "boolean",
- "mutable": false,
- "attr": "resizable",
- "reflectToAttr": true,
- "docs": "This property makes the content area resizable if the calcite-shell-panel is not 'detached'.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "widthScale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "width-scale",
- "reflectToAttr": true,
- "docs": "This sets width of the content area.",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [
- {
- "event": "calciteShellPanelToggle",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when collapse has been toggled.",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use a resizeObserver on the shell-panel to listen for changes to its size."
- }
- ],
- "deprecation": "use a resizeObserver on the shell-panel to listen for changes to its size."
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding content to the shell panel."
- },
- {
- "name": "action-bar",
- "docs": "A slot for adding a `calcite-action-bar` to the panel."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/slider/slider.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-slider",
- "readme": "# calcite-slider\n\nRange selection component for selecting single or multiple numeric values inside a given range.\n",
- "docs": "Range selection component for selecting single or multiple numeric values inside a given range.",
- "docsTags": [],
- "usage": {
- "Basic": "```html\n<calcite-slider min=\"1\" max=\"100\" value=\"50\" step=\"1\"></calcite-slider>\n```\n",
- "Two-handles": "If you'd like to allow an upper and lower value selection (two handles), you can set `min-value` and `max-value` rather than `value`. Note: these are mutually exclusive.\n\n```html\n<calcite-slider\n min=\"1\"\n max=\"100\"\n min-value=\"50\"\n max-value=\"85\"\n step=\"1\"\n min-label=\"Temperature (lower)\"\n max-label=\"Temperature (upper)\"\n></calcite-slider>\n```\n"
- },
- "props": [
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "Disable and gray out the slider",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "hasHistogram",
- "type": "boolean",
- "mutable": true,
- "attr": "has-histogram",
- "reflectToAttr": true,
- "docs": "Indicates if a histogram is present",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "histogram",
- "type": "Point[]",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "List of x,y coordinates within the slider's min and max, displays above the slider track.",
- "docsTags": [
- {
- "name": "see",
- "text": "[DataSeries](https://github.com/Esri/calcite-components/blob/master/src/components/graph/interfaces.ts#L5)"
- }
- ],
- "values": [
- {
- "type": "Point[]"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "histogramStops",
- "type": "ColorStop[]",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Array of values describing a single color stop, sorted by offset ascending.",
- "docsTags": [],
- "values": [
- {
- "type": "ColorStop[]"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "labelHandles",
- "type": "boolean",
- "mutable": false,
- "attr": "label-handles",
- "reflectToAttr": true,
- "docs": "Label handles with their numeric value",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "labelTicks",
- "type": "boolean",
- "mutable": false,
- "attr": "label-ticks",
- "reflectToAttr": true,
- "docs": "Label tick marks with their numeric value.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "max",
- "type": "number",
- "mutable": false,
- "attr": "max",
- "reflectToAttr": true,
- "docs": "Maximum selectable value",
- "docsTags": [],
- "default": "100",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "maxLabel",
- "type": "string",
- "mutable": false,
- "attr": "max-label",
- "reflectToAttr": false,
- "docs": "Used as an accessible label (aria-label) for second handle if needed (ex. \"Temperature, upper bound\")",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "maxValue",
- "type": "number",
- "mutable": true,
- "attr": "max-value",
- "reflectToAttr": false,
- "docs": "Currently selected upper number (if multi-select)",
- "docsTags": [],
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "min",
- "type": "number",
- "mutable": false,
- "attr": "min",
- "reflectToAttr": true,
- "docs": "Minimum selectable value",
- "docsTags": [],
- "default": "0",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "minLabel",
- "type": "string",
- "mutable": false,
- "attr": "min-label",
- "reflectToAttr": false,
- "docs": "Used as an accessible label (aria-label) for first (or only) handle (ex. \"Temperature, lower bound\")",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "minValue",
- "type": "number",
- "mutable": true,
- "attr": "min-value",
- "reflectToAttr": false,
- "docs": "Currently selected lower number (if multi-select)",
- "docsTags": [],
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "mirrored",
- "type": "boolean",
- "mutable": false,
- "attr": "mirrored",
- "reflectToAttr": true,
- "docs": "When true, the slider will display values from high to low.\n\nNote that this value will be ignored if the slider has an associated histogram.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "name",
- "type": "string",
- "mutable": false,
- "attr": "name",
- "reflectToAttr": true,
- "docs": "The name of the slider",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "pageStep",
- "type": "number",
- "mutable": false,
- "attr": "page-step",
- "reflectToAttr": false,
- "docs": "Interval to move on page up/page down keys",
- "docsTags": [],
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "precise",
- "type": "boolean",
- "mutable": false,
- "attr": "precise",
- "reflectToAttr": false,
- "docs": "Use finer point for handles",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "required",
- "type": "boolean",
- "mutable": false,
- "attr": "required",
- "reflectToAttr": true,
- "docs": "When true, makes the component required for form-submission.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": false,
- "docs": "Specify the scale of the slider, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "snap",
- "type": "boolean",
- "mutable": false,
- "attr": "snap",
- "reflectToAttr": false,
- "docs": "When true, enables snap selection along the step interval",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "step",
- "type": "number",
- "mutable": false,
- "attr": "step",
- "reflectToAttr": false,
- "docs": "Interval to move on up/down keys",
- "docsTags": [],
- "default": "1",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "ticks",
- "type": "number",
- "mutable": false,
- "attr": "ticks",
- "reflectToAttr": false,
- "docs": "Show tick marks on the number line at provided interval",
- "docsTags": [],
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "value",
- "type": "number | number[]",
- "mutable": true,
- "attr": "value",
- "reflectToAttr": true,
- "docs": "Currently selected number (if single select)",
- "docsTags": [],
- "default": "0",
- "values": [
- {
- "type": "number"
- },
- {
- "type": "number[]"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteSliderChange",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fires on when the thumb is released on slider\nIf you need to constantly listen to the drag event,\nplease use calciteSliderInput instead",
- "docsTags": []
- },
- {
- "event": "calciteSliderInput",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fires on all updates to the slider.\n:warning: Will be fired frequently during drag. If you are performing any\nexpensive operations consider using a debounce or throttle to avoid\nlocking up the main thread.",
- "docsTags": []
- },
- {
- "event": "calciteSliderUpdate",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fires on all updates to the slider.\n:warning: Will be fired frequently during drag. If you are performing any\nexpensive operations consider using a debounce or throttle to avoid\nlocking up the main thread.",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use calciteSliderInput instead"
- }
- ],
- "deprecation": "use calciteSliderInput instead"
- }
- ],
- "listeners": [
- {
- "event": "keydown",
- "capture": false,
- "passive": false
- },
- {
- "event": "click",
- "capture": false,
- "passive": false
- },
- {
- "event": "pointerdown",
- "capture": false,
- "passive": true
- }
- ],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-graph"
- ],
- "dependencyGraph": {
- "calcite-slider": [
- "calcite-graph"
- ]
- }
- },
- {
- "filePath": "./src/components/sortable-list/sortable-list.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-sortable-list",
- "readme": "# calcite-sortable-list\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding sortable items."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, disabled prevents interaction. This state shows items with lower opacity/grayed.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "dragSelector",
- "type": "string",
- "mutable": false,
- "attr": "drag-selector",
- "reflectToAttr": false,
- "docs": "Specifies which items inside the element should be draggable.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "group",
- "type": "string",
- "mutable": false,
- "attr": "group",
- "reflectToAttr": false,
- "docs": "The list's group identifier.\n\nTo drag elements from one list into another, both lists must have the same group value.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "handleSelector",
- "type": "string",
- "mutable": false,
- "attr": "handle-selector",
- "reflectToAttr": false,
- "docs": "The selector for the handle elements.",
- "docsTags": [],
- "default": "\"calcite-handle\"",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "layout",
- "type": "\"grid\" | \"horizontal\" | \"vertical\"",
- "mutable": false,
- "attr": "layout",
- "reflectToAttr": false,
- "docs": "Indicates the horizontal or vertical orientation of the component.",
- "docsTags": [],
- "default": "\"vertical\"",
- "values": [
- {
- "value": "grid",
- "type": "string"
- },
- {
- "value": "horizontal",
- "type": "string"
- },
- {
- "value": "vertical",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "loading",
- "type": "boolean",
- "mutable": false,
- "attr": "loading",
- "reflectToAttr": true,
- "docs": "When true, content is waiting to be loaded. This state shows a busy indicator.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [
- {
- "event": "calciteListOrderChange",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the order of the list has changed.",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "calciteHandleNudge",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding sortable items."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/split-button/split-button.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-split-button",
- "readme": "# calcite-split-button\n\nThe calcite-split-button control is one that combines a button with a dropdown menu in order to provide a primary action along with one or more related secondary options / actions. It's useful for grouping related actions or options for users, while elevating a commonly-used or default action for easier access. Its inner content populates the control's dropdown menu, and is thus expected to be valid `calcite-dropdown` content.\n",
- "docs": "The calcite-split-button control is one that combines a button with a dropdown menu in order to provide a primary action along with one or more related secondary options / actions. It's useful for grouping related actions or options for users, while elevating a commonly-used or default action for easier access. Its inner content populates the control's dropdown menu, and is thus expected to be valid `calcite-dropdown` content.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-dropdown` content."
- }
- ],
- "usage": {
- "Basic": "```html\n<calcite-split-button primary-icon-start=\"save\" primary-text=\"Primary Option\">\n <calcite-dropdown-group selection-mode=\"none\">\n <calcite-dropdown-item>Option 2</calcite-dropdown-item>\n <calcite-dropdown-item>Option 3</calcite-dropdown-item>\n <calcite-dropdown-item>Option 4</calcite-dropdown-item>\n </calcite-dropdown-group>\n</calcite-split-button>\n```\n"
- },
- "props": [
- {
- "name": "appearance",
- "type": "\"clear\" | \"outline\" | \"solid\" | \"transparent\"",
- "mutable": false,
- "attr": "appearance",
- "reflectToAttr": true,
- "docs": "specify the appearance style of the button, defaults to solid.",
- "docsTags": [],
- "default": "\"solid\"",
- "values": [
- {
- "value": "clear",
- "type": "string"
- },
- {
- "value": "outline",
- "type": "string"
- },
- {
- "value": "solid",
- "type": "string"
- },
- {
- "value": "transparent",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "color",
- "type": "\"blue\" | \"inverse\" | \"neutral\" | \"red\"",
- "mutable": false,
- "attr": "color",
- "reflectToAttr": true,
- "docs": "specify the color of the control, defaults to blue",
- "docsTags": [],
- "default": "\"blue\"",
- "values": [
- {
- "value": "blue",
- "type": "string"
- },
- {
- "value": "inverse",
- "type": "string"
- },
- {
- "value": "neutral",
- "type": "string"
- },
- {
- "value": "red",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "is the control disabled",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "dropdownIconType",
- "type": "\"caret\" | \"chevron\" | \"ellipsis\" | \"overflow\"",
- "mutable": false,
- "attr": "dropdown-icon-type",
- "reflectToAttr": true,
- "docs": "specify the icon used for the dropdown menu, defaults to chevron",
- "docsTags": [],
- "default": "\"chevron\"",
- "values": [
- {
- "value": "caret",
- "type": "string"
- },
- {
- "value": "chevron",
- "type": "string"
- },
- {
- "value": "ellipsis",
- "type": "string"
- },
- {
- "value": "overflow",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "dropdownLabel",
- "type": "string",
- "mutable": false,
- "attr": "dropdown-label",
- "reflectToAttr": true,
- "docs": "aria label for overflow button",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "loading",
- "type": "boolean",
- "mutable": false,
- "attr": "loading",
- "reflectToAttr": true,
- "docs": "optionally add a calcite-loader component to the control,\ndisabling interaction. with the primary button",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "overlayPositioning",
- "type": "\"absolute\" | \"fixed\"",
- "mutable": false,
- "attr": "overlay-positioning",
- "reflectToAttr": false,
- "docs": "Describes the type of positioning to use for the dropdown. If your element is in a fixed container, use the 'fixed' value.",
- "docsTags": [],
- "default": "\"absolute\"",
- "values": [
- {
- "value": "absolute",
- "type": "string"
- },
- {
- "value": "fixed",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "primaryIconEnd",
- "type": "string",
- "mutable": false,
- "attr": "primary-icon-end",
- "reflectToAttr": true,
- "docs": "optionally pass an icon to display at the end of the primary button - accepts Calcite UI icon names",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "primaryIconFlipRtl",
- "type": "\"both\" | \"end\" | \"start\"",
- "mutable": false,
- "attr": "primary-icon-flip-rtl",
- "reflectToAttr": true,
- "docs": "flip the primary icon(s) in rtl",
- "docsTags": [],
- "values": [
- {
- "value": "both",
- "type": "string"
- },
- {
- "value": "end",
- "type": "string"
- },
- {
- "value": "start",
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "primaryIconStart",
- "type": "string",
- "mutable": false,
- "attr": "primary-icon-start",
- "reflectToAttr": true,
- "docs": "optionally pass an icon to display at the start of the primary button - accepts Calcite UI icon names",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "primaryLabel",
- "type": "string",
- "mutable": false,
- "attr": "primary-label",
- "reflectToAttr": true,
- "docs": "optionally pass an aria-label for the primary button",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "primaryText",
- "type": "string",
- "mutable": false,
- "attr": "primary-text",
- "reflectToAttr": true,
- "docs": "text for primary action button",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of the control, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "width",
- "type": "\"auto\" | \"full\" | \"half\"",
- "mutable": false,
- "attr": "width",
- "reflectToAttr": true,
- "docs": "specify the width of the button, defaults to auto",
- "docsTags": [],
- "default": "\"auto\"",
- "values": [
- {
- "value": "auto",
- "type": "string"
- },
- {
- "value": "full",
- "type": "string"
- },
- {
- "value": "half",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [
- {
- "event": "calciteSplitButtonPrimaryClick",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "fired when the primary button is clicked",
- "docsTags": []
- },
- {
- "event": "calciteSplitButtonSecondaryClick",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "fired when the secondary button is clicked",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-dropdown` content."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-button",
- "calcite-dropdown"
- ],
- "dependencyGraph": {
- "calcite-split-button": [
- "calcite-button",
- "calcite-dropdown"
- ],
- "calcite-button": [
- "calcite-loader",
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/stepper/stepper.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-stepper",
- "readme": "# calcite-stepper\n\nCalcite stepper can be used to present a stepper workflow to a user. It has configurable display options for layout (horizontal or vertical), and the ability to automatically render status icons, and step numbers.\n",
- "docs": "Calcite stepper can be used to present a stepper workflow to a user. It has configurable display options for layout (horizontal or vertical), and the ability to automatically render status icons, and step numbers.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-stepper-item`s."
- }
- ],
- "usage": {
- "Basic": "```html\n<calcite-stepper icon numbered id=\"my-example-stepper\">\n <calcite-stepper-item item-title=\"Choose method\" item-subtitle=\"Add members without sending invitations\" complete>\n Step 1 Content Goes Here\n </calcite-stepper-item>\n <calcite-stepper-item item-title=\"Compile member list\" error> Step 2 Content Goes Here </calcite-stepper-item>\n <calcite-stepper-item item-title=\"Set member properties\" item-subtitle=\"Some subtext\" active>\n Step 3 Content Goes Here\n </calcite-stepper-item>\n <calcite-stepper-item item-title=\"Confirm and complete\" item-subtitle=\"Disabled example\" disabled>\n Step 4 Content Goes Here\n </calcite-stepper-item>\n</calcite-stepper>\n```\n"
- },
- "props": [
- {
- "name": "icon",
- "type": "boolean",
- "mutable": false,
- "attr": "icon",
- "reflectToAttr": true,
- "docs": "optionally display a status icon next to the step title",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "layout",
- "type": "\"grid\" | \"horizontal\" | \"vertical\"",
- "mutable": false,
- "attr": "layout",
- "reflectToAttr": true,
- "docs": "specify the layout of stepper, defaults to horizontal",
- "docsTags": [],
- "default": "\"horizontal\"",
- "values": [
- {
- "value": "grid",
- "type": "string"
- },
- {
- "value": "horizontal",
- "type": "string"
- },
- {
- "value": "vertical",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "numbered",
- "type": "boolean",
- "mutable": false,
- "attr": "numbered",
- "reflectToAttr": true,
- "docs": "optionally display the number next to the step title",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "specify the scale of stepper, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "endStep",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "endStep() => Promise<void>",
- "parameters": [],
- "docs": "set the last step as active",
- "docsTags": []
- },
- {
- "name": "goToStep",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "goToStep(step: number) => Promise<void>",
- "parameters": [],
- "docs": "set the requested step as active",
- "docsTags": []
- },
- {
- "name": "nextStep",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "nextStep() => Promise<void>",
- "parameters": [],
- "docs": "set the next step as active",
- "docsTags": []
- },
- {
- "name": "prevStep",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "prevStep() => Promise<void>",
- "parameters": [],
- "docs": "set the previous step as active",
- "docsTags": []
- },
- {
- "name": "startStep",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "startStep() => Promise<void>",
- "parameters": [],
- "docs": "set the first step as active",
- "docsTags": []
- }
- ],
- "events": [],
- "listeners": [
- {
- "event": "calciteStepperItemKeyEvent",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteStepperItemRegister",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteStepperItemSelect",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-stepper-item`s."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/stepper-item/stepper-item.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-stepper-item",
- "readme": "# calcite-stepper-item\n\nindividual `calcite-stepper-item` item\n",
- "docs": "individual `calcite-stepper-item` item",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding custom content."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": true,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "is the step active",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "complete",
- "type": "boolean",
- "mutable": false,
- "attr": "complete",
- "reflectToAttr": true,
- "docs": "has the step been completed",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "is the step disabled and not navigable to by a user",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "error",
- "type": "boolean",
- "mutable": false,
- "attr": "error",
- "reflectToAttr": false,
- "docs": "does the step contain an error that needs to be resolved by the user",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "itemSubtitle",
- "type": "string",
- "mutable": false,
- "attr": "item-subtitle",
- "reflectToAttr": false,
- "docs": "pass a title for the stepper item",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "itemTitle",
- "type": "string",
- "mutable": false,
- "attr": "item-title",
- "reflectToAttr": false,
- "docs": "pass a title for the stepper item",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [
- {
- "event": "calciteStepperItemChange",
- "target": "body",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding custom content."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-stepper-item": [
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/switch/switch.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-switch",
- "readme": "# calcite-switch\n\n`calcite-switch` is used to toggle a value on or off.\n",
- "docs": "`calcite-switch` is used to toggle a value on or off.",
- "docsTags": [],
- "usage": {
- "Basic": "```html\n<label> <calcite-switch checked></calcite-switch> Switch is on </label>\n```\n"
- },
- "props": [
- {
- "name": "checked",
- "type": "boolean",
- "mutable": true,
- "attr": "checked",
- "reflectToAttr": true,
- "docs": "True if the switch is initially on",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "True if the switch is disabled",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "Applies to the aria-label attribute on the switch",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "name",
- "type": "string",
- "mutable": false,
- "attr": "name",
- "reflectToAttr": true,
- "docs": "The name of the switch input",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "The scale of the switch",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "switched",
- "type": "boolean",
- "mutable": true,
- "attr": "switched",
- "reflectToAttr": false,
- "docs": "True if the switch is initially on",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use 'checked' instead."
- }
- ],
- "default": "false",
- "deprecation": "use 'checked' instead.",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "any",
- "mutable": false,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "The value of the switch input",
- "docsTags": [],
- "values": [
- {
- "type": "any"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteSwitchChange",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fires when the checked value has changed.",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [
- "calcite-block-section"
- ],
- "dependencies": [],
- "dependencyGraph": {
- "calcite-block-section": [
- "calcite-switch"
- ]
- }
- },
- {
- "filePath": "./src/components/tab/tab.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-tab",
- "readme": "# calcite-tab\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding custom content."
- }
- ],
- "usage": {
- "Basic": "`calcite-tab` wraps the content you would like to appear when that tab is selected:\n\n```html\n<calcite-tab>My stuff!</calcite-tab>\n```\n"
- },
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": true,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "Show this tab",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "tab",
- "type": "string",
- "mutable": false,
- "attr": "tab",
- "reflectToAttr": true,
- "docs": "Optionally include a unique name for this tab,\nbe sure to also set this name on the associated title.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "getTabIndex",
- "returns": {
- "type": "Promise<number>",
- "docs": ""
- },
- "signature": "getTabIndex() => Promise<number>",
- "parameters": [],
- "docs": "Return the index of this tab within the tab array",
- "docsTags": []
- }
- ],
- "events": [],
- "listeners": [
- {
- "event": "calciteInternalTabChange",
- "target": "body",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding custom content."
- }
- ],
- "parts": [],
- "dependents": [
- "calcite-color-picker"
- ],
- "dependencies": [],
- "dependencyGraph": {
- "calcite-color-picker": [
- "calcite-tab"
- ]
- }
- },
- {
- "filePath": "./src/components/tab-nav/tab-nav.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-tab-nav",
- "readme": "# calcite-tab-nav\n\nThe tab-nav groups several [calcite-tab-title](../tab-title) components and builds out the navigation. You can optionally use attibutes on the tab-nav to configure client side storage of the selected tab.\n",
- "docs": "The tab-nav groups several [calcite-tab-title](../tab-title) components and builds out the navigation. You can optionally use attibutes on the tab-nav to configure client side storage of the selected tab.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-tab-title`s."
- }
- ],
- "usage": {
- "Basic": "When tab-nav is the only parent, tab-title can inherit its `scale` and `position` from tab-nav:\n\n```html\n<calcite-tab-nav scale=\"l\" position=\"below\">\n <calcite-tab-title>Layers</calcite-tab-title>\n <calcite-tab-title>Maps</calcite-tab-title>\n <calcite-tab-title active>Data</calcite-tab-title>\n</calcite-tab-nav>\n```\n"
- },
- "props": [
- {
- "name": "storageId",
- "type": "string",
- "mutable": false,
- "attr": "storage-id",
- "reflectToAttr": false,
- "docs": "Name to use when saving selected tab data to localStorage",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "syncId",
- "type": "string",
- "mutable": false,
- "attr": "sync-id",
- "reflectToAttr": false,
- "docs": "Pass the same string to multiple tab navs to keep them all in sync if one changes",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [
- {
- "event": "calciteTabChange",
- "detail": "TabChangeEventDetail",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the active tab changes",
- "docsTags": [
- {
- "name": "see",
- "text": "[TabChangeEventDetail](https://github.com/Esri/calcite-components/blob/master/src/components/tab/interfaces.ts#L1)"
- }
- ]
- }
- ],
- "listeners": [
- {
- "event": "calciteTabsFocusPrevious",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteTabsFocusNext",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteInternalTabsActivate",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteTabsActivate",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteTabTitleRegister",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteInternalTabChange",
- "target": "body",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-tab-title`s."
- }
- ],
- "parts": [],
- "dependents": [
- "calcite-color-picker"
- ],
- "dependencies": [],
- "dependencyGraph": {
- "calcite-color-picker": [
- "calcite-tab-nav"
- ]
- }
- },
- {
- "filePath": "./src/components/tab-title/tab-title.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-tab-title",
- "readme": "# calcite-tab-title\n\nThe tab-title is the link that switches between panes in [calcite-tabs](../tabs).\n",
- "docs": "The tab-title is the link that switches between panes in [calcite-tabs](../tabs).",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding text."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": true,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "Show this tab title as selected",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "Disable this tab title",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "iconEnd",
- "type": "string",
- "mutable": false,
- "attr": "icon-end",
- "reflectToAttr": true,
- "docs": "optionally pass an icon to display at the end of a tab title - accepts calcite ui icon names",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "iconFlipRtl",
- "type": "\"both\" | \"end\" | \"start\"",
- "mutable": false,
- "attr": "icon-flip-rtl",
- "reflectToAttr": true,
- "docs": "flip the icon(s) in rtl",
- "docsTags": [],
- "values": [
- {
- "value": "both",
- "type": "string"
- },
- {
- "value": "end",
- "type": "string"
- },
- {
- "value": "start",
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "iconStart",
- "type": "string",
- "mutable": false,
- "attr": "icon-start",
- "reflectToAttr": true,
- "docs": "optionally pass an icon to display at the start of a tab title - accepts calcite ui icon names",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "tab",
- "type": "string",
- "mutable": false,
- "attr": "tab",
- "reflectToAttr": true,
- "docs": "Optionally include a unique name for the tab title,\nbe sure to also set this name on the associated tab.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "getTabIndex",
- "returns": {
- "type": "Promise<number>",
- "docs": ""
- },
- "signature": "getTabIndex() => Promise<number>",
- "parameters": [],
- "docs": "Return the index of this title within the nav",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteTabsActivate",
- "detail": "TabChangeEventDetail",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Fires when a specific tab is activated. Emits the \"tab\" property or the index position.",
- "docsTags": [
- {
- "name": "see",
- "text": "[TabChangeEventDetail](https://github.com/Esri/calcite-components/blob/master/src/components/tab/interfaces.ts#L1)"
- }
- ]
- }
- ],
- "listeners": [
- {
- "event": "calciteInternalTabChange",
- "target": "body",
- "capture": false,
- "passive": false
- },
- {
- "event": "click",
- "capture": false,
- "passive": false
- },
- {
- "event": "keydown",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding text."
- }
- ],
- "parts": [],
- "dependents": [
- "calcite-color-picker"
- ],
- "dependencies": [
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-tab-title": [
- "calcite-icon"
- ],
- "calcite-color-picker": [
- "calcite-tab-title"
- ]
- }
- },
- {
- "filePath": "./src/components/tabs/tabs.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-tabs",
- "readme": "# calcite-tabs\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-tab`s."
- },
- {
- "name": "slot",
- "text": "tab-nav - A slot for adding a tab navigation component."
- }
- ],
- "usage": {
- "Basic": "`calcite-tabs` uses several sub-components ([calcite-tab-nav](../tab-nav), [calcite-tab](../tab), [calcite-tab-title](../tab-title)) to create a tabbed interface with optional client side storage. Place your content inside of the `<calcite-tab>` element:\n\n```html\n<calcite-tabs>\n <calcite-tab-nav slot=\"tab-nav\">\n <calcite-tab-title active>Tab 1 Title</calcite-tab-title>\n <calcite-tab-title>Tab 2 Title</calcite-tab-title>\n </calcite-tab-nav>\n\n <calcite-tab active>Tab 1 Content</calcite-tab>\n <calcite-tab>Tab 2 Content</calcite-tab>\n</calcite-tabs>\n```\n",
- "Bordered": "```html\n<calcite-tabs bordered>\n <calcite-tab-nav slot=\"tab-nav\">\n <calcite-tab-title tab=\"tab1\">Tab 1 Title</calcite-tab-title>\n <calcite-tab-title tab=\"tab2\">Tab 2 Title</calcite-tab-title>\n <calcite-tab-title tab=\"tab3\">Tab 3 Title</calcite-tab-title>\n <calcite-tab-title tab=\"tab4\" active>Tab 4 Title</calcite-tab-title>\n </calcite-tab-nav>\n <calcite-tab tab=\"tab1\">Tab 1 Content</calcite-tab>\n <calcite-tab tab=\"tab2\">Tab 2 Content</calcite-tab>\n <calcite-tab tab=\"tab3\">Tab 3 Content</calcite-tab>\n <calcite-tab tab=\"tab4\" active>Tab 4 Content</calcite-tab>\n</calcite-tabs>\n```\n"
- },
- "props": [
- {
- "name": "bordered",
- "type": "boolean",
- "mutable": true,
- "attr": "bordered",
- "reflectToAttr": true,
- "docs": "Optionally enable tabs to appear like a folder-style menu when its layout is \"inline\"",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "layout",
- "type": "\"center\" | \"inline\"",
- "mutable": false,
- "attr": "layout",
- "reflectToAttr": true,
- "docs": "Align tab titles to the edge or fully justify them across the tab nav (\"center\")",
- "docsTags": [],
- "default": "\"inline\"",
- "values": [
- {
- "value": "center",
- "type": "string"
- },
- {
- "value": "inline",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "position",
- "type": "\"above\" | \"below\"",
- "mutable": false,
- "attr": "position",
- "reflectToAttr": true,
- "docs": "Display the tabs above (default) or below the tab content",
- "docsTags": [],
- "default": "\"above\"",
- "values": [
- {
- "value": "above",
- "type": "string"
- },
- {
- "value": "below",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "Specify the scale of the tabs component, defaults to m",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [
- {
- "event": "calciteTabTitleRegister",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteTabTitleUnregister",
- "target": "body",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteTabRegister",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteTabUnregister",
- "target": "body",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-tab`s."
- },
- {
- "name": "tab-nav",
- "docs": "A slot for adding a tab navigation component."
- }
- ],
- "parts": [],
- "dependents": [
- "calcite-color-picker"
- ],
- "dependencies": [],
- "dependencyGraph": {
- "calcite-color-picker": [
- "calcite-tabs"
- ]
- }
- },
- {
- "filePath": "./src/components/tile/tile.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-tile",
- "readme": "# calcite-tile\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "content-start - A slot for adding non-actionable elements before the tile content."
- },
- {
- "name": "slot",
- "text": "content-end - A slot for adding non-actionable elements after the tile content."
- }
- ],
- "usage": {
- "Basic": "```html\n<calcite-tile\n description=\"Leverage agile frameworks to provide a robust synopsis for high level overviews. Iterative approaches to corporate strategy foster collab on thinking to further the overall.\"\n heading=\"Tile heading lorem ipsum\"\n href=\"#\"\n icon=\"images\"\n></calcite-tile>\n```\n"
- },
- "props": [
- {
- "name": "active",
- "type": "boolean",
- "mutable": false,
- "attr": "active",
- "reflectToAttr": true,
- "docs": "The active state of the tile.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "description",
- "type": "string",
- "mutable": false,
- "attr": "description",
- "reflectToAttr": true,
- "docs": "The description text that appears beneath the heading of the tile.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, prevents interaction.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "embed",
- "type": "boolean",
- "mutable": false,
- "attr": "embed",
- "reflectToAttr": true,
- "docs": "The embed mode of the tile. When true, renders without a border and padding for use by other components.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "heading",
- "type": "string",
- "mutable": false,
- "attr": "heading",
- "reflectToAttr": true,
- "docs": "The heading text that appears between the icon and description of the tile.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "hidden",
- "type": "boolean",
- "mutable": false,
- "attr": "hidden",
- "reflectToAttr": true,
- "docs": "The hidden state of the tile.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "href",
- "type": "string",
- "mutable": false,
- "attr": "href",
- "reflectToAttr": true,
- "docs": "The (optional) url for the tile. (Only applies when embed is set to false)",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "icon",
- "type": "string",
- "mutable": false,
- "attr": "icon",
- "reflectToAttr": true,
- "docs": "The icon that appears at the top of the tile.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "content-end",
- "docs": "A slot for adding non-actionable elements after the tile content."
- },
- {
- "name": "content-start",
- "docs": "A slot for adding non-actionable elements before the tile content."
- }
- ],
- "parts": [],
- "dependents": [
- "calcite-tile-select"
- ],
- "dependencies": [
- "calcite-icon",
- "calcite-link"
- ],
- "dependencyGraph": {
- "calcite-tile": [
- "calcite-icon",
- "calcite-link"
- ],
- "calcite-link": [
- "calcite-icon"
- ],
- "calcite-tile-select": [
- "calcite-tile"
- ]
- }
- },
- {
- "filePath": "./src/components/tile-select/tile-select.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-tile-select",
- "readme": "# calcite-tile-select\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding custom content."
- }
- ],
- "usage": {
- "Basic": "```html\n<calcite-tile-select\n checked\n input-enabled\n description=\"Leverage agile frameworks to provide a robust synopsis for high level overviews. Iterative approaches to corporate strategy foster collab on thinking to further the overall.\"\n heading=\"Tile heading lorem ipsum\"\n icon=\"layer\"\n input-alignment=\"end\"\n type=\"radio\"\n value=\"one\"\n></calcite-tile-select>\n```\n"
- },
- "props": [
- {
- "name": "checked",
- "type": "boolean",
- "mutable": true,
- "attr": "checked",
- "reflectToAttr": true,
- "docs": "The checked state of the tile select.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "description",
- "type": "string",
- "mutable": false,
- "attr": "description",
- "reflectToAttr": true,
- "docs": "The description text that appears beneath the heading of the tile.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "The disabled state of the tile select.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "heading",
- "type": "string",
- "mutable": false,
- "attr": "heading",
- "reflectToAttr": true,
- "docs": "The heading text that appears between the icon and description of the tile.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "hidden",
- "type": "boolean",
- "mutable": false,
- "attr": "hidden",
- "reflectToAttr": true,
- "docs": "The hidden state of the tile select.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "icon",
- "type": "string",
- "mutable": false,
- "attr": "icon",
- "reflectToAttr": true,
- "docs": "The icon that appears at the top of the tile.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "inputAlignment",
- "type": "\"end\" | \"start\"",
- "mutable": false,
- "attr": "input-alignment",
- "reflectToAttr": true,
- "docs": "The side of the tile that the radio or checkbox appears on when inputEnabled is true.",
- "docsTags": [],
- "default": "\"start\"",
- "values": [
- {
- "value": "end",
- "type": "string"
- },
- {
- "value": "start",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "inputEnabled",
- "type": "boolean",
- "mutable": false,
- "attr": "input-enabled",
- "reflectToAttr": true,
- "docs": "Display an interactive radio or checkbox.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "name",
- "type": "any",
- "mutable": false,
- "attr": "name",
- "reflectToAttr": true,
- "docs": "The name of the tile select. This name will appear in form submissions as either a radio or checkbox identifier based on the `type` property.",
- "docsTags": [],
- "values": [
- {
- "type": "any"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "type",
- "type": "\"checkbox\" | \"radio\"",
- "mutable": false,
- "attr": "type",
- "reflectToAttr": true,
- "docs": "The selection mode of the tile select: radio (single) or checkbox (multiple).",
- "docsTags": [],
- "default": "\"radio\"",
- "values": [
- {
- "value": "checkbox",
- "type": "string"
- },
- {
- "value": "radio",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "any",
- "mutable": false,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "The value of the tile select. This value will appear in form submissions when this tile select is checked.",
- "docsTags": [],
- "values": [
- {
- "type": "any"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "width",
- "type": "\"auto\" | \"full\"",
- "mutable": false,
- "attr": "width",
- "reflectToAttr": true,
- "docs": "specify the width of the tile, defaults to auto",
- "docsTags": [],
- "default": "\"auto\"",
- "values": [
- {
- "value": "auto",
- "type": "string"
- },
- {
- "value": "full",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteTileSelectChange",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emits a custom change event. For checkboxes, it emits when the checkbox is checked or unchecked. For radios it only emits when it is checked.",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "calciteCheckboxChange",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteInternalCheckboxFocus",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteInternalCheckboxBlur",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteRadioButtonChange",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteInternalRadioButtonCheckedChange",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteInternalRadioButtonFocus",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteInternalRadioButtonBlur",
- "capture": false,
- "passive": false
- },
- {
- "event": "click",
- "capture": false,
- "passive": false
- },
- {
- "event": "mouseenter",
- "capture": false,
- "passive": true
- },
- {
- "event": "mouseleave",
- "capture": false,
- "passive": true
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding custom content."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-tile"
- ],
- "dependencyGraph": {
- "calcite-tile-select": [
- "calcite-tile"
- ],
- "calcite-tile": [
- "calcite-icon",
- "calcite-link"
- ],
- "calcite-link": [
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/tile-select-group/tile-select-group.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-tile-select-group",
- "readme": "# calcite-tile-select-group\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-tile-select`s."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "The disabled state of the tile select.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "layout",
- "type": "\"horizontal\" | \"vertical\"",
- "mutable": false,
- "attr": "layout",
- "reflectToAttr": true,
- "docs": "Tiles by default move horizontally, stacking with each row, vertical allows single-column layouts",
- "docsTags": [],
- "default": "\"horizontal\"",
- "values": [
- {
- "value": "horizontal",
- "type": "string"
- },
- {
- "value": "vertical",
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-tile-select`s."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/time-picker/time-picker.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-time-picker",
- "readme": "# calcite-time-picker\n",
- "docs": "",
- "docsTags": [],
- "usage": {},
- "props": [
- {
- "name": "intlHour",
- "type": "string",
- "mutable": false,
- "attr": "intl-hour",
- "reflectToAttr": false,
- "docs": "aria-label for the hour input",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Hour\""
- }
- ],
- "default": "TEXT.hour",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlHourDown",
- "type": "string",
- "mutable": false,
- "attr": "intl-hour-down",
- "reflectToAttr": false,
- "docs": "aria-label for the hour down button",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Decrease hour\""
- }
- ],
- "default": "TEXT.hourDown",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlHourUp",
- "type": "string",
- "mutable": false,
- "attr": "intl-hour-up",
- "reflectToAttr": false,
- "docs": "aria-label for the hour up button",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Increase hour\""
- }
- ],
- "default": "TEXT.hourUp",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlMeridiem",
- "type": "string",
- "mutable": false,
- "attr": "intl-meridiem",
- "reflectToAttr": false,
- "docs": "aria-label for the meridiem (am/pm) input",
- "docsTags": [
- {
- "name": "default",
- "text": "\"AM/PM\""
- }
- ],
- "default": "TEXT.meridiem",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlMeridiemDown",
- "type": "string",
- "mutable": false,
- "attr": "intl-meridiem-down",
- "reflectToAttr": false,
- "docs": "aria-label for the meridiem (am/pm) down button",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Decrease AM/PM\""
- }
- ],
- "default": "TEXT.meridiemDown",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlMeridiemUp",
- "type": "string",
- "mutable": false,
- "attr": "intl-meridiem-up",
- "reflectToAttr": false,
- "docs": "aria-label for the meridiem (am/pm) up button",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Increase AM/PM\""
- }
- ],
- "default": "TEXT.meridiemUp",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlMinute",
- "type": "string",
- "mutable": false,
- "attr": "intl-minute",
- "reflectToAttr": false,
- "docs": "aria-label for the minute input",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Minute\""
- }
- ],
- "default": "TEXT.minute",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlMinuteDown",
- "type": "string",
- "mutable": false,
- "attr": "intl-minute-down",
- "reflectToAttr": false,
- "docs": "aria-label for the minute down button",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Decrease minute\""
- }
- ],
- "default": "TEXT.minuteDown",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlMinuteUp",
- "type": "string",
- "mutable": false,
- "attr": "intl-minute-up",
- "reflectToAttr": false,
- "docs": "aria-label for the minute up button",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Increase minute\""
- }
- ],
- "default": "TEXT.minuteUp",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlSecond",
- "type": "string",
- "mutable": false,
- "attr": "intl-second",
- "reflectToAttr": false,
- "docs": "aria-label for the second input",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Second\""
- }
- ],
- "default": "TEXT.second",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlSecondDown",
- "type": "string",
- "mutable": false,
- "attr": "intl-second-down",
- "reflectToAttr": false,
- "docs": "aria-label for the second down button",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Decrease second\""
- }
- ],
- "default": "TEXT.secondDown",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlSecondUp",
- "type": "string",
- "mutable": false,
- "attr": "intl-second-up",
- "reflectToAttr": false,
- "docs": "aria-label for the second up button",
- "docsTags": [
- {
- "name": "default",
- "text": "\"Increase second\""
- }
- ],
- "default": "TEXT.secondUp",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": false,
- "attr": "scale",
- "reflectToAttr": false,
- "docs": "The scale (size) of the time picker",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "step",
- "type": "number",
- "mutable": false,
- "attr": "step",
- "reflectToAttr": false,
- "docs": "number (seconds) that specifies the granularity that the value must adhere to",
- "docsTags": [],
- "default": "60",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "string",
- "mutable": true,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "The selected time in UTC (always 24-hour format)",
- "docsTags": [],
- "default": "null",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus(target: TimePart) => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [],
- "listeners": [
- {
- "event": "blur",
- "capture": false,
- "passive": false
- },
- {
- "event": "focus",
- "capture": false,
- "passive": false
- },
- {
- "event": "keydown",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [],
- "parts": [],
- "dependents": [
- "calcite-input-time-picker"
- ],
- "dependencies": [
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-time-picker": [
- "calcite-icon"
- ],
- "calcite-input-time-picker": [
- "calcite-time-picker"
- ]
- }
- },
- {
- "filePath": "./src/components/tip/tip.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-tip",
- "readme": "# calcite-tip\n\nThe `calcite-tip` component can comprise of an image, text and hyperlink to give helpful hints to a user about using the platform.\n",
- "docs": "The `calcite-tip` component can comprise of an image, text and hyperlink to give helpful hints to a user about using the platform.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding text and a hyperlink."
- },
- {
- "name": "slot",
- "text": "thumbnail - A slot for adding an HTML image element to the tip."
- }
- ],
- "usage": {
- "Basic": "Renders a non-dismissible tip with a heading, thumbnail, info and a link.\n\n```html\n<calcite-tip non-dismissible heading=\"Celestial Bodies!\">\n <img slot=\"thumbnail\" src=\"https://placeimg.com/1000/600\" alt=\"This is an image of nature.\" />\n <p>Normal tip with a landscape or square image and a small amount of text in the \"info\" slot.</p>\n <a href=\"http://www.esri.com\">Put a link hurr!</a>\n</calcite-tip>\n```\n"
- },
- "props": [
- {
- "name": "dismissed",
- "type": "boolean",
- "mutable": true,
- "attr": "dismissed",
- "reflectToAttr": true,
- "docs": "No longer displays the tip.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "heading",
- "type": "string",
- "mutable": false,
- "attr": "heading",
- "reflectToAttr": false,
- "docs": "The heading of the tip.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "headingLevel",
- "type": "1 | 2 | 3 | 4 | 5 | 6",
- "mutable": false,
- "attr": "heading-level",
- "reflectToAttr": false,
- "docs": "Number at which section headings should start for this component.",
- "docsTags": [],
- "values": [
- {
- "value": "1",
- "type": "number"
- },
- {
- "value": "2",
- "type": "number"
- },
- {
- "value": "3",
- "type": "number"
- },
- {
- "value": "4",
- "type": "number"
- },
- {
- "value": "5",
- "type": "number"
- },
- {
- "value": "6",
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlClose",
- "type": "string",
- "mutable": false,
- "attr": "intl-close",
- "reflectToAttr": false,
- "docs": "Alternate text for closing the tip.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "nonDismissible",
- "type": "boolean",
- "mutable": false,
- "attr": "non-dismissible",
- "reflectToAttr": true,
- "docs": "Indicates whether the tip can be dismissed.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selected",
- "type": "boolean",
- "mutable": false,
- "attr": "selected",
- "reflectToAttr": true,
- "docs": "The selected state of the tip if it is being used inside a `calcite-tip-manager`.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [
- {
- "event": "calciteTipDismiss",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the component has been dismissed.",
- "docsTags": []
- }
- ],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding text and a hyperlink."
- },
- {
- "name": "thumbnail",
- "docs": "A slot for adding an HTML image element to the tip."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-action"
- ],
- "dependencyGraph": {
- "calcite-tip": [
- "calcite-action"
- ],
- "calcite-action": [
- "calcite-loader",
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/tip-group/tip-group.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-tip-group",
- "readme": "# calcite-tip-group\n\n`calcite-tip-group` is a wrapper for multiple `calcite-tip`s and is housed in `calcite-tip-manager`.\n",
- "docs": "`calcite-tip-group` is a wrapper for multiple `calcite-tip`s and is housed in `calcite-tip-manager`.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-tip`s."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "groupTitle",
- "type": "string",
- "mutable": false,
- "attr": "group-title",
- "reflectToAttr": false,
- "docs": "The title used for all nested tips.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-tip`s."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/tip-manager/tip-manager.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-tip-manager",
- "readme": "# calcite-tip-manager\n\nThe `calcite-tip-manager` component contains multiple `calcite-tip`s that a user can view through via interactive arrows to go back and forth through the tips in the deck.\n",
- "docs": "The `calcite-tip-manager` component contains multiple `calcite-tip`s that a user can view through via interactive arrows to go back and forth through the tips in the deck.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding `calcite-tip`s."
- }
- ],
- "usage": {
- "Basic": "Renders a tip manager using a group of tips as well as a single tip.\n\n```html\n<calcite-tip-manager>\n <calcite-tip-group group-title=\"Tip Manager heading\">\n <calcite-tip heading=\"Tip heading\" selected>\n <img slot=\"thumbnail\" src=\"https://placeimg.com/200/200\" alt=\"This is an image.\" />\n <p>\n Tip description lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut\n labore et dolore magna aliqua.\n </p>\n <p>\n This is another slotted paragraph. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut\n aliquip ex ea commodo consequat.\n </p>\n <calcite-link href=\"https://www.esri.com\" target=\"_blank\" rel=\"noopener noreferrer\">A calcite-link</calcite-link>\n </calcite-tip>\n <calcite-tip heading=\"The Long Trees\" hidden>\n <img slot=\"thumbnail\" src=\"https://placeimg.com/200/200\" alt=\"This is an image.\" />\n <p>This tip has an image that is a pretty tall. And the text will run out before the end of the image.</p>\n <p>In astronomy, the terms object and body are often used interchangeably.</p>\n <calcite-link href=\"https://www.esri.com\" target=\"_blank\" rel=\"noopener noreferrer\">A calcite-link</calcite-link>\n </calcite-tip>\n </calcite-tip-group>\n <calcite-tip heading=\"Square Nature\" hidden>\n <img slot=\"thumbnail\" src=\"https://placeimg.com/200/200\" alt=\"This is an image.\" />\n <p>This tip has an image that is square. And the text will run out before the end of the image.</p>\n <p>In astronomy, the terms object and body are often used interchangeably.</p>\n <p>\n In publishing and graphic design, Lorem ipsum is a placeholder text commonly used to demonstrate the visual form\n of a document without relying on meaningful content (also called greeking). Replacing the actual content with\n placeholder text allows designers to design the form of the content before the content itself has been produced.\n </p>\n <calcite-link href=\"https://www.esri.com\" target=\"_blank\" rel=\"noopener noreferrer\">A calcite-link</calcite-link>\n </calcite-tip>\n <calcite-tip heading=\"The lack of imagery\" hidden>\n <p>This tip has no image. As such, the content area will take up the entire width of the tip.</p>\n <p>\n This is the next paragraph and should show how wide the content area is now. Of course, the width of the overall\n tip will affect things. In astronomy, the terms object and body are often used interchangeably.\n </p>\n <calcite-link href=\"https://www.esri.com\" target=\"_blank\" rel=\"noopener noreferrer\">A calcite-link</calcite-link>\n </calcite-tip>\n</calcite-tip-manager>\n```\n"
- },
- "props": [
- {
- "name": "closed",
- "type": "boolean",
- "mutable": true,
- "attr": "closed",
- "reflectToAttr": true,
- "docs": "Closed state of the `calcite-tip-manager`.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "headingLevel",
- "type": "1 | 2 | 3 | 4 | 5 | 6",
- "mutable": false,
- "attr": "heading-level",
- "reflectToAttr": false,
- "docs": "Number at which section headings should start for this component.",
- "docsTags": [],
- "values": [
- {
- "value": "1",
- "type": "number"
- },
- {
- "value": "2",
- "type": "number"
- },
- {
- "value": "3",
- "type": "number"
- },
- {
- "value": "4",
- "type": "number"
- },
- {
- "value": "5",
- "type": "number"
- },
- {
- "value": "6",
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "intlClose",
- "type": "string",
- "mutable": false,
- "attr": "intl-close",
- "reflectToAttr": false,
- "docs": "Alternate text for closing the tip.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlDefaultTitle",
- "type": "string",
- "mutable": false,
- "attr": "intl-default-title",
- "reflectToAttr": false,
- "docs": "The default group title for the `calcite-tip-manager`.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlNext",
- "type": "string",
- "mutable": false,
- "attr": "intl-next",
- "reflectToAttr": false,
- "docs": "Alternate text for navigating to the next tip.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlPaginationLabel",
- "type": "string",
- "mutable": false,
- "attr": "intl-pagination-label",
- "reflectToAttr": false,
- "docs": "Label that appears on hover of pagination icon.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "intlPrevious",
- "type": "string",
- "mutable": false,
- "attr": "intl-previous",
- "reflectToAttr": false,
- "docs": "Alternate text for navigating to the previous tip.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "nextTip",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "nextTip() => Promise<void>",
- "parameters": [],
- "docs": "Selects the next tip to display",
- "docsTags": []
- },
- {
- "name": "previousTip",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "previousTip() => Promise<void>",
- "parameters": [],
- "docs": "Selects the previous tip to display",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteTipManagerClose",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the `calcite-tip-manager` has been closed.",
- "docsTags": []
- },
- {
- "event": "calciteTipManagerToggle",
- "detail": "any",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emitted when the `calcite-tip-manager` has been toggled open or closed.",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "use calciteTipManagerClose instead."
- }
- ],
- "deprecation": "use calciteTipManagerClose instead."
- }
- ],
- "listeners": [],
- "styles": [
- {
- "name": "--calcite-tip-manager-height",
- "annotation": "prop",
- "docs": "the maximum height of the tip-manager"
- },
- {
- "name": "--calcite-tip-max-width",
- "annotation": "prop",
- "docs": "the maximum width of a slotted tip within tip-manager"
- }
- ],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding `calcite-tip`s."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-action",
- "calcite-icon"
- ],
- "dependencyGraph": {
- "calcite-tip-manager": [
- "calcite-action",
- "calcite-icon"
- ],
- "calcite-action": [
- "calcite-loader",
- "calcite-icon"
- ]
- }
- },
- {
- "filePath": "./src/components/tooltip/tooltip.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-tooltip",
- "readme": "# calcite-tooltip\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding text."
- }
- ],
- "usage": {
- "Basic": "```html\n<calcite-tooltip placement=\"auto\" reference-element=\"tooltip-button\"\n >This is the message of the tooltip</calcite-tooltip\n>\n<p>\n Lorem <a id=\"tooltip-button\" href=\"#\">ipsum</a> dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor\n incididunt ut labore et dolore magna aliqua.\n</p>\n```\n"
- },
- "props": [
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": false,
- "docs": "Accessible name for the component",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": true
- },
- {
- "name": "offsetDistance",
- "type": "number",
- "mutable": false,
- "attr": "offset-distance",
- "reflectToAttr": true,
- "docs": "Offset the position of the tooltip away from the reference element.",
- "docsTags": [
- {
- "name": "default",
- "text": "6"
- }
- ],
- "default": "defaultOffsetDistance",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "offsetSkidding",
- "type": "number",
- "mutable": false,
- "attr": "offset-skidding",
- "reflectToAttr": true,
- "docs": "Offset the position of the tooltip along the reference element.",
- "docsTags": [],
- "default": "0",
- "values": [
- {
- "type": "number"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "open",
- "type": "boolean",
- "mutable": false,
- "attr": "open",
- "reflectToAttr": true,
- "docs": "Display and position the component.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "overlayPositioning",
- "type": "\"absolute\" | \"fixed\"",
- "mutable": false,
- "attr": "overlay-positioning",
- "reflectToAttr": false,
- "docs": "Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value.",
- "docsTags": [],
- "default": "\"absolute\"",
- "values": [
- {
- "value": "absolute",
- "type": "string"
- },
- {
- "value": "fixed",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "placement",
- "type": "Placement | PlacementRtl | VariationRtl",
- "mutable": false,
- "attr": "placement",
- "reflectToAttr": true,
- "docs": "Determines where the component will be positioned relative to the referenceElement.",
- "docsTags": [
- {
- "name": "see",
- "text": "[PopperPlacement](https://github.com/Esri/calcite-components/blob/master/src/utils/popper.ts#L25)"
- }
- ],
- "default": "\"auto\"",
- "values": [
- {
- "type": "Placement"
- },
- {
- "type": "PlacementRtl"
- },
- {
- "type": "VariationRtl"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "referenceElement",
- "type": "HTMLElement | string",
- "mutable": false,
- "attr": "reference-element",
- "reflectToAttr": false,
- "docs": "Reference HTMLElement used to position this component according to the placement property. As a convenience, a string ID of the reference element can be used. However, setting this property to use an HTMLElement is preferred so that the component does not need to query the DOM for the referenceElement.",
- "docsTags": [],
- "values": [
- {
- "type": "HTMLElement"
- },
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "reposition",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "reposition() => Promise<void>",
- "parameters": [],
- "docs": "Updates the position of the component.",
- "docsTags": []
- }
- ],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding text."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/tooltip-manager/tooltip-manager.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-tooltip-manager",
- "readme": "# calcite-tooltip-manager\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding elements that reference a 'calcite-tooltip' by the 'selector' property."
- },
- {
- "name": "deprecated",
- "text": "No longer required for tooltip usage."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "selector",
- "type": "string",
- "mutable": false,
- "attr": "selector",
- "reflectToAttr": false,
- "docs": "CSS Selector to match reference elements for tooltips. Reference elements will be identified by this selector in order to open their associated tooltip.",
- "docsTags": [
- {
- "name": "default",
- "text": "`[data-calcite-tooltip-reference]`"
- }
- ],
- "default": "\"[data-calcite-tooltip-reference]\"",
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding elements that reference a 'calcite-tooltip' by the 'selector' property."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {},
- "deprecation": "No longer required for tooltip usage."
- },
- {
- "filePath": "./src/components/tree/tree.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-tree",
- "readme": "# calcite-tree\n",
- "docs": "",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for calcite-tree-item elements."
- }
- ],
- "usage": {
- "Basic": "`<calcite-tree>` can be used as a sidebar navigation tree with optional lines and different selection modes.\n\n```html\n<calcite-tree>\n <calcite-tree-item>\n <a href=\"#\">Child 1</a>\n <calcite-tree slot=\"children\">\n <calcite-tree-item>\n <a href=\"#\">Grandchild 1</a>\n </calcite-tree-item>\n <calcite-tree-item>\n <a href=\"#\">Grandchild 2</a>\n </calcite-tree-item>\n </calcite-tree>\n </calcite-tree-item>\n</calcite-tree>\n```\n"
- },
- "props": [
- {
- "name": "inputEnabled",
- "type": "boolean",
- "mutable": false,
- "attr": "input-enabled",
- "reflectToAttr": false,
- "docs": "Display input",
- "docsTags": [
- {
- "name": "deprecated",
- "text": "Use \"ancestors\" selection-mode for checkbox input."
- }
- ],
- "default": "false",
- "deprecation": "Use \"ancestors\" selection-mode for checkbox input.",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "lines",
- "type": "boolean",
- "mutable": true,
- "attr": "lines",
- "reflectToAttr": true,
- "docs": "Display indentation guide lines.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "scale",
- "type": "\"l\" | \"m\" | \"s\"",
- "mutable": true,
- "attr": "scale",
- "reflectToAttr": true,
- "docs": "Specify the scale of the tree.",
- "docsTags": [],
- "default": "\"m\"",
- "values": [
- {
- "value": "l",
- "type": "string"
- },
- {
- "value": "m",
- "type": "string"
- },
- {
- "value": "s",
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selectionMode",
- "type": "TreeSelectionMode.Ancestors | TreeSelectionMode.Children | TreeSelectionMode.Multi | TreeSelectionMode.MultiChildren | TreeSelectionMode.Single",
- "mutable": true,
- "attr": "selection-mode",
- "reflectToAttr": true,
- "docs": "Customize how tree selection works.",
- "docsTags": [
- {
- "name": "default",
- "text": "\"single\""
- },
- {
- "name": "see",
- "text": "[TreeSelectionMode](https://github.com/Esri/calcite-components/blob/master/src/components/tree/interfaces.ts#L5)"
- }
- ],
- "default": "TreeSelectionMode.Single",
- "values": [
- {
- "type": "TreeSelectionMode.Ancestors"
- },
- {
- "type": "TreeSelectionMode.Children"
- },
- {
- "type": "TreeSelectionMode.Multi"
- },
- {
- "type": "TreeSelectionMode.MultiChildren"
- },
- {
- "type": "TreeSelectionMode.Single"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [
- {
- "event": "calciteTreeSelect",
- "detail": "TreeSelectDetail",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emits when the user selects/deselects tree items. An object including an array of selected items will be passed in the event's \"detail\" property.",
- "docsTags": [
- {
- "name": "see",
- "text": "[TreeSelectDetail](https://github.com/Esri/calcite-components/blob/master/src/components/tree/interfaces.ts#L1)"
- }
- ]
- }
- ],
- "listeners": [
- {
- "event": "focus",
- "capture": false,
- "passive": false
- },
- {
- "event": "focusin",
- "capture": false,
- "passive": false
- },
- {
- "event": "focusout",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteTreeItemSelect",
- "capture": false,
- "passive": false
- },
- {
- "event": "keydown",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for calcite-tree-item elements."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [],
- "dependencyGraph": {}
- },
- {
- "filePath": "./src/components/tree-item/tree-item.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-tree-item",
- "readme": "# calcite-tree-item\n\n`<calcite-tree-item>` is used to represent a single item in a `<calcite-tree>`.\n",
- "docs": "`<calcite-tree-item>` is used to represent a single item in a `<calcite-tree>`.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding content to the item."
- },
- {
- "name": "slot",
- "text": "children - A slot for adding nested calcite-tree elements."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "expanded",
- "type": "boolean",
- "mutable": true,
- "attr": "expanded",
- "reflectToAttr": true,
- "docs": "Expanded state of the item.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selected",
- "type": "boolean",
- "mutable": true,
- "attr": "selected",
- "reflectToAttr": true,
- "docs": "Selected state of the item.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [],
- "events": [],
- "listeners": [
- {
- "event": "click",
- "capture": false,
- "passive": false
- },
- {
- "event": "keydown",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding content to the item."
- },
- {
- "name": "children",
- "docs": "A slot for adding nested calcite-tree elements."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-icon",
- "calcite-checkbox"
- ],
- "dependencyGraph": {
- "calcite-tree-item": [
- "calcite-icon",
- "calcite-checkbox"
- ]
- }
- },
- {
- "filePath": "./src/components/value-list/value-list.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-value-list",
- "readme": "# calcite-value-list\n\n`calcite-value-list` is housed in a panel and contains `calcite-value-list-item`s. The value list has options for drag and drop, label editing, and single or multi-select of items which can be done through shift+click.\n",
- "docs": "`calcite-value-list` is housed in a panel and contains `calcite-value-list-item`s. The value list has options for drag and drop, label editing, and single or multi-select of items which can be done through shift+click.",
- "docsTags": [
- {
- "name": "slot",
- "text": "- A slot for adding calcite-value-list-item elements. List items are displayed as a vertical list."
- },
- {
- "name": "slot",
- "text": "menu-actions - A slot for adding a button and menu combination for performing actions, such as sorting."
- }
- ],
- "usage": {
- "Basic": "Renders a value list with multiple items able to be selected and a filter.\n\n```html\n<calcite-value-list multiple filter-enabled>\n <calcite-value-list-item label=\"Dogs\" description=\"Man's best friend\" value=\"dogs\">\n <calcite-action slot=\"actions-end\" icon=\"plus\"></calcite-action>\n </calcite-value-list-item>\n <calcite-value-list-item label=\"Cats\" description=\"Independent and fluffy\" value=\"cats\">\n <calcite-action slot=\"actions-end\" icon=\"plus\"></calcite-action>\n </calcite-value-list-item>\n <calcite-value-list-item\n label=\"Fish. But not just any fish, a tiger fish caught live in the Atlantic Ocean while on vacation.\"\n description=\"Easy to care for.\"\n value=\"fish\"\n >\n <calcite-action slot=\"actions-end\" icon=\"plus\"></calcite-action>\n </calcite-value-list-item>\n</calcite-value-list>\n```\n",
- "Drag-and-drop": "Renders a value list with drag and drop capability between the items.\n\n```html\n<calcite-value-list drag-enabled>\n <calcite-value-list-item label=\"Rent\" description=\"Mortgage + housing costs\" value=\"rent\"> </calcite-value-list-item>\n <calcite-value-list-item label=\"Food\" description=\"its what you eat.\" value=\"food\"> </calcite-value-list-item>\n <calcite-value-list-item label=\"Utilities\" value=\"utilities\"> </calcite-value-list-item>\n <calcite-value-list-item label=\"Entertainment\" description=\"Toys and leisure\" value=\"entertainment\">\n </calcite-value-list-item>\n</calcite-value-list>\n```\n",
- "Label-editing-and-single-select": "Renders a value list with label editing and single select.\n\n```html\n<calcite-value-list label-editing-enabled>\n <calcite-value-list-item\n label=\"2018 Generation Alpha Population (Born 2017 or Later) [updated 2019-09-18]\"\n description=\"GENALPHACY\"\n value=\"GENALPHACY\"\n >\n </calcite-value-list-item>\n <calcite-value-list-item\n label=\"2010-2018 Households: Annual Growth Rate (Esri)\"\n description=\"HHGRW10CY-2019-09-18.001ZZYLKJ\"\n value=\"HHGRW10CY\"\n >\n </calcite-value-list-item>\n <calcite-value-list-item\n label=\"2010-2018 Households: Annual Growth Rate (Esri)\"\n description=\"HHGRW10CY-2019-09-18.001ZZYYZLKJ\"\n value=\"HHGRW10CY2\"\n >\n </calcite-value-list-item>\n</calcite-value-list>\n```\n"
- },
- "props": [
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, prevents user interaction. This state shows list items grayed out and with lower opacity.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "dragEnabled",
- "type": "boolean",
- "mutable": false,
- "attr": "drag-enabled",
- "reflectToAttr": true,
- "docs": "When true, list items are sortable via a draggable button.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "filterEnabled",
- "type": "boolean",
- "mutable": false,
- "attr": "filter-enabled",
- "reflectToAttr": true,
- "docs": "When true, an input appears at the top of the list that can be used by end users to filter list items.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "filterPlaceholder",
- "type": "string",
- "mutable": false,
- "attr": "filter-placeholder",
- "reflectToAttr": true,
- "docs": "Placeholder text for the filter's input field.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "group",
- "type": "string",
- "mutable": false,
- "attr": "group",
- "reflectToAttr": false,
- "docs": "The list's group identifier.\n\nTo drag elements from one list into another, both lists must have the same group value.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "loading",
- "type": "boolean",
- "mutable": false,
- "attr": "loading",
- "reflectToAttr": true,
- "docs": "When true, content is waiting to be loaded. This state shows a busy indicator.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "multiple",
- "type": "boolean",
- "mutable": false,
- "attr": "multiple",
- "reflectToAttr": true,
- "docs": "Similar to standard radio buttons and checkboxes.\nWhen true, a user can select multiple list items at a time.\nWhen false, only a single list item can be selected at a time,\nand selecting a new list item will deselect any other selected list items.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selectionFollowsFocus",
- "type": "boolean",
- "mutable": false,
- "attr": "selection-follows-focus",
- "reflectToAttr": false,
- "docs": "When true and single-selection is enabled, the selection changes when navigating list items via the keyboard.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- }
- ],
- "methods": [
- {
- "name": "getSelectedItems",
- "returns": {
- "type": "Promise<Map<string, HTMLCalciteValueListItemElement>>",
- "docs": ""
- },
- "signature": "getSelectedItems() => Promise<Map<string, HTMLCalciteValueListItemElement>>",
- "parameters": [],
- "docs": "Returns the currently selected items",
- "docsTags": []
- },
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus(focusId?: ListFocusId) => Promise<void>",
- "parameters": [],
- "docs": "Sets focus on the component.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteListChange",
- "detail": "Map<string, HTMLCalciteValueListItemElement>",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emits when any of the list item selections have changed.",
- "docsTags": []
- },
- {
- "event": "calciteListOrderChange",
- "detail": "any[]",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emits when the order of the list has changed.",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "focusout",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteListItemRemove",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteListItemChange",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteListItemPropsChange",
- "capture": false,
- "passive": false
- },
- {
- "event": "calciteListItemValueChange",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "",
- "docs": "A slot for adding calcite-value-list-item elements. List items are displayed as a vertical list."
- },
- {
- "name": "menu-actions",
- "docs": "A slot for adding a button and menu combination for performing actions, such as sorting."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-filter",
- "calcite-scrim"
- ],
- "dependencyGraph": {
- "calcite-value-list": [
- "calcite-filter",
- "calcite-scrim"
- ],
- "calcite-filter": [
- "calcite-input"
- ],
- "calcite-input": [
- "calcite-progress",
- "calcite-icon"
- ],
- "calcite-scrim": [
- "calcite-loader"
- ]
- }
- },
- {
- "filePath": "./src/components/value-list-item/value-list-item.tsx",
- "encapsulation": "shadow",
- "tag": "calcite-value-list-item",
- "readme": "# calcite-value-list-item\n\n`calcite-value-list-item`s are cards contained in a `calcite-value-list`. They each can have a label and description, an icon and can have their label's be editable (inherited from `calcite-value-list`). The developer can disable or preselect each list item and give it a value.\n",
- "docs": "`calcite-value-list-item`s are cards contained in a `calcite-value-list`. They each can have a label and description, an icon and can have their label's be editable (inherited from `calcite-value-list`). The developer can disable or preselect each list item and give it a value.",
- "docsTags": [
- {
- "name": "slot",
- "text": "actions-end - A slot for adding actions or content to the end side of the item."
- },
- {
- "name": "slot",
- "text": "actions-start - A slot for adding actions or content to the start side of the item."
- }
- ],
- "usage": {},
- "props": [
- {
- "name": "description",
- "type": "string",
- "mutable": false,
- "attr": "description",
- "reflectToAttr": true,
- "docs": "An optional description for the list item that displays below the label text.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "disabled",
- "type": "boolean",
- "mutable": false,
- "attr": "disabled",
- "reflectToAttr": true,
- "docs": "When true, the list item cannot be clicked and is visually muted.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "icon",
- "type": "ICON_TYPES.circle | ICON_TYPES.grip | ICON_TYPES.square",
- "mutable": false,
- "attr": "icon",
- "reflectToAttr": true,
- "docs": "Determines the icon SVG symbol that will be shown. Options are circle, square, grip or null.",
- "docsTags": [
- {
- "name": "see",
- "text": "[ICON_TYPES](https://github.com/Esri/calcite-components/blob/master/src/components/pick-list/resources.ts#L5)"
- }
- ],
- "default": "null",
- "values": [
- {
- "type": "ICON_TYPES.circle"
- },
- {
- "type": "ICON_TYPES.grip"
- },
- {
- "type": "ICON_TYPES.square"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "label",
- "type": "string",
- "mutable": false,
- "attr": "label",
- "reflectToAttr": true,
- "docs": "The main label for the list item. Appears next to the icon.",
- "docsTags": [],
- "values": [
- {
- "type": "string"
- }
- ],
- "optional": false,
- "required": true
- },
- {
- "name": "metadata",
- "type": "{ [x: string]: unknown; }",
- "mutable": false,
- "reflectToAttr": false,
- "docs": "Provides additional metadata to a list item. Primary use is for a filter on the parent list.",
- "docsTags": [],
- "values": [
- {
- "type": "{ [x: string]: unknown; }"
- }
- ],
- "optional": true,
- "required": false
- },
- {
- "name": "nonInteractive",
- "type": "boolean",
- "mutable": false,
- "attr": "non-interactive",
- "reflectToAttr": true,
- "docs": "When true, prevents the content of the list item from user interaction.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "removable",
- "type": "boolean",
- "mutable": false,
- "attr": "removable",
- "reflectToAttr": true,
- "docs": "When true, adds an action to remove the list item.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "selected",
- "type": "boolean",
- "mutable": true,
- "attr": "selected",
- "reflectToAttr": true,
- "docs": "When true, preselects the list item. Toggles when an item is checked/unchecked.",
- "docsTags": [],
- "default": "false",
- "values": [
- {
- "type": "boolean"
- }
- ],
- "optional": false,
- "required": false
- },
- {
- "name": "value",
- "type": "any",
- "mutable": false,
- "attr": "value",
- "reflectToAttr": false,
- "docs": "The list item's associated value.",
- "docsTags": [],
- "values": [
- {
- "type": "any"
- }
- ],
- "optional": false,
- "required": true
- }
- ],
- "methods": [
- {
- "name": "setFocus",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "setFocus() => Promise<void>",
- "parameters": [],
- "docs": "Set focus on the component.",
- "docsTags": []
- },
- {
- "name": "toggleSelected",
- "returns": {
- "type": "Promise<void>",
- "docs": ""
- },
- "signature": "toggleSelected(coerce?: boolean) => Promise<void>",
- "parameters": [],
- "docs": "Toggle the selection state. By default this won't trigger an event.\nThe first argument allows the value to be coerced, rather than swapping values.",
- "docsTags": []
- }
- ],
- "events": [
- {
- "event": "calciteListItemRemove",
- "detail": "void",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": "Emits when the remove button is pressed.",
- "docsTags": []
- }
- ],
- "listeners": [
- {
- "event": "calciteListItemChange",
- "capture": false,
- "passive": false
- }
- ],
- "styles": [],
- "slots": [
- {
- "name": "actions-end",
- "docs": "A slot for adding actions or content to the end side of the item."
- },
- {
- "name": "actions-start",
- "docs": "A slot for adding actions or content to the start side of the item."
- }
- ],
- "parts": [],
- "dependents": [],
- "dependencies": [
- "calcite-icon",
- "calcite-pick-list-item"
- ],
- "dependencyGraph": {
- "calcite-value-list-item": [
- "calcite-icon",
- "calcite-pick-list-item"
- ],
- "calcite-pick-list-item": [
- "calcite-icon",
- "calcite-action"
- ],
- "calcite-action": [
- "calcite-loader",
- "calcite-icon"
- ]
- }
- }
- ]
- }
|