index.js 149 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055305630573058305930603061306230633064306530663067306830693070307130723073307430753076307730783079308030813082308330843085308630873088308930903091309230933094309530963097309830993100310131023103310431053106310731083109311031113112311331143115311631173118311931203121312231233124312531263127312831293130313131323133313431353136313731383139314031413142314331443145314631473148314931503151315231533154315531563157315831593160316131623163316431653166316731683169317031713172317331743175317631773178317931803181318231833184318531863187318831893190319131923193319431953196319731983199320032013202320332043205320632073208320932103211321232133214321532163217321832193220322132223223322432253226322732283229323032313232323332343235323632373238323932403241324232433244324532463247324832493250325132523253325432553256325732583259326032613262326332643265326632673268326932703271327232733274327532763277327832793280328132823283328432853286328732883289329032913292329332943295329632973298329933003301330233033304330533063307330833093310331133123313331433153316331733183319332033213322332333243325332633273328332933303331333233333334333533363337333833393340334133423343334433453346334733483349335033513352335333543355335633573358335933603361336233633364336533663367336833693370337133723373337433753376337733783379338033813382338333843385338633873388338933903391339233933394339533963397339833993400340134023403340434053406340734083409341034113412341334143415341634173418341934203421342234233424342534263427342834293430343134323433343434353436343734383439344034413442344334443445344634473448344934503451345234533454345534563457345834593460346134623463346434653466346734683469347034713472347334743475347634773478347934803481348234833484348534863487348834893490349134923493349434953496349734983499350035013502350335043505350635073508350935103511351235133514351535163517351835193520352135223523352435253526352735283529353035313532353335343535353635373538353935403541354235433544354535463547354835493550355135523553355435553556355735583559356035613562356335643565356635673568356935703571357235733574357535763577357835793580358135823583358435853586358735883589359035913592359335943595359635973598359936003601360236033604360536063607360836093610361136123613361436153616361736183619362036213622362336243625362636273628362936303631363236333634363536363637363836393640364136423643364436453646364736483649365036513652365336543655365636573658365936603661366236633664366536663667366836693670367136723673367436753676367736783679368036813682368336843685368636873688368936903691369236933694369536963697369836993700370137023703370437053706370737083709371037113712371337143715371637173718371937203721372237233724372537263727372837293730373137323733373437353736373737383739374037413742374337443745374637473748374937503751375237533754375537563757375837593760376137623763376437653766376737683769377037713772377337743775377637773778377937803781378237833784378537863787378837893790379137923793379437953796379737983799380038013802380338043805380638073808380938103811381238133814381538163817381838193820382138223823382438253826382738283829383038313832383338343835383638373838383938403841384238433844384538463847384838493850385138523853385438553856385738583859386038613862386338643865386638673868386938703871387238733874387538763877387838793880388138823883388438853886388738883889389038913892389338943895389638973898389939003901390239033904390539063907390839093910391139123913391439153916391739183919392039213922392339243925392639273928392939303931393239333934393539363937393839393940394139423943394439453946394739483949395039513952395339543955395639573958395939603961396239633964396539663967396839693970397139723973397439753976397739783979398039813982398339843985398639873988398939903991399239933994399539963997399839994000400140024003400440054006400740084009401040114012401340144015401640174018401940204021402240234024402540264027402840294030403140324033403440354036403740384039404040414042404340444045404640474048404940504051405240534054405540564057405840594060406140624063406440654066406740684069407040714072407340744075407640774078407940804081408240834084408540864087408840894090409140924093409440954096409740984099410041014102410341044105410641074108410941104111411241134114411541164117411841194120412141224123412441254126412741284129413041314132413341344135413641374138413941404141414241434144414541464147414841494150415141524153415441554156415741584159416041614162416341644165416641674168416941704171417241734174417541764177417841794180418141824183418441854186418741884189419041914192419341944195419641974198419942004201420242034204420542064207420842094210421142124213421442154216421742184219422042214222422342244225422642274228422942304231423242334234423542364237423842394240424142424243424442454246424742484249425042514252425342544255425642574258425942604261426242634264426542664267426842694270427142724273427442754276427742784279428042814282428342844285428642874288428942904291429242934294429542964297429842994300430143024303430443054306430743084309431043114312431343144315431643174318431943204321432243234324432543264327432843294330433143324333433443354336433743384339434043414342434343444345434643474348434943504351435243534354435543564357435843594360436143624363436443654366436743684369437043714372437343744375437643774378437943804381438243834384438543864387438843894390439143924393439443954396439743984399440044014402440344044405440644074408440944104411441244134414441544164417441844194420442144224423442444254426442744284429443044314432443344344435443644374438443944404441444244434444444544464447444844494450445144524453445444554456445744584459446044614462446344644465446644674468446944704471447244734474447544764477447844794480448144824483448444854486448744884489449044914492449344944495449644974498449945004501450245034504450545064507450845094510451145124513451445154516451745184519452045214522452345244525452645274528452945304531453245334534453545364537453845394540454145424543454445454546454745484549455045514552455345544555455645574558455945604561456245634564456545664567456845694570457145724573457445754576457745784579458045814582458345844585458645874588458945904591459245934594459545964597459845994600460146024603460446054606460746084609461046114612
  1. function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
  2. var React$1 = require('react');
  3. var React$1__default = _interopDefault(React$1);
  4. var core = require('@material-ui/core');
  5. var styles$1 = require('@material-ui/core/styles');
  6. var Popper = _interopDefault(require('@material-ui/core/Popper'));
  7. var ListSubheader = _interopDefault(require('@material-ui/core/ListSubheader'));
  8. var Paper = _interopDefault(require('@material-ui/core/Paper'));
  9. var IconButton = _interopDefault(require('@material-ui/core/IconButton'));
  10. var Chip = _interopDefault(require('@material-ui/core/Chip'));
  11. var utils = require('@material-ui/core/utils');
  12. var Table$1 = _interopDefault(require('@material-ui/core/Table'));
  13. var TableBody$1 = _interopDefault(require('@material-ui/core/TableBody'));
  14. var TableCell$1 = _interopDefault(require('@material-ui/core/TableCell'));
  15. var TableContainer$1 = _interopDefault(require('@material-ui/core/TableContainer'));
  16. var TableHead$1 = _interopDefault(require('@material-ui/core/TableHead'));
  17. var TablePagination = _interopDefault(require('@material-ui/core/TablePagination'));
  18. var TableRow$1 = _interopDefault(require('@material-ui/core/TableRow'));
  19. var TableSortLabel = _interopDefault(require('@material-ui/core/TableSortLabel'));
  20. function List(_ref) {
  21. var groupName = _ref.groupName,
  22. _ref$members = _ref.members,
  23. members = _ref$members === void 0 ? [] : _ref$members;
  24. return /*#__PURE__*/React$1__default.createElement("div", null, /*#__PURE__*/React$1__default.createElement("h1", null, "1.0.3"), /*#__PURE__*/React$1__default.createElement("h5", null, "Group: ", /*#__PURE__*/React$1__default.createElement("em", null, groupName)), /*#__PURE__*/React$1__default.createElement("ul", null, /*#__PURE__*/React$1__default.createElement("p", null, "Members"), members.map(function (member) {
  25. return /*#__PURE__*/React$1__default.createElement("li", {
  26. key: member
  27. }, member);
  28. })));
  29. }
  30. function _extends() {
  31. _extends = Object.assign || function (target) {
  32. for (var i = 1; i < arguments.length; i++) {
  33. var source = arguments[i];
  34. for (var key in source) {
  35. if (Object.prototype.hasOwnProperty.call(source, key)) {
  36. target[key] = source[key];
  37. }
  38. }
  39. }
  40. return target;
  41. };
  42. return _extends.apply(this, arguments);
  43. }
  44. function createCommonjsModule(fn, module) {
  45. return module = { exports: {} }, fn(module, module.exports), module.exports;
  46. }
  47. /** @license React v16.13.1
  48. * react-is.production.min.js
  49. *
  50. * Copyright (c) Facebook, Inc. and its affiliates.
  51. *
  52. * This source code is licensed under the MIT license found in the
  53. * LICENSE file in the root directory of this source tree.
  54. */
  55. var b="function"===typeof Symbol&&Symbol.for,c=b?Symbol.for("react.element"):60103,d=b?Symbol.for("react.portal"):60106,e=b?Symbol.for("react.fragment"):60107,f=b?Symbol.for("react.strict_mode"):60108,g=b?Symbol.for("react.profiler"):60114,h=b?Symbol.for("react.provider"):60109,k=b?Symbol.for("react.context"):60110,l=b?Symbol.for("react.async_mode"):60111,m=b?Symbol.for("react.concurrent_mode"):60111,n=b?Symbol.for("react.forward_ref"):60112,p=b?Symbol.for("react.suspense"):60113,q=b?
  56. Symbol.for("react.suspense_list"):60120,r=b?Symbol.for("react.memo"):60115,t=b?Symbol.for("react.lazy"):60116,v=b?Symbol.for("react.block"):60121,w=b?Symbol.for("react.fundamental"):60117,x=b?Symbol.for("react.responder"):60118,y=b?Symbol.for("react.scope"):60119;
  57. function z(a){if("object"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c:switch(a=a.type,a){case l:case m:case e:case g:case f:case p:return a;default:switch(a=a&&a.$$typeof,a){case k:case n:case t:case r:case h:return a;default:return u}}case d:return u}}}function A(a){return z(a)===m}var AsyncMode=l;var ConcurrentMode=m;var ContextConsumer=k;var ContextProvider=h;var Element=c;var ForwardRef=n;var Fragment=e;var Lazy=t;var Memo=r;var Portal=d;
  58. var Profiler=g;var StrictMode=f;var Suspense=p;var isAsyncMode=function(a){return A(a)||z(a)===l};var isConcurrentMode=A;var isContextConsumer=function(a){return z(a)===k};var isContextProvider=function(a){return z(a)===h};var isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===c};var isForwardRef=function(a){return z(a)===n};var isFragment=function(a){return z(a)===e};var isLazy=function(a){return z(a)===t};
  59. var isMemo=function(a){return z(a)===r};var isPortal=function(a){return z(a)===d};var isProfiler=function(a){return z(a)===g};var isStrictMode=function(a){return z(a)===f};var isSuspense=function(a){return z(a)===p};
  60. var isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===e||a===m||a===g||a===f||a===p||a===q||"object"===typeof a&&null!==a&&(a.$$typeof===t||a.$$typeof===r||a.$$typeof===h||a.$$typeof===k||a.$$typeof===n||a.$$typeof===w||a.$$typeof===x||a.$$typeof===y||a.$$typeof===v)};var typeOf=z;
  61. var reactIs_production_min = {
  62. AsyncMode: AsyncMode,
  63. ConcurrentMode: ConcurrentMode,
  64. ContextConsumer: ContextConsumer,
  65. ContextProvider: ContextProvider,
  66. Element: Element,
  67. ForwardRef: ForwardRef,
  68. Fragment: Fragment,
  69. Lazy: Lazy,
  70. Memo: Memo,
  71. Portal: Portal,
  72. Profiler: Profiler,
  73. StrictMode: StrictMode,
  74. Suspense: Suspense,
  75. isAsyncMode: isAsyncMode,
  76. isConcurrentMode: isConcurrentMode,
  77. isContextConsumer: isContextConsumer,
  78. isContextProvider: isContextProvider,
  79. isElement: isElement,
  80. isForwardRef: isForwardRef,
  81. isFragment: isFragment,
  82. isLazy: isLazy,
  83. isMemo: isMemo,
  84. isPortal: isPortal,
  85. isProfiler: isProfiler,
  86. isStrictMode: isStrictMode,
  87. isSuspense: isSuspense,
  88. isValidElementType: isValidElementType,
  89. typeOf: typeOf
  90. };
  91. var reactIs_development = createCommonjsModule(function (module, exports) {
  92. if (process.env.NODE_ENV !== "production") {
  93. (function() {
  94. // The Symbol used to tag the ReactElement-like types. If there is no native Symbol
  95. // nor polyfill, then a plain number is used for performance.
  96. var hasSymbol = typeof Symbol === 'function' && Symbol.for;
  97. var REACT_ELEMENT_TYPE = hasSymbol ? Symbol.for('react.element') : 0xeac7;
  98. var REACT_PORTAL_TYPE = hasSymbol ? Symbol.for('react.portal') : 0xeaca;
  99. var REACT_FRAGMENT_TYPE = hasSymbol ? Symbol.for('react.fragment') : 0xeacb;
  100. var REACT_STRICT_MODE_TYPE = hasSymbol ? Symbol.for('react.strict_mode') : 0xeacc;
  101. var REACT_PROFILER_TYPE = hasSymbol ? Symbol.for('react.profiler') : 0xead2;
  102. var REACT_PROVIDER_TYPE = hasSymbol ? Symbol.for('react.provider') : 0xeacd;
  103. var REACT_CONTEXT_TYPE = hasSymbol ? Symbol.for('react.context') : 0xeace; // TODO: We don't use AsyncMode or ConcurrentMode anymore. They were temporary
  104. // (unstable) APIs that have been removed. Can we remove the symbols?
  105. var REACT_ASYNC_MODE_TYPE = hasSymbol ? Symbol.for('react.async_mode') : 0xeacf;
  106. var REACT_CONCURRENT_MODE_TYPE = hasSymbol ? Symbol.for('react.concurrent_mode') : 0xeacf;
  107. var REACT_FORWARD_REF_TYPE = hasSymbol ? Symbol.for('react.forward_ref') : 0xead0;
  108. var REACT_SUSPENSE_TYPE = hasSymbol ? Symbol.for('react.suspense') : 0xead1;
  109. var REACT_SUSPENSE_LIST_TYPE = hasSymbol ? Symbol.for('react.suspense_list') : 0xead8;
  110. var REACT_MEMO_TYPE = hasSymbol ? Symbol.for('react.memo') : 0xead3;
  111. var REACT_LAZY_TYPE = hasSymbol ? Symbol.for('react.lazy') : 0xead4;
  112. var REACT_BLOCK_TYPE = hasSymbol ? Symbol.for('react.block') : 0xead9;
  113. var REACT_FUNDAMENTAL_TYPE = hasSymbol ? Symbol.for('react.fundamental') : 0xead5;
  114. var REACT_RESPONDER_TYPE = hasSymbol ? Symbol.for('react.responder') : 0xead6;
  115. var REACT_SCOPE_TYPE = hasSymbol ? Symbol.for('react.scope') : 0xead7;
  116. function isValidElementType(type) {
  117. return typeof type === 'string' || typeof type === 'function' || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
  118. type === REACT_FRAGMENT_TYPE || type === REACT_CONCURRENT_MODE_TYPE || type === REACT_PROFILER_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || typeof type === 'object' && type !== null && (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_RESPONDER_TYPE || type.$$typeof === REACT_SCOPE_TYPE || type.$$typeof === REACT_BLOCK_TYPE);
  119. }
  120. function typeOf(object) {
  121. if (typeof object === 'object' && object !== null) {
  122. var $$typeof = object.$$typeof;
  123. switch ($$typeof) {
  124. case REACT_ELEMENT_TYPE:
  125. var type = object.type;
  126. switch (type) {
  127. case REACT_ASYNC_MODE_TYPE:
  128. case REACT_CONCURRENT_MODE_TYPE:
  129. case REACT_FRAGMENT_TYPE:
  130. case REACT_PROFILER_TYPE:
  131. case REACT_STRICT_MODE_TYPE:
  132. case REACT_SUSPENSE_TYPE:
  133. return type;
  134. default:
  135. var $$typeofType = type && type.$$typeof;
  136. switch ($$typeofType) {
  137. case REACT_CONTEXT_TYPE:
  138. case REACT_FORWARD_REF_TYPE:
  139. case REACT_LAZY_TYPE:
  140. case REACT_MEMO_TYPE:
  141. case REACT_PROVIDER_TYPE:
  142. return $$typeofType;
  143. default:
  144. return $$typeof;
  145. }
  146. }
  147. case REACT_PORTAL_TYPE:
  148. return $$typeof;
  149. }
  150. }
  151. return undefined;
  152. } // AsyncMode is deprecated along with isAsyncMode
  153. var AsyncMode = REACT_ASYNC_MODE_TYPE;
  154. var ConcurrentMode = REACT_CONCURRENT_MODE_TYPE;
  155. var ContextConsumer = REACT_CONTEXT_TYPE;
  156. var ContextProvider = REACT_PROVIDER_TYPE;
  157. var Element = REACT_ELEMENT_TYPE;
  158. var ForwardRef = REACT_FORWARD_REF_TYPE;
  159. var Fragment = REACT_FRAGMENT_TYPE;
  160. var Lazy = REACT_LAZY_TYPE;
  161. var Memo = REACT_MEMO_TYPE;
  162. var Portal = REACT_PORTAL_TYPE;
  163. var Profiler = REACT_PROFILER_TYPE;
  164. var StrictMode = REACT_STRICT_MODE_TYPE;
  165. var Suspense = REACT_SUSPENSE_TYPE;
  166. var hasWarnedAboutDeprecatedIsAsyncMode = false; // AsyncMode should be deprecated
  167. function isAsyncMode(object) {
  168. {
  169. if (!hasWarnedAboutDeprecatedIsAsyncMode) {
  170. hasWarnedAboutDeprecatedIsAsyncMode = true; // Using console['warn'] to evade Babel and ESLint
  171. console['warn']('The ReactIs.isAsyncMode() alias has been deprecated, ' + 'and will be removed in React 17+. Update your code to use ' + 'ReactIs.isConcurrentMode() instead. It has the exact same API.');
  172. }
  173. }
  174. return isConcurrentMode(object) || typeOf(object) === REACT_ASYNC_MODE_TYPE;
  175. }
  176. function isConcurrentMode(object) {
  177. return typeOf(object) === REACT_CONCURRENT_MODE_TYPE;
  178. }
  179. function isContextConsumer(object) {
  180. return typeOf(object) === REACT_CONTEXT_TYPE;
  181. }
  182. function isContextProvider(object) {
  183. return typeOf(object) === REACT_PROVIDER_TYPE;
  184. }
  185. function isElement(object) {
  186. return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
  187. }
  188. function isForwardRef(object) {
  189. return typeOf(object) === REACT_FORWARD_REF_TYPE;
  190. }
  191. function isFragment(object) {
  192. return typeOf(object) === REACT_FRAGMENT_TYPE;
  193. }
  194. function isLazy(object) {
  195. return typeOf(object) === REACT_LAZY_TYPE;
  196. }
  197. function isMemo(object) {
  198. return typeOf(object) === REACT_MEMO_TYPE;
  199. }
  200. function isPortal(object) {
  201. return typeOf(object) === REACT_PORTAL_TYPE;
  202. }
  203. function isProfiler(object) {
  204. return typeOf(object) === REACT_PROFILER_TYPE;
  205. }
  206. function isStrictMode(object) {
  207. return typeOf(object) === REACT_STRICT_MODE_TYPE;
  208. }
  209. function isSuspense(object) {
  210. return typeOf(object) === REACT_SUSPENSE_TYPE;
  211. }
  212. exports.AsyncMode = AsyncMode;
  213. exports.ConcurrentMode = ConcurrentMode;
  214. exports.ContextConsumer = ContextConsumer;
  215. exports.ContextProvider = ContextProvider;
  216. exports.Element = Element;
  217. exports.ForwardRef = ForwardRef;
  218. exports.Fragment = Fragment;
  219. exports.Lazy = Lazy;
  220. exports.Memo = Memo;
  221. exports.Portal = Portal;
  222. exports.Profiler = Profiler;
  223. exports.StrictMode = StrictMode;
  224. exports.Suspense = Suspense;
  225. exports.isAsyncMode = isAsyncMode;
  226. exports.isConcurrentMode = isConcurrentMode;
  227. exports.isContextConsumer = isContextConsumer;
  228. exports.isContextProvider = isContextProvider;
  229. exports.isElement = isElement;
  230. exports.isForwardRef = isForwardRef;
  231. exports.isFragment = isFragment;
  232. exports.isLazy = isLazy;
  233. exports.isMemo = isMemo;
  234. exports.isPortal = isPortal;
  235. exports.isProfiler = isProfiler;
  236. exports.isStrictMode = isStrictMode;
  237. exports.isSuspense = isSuspense;
  238. exports.isValidElementType = isValidElementType;
  239. exports.typeOf = typeOf;
  240. })();
  241. }
  242. });
  243. var reactIs = createCommonjsModule(function (module) {
  244. if (process.env.NODE_ENV === 'production') {
  245. module.exports = reactIs_production_min;
  246. } else {
  247. module.exports = reactIs_development;
  248. }
  249. });
  250. /*
  251. object-assign
  252. (c) Sindre Sorhus
  253. @license MIT
  254. */
  255. /* eslint-disable no-unused-vars */
  256. var getOwnPropertySymbols = Object.getOwnPropertySymbols;
  257. var hasOwnProperty = Object.prototype.hasOwnProperty;
  258. var propIsEnumerable = Object.prototype.propertyIsEnumerable;
  259. function toObject(val) {
  260. if (val === null || val === undefined) {
  261. throw new TypeError('Object.assign cannot be called with null or undefined');
  262. }
  263. return Object(val);
  264. }
  265. function shouldUseNative() {
  266. try {
  267. if (!Object.assign) {
  268. return false;
  269. }
  270. // Detect buggy property enumeration order in older V8 versions.
  271. // https://bugs.chromium.org/p/v8/issues/detail?id=4118
  272. var test1 = new String('abc'); // eslint-disable-line no-new-wrappers
  273. test1[5] = 'de';
  274. if (Object.getOwnPropertyNames(test1)[0] === '5') {
  275. return false;
  276. }
  277. // https://bugs.chromium.org/p/v8/issues/detail?id=3056
  278. var test2 = {};
  279. for (var i = 0; i < 10; i++) {
  280. test2['_' + String.fromCharCode(i)] = i;
  281. }
  282. var order2 = Object.getOwnPropertyNames(test2).map(function (n) {
  283. return test2[n];
  284. });
  285. if (order2.join('') !== '0123456789') {
  286. return false;
  287. }
  288. // https://bugs.chromium.org/p/v8/issues/detail?id=3056
  289. var test3 = {};
  290. 'abcdefghijklmnopqrst'.split('').forEach(function (letter) {
  291. test3[letter] = letter;
  292. });
  293. if (Object.keys(Object.assign({}, test3)).join('') !==
  294. 'abcdefghijklmnopqrst') {
  295. return false;
  296. }
  297. return true;
  298. } catch (err) {
  299. // We don't expect any of the above to throw, but better to be safe.
  300. return false;
  301. }
  302. }
  303. var objectAssign = shouldUseNative() ? Object.assign : function (target, source) {
  304. var from;
  305. var to = toObject(target);
  306. var symbols;
  307. for (var s = 1; s < arguments.length; s++) {
  308. from = Object(arguments[s]);
  309. for (var key in from) {
  310. if (hasOwnProperty.call(from, key)) {
  311. to[key] = from[key];
  312. }
  313. }
  314. if (getOwnPropertySymbols) {
  315. symbols = getOwnPropertySymbols(from);
  316. for (var i = 0; i < symbols.length; i++) {
  317. if (propIsEnumerable.call(from, symbols[i])) {
  318. to[symbols[i]] = from[symbols[i]];
  319. }
  320. }
  321. }
  322. }
  323. return to;
  324. };
  325. /**
  326. * Copyright (c) 2013-present, Facebook, Inc.
  327. *
  328. * This source code is licensed under the MIT license found in the
  329. * LICENSE file in the root directory of this source tree.
  330. */
  331. var ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';
  332. var ReactPropTypesSecret_1 = ReactPropTypesSecret;
  333. var printWarning = function() {};
  334. if (process.env.NODE_ENV !== 'production') {
  335. var ReactPropTypesSecret$1 = ReactPropTypesSecret_1;
  336. var loggedTypeFailures = {};
  337. var has = Function.call.bind(Object.prototype.hasOwnProperty);
  338. printWarning = function(text) {
  339. var message = 'Warning: ' + text;
  340. if (typeof console !== 'undefined') {
  341. console.error(message);
  342. }
  343. try {
  344. // --- Welcome to debugging React ---
  345. // This error was thrown as a convenience so that you can use this stack
  346. // to find the callsite that caused this warning to fire.
  347. throw new Error(message);
  348. } catch (x) {}
  349. };
  350. }
  351. /**
  352. * Assert that the values match with the type specs.
  353. * Error messages are memorized and will only be shown once.
  354. *
  355. * @param {object} typeSpecs Map of name to a ReactPropType
  356. * @param {object} values Runtime values that need to be type-checked
  357. * @param {string} location e.g. "prop", "context", "child context"
  358. * @param {string} componentName Name of the component for error messages.
  359. * @param {?Function} getStack Returns the component stack.
  360. * @private
  361. */
  362. function checkPropTypes(typeSpecs, values, location, componentName, getStack) {
  363. if (process.env.NODE_ENV !== 'production') {
  364. for (var typeSpecName in typeSpecs) {
  365. if (has(typeSpecs, typeSpecName)) {
  366. var error;
  367. // Prop type validation may throw. In case they do, we don't want to
  368. // fail the render phase where it didn't fail before. So we log it.
  369. // After these have been cleaned up, we'll let them throw.
  370. try {
  371. // This is intentionally an invariant that gets caught. It's the same
  372. // behavior as without this statement except with a better message.
  373. if (typeof typeSpecs[typeSpecName] !== 'function') {
  374. var err = Error(
  375. (componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' +
  376. 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.'
  377. );
  378. err.name = 'Invariant Violation';
  379. throw err;
  380. }
  381. error = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, ReactPropTypesSecret$1);
  382. } catch (ex) {
  383. error = ex;
  384. }
  385. if (error && !(error instanceof Error)) {
  386. printWarning(
  387. (componentName || 'React class') + ': type specification of ' +
  388. location + ' `' + typeSpecName + '` is invalid; the type checker ' +
  389. 'function must return `null` or an `Error` but returned a ' + typeof error + '. ' +
  390. 'You may have forgotten to pass an argument to the type checker ' +
  391. 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' +
  392. 'shape all require an argument).'
  393. );
  394. }
  395. if (error instanceof Error && !(error.message in loggedTypeFailures)) {
  396. // Only monitor this failure once because there tends to be a lot of the
  397. // same error.
  398. loggedTypeFailures[error.message] = true;
  399. var stack = getStack ? getStack() : '';
  400. printWarning(
  401. 'Failed ' + location + ' type: ' + error.message + (stack != null ? stack : '')
  402. );
  403. }
  404. }
  405. }
  406. }
  407. }
  408. /**
  409. * Resets warning cache when testing.
  410. *
  411. * @private
  412. */
  413. checkPropTypes.resetWarningCache = function() {
  414. if (process.env.NODE_ENV !== 'production') {
  415. loggedTypeFailures = {};
  416. }
  417. };
  418. var checkPropTypes_1 = checkPropTypes;
  419. var has$1 = Function.call.bind(Object.prototype.hasOwnProperty);
  420. var printWarning$1 = function() {};
  421. if (process.env.NODE_ENV !== 'production') {
  422. printWarning$1 = function(text) {
  423. var message = 'Warning: ' + text;
  424. if (typeof console !== 'undefined') {
  425. console.error(message);
  426. }
  427. try {
  428. // --- Welcome to debugging React ---
  429. // This error was thrown as a convenience so that you can use this stack
  430. // to find the callsite that caused this warning to fire.
  431. throw new Error(message);
  432. } catch (x) {}
  433. };
  434. }
  435. function emptyFunctionThatReturnsNull() {
  436. return null;
  437. }
  438. var factoryWithTypeCheckers = function(isValidElement, throwOnDirectAccess) {
  439. /* global Symbol */
  440. var ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;
  441. var FAUX_ITERATOR_SYMBOL = '@@iterator'; // Before Symbol spec.
  442. /**
  443. * Returns the iterator method function contained on the iterable object.
  444. *
  445. * Be sure to invoke the function with the iterable as context:
  446. *
  447. * var iteratorFn = getIteratorFn(myIterable);
  448. * if (iteratorFn) {
  449. * var iterator = iteratorFn.call(myIterable);
  450. * ...
  451. * }
  452. *
  453. * @param {?object} maybeIterable
  454. * @return {?function}
  455. */
  456. function getIteratorFn(maybeIterable) {
  457. var iteratorFn = maybeIterable && (ITERATOR_SYMBOL && maybeIterable[ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL]);
  458. if (typeof iteratorFn === 'function') {
  459. return iteratorFn;
  460. }
  461. }
  462. /**
  463. * Collection of methods that allow declaration and validation of props that are
  464. * supplied to React components. Example usage:
  465. *
  466. * var Props = require('ReactPropTypes');
  467. * var MyArticle = React.createClass({
  468. * propTypes: {
  469. * // An optional string prop named "description".
  470. * description: Props.string,
  471. *
  472. * // A required enum prop named "category".
  473. * category: Props.oneOf(['News','Photos']).isRequired,
  474. *
  475. * // A prop named "dialog" that requires an instance of Dialog.
  476. * dialog: Props.instanceOf(Dialog).isRequired
  477. * },
  478. * render: function() { ... }
  479. * });
  480. *
  481. * A more formal specification of how these methods are used:
  482. *
  483. * type := array|bool|func|object|number|string|oneOf([...])|instanceOf(...)
  484. * decl := ReactPropTypes.{type}(.isRequired)?
  485. *
  486. * Each and every declaration produces a function with the same signature. This
  487. * allows the creation of custom validation functions. For example:
  488. *
  489. * var MyLink = React.createClass({
  490. * propTypes: {
  491. * // An optional string or URI prop named "href".
  492. * href: function(props, propName, componentName) {
  493. * var propValue = props[propName];
  494. * if (propValue != null && typeof propValue !== 'string' &&
  495. * !(propValue instanceof URI)) {
  496. * return new Error(
  497. * 'Expected a string or an URI for ' + propName + ' in ' +
  498. * componentName
  499. * );
  500. * }
  501. * }
  502. * },
  503. * render: function() {...}
  504. * });
  505. *
  506. * @internal
  507. */
  508. var ANONYMOUS = '<<anonymous>>';
  509. // Important!
  510. // Keep this list in sync with production version in `./factoryWithThrowingShims.js`.
  511. var ReactPropTypes = {
  512. array: createPrimitiveTypeChecker('array'),
  513. bool: createPrimitiveTypeChecker('boolean'),
  514. func: createPrimitiveTypeChecker('function'),
  515. number: createPrimitiveTypeChecker('number'),
  516. object: createPrimitiveTypeChecker('object'),
  517. string: createPrimitiveTypeChecker('string'),
  518. symbol: createPrimitiveTypeChecker('symbol'),
  519. any: createAnyTypeChecker(),
  520. arrayOf: createArrayOfTypeChecker,
  521. element: createElementTypeChecker(),
  522. elementType: createElementTypeTypeChecker(),
  523. instanceOf: createInstanceTypeChecker,
  524. node: createNodeChecker(),
  525. objectOf: createObjectOfTypeChecker,
  526. oneOf: createEnumTypeChecker,
  527. oneOfType: createUnionTypeChecker,
  528. shape: createShapeTypeChecker,
  529. exact: createStrictShapeTypeChecker,
  530. };
  531. /**
  532. * inlined Object.is polyfill to avoid requiring consumers ship their own
  533. * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is
  534. */
  535. /*eslint-disable no-self-compare*/
  536. function is(x, y) {
  537. // SameValue algorithm
  538. if (x === y) {
  539. // Steps 1-5, 7-10
  540. // Steps 6.b-6.e: +0 != -0
  541. return x !== 0 || 1 / x === 1 / y;
  542. } else {
  543. // Step 6.a: NaN == NaN
  544. return x !== x && y !== y;
  545. }
  546. }
  547. /*eslint-enable no-self-compare*/
  548. /**
  549. * We use an Error-like object for backward compatibility as people may call
  550. * PropTypes directly and inspect their output. However, we don't use real
  551. * Errors anymore. We don't inspect their stack anyway, and creating them
  552. * is prohibitively expensive if they are created too often, such as what
  553. * happens in oneOfType() for any type before the one that matched.
  554. */
  555. function PropTypeError(message) {
  556. this.message = message;
  557. this.stack = '';
  558. }
  559. // Make `instanceof Error` still work for returned errors.
  560. PropTypeError.prototype = Error.prototype;
  561. function createChainableTypeChecker(validate) {
  562. if (process.env.NODE_ENV !== 'production') {
  563. var manualPropTypeCallCache = {};
  564. var manualPropTypeWarningCount = 0;
  565. }
  566. function checkType(isRequired, props, propName, componentName, location, propFullName, secret) {
  567. componentName = componentName || ANONYMOUS;
  568. propFullName = propFullName || propName;
  569. if (secret !== ReactPropTypesSecret_1) {
  570. if (throwOnDirectAccess) {
  571. // New behavior only for users of `prop-types` package
  572. var err = new Error(
  573. 'Calling PropTypes validators directly is not supported by the `prop-types` package. ' +
  574. 'Use `PropTypes.checkPropTypes()` to call them. ' +
  575. 'Read more at http://fb.me/use-check-prop-types'
  576. );
  577. err.name = 'Invariant Violation';
  578. throw err;
  579. } else if (process.env.NODE_ENV !== 'production' && typeof console !== 'undefined') {
  580. // Old behavior for people using React.PropTypes
  581. var cacheKey = componentName + ':' + propName;
  582. if (
  583. !manualPropTypeCallCache[cacheKey] &&
  584. // Avoid spamming the console because they are often not actionable except for lib authors
  585. manualPropTypeWarningCount < 3
  586. ) {
  587. printWarning$1(
  588. 'You are manually calling a React.PropTypes validation ' +
  589. 'function for the `' + propFullName + '` prop on `' + componentName + '`. This is deprecated ' +
  590. 'and will throw in the standalone `prop-types` package. ' +
  591. 'You may be seeing this warning due to a third-party PropTypes ' +
  592. 'library. See https://fb.me/react-warning-dont-call-proptypes ' + 'for details.'
  593. );
  594. manualPropTypeCallCache[cacheKey] = true;
  595. manualPropTypeWarningCount++;
  596. }
  597. }
  598. }
  599. if (props[propName] == null) {
  600. if (isRequired) {
  601. if (props[propName] === null) {
  602. return new PropTypeError('The ' + location + ' `' + propFullName + '` is marked as required ' + ('in `' + componentName + '`, but its value is `null`.'));
  603. }
  604. return new PropTypeError('The ' + location + ' `' + propFullName + '` is marked as required in ' + ('`' + componentName + '`, but its value is `undefined`.'));
  605. }
  606. return null;
  607. } else {
  608. return validate(props, propName, componentName, location, propFullName);
  609. }
  610. }
  611. var chainedCheckType = checkType.bind(null, false);
  612. chainedCheckType.isRequired = checkType.bind(null, true);
  613. return chainedCheckType;
  614. }
  615. function createPrimitiveTypeChecker(expectedType) {
  616. function validate(props, propName, componentName, location, propFullName, secret) {
  617. var propValue = props[propName];
  618. var propType = getPropType(propValue);
  619. if (propType !== expectedType) {
  620. // `propValue` being instance of, say, date/regexp, pass the 'object'
  621. // check, but we can offer a more precise error message here rather than
  622. // 'of type `object`'.
  623. var preciseType = getPreciseType(propValue);
  624. return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + preciseType + '` supplied to `' + componentName + '`, expected ') + ('`' + expectedType + '`.'));
  625. }
  626. return null;
  627. }
  628. return createChainableTypeChecker(validate);
  629. }
  630. function createAnyTypeChecker() {
  631. return createChainableTypeChecker(emptyFunctionThatReturnsNull);
  632. }
  633. function createArrayOfTypeChecker(typeChecker) {
  634. function validate(props, propName, componentName, location, propFullName) {
  635. if (typeof typeChecker !== 'function') {
  636. return new PropTypeError('Property `' + propFullName + '` of component `' + componentName + '` has invalid PropType notation inside arrayOf.');
  637. }
  638. var propValue = props[propName];
  639. if (!Array.isArray(propValue)) {
  640. var propType = getPropType(propValue);
  641. return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected an array.'));
  642. }
  643. for (var i = 0; i < propValue.length; i++) {
  644. var error = typeChecker(propValue, i, componentName, location, propFullName + '[' + i + ']', ReactPropTypesSecret_1);
  645. if (error instanceof Error) {
  646. return error;
  647. }
  648. }
  649. return null;
  650. }
  651. return createChainableTypeChecker(validate);
  652. }
  653. function createElementTypeChecker() {
  654. function validate(props, propName, componentName, location, propFullName) {
  655. var propValue = props[propName];
  656. if (!isValidElement(propValue)) {
  657. var propType = getPropType(propValue);
  658. return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected a single ReactElement.'));
  659. }
  660. return null;
  661. }
  662. return createChainableTypeChecker(validate);
  663. }
  664. function createElementTypeTypeChecker() {
  665. function validate(props, propName, componentName, location, propFullName) {
  666. var propValue = props[propName];
  667. if (!reactIs.isValidElementType(propValue)) {
  668. var propType = getPropType(propValue);
  669. return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected a single ReactElement type.'));
  670. }
  671. return null;
  672. }
  673. return createChainableTypeChecker(validate);
  674. }
  675. function createInstanceTypeChecker(expectedClass) {
  676. function validate(props, propName, componentName, location, propFullName) {
  677. if (!(props[propName] instanceof expectedClass)) {
  678. var expectedClassName = expectedClass.name || ANONYMOUS;
  679. var actualClassName = getClassName(props[propName]);
  680. return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + actualClassName + '` supplied to `' + componentName + '`, expected ') + ('instance of `' + expectedClassName + '`.'));
  681. }
  682. return null;
  683. }
  684. return createChainableTypeChecker(validate);
  685. }
  686. function createEnumTypeChecker(expectedValues) {
  687. if (!Array.isArray(expectedValues)) {
  688. if (process.env.NODE_ENV !== 'production') {
  689. if (arguments.length > 1) {
  690. printWarning$1(
  691. 'Invalid arguments supplied to oneOf, expected an array, got ' + arguments.length + ' arguments. ' +
  692. 'A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z]).'
  693. );
  694. } else {
  695. printWarning$1('Invalid argument supplied to oneOf, expected an array.');
  696. }
  697. }
  698. return emptyFunctionThatReturnsNull;
  699. }
  700. function validate(props, propName, componentName, location, propFullName) {
  701. var propValue = props[propName];
  702. for (var i = 0; i < expectedValues.length; i++) {
  703. if (is(propValue, expectedValues[i])) {
  704. return null;
  705. }
  706. }
  707. var valuesString = JSON.stringify(expectedValues, function replacer(key, value) {
  708. var type = getPreciseType(value);
  709. if (type === 'symbol') {
  710. return String(value);
  711. }
  712. return value;
  713. });
  714. return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of value `' + String(propValue) + '` ' + ('supplied to `' + componentName + '`, expected one of ' + valuesString + '.'));
  715. }
  716. return createChainableTypeChecker(validate);
  717. }
  718. function createObjectOfTypeChecker(typeChecker) {
  719. function validate(props, propName, componentName, location, propFullName) {
  720. if (typeof typeChecker !== 'function') {
  721. return new PropTypeError('Property `' + propFullName + '` of component `' + componentName + '` has invalid PropType notation inside objectOf.');
  722. }
  723. var propValue = props[propName];
  724. var propType = getPropType(propValue);
  725. if (propType !== 'object') {
  726. return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected an object.'));
  727. }
  728. for (var key in propValue) {
  729. if (has$1(propValue, key)) {
  730. var error = typeChecker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret_1);
  731. if (error instanceof Error) {
  732. return error;
  733. }
  734. }
  735. }
  736. return null;
  737. }
  738. return createChainableTypeChecker(validate);
  739. }
  740. function createUnionTypeChecker(arrayOfTypeCheckers) {
  741. if (!Array.isArray(arrayOfTypeCheckers)) {
  742. process.env.NODE_ENV !== 'production' ? printWarning$1('Invalid argument supplied to oneOfType, expected an instance of array.') : void 0;
  743. return emptyFunctionThatReturnsNull;
  744. }
  745. for (var i = 0; i < arrayOfTypeCheckers.length; i++) {
  746. var checker = arrayOfTypeCheckers[i];
  747. if (typeof checker !== 'function') {
  748. printWarning$1(
  749. 'Invalid argument supplied to oneOfType. Expected an array of check functions, but ' +
  750. 'received ' + getPostfixForTypeWarning(checker) + ' at index ' + i + '.'
  751. );
  752. return emptyFunctionThatReturnsNull;
  753. }
  754. }
  755. function validate(props, propName, componentName, location, propFullName) {
  756. for (var i = 0; i < arrayOfTypeCheckers.length; i++) {
  757. var checker = arrayOfTypeCheckers[i];
  758. if (checker(props, propName, componentName, location, propFullName, ReactPropTypesSecret_1) == null) {
  759. return null;
  760. }
  761. }
  762. return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` supplied to ' + ('`' + componentName + '`.'));
  763. }
  764. return createChainableTypeChecker(validate);
  765. }
  766. function createNodeChecker() {
  767. function validate(props, propName, componentName, location, propFullName) {
  768. if (!isNode(props[propName])) {
  769. return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` supplied to ' + ('`' + componentName + '`, expected a ReactNode.'));
  770. }
  771. return null;
  772. }
  773. return createChainableTypeChecker(validate);
  774. }
  775. function createShapeTypeChecker(shapeTypes) {
  776. function validate(props, propName, componentName, location, propFullName) {
  777. var propValue = props[propName];
  778. var propType = getPropType(propValue);
  779. if (propType !== 'object') {
  780. return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type `' + propType + '` ' + ('supplied to `' + componentName + '`, expected `object`.'));
  781. }
  782. for (var key in shapeTypes) {
  783. var checker = shapeTypes[key];
  784. if (!checker) {
  785. continue;
  786. }
  787. var error = checker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret_1);
  788. if (error) {
  789. return error;
  790. }
  791. }
  792. return null;
  793. }
  794. return createChainableTypeChecker(validate);
  795. }
  796. function createStrictShapeTypeChecker(shapeTypes) {
  797. function validate(props, propName, componentName, location, propFullName) {
  798. var propValue = props[propName];
  799. var propType = getPropType(propValue);
  800. if (propType !== 'object') {
  801. return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type `' + propType + '` ' + ('supplied to `' + componentName + '`, expected `object`.'));
  802. }
  803. // We need to check all keys in case some are required but missing from
  804. // props.
  805. var allKeys = objectAssign({}, props[propName], shapeTypes);
  806. for (var key in allKeys) {
  807. var checker = shapeTypes[key];
  808. if (!checker) {
  809. return new PropTypeError(
  810. 'Invalid ' + location + ' `' + propFullName + '` key `' + key + '` supplied to `' + componentName + '`.' +
  811. '\nBad object: ' + JSON.stringify(props[propName], null, ' ') +
  812. '\nValid keys: ' + JSON.stringify(Object.keys(shapeTypes), null, ' ')
  813. );
  814. }
  815. var error = checker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret_1);
  816. if (error) {
  817. return error;
  818. }
  819. }
  820. return null;
  821. }
  822. return createChainableTypeChecker(validate);
  823. }
  824. function isNode(propValue) {
  825. switch (typeof propValue) {
  826. case 'number':
  827. case 'string':
  828. case 'undefined':
  829. return true;
  830. case 'boolean':
  831. return !propValue;
  832. case 'object':
  833. if (Array.isArray(propValue)) {
  834. return propValue.every(isNode);
  835. }
  836. if (propValue === null || isValidElement(propValue)) {
  837. return true;
  838. }
  839. var iteratorFn = getIteratorFn(propValue);
  840. if (iteratorFn) {
  841. var iterator = iteratorFn.call(propValue);
  842. var step;
  843. if (iteratorFn !== propValue.entries) {
  844. while (!(step = iterator.next()).done) {
  845. if (!isNode(step.value)) {
  846. return false;
  847. }
  848. }
  849. } else {
  850. // Iterator will provide entry [k,v] tuples rather than values.
  851. while (!(step = iterator.next()).done) {
  852. var entry = step.value;
  853. if (entry) {
  854. if (!isNode(entry[1])) {
  855. return false;
  856. }
  857. }
  858. }
  859. }
  860. } else {
  861. return false;
  862. }
  863. return true;
  864. default:
  865. return false;
  866. }
  867. }
  868. function isSymbol(propType, propValue) {
  869. // Native Symbol.
  870. if (propType === 'symbol') {
  871. return true;
  872. }
  873. // falsy value can't be a Symbol
  874. if (!propValue) {
  875. return false;
  876. }
  877. // 19.4.3.5 Symbol.prototype[@@toStringTag] === 'Symbol'
  878. if (propValue['@@toStringTag'] === 'Symbol') {
  879. return true;
  880. }
  881. // Fallback for non-spec compliant Symbols which are polyfilled.
  882. if (typeof Symbol === 'function' && propValue instanceof Symbol) {
  883. return true;
  884. }
  885. return false;
  886. }
  887. // Equivalent of `typeof` but with special handling for array and regexp.
  888. function getPropType(propValue) {
  889. var propType = typeof propValue;
  890. if (Array.isArray(propValue)) {
  891. return 'array';
  892. }
  893. if (propValue instanceof RegExp) {
  894. // Old webkits (at least until Android 4.0) return 'function' rather than
  895. // 'object' for typeof a RegExp. We'll normalize this here so that /bla/
  896. // passes PropTypes.object.
  897. return 'object';
  898. }
  899. if (isSymbol(propType, propValue)) {
  900. return 'symbol';
  901. }
  902. return propType;
  903. }
  904. // This handles more types than `getPropType`. Only used for error messages.
  905. // See `createPrimitiveTypeChecker`.
  906. function getPreciseType(propValue) {
  907. if (typeof propValue === 'undefined' || propValue === null) {
  908. return '' + propValue;
  909. }
  910. var propType = getPropType(propValue);
  911. if (propType === 'object') {
  912. if (propValue instanceof Date) {
  913. return 'date';
  914. } else if (propValue instanceof RegExp) {
  915. return 'regexp';
  916. }
  917. }
  918. return propType;
  919. }
  920. // Returns a string that is postfixed to a warning about an invalid type.
  921. // For example, "undefined" or "of type array"
  922. function getPostfixForTypeWarning(value) {
  923. var type = getPreciseType(value);
  924. switch (type) {
  925. case 'array':
  926. case 'object':
  927. return 'an ' + type;
  928. case 'boolean':
  929. case 'date':
  930. case 'regexp':
  931. return 'a ' + type;
  932. default:
  933. return type;
  934. }
  935. }
  936. // Returns class name of the object, if any.
  937. function getClassName(propValue) {
  938. if (!propValue.constructor || !propValue.constructor.name) {
  939. return ANONYMOUS;
  940. }
  941. return propValue.constructor.name;
  942. }
  943. ReactPropTypes.checkPropTypes = checkPropTypes_1;
  944. ReactPropTypes.resetWarningCache = checkPropTypes_1.resetWarningCache;
  945. ReactPropTypes.PropTypes = ReactPropTypes;
  946. return ReactPropTypes;
  947. };
  948. function emptyFunction() {}
  949. function emptyFunctionWithReset() {}
  950. emptyFunctionWithReset.resetWarningCache = emptyFunction;
  951. var factoryWithThrowingShims = function() {
  952. function shim(props, propName, componentName, location, propFullName, secret) {
  953. if (secret === ReactPropTypesSecret_1) {
  954. // It is still safe when called from React.
  955. return;
  956. }
  957. var err = new Error(
  958. 'Calling PropTypes validators directly is not supported by the `prop-types` package. ' +
  959. 'Use PropTypes.checkPropTypes() to call them. ' +
  960. 'Read more at http://fb.me/use-check-prop-types'
  961. );
  962. err.name = 'Invariant Violation';
  963. throw err;
  964. } shim.isRequired = shim;
  965. function getShim() {
  966. return shim;
  967. } // Important!
  968. // Keep this list in sync with production version in `./factoryWithTypeCheckers.js`.
  969. var ReactPropTypes = {
  970. array: shim,
  971. bool: shim,
  972. func: shim,
  973. number: shim,
  974. object: shim,
  975. string: shim,
  976. symbol: shim,
  977. any: shim,
  978. arrayOf: getShim,
  979. element: shim,
  980. elementType: shim,
  981. instanceOf: getShim,
  982. node: shim,
  983. objectOf: getShim,
  984. oneOf: getShim,
  985. oneOfType: getShim,
  986. shape: getShim,
  987. exact: getShim,
  988. checkPropTypes: emptyFunctionWithReset,
  989. resetWarningCache: emptyFunction
  990. };
  991. ReactPropTypes.PropTypes = ReactPropTypes;
  992. return ReactPropTypes;
  993. };
  994. var propTypes = createCommonjsModule(function (module) {
  995. /**
  996. * Copyright (c) 2013-present, Facebook, Inc.
  997. *
  998. * This source code is licensed under the MIT license found in the
  999. * LICENSE file in the root directory of this source tree.
  1000. */
  1001. if (process.env.NODE_ENV !== 'production') {
  1002. var ReactIs = reactIs;
  1003. // By explicitly using `prop-types` you are opting into new development behavior.
  1004. // http://fb.me/prop-types-in-prod
  1005. var throwOnDirectAccess = true;
  1006. module.exports = factoryWithTypeCheckers(ReactIs.isElement, throwOnDirectAccess);
  1007. } else {
  1008. // By explicitly using `prop-types` you are opting into new production behavior.
  1009. // http://fb.me/prop-types-in-prod
  1010. module.exports = factoryWithThrowingShims();
  1011. }
  1012. });
  1013. function _objectWithoutPropertiesLoose(source, excluded) {
  1014. if (source == null) return {};
  1015. var target = {};
  1016. var sourceKeys = Object.keys(source);
  1017. var key, i;
  1018. for (i = 0; i < sourceKeys.length; i++) {
  1019. key = sourceKeys[i];
  1020. if (excluded.indexOf(key) >= 0) continue;
  1021. target[key] = source[key];
  1022. }
  1023. return target;
  1024. }
  1025. function _objectWithoutProperties(source, excluded) {
  1026. if (source == null) return {};
  1027. var target = _objectWithoutPropertiesLoose(source, excluded);
  1028. var key, i;
  1029. if (Object.getOwnPropertySymbols) {
  1030. var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
  1031. for (i = 0; i < sourceSymbolKeys.length; i++) {
  1032. key = sourceSymbolKeys[i];
  1033. if (excluded.indexOf(key) >= 0) continue;
  1034. if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
  1035. target[key] = source[key];
  1036. }
  1037. }
  1038. return target;
  1039. }
  1040. function _defineProperty(obj, key, value) {
  1041. if (key in obj) {
  1042. Object.defineProperty(obj, key, {
  1043. value: value,
  1044. enumerable: true,
  1045. configurable: true,
  1046. writable: true
  1047. });
  1048. } else {
  1049. obj[key] = value;
  1050. }
  1051. return obj;
  1052. }
  1053. function _extends$1() {
  1054. _extends$1 = Object.assign || function (target) {
  1055. for (var i = 1; i < arguments.length; i++) {
  1056. var source = arguments[i];
  1057. for (var key in source) {
  1058. if (Object.prototype.hasOwnProperty.call(source, key)) {
  1059. target[key] = source[key];
  1060. }
  1061. }
  1062. }
  1063. return target;
  1064. };
  1065. return _extends$1.apply(this, arguments);
  1066. }
  1067. function toVal(mix) {
  1068. var k, y, str='';
  1069. if (typeof mix === 'string' || typeof mix === 'number') {
  1070. str += mix;
  1071. } else if (typeof mix === 'object') {
  1072. if (Array.isArray(mix)) {
  1073. for (k=0; k < mix.length; k++) {
  1074. if (mix[k]) {
  1075. if (y = toVal(mix[k])) {
  1076. str && (str += ' ');
  1077. str += y;
  1078. }
  1079. }
  1080. }
  1081. } else {
  1082. for (k in mix) {
  1083. if (mix[k]) {
  1084. str && (str += ' ');
  1085. str += k;
  1086. }
  1087. }
  1088. }
  1089. }
  1090. return str;
  1091. }
  1092. function clsx () {
  1093. var i=0, tmp, x, str='';
  1094. while (i < arguments.length) {
  1095. if (tmp = arguments[i++]) {
  1096. if (x = toVal(tmp)) {
  1097. str && (str += ' ');
  1098. str += x;
  1099. }
  1100. }
  1101. }
  1102. return str;
  1103. }
  1104. /**
  1105. * @ignore - internal component.
  1106. */
  1107. var CloseIcon = utils.createSvgIcon( /*#__PURE__*/React$1.createElement("path", {
  1108. d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
  1109. }), 'Close');
  1110. /**
  1111. * @ignore - internal component.
  1112. */
  1113. var ArrowDropDownIcon = utils.createSvgIcon( /*#__PURE__*/React$1.createElement("path", {
  1114. d: "M7 10l5 5 5-5z"
  1115. }), 'ArrowDropDown');
  1116. function _arrayWithHoles(arr) {
  1117. if (Array.isArray(arr)) return arr;
  1118. }
  1119. function _iterableToArrayLimit(arr, i) {
  1120. if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
  1121. var _arr = [];
  1122. var _n = true;
  1123. var _d = false;
  1124. var _e = undefined;
  1125. try {
  1126. for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
  1127. _arr.push(_s.value);
  1128. if (i && _arr.length === i) break;
  1129. }
  1130. } catch (err) {
  1131. _d = true;
  1132. _e = err;
  1133. } finally {
  1134. try {
  1135. if (!_n && _i["return"] != null) _i["return"]();
  1136. } finally {
  1137. if (_d) throw _e;
  1138. }
  1139. }
  1140. return _arr;
  1141. }
  1142. function _arrayLikeToArray(arr, len) {
  1143. if (len == null || len > arr.length) len = arr.length;
  1144. for (var i = 0, arr2 = new Array(len); i < len; i++) {
  1145. arr2[i] = arr[i];
  1146. }
  1147. return arr2;
  1148. }
  1149. function _unsupportedIterableToArray(o, minLen) {
  1150. if (!o) return;
  1151. if (typeof o === "string") return _arrayLikeToArray(o, minLen);
  1152. var n = Object.prototype.toString.call(o).slice(8, -1);
  1153. if (n === "Object" && o.constructor) n = o.constructor.name;
  1154. if (n === "Map" || n === "Set") return Array.from(o);
  1155. if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
  1156. }
  1157. function _nonIterableRest() {
  1158. throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
  1159. }
  1160. function _slicedToArray(arr, i) {
  1161. return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
  1162. }
  1163. function _typeof(obj) {
  1164. "@babel/helpers - typeof";
  1165. if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
  1166. _typeof = function _typeof(obj) {
  1167. return typeof obj;
  1168. };
  1169. } else {
  1170. _typeof = function _typeof(obj) {
  1171. return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
  1172. };
  1173. }
  1174. return _typeof(obj);
  1175. }
  1176. // Give up on IE 11 support for this feature
  1177. function stripDiacritics(string) {
  1178. return typeof string.normalize !== 'undefined' ? string.normalize('NFD').replace(/[\u0300-\u036f]/g, '') : string;
  1179. }
  1180. function createFilterOptions() {
  1181. var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
  1182. var _config$ignoreAccents = config.ignoreAccents,
  1183. ignoreAccents = _config$ignoreAccents === void 0 ? true : _config$ignoreAccents,
  1184. _config$ignoreCase = config.ignoreCase,
  1185. ignoreCase = _config$ignoreCase === void 0 ? true : _config$ignoreCase,
  1186. limit = config.limit,
  1187. _config$matchFrom = config.matchFrom,
  1188. matchFrom = _config$matchFrom === void 0 ? 'any' : _config$matchFrom,
  1189. stringify = config.stringify,
  1190. _config$trim = config.trim,
  1191. trim = _config$trim === void 0 ? false : _config$trim;
  1192. return function (options, _ref) {
  1193. var inputValue = _ref.inputValue,
  1194. getOptionLabel = _ref.getOptionLabel;
  1195. var input = trim ? inputValue.trim() : inputValue;
  1196. if (ignoreCase) {
  1197. input = input.toLowerCase();
  1198. }
  1199. if (ignoreAccents) {
  1200. input = stripDiacritics(input);
  1201. }
  1202. var filteredOptions = options.filter(function (option) {
  1203. var candidate = (stringify || getOptionLabel)(option);
  1204. if (ignoreCase) {
  1205. candidate = candidate.toLowerCase();
  1206. }
  1207. if (ignoreAccents) {
  1208. candidate = stripDiacritics(candidate);
  1209. }
  1210. return matchFrom === 'start' ? candidate.indexOf(input) === 0 : candidate.indexOf(input) > -1;
  1211. });
  1212. return typeof limit === 'number' ? filteredOptions.slice(0, limit) : filteredOptions;
  1213. };
  1214. } // To replace with .findIndex() once we stop IE 11 support.
  1215. function findIndex(array, comp) {
  1216. for (var i = 0; i < array.length; i += 1) {
  1217. if (comp(array[i])) {
  1218. return i;
  1219. }
  1220. }
  1221. return -1;
  1222. }
  1223. var defaultFilterOptions = createFilterOptions(); // Number of options to jump in list box when pageup and pagedown keys are used.
  1224. var pageSize = 5;
  1225. function useAutocomplete(props) {
  1226. var _props$autoComplete = props.autoComplete,
  1227. autoComplete = _props$autoComplete === void 0 ? false : _props$autoComplete,
  1228. _props$autoHighlight = props.autoHighlight,
  1229. autoHighlight = _props$autoHighlight === void 0 ? false : _props$autoHighlight,
  1230. _props$autoSelect = props.autoSelect,
  1231. autoSelect = _props$autoSelect === void 0 ? false : _props$autoSelect,
  1232. _props$blurOnSelect = props.blurOnSelect,
  1233. blurOnSelect = _props$blurOnSelect === void 0 ? false : _props$blurOnSelect,
  1234. _props$clearOnBlur = props.clearOnBlur,
  1235. clearOnBlur = _props$clearOnBlur === void 0 ? !props.freeSolo : _props$clearOnBlur,
  1236. _props$clearOnEscape = props.clearOnEscape,
  1237. clearOnEscape = _props$clearOnEscape === void 0 ? false : _props$clearOnEscape,
  1238. _props$componentName = props.componentName,
  1239. componentName = _props$componentName === void 0 ? 'useAutocomplete' : _props$componentName,
  1240. _props$debug = props.debug,
  1241. debug = _props$debug === void 0 ? false : _props$debug,
  1242. _props$defaultValue = props.defaultValue,
  1243. defaultValue = _props$defaultValue === void 0 ? props.multiple ? [] : null : _props$defaultValue,
  1244. _props$disableClearab = props.disableClearable,
  1245. disableClearable = _props$disableClearab === void 0 ? false : _props$disableClearab,
  1246. _props$disableCloseOn = props.disableCloseOnSelect,
  1247. disableCloseOnSelect = _props$disableCloseOn === void 0 ? false : _props$disableCloseOn,
  1248. _props$disabledItemsF = props.disabledItemsFocusable,
  1249. disabledItemsFocusable = _props$disabledItemsF === void 0 ? false : _props$disabledItemsF,
  1250. _props$disableListWra = props.disableListWrap,
  1251. disableListWrap = _props$disableListWra === void 0 ? false : _props$disableListWra,
  1252. _props$filterOptions = props.filterOptions,
  1253. filterOptions = _props$filterOptions === void 0 ? defaultFilterOptions : _props$filterOptions,
  1254. _props$filterSelected = props.filterSelectedOptions,
  1255. filterSelectedOptions = _props$filterSelected === void 0 ? false : _props$filterSelected,
  1256. _props$freeSolo = props.freeSolo,
  1257. freeSolo = _props$freeSolo === void 0 ? false : _props$freeSolo,
  1258. getOptionDisabled = props.getOptionDisabled,
  1259. _props$getOptionLabel = props.getOptionLabel,
  1260. getOptionLabelProp = _props$getOptionLabel === void 0 ? function (option) {
  1261. return option;
  1262. } : _props$getOptionLabel,
  1263. _props$getOptionSelec = props.getOptionSelected,
  1264. getOptionSelected = _props$getOptionSelec === void 0 ? function (option, value) {
  1265. return option === value;
  1266. } : _props$getOptionSelec,
  1267. groupBy = props.groupBy,
  1268. _props$handleHomeEndK = props.handleHomeEndKeys,
  1269. handleHomeEndKeys = _props$handleHomeEndK === void 0 ? !props.freeSolo : _props$handleHomeEndK,
  1270. idProp = props.id,
  1271. _props$includeInputIn = props.includeInputInList,
  1272. includeInputInList = _props$includeInputIn === void 0 ? false : _props$includeInputIn,
  1273. inputValueProp = props.inputValue,
  1274. _props$multiple = props.multiple,
  1275. multiple = _props$multiple === void 0 ? false : _props$multiple,
  1276. onChange = props.onChange,
  1277. onClose = props.onClose,
  1278. onHighlightChange = props.onHighlightChange,
  1279. onInputChange = props.onInputChange,
  1280. onOpen = props.onOpen,
  1281. openProp = props.open,
  1282. _props$openOnFocus = props.openOnFocus,
  1283. openOnFocus = _props$openOnFocus === void 0 ? false : _props$openOnFocus,
  1284. options = props.options,
  1285. _props$selectOnFocus = props.selectOnFocus,
  1286. selectOnFocus = _props$selectOnFocus === void 0 ? !props.freeSolo : _props$selectOnFocus,
  1287. valueProp = props.value;
  1288. var id = utils.unstable_useId(idProp);
  1289. var getOptionLabel = getOptionLabelProp;
  1290. if (process.env.NODE_ENV !== 'production') {
  1291. getOptionLabel = function getOptionLabel(option) {
  1292. var optionLabel = getOptionLabelProp(option);
  1293. if (typeof optionLabel !== 'string') {
  1294. var erroneousReturn = optionLabel === undefined ? 'undefined' : "".concat(_typeof(optionLabel), " (").concat(optionLabel, ")");
  1295. console.error("Material-UI: The `getOptionLabel` method of ".concat(componentName, " returned ").concat(erroneousReturn, " instead of a string for ").concat(JSON.stringify(option), "."));
  1296. }
  1297. return optionLabel;
  1298. };
  1299. }
  1300. var ignoreFocus = React$1.useRef(false);
  1301. var firstFocus = React$1.useRef(true);
  1302. var inputRef = React$1.useRef(null);
  1303. var listboxRef = React$1.useRef(null);
  1304. var _React$useState = React$1.useState(null),
  1305. anchorEl = _React$useState[0],
  1306. setAnchorEl = _React$useState[1];
  1307. var _React$useState2 = React$1.useState(-1),
  1308. focusedTag = _React$useState2[0],
  1309. setFocusedTag = _React$useState2[1];
  1310. var defaultHighlighted = autoHighlight ? 0 : -1;
  1311. var highlightedIndexRef = React$1.useRef(defaultHighlighted);
  1312. var _useControlled = utils.useControlled({
  1313. controlled: valueProp,
  1314. default: defaultValue,
  1315. name: componentName
  1316. }),
  1317. _useControlled2 = _slicedToArray(_useControlled, 2),
  1318. value = _useControlled2[0],
  1319. setValue = _useControlled2[1];
  1320. var _useControlled3 = utils.useControlled({
  1321. controlled: inputValueProp,
  1322. default: '',
  1323. name: componentName,
  1324. state: 'inputValue'
  1325. }),
  1326. _useControlled4 = _slicedToArray(_useControlled3, 2),
  1327. inputValue = _useControlled4[0],
  1328. setInputValue = _useControlled4[1];
  1329. var _React$useState3 = React$1.useState(false),
  1330. focused = _React$useState3[0],
  1331. setFocused = _React$useState3[1];
  1332. var resetInputValue = utils.useEventCallback(function (event, newValue) {
  1333. var newInputValue;
  1334. if (multiple) {
  1335. newInputValue = '';
  1336. } else if (newValue == null) {
  1337. newInputValue = '';
  1338. } else {
  1339. var optionLabel = getOptionLabel(newValue);
  1340. newInputValue = typeof optionLabel === 'string' ? optionLabel : '';
  1341. }
  1342. if (inputValue === newInputValue) {
  1343. return;
  1344. }
  1345. setInputValue(newInputValue);
  1346. if (onInputChange) {
  1347. onInputChange(event, newInputValue, 'reset');
  1348. }
  1349. });
  1350. React$1.useEffect(function () {
  1351. resetInputValue(null, value);
  1352. }, [value, resetInputValue]);
  1353. var _useControlled5 = utils.useControlled({
  1354. controlled: openProp,
  1355. default: false,
  1356. name: componentName,
  1357. state: 'open'
  1358. }),
  1359. _useControlled6 = _slicedToArray(_useControlled5, 2),
  1360. open = _useControlled6[0],
  1361. setOpenState = _useControlled6[1];
  1362. var inputValueIsSelectedValue = !multiple && value != null && inputValue === getOptionLabel(value);
  1363. var popupOpen = open;
  1364. var filteredOptions = popupOpen ? filterOptions(options.filter(function (option) {
  1365. if (filterSelectedOptions && (multiple ? value : [value]).some(function (value2) {
  1366. return value2 !== null && getOptionSelected(option, value2);
  1367. })) {
  1368. return false;
  1369. }
  1370. return true;
  1371. }), // we use the empty string to manipulate `filterOptions` to not filter any options
  1372. // i.e. the filter predicate always returns true
  1373. {
  1374. inputValue: inputValueIsSelectedValue ? '' : inputValue,
  1375. getOptionLabel: getOptionLabel
  1376. }) : [];
  1377. if (process.env.NODE_ENV !== 'production') {
  1378. if (value !== null && !freeSolo && options.length > 0) {
  1379. var missingValue = (multiple ? value : [value]).filter(function (value2) {
  1380. return !options.some(function (option) {
  1381. return getOptionSelected(option, value2);
  1382. });
  1383. });
  1384. if (missingValue.length > 0) {
  1385. console.warn(["Material-UI: The value provided to ".concat(componentName, " is invalid."), "None of the options match with `".concat(missingValue.length > 1 ? JSON.stringify(missingValue) : JSON.stringify(missingValue[0]), "`."), 'You can use the `getOptionSelected` prop to customize the equality test.'].join('\n'));
  1386. }
  1387. }
  1388. }
  1389. var focusTag = utils.useEventCallback(function (tagToFocus) {
  1390. if (tagToFocus === -1) {
  1391. inputRef.current.focus();
  1392. } else {
  1393. anchorEl.querySelector("[data-tag-index=\"".concat(tagToFocus, "\"]")).focus();
  1394. }
  1395. }); // Ensure the focusedTag is never inconsistent
  1396. React$1.useEffect(function () {
  1397. if (multiple && focusedTag > value.length - 1) {
  1398. setFocusedTag(-1);
  1399. focusTag(-1);
  1400. }
  1401. }, [value, multiple, focusedTag, focusTag]);
  1402. function validOptionIndex(index, direction) {
  1403. if (!listboxRef.current || index === -1) {
  1404. return -1;
  1405. }
  1406. var nextFocus = index;
  1407. while (true) {
  1408. // Out of range
  1409. if (direction === 'next' && nextFocus === filteredOptions.length || direction === 'previous' && nextFocus === -1) {
  1410. return -1;
  1411. }
  1412. var option = listboxRef.current.querySelector("[data-option-index=\"".concat(nextFocus, "\"]")); // Same logic as MenuList.js
  1413. var nextFocusDisabled = disabledItemsFocusable ? false : option && (option.disabled || option.getAttribute('aria-disabled') === 'true');
  1414. if (option && !option.hasAttribute('tabindex') || nextFocusDisabled) {
  1415. // Move to the next element.
  1416. nextFocus += direction === 'next' ? 1 : -1;
  1417. } else {
  1418. return nextFocus;
  1419. }
  1420. }
  1421. }
  1422. var setHighlightedIndex = utils.useEventCallback(function (_ref2) {
  1423. var event = _ref2.event,
  1424. index = _ref2.index,
  1425. _ref2$reason = _ref2.reason,
  1426. reason = _ref2$reason === void 0 ? 'auto' : _ref2$reason;
  1427. highlightedIndexRef.current = index; // does the index exist?
  1428. if (index === -1) {
  1429. inputRef.current.removeAttribute('aria-activedescendant');
  1430. } else {
  1431. inputRef.current.setAttribute('aria-activedescendant', "".concat(id, "-option-").concat(index));
  1432. }
  1433. if (onHighlightChange) {
  1434. onHighlightChange(event, index === -1 ? null : filteredOptions[index], reason);
  1435. }
  1436. if (!listboxRef.current) {
  1437. return;
  1438. }
  1439. var prev = listboxRef.current.querySelector('[data-focus]');
  1440. if (prev) {
  1441. prev.removeAttribute('data-focus');
  1442. }
  1443. var listboxNode = listboxRef.current.parentElement.querySelector('[role="listbox"]'); // "No results"
  1444. if (!listboxNode) {
  1445. return;
  1446. }
  1447. if (index === -1) {
  1448. listboxNode.scrollTop = 0;
  1449. return;
  1450. }
  1451. var option = listboxRef.current.querySelector("[data-option-index=\"".concat(index, "\"]"));
  1452. if (!option) {
  1453. return;
  1454. }
  1455. option.setAttribute('data-focus', 'true'); // Scroll active descendant into view.
  1456. // Logic copied from https://www.w3.org/TR/wai-aria-practices/examples/listbox/js/listbox.js
  1457. //
  1458. // Consider this API instead once it has a better browser support:
  1459. // .scrollIntoView({ scrollMode: 'if-needed', block: 'nearest' });
  1460. if (listboxNode.scrollHeight > listboxNode.clientHeight && reason !== 'mouse') {
  1461. var element = option;
  1462. var scrollBottom = listboxNode.clientHeight + listboxNode.scrollTop;
  1463. var elementBottom = element.offsetTop + element.offsetHeight;
  1464. if (elementBottom > scrollBottom) {
  1465. listboxNode.scrollTop = elementBottom - listboxNode.clientHeight;
  1466. } else if (element.offsetTop - element.offsetHeight * (groupBy ? 1.3 : 0) < listboxNode.scrollTop) {
  1467. listboxNode.scrollTop = element.offsetTop - element.offsetHeight * (groupBy ? 1.3 : 0);
  1468. }
  1469. }
  1470. });
  1471. var changeHighlightedIndex = utils.useEventCallback(function (_ref3) {
  1472. var event = _ref3.event,
  1473. diff = _ref3.diff,
  1474. _ref3$direction = _ref3.direction,
  1475. direction = _ref3$direction === void 0 ? 'next' : _ref3$direction,
  1476. _ref3$reason = _ref3.reason,
  1477. reason = _ref3$reason === void 0 ? 'auto' : _ref3$reason;
  1478. if (!popupOpen) {
  1479. return;
  1480. }
  1481. var getNextIndex = function getNextIndex() {
  1482. var maxIndex = filteredOptions.length - 1;
  1483. if (diff === 'reset') {
  1484. return defaultHighlighted;
  1485. }
  1486. if (diff === 'start') {
  1487. return 0;
  1488. }
  1489. if (diff === 'end') {
  1490. return maxIndex;
  1491. }
  1492. var newIndex = highlightedIndexRef.current + diff;
  1493. if (newIndex < 0) {
  1494. if (newIndex === -1 && includeInputInList) {
  1495. return -1;
  1496. }
  1497. if (disableListWrap && highlightedIndexRef.current !== -1 || Math.abs(diff) > 1) {
  1498. return 0;
  1499. }
  1500. return maxIndex;
  1501. }
  1502. if (newIndex > maxIndex) {
  1503. if (newIndex === maxIndex + 1 && includeInputInList) {
  1504. return -1;
  1505. }
  1506. if (disableListWrap || Math.abs(diff) > 1) {
  1507. return maxIndex;
  1508. }
  1509. return 0;
  1510. }
  1511. return newIndex;
  1512. };
  1513. var nextIndex = validOptionIndex(getNextIndex(), direction);
  1514. setHighlightedIndex({
  1515. index: nextIndex,
  1516. reason: reason,
  1517. event: event
  1518. }); // Sync the content of the input with the highlighted option.
  1519. if (autoComplete && diff !== 'reset') {
  1520. if (nextIndex === -1) {
  1521. inputRef.current.value = inputValue;
  1522. } else {
  1523. var option = getOptionLabel(filteredOptions[nextIndex]);
  1524. inputRef.current.value = option; // The portion of the selected suggestion that has not been typed by the user,
  1525. // a completion string, appears inline after the input cursor in the textbox.
  1526. var index = option.toLowerCase().indexOf(inputValue.toLowerCase());
  1527. if (index === 0 && inputValue.length > 0) {
  1528. inputRef.current.setSelectionRange(inputValue.length, option.length);
  1529. }
  1530. }
  1531. }
  1532. });
  1533. var syncHighlightedIndex = React$1.useCallback(function () {
  1534. if (!popupOpen) {
  1535. return;
  1536. }
  1537. var valueItem = multiple ? value[0] : value; // The popup is empty, reset
  1538. if (filteredOptions.length === 0 || valueItem == null) {
  1539. changeHighlightedIndex({
  1540. diff: 'reset'
  1541. });
  1542. return;
  1543. }
  1544. if (!listboxRef.current) {
  1545. return;
  1546. } // Synchronize the value with the highlighted index
  1547. if (!filterSelectedOptions && valueItem != null) {
  1548. var currentOption = filteredOptions[highlightedIndexRef.current]; // Keep the current highlighted index if possible
  1549. if (multiple && currentOption && findIndex(value, function (val) {
  1550. return getOptionSelected(currentOption, val);
  1551. }) !== -1) {
  1552. return;
  1553. }
  1554. var itemIndex = findIndex(filteredOptions, function (optionItem) {
  1555. return getOptionSelected(optionItem, valueItem);
  1556. });
  1557. if (itemIndex === -1) {
  1558. changeHighlightedIndex({
  1559. diff: 'reset'
  1560. });
  1561. } else {
  1562. setHighlightedIndex({
  1563. index: itemIndex
  1564. });
  1565. }
  1566. return;
  1567. } // Prevent the highlighted index to leak outside the boundaries.
  1568. if (highlightedIndexRef.current >= filteredOptions.length - 1) {
  1569. setHighlightedIndex({
  1570. index: filteredOptions.length - 1
  1571. });
  1572. return;
  1573. } // Restore the focus to the previous index.
  1574. setHighlightedIndex({
  1575. index: highlightedIndexRef.current
  1576. }); // Ignore filteredOptions (and options, getOptionSelected, getOptionLabel) not to break the scroll position
  1577. // eslint-disable-next-line react-hooks/exhaustive-deps
  1578. }, [// Only sync the highlighted index when the option switch between empty and not
  1579. // eslint-disable-next-line react-hooks/exhaustive-deps
  1580. filteredOptions.length === 0, // Don't sync the highlighted index with the value when multiple
  1581. // eslint-disable-next-line react-hooks/exhaustive-deps
  1582. multiple ? false : value, filterSelectedOptions, changeHighlightedIndex, setHighlightedIndex, popupOpen, inputValue, multiple]);
  1583. var handleListboxRef = utils.useEventCallback(function (node) {
  1584. utils.setRef(listboxRef, node);
  1585. if (!node) {
  1586. return;
  1587. }
  1588. syncHighlightedIndex();
  1589. });
  1590. React$1.useEffect(function () {
  1591. syncHighlightedIndex();
  1592. }, [syncHighlightedIndex]);
  1593. var handleOpen = function handleOpen(event) {
  1594. if (open) {
  1595. return;
  1596. }
  1597. setOpenState(true);
  1598. if (onOpen) {
  1599. onOpen(event);
  1600. }
  1601. };
  1602. var handleClose = function handleClose(event, reason) {
  1603. if (!open) {
  1604. return;
  1605. }
  1606. setOpenState(false);
  1607. if (onClose) {
  1608. onClose(event, reason);
  1609. }
  1610. };
  1611. var handleValue = function handleValue(event, newValue, reason, details) {
  1612. if (value === newValue) {
  1613. return;
  1614. }
  1615. if (onChange) {
  1616. onChange(event, newValue, reason, details);
  1617. }
  1618. setValue(newValue);
  1619. };
  1620. var isTouch = React$1.useRef(false);
  1621. var selectNewValue = function selectNewValue(event, option) {
  1622. var reasonProp = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'select-option';
  1623. var origin = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'options';
  1624. var reason = reasonProp;
  1625. var newValue = option;
  1626. if (multiple) {
  1627. newValue = Array.isArray(value) ? value.slice() : [];
  1628. if (process.env.NODE_ENV !== 'production') {
  1629. var matches = newValue.filter(function (val) {
  1630. return getOptionSelected(option, val);
  1631. });
  1632. if (matches.length > 1) {
  1633. console.error(["Material-UI: The `getOptionSelected` method of ".concat(componentName, " do not handle the arguments correctly."), "The component expects a single value to match a given option but found ".concat(matches.length, " matches.")].join('\n'));
  1634. }
  1635. }
  1636. var itemIndex = findIndex(newValue, function (valueItem) {
  1637. return getOptionSelected(option, valueItem);
  1638. });
  1639. if (itemIndex === -1) {
  1640. newValue.push(option);
  1641. } else if (origin !== 'freeSolo') {
  1642. newValue.splice(itemIndex, 1);
  1643. reason = 'remove-option';
  1644. }
  1645. }
  1646. resetInputValue(event, newValue);
  1647. handleValue(event, newValue, reason, {
  1648. option: option
  1649. });
  1650. if (!disableCloseOnSelect) {
  1651. handleClose(event, reason);
  1652. }
  1653. if (blurOnSelect === true || blurOnSelect === 'touch' && isTouch.current || blurOnSelect === 'mouse' && !isTouch.current) {
  1654. inputRef.current.blur();
  1655. }
  1656. };
  1657. function validTagIndex(index, direction) {
  1658. if (index === -1) {
  1659. return -1;
  1660. }
  1661. var nextFocus = index;
  1662. while (true) {
  1663. // Out of range
  1664. if (direction === 'next' && nextFocus === value.length || direction === 'previous' && nextFocus === -1) {
  1665. return -1;
  1666. }
  1667. var option = anchorEl.querySelector("[data-tag-index=\"".concat(nextFocus, "\"]")); // Same logic as MenuList.js
  1668. if (option && (!option.hasAttribute('tabindex') || option.disabled || option.getAttribute('aria-disabled') === 'true')) {
  1669. nextFocus += direction === 'next' ? 1 : -1;
  1670. } else {
  1671. return nextFocus;
  1672. }
  1673. }
  1674. }
  1675. var handleFocusTag = function handleFocusTag(event, direction) {
  1676. if (!multiple) {
  1677. return;
  1678. }
  1679. handleClose(event, 'toggleInput');
  1680. var nextTag = focusedTag;
  1681. if (focusedTag === -1) {
  1682. if (inputValue === '' && direction === 'previous') {
  1683. nextTag = value.length - 1;
  1684. }
  1685. } else {
  1686. nextTag += direction === 'next' ? 1 : -1;
  1687. if (nextTag < 0) {
  1688. nextTag = 0;
  1689. }
  1690. if (nextTag === value.length) {
  1691. nextTag = -1;
  1692. }
  1693. }
  1694. nextTag = validTagIndex(nextTag, direction);
  1695. setFocusedTag(nextTag);
  1696. focusTag(nextTag);
  1697. };
  1698. var handleClear = function handleClear(event) {
  1699. ignoreFocus.current = true;
  1700. setInputValue('');
  1701. if (onInputChange) {
  1702. onInputChange(event, '', 'clear');
  1703. }
  1704. handleValue(event, multiple ? [] : null, 'clear');
  1705. };
  1706. var handleKeyDown = function handleKeyDown(other) {
  1707. return function (event) {
  1708. if (focusedTag !== -1 && ['ArrowLeft', 'ArrowRight'].indexOf(event.key) === -1) {
  1709. setFocusedTag(-1);
  1710. focusTag(-1);
  1711. }
  1712. switch (event.key) {
  1713. case 'Home':
  1714. if (popupOpen && handleHomeEndKeys) {
  1715. // Prevent scroll of the page
  1716. event.preventDefault();
  1717. changeHighlightedIndex({
  1718. diff: 'start',
  1719. direction: 'next',
  1720. reason: 'keyboard',
  1721. event: event
  1722. });
  1723. }
  1724. break;
  1725. case 'End':
  1726. if (popupOpen && handleHomeEndKeys) {
  1727. // Prevent scroll of the page
  1728. event.preventDefault();
  1729. changeHighlightedIndex({
  1730. diff: 'end',
  1731. direction: 'previous',
  1732. reason: 'keyboard',
  1733. event: event
  1734. });
  1735. }
  1736. break;
  1737. case 'PageUp':
  1738. // Prevent scroll of the page
  1739. event.preventDefault();
  1740. changeHighlightedIndex({
  1741. diff: -pageSize,
  1742. direction: 'previous',
  1743. reason: 'keyboard',
  1744. event: event
  1745. });
  1746. handleOpen(event);
  1747. break;
  1748. case 'PageDown':
  1749. // Prevent scroll of the page
  1750. event.preventDefault();
  1751. changeHighlightedIndex({
  1752. diff: pageSize,
  1753. direction: 'next',
  1754. reason: 'keyboard',
  1755. event: event
  1756. });
  1757. handleOpen(event);
  1758. break;
  1759. case 'ArrowDown':
  1760. // Prevent cursor move
  1761. event.preventDefault();
  1762. changeHighlightedIndex({
  1763. diff: 1,
  1764. direction: 'next',
  1765. reason: 'keyboard',
  1766. event: event
  1767. });
  1768. handleOpen(event);
  1769. break;
  1770. case 'ArrowUp':
  1771. // Prevent cursor move
  1772. event.preventDefault();
  1773. changeHighlightedIndex({
  1774. diff: -1,
  1775. direction: 'previous',
  1776. reason: 'keyboard',
  1777. event: event
  1778. });
  1779. handleOpen(event);
  1780. break;
  1781. case 'ArrowLeft':
  1782. handleFocusTag(event, 'previous');
  1783. break;
  1784. case 'ArrowRight':
  1785. handleFocusTag(event, 'next');
  1786. break;
  1787. case 'Enter':
  1788. // Wait until IME is settled.
  1789. if (event.which === 229) {
  1790. break;
  1791. }
  1792. if (highlightedIndexRef.current !== -1 && popupOpen) {
  1793. var option = filteredOptions[highlightedIndexRef.current];
  1794. var disabled = getOptionDisabled ? getOptionDisabled(option) : false; // We don't want to validate the form.
  1795. event.preventDefault();
  1796. if (disabled) {
  1797. return;
  1798. }
  1799. selectNewValue(event, option, 'select-option'); // Move the selection to the end.
  1800. if (autoComplete) {
  1801. inputRef.current.setSelectionRange(inputRef.current.value.length, inputRef.current.value.length);
  1802. }
  1803. } else if (freeSolo && inputValue !== '' && inputValueIsSelectedValue === false) {
  1804. if (multiple) {
  1805. // Allow people to add new values before they submit the form.
  1806. event.preventDefault();
  1807. }
  1808. selectNewValue(event, inputValue, 'create-option', 'freeSolo');
  1809. }
  1810. break;
  1811. case 'Escape':
  1812. if (popupOpen) {
  1813. // Avoid Opera to exit fullscreen mode.
  1814. event.preventDefault(); // Avoid the Modal to handle the event.
  1815. event.stopPropagation();
  1816. handleClose(event, 'escape');
  1817. } else if (clearOnEscape && (inputValue !== '' || multiple && value.length > 0)) {
  1818. // Avoid Opera to exit fullscreen mode.
  1819. event.preventDefault(); // Avoid the Modal to handle the event.
  1820. event.stopPropagation();
  1821. handleClear(event);
  1822. }
  1823. break;
  1824. case 'Backspace':
  1825. if (multiple && inputValue === '' && value.length > 0) {
  1826. var index = focusedTag === -1 ? value.length - 1 : focusedTag;
  1827. var newValue = value.slice();
  1828. newValue.splice(index, 1);
  1829. handleValue(event, newValue, 'remove-option', {
  1830. option: value[index]
  1831. });
  1832. }
  1833. break;
  1834. }
  1835. if (other.onKeyDown) {
  1836. other.onKeyDown(event);
  1837. }
  1838. };
  1839. };
  1840. var handleFocus = function handleFocus(event) {
  1841. setFocused(true);
  1842. if (openOnFocus && !ignoreFocus.current) {
  1843. handleOpen(event);
  1844. }
  1845. };
  1846. var handleBlur = function handleBlur(event) {
  1847. // Ignore the event when using the scrollbar with IE 11
  1848. if (listboxRef.current !== null && document.activeElement === listboxRef.current.parentElement) {
  1849. inputRef.current.focus();
  1850. return;
  1851. }
  1852. setFocused(false);
  1853. firstFocus.current = true;
  1854. ignoreFocus.current = false;
  1855. if (debug && inputValue !== '') {
  1856. return;
  1857. }
  1858. if (autoSelect && highlightedIndexRef.current !== -1 && popupOpen) {
  1859. selectNewValue(event, filteredOptions[highlightedIndexRef.current], 'blur');
  1860. } else if (autoSelect && freeSolo && inputValue !== '') {
  1861. selectNewValue(event, inputValue, 'blur', 'freeSolo');
  1862. } else if (clearOnBlur) {
  1863. resetInputValue(event, value);
  1864. }
  1865. handleClose(event, 'blur');
  1866. };
  1867. var handleInputChange = function handleInputChange(event) {
  1868. var newValue = event.target.value;
  1869. if (inputValue !== newValue) {
  1870. setInputValue(newValue);
  1871. if (onInputChange) {
  1872. onInputChange(event, newValue, 'input');
  1873. }
  1874. }
  1875. if (newValue === '') {
  1876. if (!disableClearable && !multiple) {
  1877. handleValue(event, null, 'clear');
  1878. }
  1879. } else {
  1880. handleOpen(event);
  1881. }
  1882. };
  1883. var handleOptionMouseOver = function handleOptionMouseOver(event) {
  1884. setHighlightedIndex({
  1885. event: event,
  1886. index: Number(event.currentTarget.getAttribute('data-option-index')),
  1887. reason: 'mouse'
  1888. });
  1889. };
  1890. var handleOptionTouchStart = function handleOptionTouchStart() {
  1891. isTouch.current = true;
  1892. };
  1893. var handleOptionClick = function handleOptionClick(event) {
  1894. var index = Number(event.currentTarget.getAttribute('data-option-index'));
  1895. selectNewValue(event, filteredOptions[index], 'select-option');
  1896. isTouch.current = false;
  1897. };
  1898. var handleTagDelete = function handleTagDelete(index) {
  1899. return function (event) {
  1900. var newValue = value.slice();
  1901. newValue.splice(index, 1);
  1902. handleValue(event, newValue, 'remove-option', {
  1903. option: value[index]
  1904. });
  1905. };
  1906. };
  1907. var handlePopupIndicator = function handlePopupIndicator(event) {
  1908. if (open) {
  1909. handleClose(event, 'toggleInput');
  1910. } else {
  1911. handleOpen(event);
  1912. }
  1913. }; // Prevent input blur when interacting with the combobox
  1914. var handleMouseDown = function handleMouseDown(event) {
  1915. if (event.target.getAttribute('id') !== id) {
  1916. event.preventDefault();
  1917. }
  1918. }; // Focus the input when interacting with the combobox
  1919. var handleClick = function handleClick() {
  1920. inputRef.current.focus();
  1921. if (selectOnFocus && firstFocus.current && inputRef.current.selectionEnd - inputRef.current.selectionStart === 0) {
  1922. inputRef.current.select();
  1923. }
  1924. firstFocus.current = false;
  1925. };
  1926. var handleInputMouseDown = function handleInputMouseDown(event) {
  1927. if (inputValue === '' || !open) {
  1928. handlePopupIndicator(event);
  1929. }
  1930. };
  1931. var dirty = freeSolo && inputValue.length > 0;
  1932. dirty = dirty || (multiple ? value.length > 0 : value !== null);
  1933. var groupedOptions = filteredOptions;
  1934. if (groupBy) {
  1935. // used to keep track of key and indexes in the result array
  1936. var indexBy = new Map();
  1937. var warn = false;
  1938. groupedOptions = filteredOptions.reduce(function (acc, option, index) {
  1939. var group = groupBy(option);
  1940. if (acc.length > 0 && acc[acc.length - 1].group === group) {
  1941. acc[acc.length - 1].options.push(option);
  1942. } else {
  1943. if (process.env.NODE_ENV !== 'production') {
  1944. if (indexBy.get(group) && !warn) {
  1945. console.warn("Material-UI: The options provided combined with the `groupBy` method of ".concat(componentName, " returns duplicated headers."), 'You can solve the issue by sorting the options with the output of `groupBy`.');
  1946. warn = true;
  1947. }
  1948. indexBy.set(group, true);
  1949. }
  1950. acc.push({
  1951. key: index,
  1952. index: index,
  1953. group: group,
  1954. options: [option]
  1955. });
  1956. }
  1957. return acc;
  1958. }, []);
  1959. }
  1960. return {
  1961. getRootProps: function getRootProps() {
  1962. var other = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
  1963. return _extends$1({
  1964. 'aria-owns': popupOpen ? "".concat(id, "-popup") : null,
  1965. role: 'combobox',
  1966. 'aria-expanded': popupOpen
  1967. }, other, {
  1968. onKeyDown: handleKeyDown(other),
  1969. onMouseDown: handleMouseDown,
  1970. onClick: handleClick
  1971. });
  1972. },
  1973. getInputLabelProps: function getInputLabelProps() {
  1974. return {
  1975. id: "".concat(id, "-label"),
  1976. htmlFor: id
  1977. };
  1978. },
  1979. getInputProps: function getInputProps() {
  1980. return {
  1981. id: id,
  1982. value: inputValue,
  1983. onBlur: handleBlur,
  1984. onFocus: handleFocus,
  1985. onChange: handleInputChange,
  1986. onMouseDown: handleInputMouseDown,
  1987. // if open then this is handled imperativeley so don't let react override
  1988. // only have an opinion about this when closed
  1989. 'aria-activedescendant': popupOpen ? '' : null,
  1990. 'aria-autocomplete': autoComplete ? 'both' : 'list',
  1991. 'aria-controls': popupOpen ? "".concat(id, "-popup") : null,
  1992. // Disable browser's suggestion that might overlap with the popup.
  1993. // Handle autocomplete but not autofill.
  1994. autoComplete: 'off',
  1995. ref: inputRef,
  1996. autoCapitalize: 'none',
  1997. spellCheck: 'false'
  1998. };
  1999. },
  2000. getClearProps: function getClearProps() {
  2001. return {
  2002. tabIndex: -1,
  2003. onClick: handleClear
  2004. };
  2005. },
  2006. getPopupIndicatorProps: function getPopupIndicatorProps() {
  2007. return {
  2008. tabIndex: -1,
  2009. onClick: handlePopupIndicator
  2010. };
  2011. },
  2012. getTagProps: function getTagProps(_ref4) {
  2013. var index = _ref4.index;
  2014. return {
  2015. key: index,
  2016. 'data-tag-index': index,
  2017. tabIndex: -1,
  2018. onDelete: handleTagDelete(index)
  2019. };
  2020. },
  2021. getListboxProps: function getListboxProps() {
  2022. return {
  2023. role: 'listbox',
  2024. id: "".concat(id, "-popup"),
  2025. 'aria-labelledby': "".concat(id, "-label"),
  2026. ref: handleListboxRef,
  2027. onMouseDown: function onMouseDown(event) {
  2028. // Prevent blur
  2029. event.preventDefault();
  2030. }
  2031. };
  2032. },
  2033. getOptionProps: function getOptionProps(_ref5) {
  2034. var index = _ref5.index,
  2035. option = _ref5.option;
  2036. var selected = (multiple ? value : [value]).some(function (value2) {
  2037. return value2 != null && getOptionSelected(option, value2);
  2038. });
  2039. var disabled = getOptionDisabled ? getOptionDisabled(option) : false;
  2040. return {
  2041. key: index,
  2042. tabIndex: -1,
  2043. role: 'option',
  2044. id: "".concat(id, "-option-").concat(index),
  2045. onMouseOver: handleOptionMouseOver,
  2046. onClick: handleOptionClick,
  2047. onTouchStart: handleOptionTouchStart,
  2048. 'data-option-index': index,
  2049. 'aria-disabled': disabled,
  2050. 'aria-selected': selected
  2051. };
  2052. },
  2053. id: id,
  2054. inputValue: inputValue,
  2055. value: value,
  2056. dirty: dirty,
  2057. popupOpen: popupOpen,
  2058. focused: focused || focusedTag !== -1,
  2059. anchorEl: anchorEl,
  2060. setAnchorEl: setAnchorEl,
  2061. focusedTag: focusedTag,
  2062. groupedOptions: groupedOptions
  2063. };
  2064. }
  2065. var styles = function styles(theme) {
  2066. var _option;
  2067. return {
  2068. /* Styles applied to the root element. */
  2069. root: {
  2070. '&$focused $clearIndicatorDirty': {
  2071. visibility: 'visible'
  2072. },
  2073. /* Avoid double tap issue on iOS */
  2074. '@media (pointer: fine)': {
  2075. '&:hover $clearIndicatorDirty': {
  2076. visibility: 'visible'
  2077. }
  2078. }
  2079. },
  2080. /* Styles applied to the root element if `fullWidth={true}`. */
  2081. fullWidth: {
  2082. width: '100%'
  2083. },
  2084. /* Pseudo-class applied to the root element if focused. */
  2085. focused: {},
  2086. /* Styles applied to the tag elements, e.g. the chips. */
  2087. tag: {
  2088. margin: 3,
  2089. maxWidth: 'calc(100% - 6px)'
  2090. },
  2091. /* Styles applied to the tag elements, e.g. the chips if `size="small"`. */
  2092. tagSizeSmall: {
  2093. margin: 2,
  2094. maxWidth: 'calc(100% - 4px)'
  2095. },
  2096. /* Styles applied when the popup icon is rendered. */
  2097. hasPopupIcon: {},
  2098. /* Styles applied when the clear icon is rendered. */
  2099. hasClearIcon: {},
  2100. /* Styles applied to the Input element. */
  2101. inputRoot: {
  2102. flexWrap: 'wrap',
  2103. '$hasPopupIcon &, $hasClearIcon &': {
  2104. paddingRight: 26 + 4
  2105. },
  2106. '$hasPopupIcon$hasClearIcon &': {
  2107. paddingRight: 52 + 4
  2108. },
  2109. '& $input': {
  2110. width: 0,
  2111. minWidth: 30
  2112. },
  2113. '&[class*="MuiInput-root"]': {
  2114. paddingBottom: 1,
  2115. '& $input': {
  2116. padding: 4
  2117. },
  2118. '& $input:first-child': {
  2119. padding: '6px 0'
  2120. }
  2121. },
  2122. '&[class*="MuiInput-root"][class*="MuiInput-marginDense"]': {
  2123. '& $input': {
  2124. padding: '4px 4px 5px'
  2125. },
  2126. '& $input:first-child': {
  2127. padding: '3px 0 6px'
  2128. }
  2129. },
  2130. '&[class*="MuiOutlinedInput-root"]': {
  2131. padding: 9,
  2132. '$hasPopupIcon &, $hasClearIcon &': {
  2133. paddingRight: 26 + 4 + 9
  2134. },
  2135. '$hasPopupIcon$hasClearIcon &': {
  2136. paddingRight: 52 + 4 + 9
  2137. },
  2138. '& $input': {
  2139. padding: '9.5px 4px'
  2140. },
  2141. '& $input:first-child': {
  2142. paddingLeft: 6
  2143. },
  2144. '& $endAdornment': {
  2145. right: 9
  2146. }
  2147. },
  2148. '&[class*="MuiOutlinedInput-root"][class*="MuiOutlinedInput-marginDense"]': {
  2149. padding: 6,
  2150. '& $input': {
  2151. padding: '4.5px 4px'
  2152. }
  2153. },
  2154. '&[class*="MuiFilledInput-root"]': {
  2155. paddingTop: 19,
  2156. paddingLeft: 8,
  2157. '$hasPopupIcon &, $hasClearIcon &': {
  2158. paddingRight: 26 + 4 + 9
  2159. },
  2160. '$hasPopupIcon$hasClearIcon &': {
  2161. paddingRight: 52 + 4 + 9
  2162. },
  2163. '& $input': {
  2164. padding: '9px 4px'
  2165. },
  2166. '& $endAdornment': {
  2167. right: 9
  2168. }
  2169. },
  2170. '&[class*="MuiFilledInput-root"][class*="MuiFilledInput-marginDense"]': {
  2171. paddingBottom: 1,
  2172. '& $input': {
  2173. padding: '4.5px 4px'
  2174. }
  2175. }
  2176. },
  2177. /* Styles applied to the input element. */
  2178. input: {
  2179. flexGrow: 1,
  2180. textOverflow: 'ellipsis',
  2181. opacity: 0
  2182. },
  2183. /* Styles applied to the input element if tag focused. */
  2184. inputFocused: {
  2185. opacity: 1
  2186. },
  2187. /* Styles applied to the endAdornment element. */
  2188. endAdornment: {
  2189. // We use a position absolute to support wrapping tags.
  2190. position: 'absolute',
  2191. right: 0,
  2192. top: 'calc(50% - 14px)' // Center vertically
  2193. },
  2194. /* Styles applied to the clear indicator. */
  2195. clearIndicator: {
  2196. marginRight: -2,
  2197. padding: 4,
  2198. visibility: 'hidden'
  2199. },
  2200. /* Styles applied to the clear indicator if the input is dirty. */
  2201. clearIndicatorDirty: {},
  2202. /* Styles applied to the popup indicator. */
  2203. popupIndicator: {
  2204. padding: 2,
  2205. marginRight: -2
  2206. },
  2207. /* Styles applied to the popup indicator if the popup is open. */
  2208. popupIndicatorOpen: {
  2209. transform: 'rotate(180deg)'
  2210. },
  2211. /* Styles applied to the popper element. */
  2212. popper: {
  2213. zIndex: theme.zIndex.modal
  2214. },
  2215. /* Styles applied to the popper element if `disablePortal={true}`. */
  2216. popperDisablePortal: {
  2217. position: 'absolute'
  2218. },
  2219. /* Styles applied to the `Paper` component. */
  2220. paper: _extends$1({}, theme.typography.body1, {
  2221. overflow: 'hidden',
  2222. margin: '4px 0'
  2223. }),
  2224. /* Styles applied to the `listbox` component. */
  2225. listbox: {
  2226. listStyle: 'none',
  2227. margin: 0,
  2228. padding: '8px 0',
  2229. maxHeight: '40vh',
  2230. overflow: 'auto'
  2231. },
  2232. /* Styles applied to the loading wrapper. */
  2233. loading: {
  2234. color: theme.palette.text.secondary,
  2235. padding: '14px 16px'
  2236. },
  2237. /* Styles applied to the no option wrapper. */
  2238. noOptions: {
  2239. color: theme.palette.text.secondary,
  2240. padding: '14px 16px'
  2241. },
  2242. /* Styles applied to the option elements. */
  2243. option: (_option = {
  2244. minHeight: 48,
  2245. display: 'flex',
  2246. justifyContent: 'flex-start',
  2247. alignItems: 'center',
  2248. cursor: 'pointer',
  2249. paddingTop: 6,
  2250. boxSizing: 'border-box',
  2251. outline: '0',
  2252. WebkitTapHighlightColor: 'transparent',
  2253. paddingBottom: 6,
  2254. paddingLeft: 16,
  2255. paddingRight: 16
  2256. }, _defineProperty(_option, theme.breakpoints.up('sm'), {
  2257. minHeight: 'auto'
  2258. }), _defineProperty(_option, '&[aria-selected="true"]', {
  2259. backgroundColor: theme.palette.action.selected
  2260. }), _defineProperty(_option, '&[data-focus="true"]', {
  2261. backgroundColor: theme.palette.action.hover
  2262. }), _defineProperty(_option, '&:active', {
  2263. backgroundColor: theme.palette.action.selected
  2264. }), _defineProperty(_option, '&[aria-disabled="true"]', {
  2265. opacity: theme.palette.action.disabledOpacity,
  2266. pointerEvents: 'none'
  2267. }), _option),
  2268. /* Styles applied to the group's label elements. */
  2269. groupLabel: {
  2270. backgroundColor: theme.palette.background.paper,
  2271. top: -8
  2272. },
  2273. /* Styles applied to the group's ul elements. */
  2274. groupUl: {
  2275. padding: 0,
  2276. '& $option': {
  2277. paddingLeft: 24
  2278. }
  2279. }
  2280. };
  2281. };
  2282. function DisablePortal(props) {
  2283. // eslint-disable-next-line react/prop-types
  2284. var other = _objectWithoutProperties(props, ["anchorEl", "open"]);
  2285. return /*#__PURE__*/React$1.createElement("div", other);
  2286. }
  2287. var _ref = /*#__PURE__*/React$1.createElement(CloseIcon, {
  2288. fontSize: "small"
  2289. });
  2290. var _ref2 = /*#__PURE__*/React$1.createElement(ArrowDropDownIcon, null);
  2291. var Autocomplete = /*#__PURE__*/React$1.forwardRef(function Autocomplete(props, ref) {
  2292. /* eslint-disable no-unused-vars */
  2293. var ChipProps = props.ChipProps,
  2294. classes = props.classes,
  2295. className = props.className,
  2296. _props$clearText = props.clearText,
  2297. clearText = _props$clearText === void 0 ? 'Clear' : _props$clearText,
  2298. _props$closeIcon = props.closeIcon,
  2299. closeIcon = _props$closeIcon === void 0 ? _ref : _props$closeIcon,
  2300. _props$closeText = props.closeText,
  2301. closeText = _props$closeText === void 0 ? 'Close' : _props$closeText,
  2302. _props$disableClearab = props.disableClearable,
  2303. disableClearable = _props$disableClearab === void 0 ? false : _props$disableClearab,
  2304. _props$disabled = props.disabled,
  2305. disabled = _props$disabled === void 0 ? false : _props$disabled,
  2306. _props$disablePortal = props.disablePortal,
  2307. disablePortal = _props$disablePortal === void 0 ? false : _props$disablePortal,
  2308. _props$forcePopupIcon = props.forcePopupIcon,
  2309. forcePopupIcon = _props$forcePopupIcon === void 0 ? 'auto' : _props$forcePopupIcon,
  2310. _props$freeSolo = props.freeSolo,
  2311. freeSolo = _props$freeSolo === void 0 ? false : _props$freeSolo,
  2312. _props$fullWidth = props.fullWidth,
  2313. fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth,
  2314. _props$getLimitTagsTe = props.getLimitTagsText,
  2315. getLimitTagsText = _props$getLimitTagsTe === void 0 ? function (more) {
  2316. return "+".concat(more);
  2317. } : _props$getLimitTagsTe,
  2318. _props$getOptionLabel = props.getOptionLabel,
  2319. getOptionLabel = _props$getOptionLabel === void 0 ? function (x) {
  2320. return x;
  2321. } : _props$getOptionLabel,
  2322. groupBy = props.groupBy,
  2323. _props$limitTags = props.limitTags,
  2324. limitTags = _props$limitTags === void 0 ? -1 : _props$limitTags,
  2325. _props$ListboxCompone = props.ListboxComponent,
  2326. ListboxComponent = _props$ListboxCompone === void 0 ? 'ul' : _props$ListboxCompone,
  2327. ListboxProps = props.ListboxProps,
  2328. _props$loading = props.loading,
  2329. loading = _props$loading === void 0 ? false : _props$loading,
  2330. _props$loadingText = props.loadingText,
  2331. loadingText = _props$loadingText === void 0 ? 'Loading…' : _props$loadingText,
  2332. _props$multiple = props.multiple,
  2333. multiple = _props$multiple === void 0 ? false : _props$multiple,
  2334. _props$noOptionsText = props.noOptionsText,
  2335. noOptionsText = _props$noOptionsText === void 0 ? 'No options' : _props$noOptionsText,
  2336. _props$openText = props.openText,
  2337. openText = _props$openText === void 0 ? 'Open' : _props$openText,
  2338. _props$PaperComponent = props.PaperComponent,
  2339. PaperComponent = _props$PaperComponent === void 0 ? Paper : _props$PaperComponent,
  2340. _props$PopperComponen = props.PopperComponent,
  2341. PopperComponentProp = _props$PopperComponen === void 0 ? Popper : _props$PopperComponen,
  2342. _props$popupIcon = props.popupIcon,
  2343. popupIcon = _props$popupIcon === void 0 ? _ref2 : _props$popupIcon,
  2344. renderGroupProp = props.renderGroup,
  2345. renderInput = props.renderInput,
  2346. renderOptionProp = props.renderOption,
  2347. renderTags = props.renderTags,
  2348. _props$size = props.size,
  2349. size = _props$size === void 0 ? 'medium' : _props$size,
  2350. other = _objectWithoutProperties(props, ["autoComplete", "autoHighlight", "autoSelect", "blurOnSelect", "ChipProps", "classes", "className", "clearOnBlur", "clearOnEscape", "clearText", "closeIcon", "closeText", "debug", "defaultValue", "disableClearable", "disableCloseOnSelect", "disabled", "disabledItemsFocusable", "disableListWrap", "disablePortal", "filterOptions", "filterSelectedOptions", "forcePopupIcon", "freeSolo", "fullWidth", "getLimitTagsText", "getOptionDisabled", "getOptionLabel", "getOptionSelected", "groupBy", "handleHomeEndKeys", "id", "includeInputInList", "inputValue", "limitTags", "ListboxComponent", "ListboxProps", "loading", "loadingText", "multiple", "noOptionsText", "onChange", "onClose", "onHighlightChange", "onInputChange", "onOpen", "open", "openOnFocus", "openText", "options", "PaperComponent", "PopperComponent", "popupIcon", "renderGroup", "renderInput", "renderOption", "renderTags", "selectOnFocus", "size", "value"]);
  2351. /* eslint-enable no-unused-vars */
  2352. var PopperComponent = disablePortal ? DisablePortal : PopperComponentProp;
  2353. var _useAutocomplete = useAutocomplete(_extends$1({}, props, {
  2354. componentName: 'Autocomplete'
  2355. })),
  2356. getRootProps = _useAutocomplete.getRootProps,
  2357. getInputProps = _useAutocomplete.getInputProps,
  2358. getInputLabelProps = _useAutocomplete.getInputLabelProps,
  2359. getPopupIndicatorProps = _useAutocomplete.getPopupIndicatorProps,
  2360. getClearProps = _useAutocomplete.getClearProps,
  2361. getTagProps = _useAutocomplete.getTagProps,
  2362. getListboxProps = _useAutocomplete.getListboxProps,
  2363. getOptionProps = _useAutocomplete.getOptionProps,
  2364. value = _useAutocomplete.value,
  2365. dirty = _useAutocomplete.dirty,
  2366. id = _useAutocomplete.id,
  2367. popupOpen = _useAutocomplete.popupOpen,
  2368. focused = _useAutocomplete.focused,
  2369. focusedTag = _useAutocomplete.focusedTag,
  2370. anchorEl = _useAutocomplete.anchorEl,
  2371. setAnchorEl = _useAutocomplete.setAnchorEl,
  2372. inputValue = _useAutocomplete.inputValue,
  2373. groupedOptions = _useAutocomplete.groupedOptions;
  2374. var startAdornment;
  2375. if (multiple && value.length > 0) {
  2376. var getCustomizedTagProps = function getCustomizedTagProps(params) {
  2377. return _extends$1({
  2378. className: clsx(classes.tag, size === 'small' && classes.tagSizeSmall),
  2379. disabled: disabled
  2380. }, getTagProps(params));
  2381. };
  2382. if (renderTags) {
  2383. startAdornment = renderTags(value, getCustomizedTagProps);
  2384. } else {
  2385. startAdornment = value.map(function (option, index) {
  2386. return /*#__PURE__*/React$1.createElement(Chip, _extends$1({
  2387. label: getOptionLabel(option),
  2388. size: size
  2389. }, getCustomizedTagProps({
  2390. index: index
  2391. }), ChipProps));
  2392. });
  2393. }
  2394. }
  2395. if (limitTags > -1 && Array.isArray(startAdornment)) {
  2396. var more = startAdornment.length - limitTags;
  2397. if (!focused && more > 0) {
  2398. startAdornment = startAdornment.splice(0, limitTags);
  2399. startAdornment.push( /*#__PURE__*/React$1.createElement("span", {
  2400. className: classes.tag,
  2401. key: startAdornment.length
  2402. }, getLimitTagsText(more)));
  2403. }
  2404. }
  2405. var defaultRenderGroup = function defaultRenderGroup(params) {
  2406. return /*#__PURE__*/React$1.createElement("li", {
  2407. key: params.key
  2408. }, /*#__PURE__*/React$1.createElement(ListSubheader, {
  2409. className: classes.groupLabel,
  2410. component: "div"
  2411. }, params.group), /*#__PURE__*/React$1.createElement("ul", {
  2412. className: classes.groupUl
  2413. }, params.children));
  2414. };
  2415. var renderGroup = renderGroupProp || defaultRenderGroup;
  2416. var renderOption = renderOptionProp || getOptionLabel;
  2417. var renderListOption = function renderListOption(option, index) {
  2418. var optionProps = getOptionProps({
  2419. option: option,
  2420. index: index
  2421. });
  2422. return /*#__PURE__*/React$1.createElement("li", _extends$1({}, optionProps, {
  2423. className: classes.option
  2424. }), renderOption(option, {
  2425. selected: optionProps['aria-selected'],
  2426. inputValue: inputValue
  2427. }));
  2428. };
  2429. var hasClearIcon = !disableClearable && !disabled;
  2430. var hasPopupIcon = (!freeSolo || forcePopupIcon === true) && forcePopupIcon !== false;
  2431. return /*#__PURE__*/React$1.createElement(React$1.Fragment, null, /*#__PURE__*/React$1.createElement("div", _extends$1({
  2432. ref: ref,
  2433. className: clsx(classes.root, className, focused && classes.focused, fullWidth && classes.fullWidth, hasClearIcon && classes.hasClearIcon, hasPopupIcon && classes.hasPopupIcon)
  2434. }, getRootProps(other)), renderInput({
  2435. id: id,
  2436. disabled: disabled,
  2437. fullWidth: true,
  2438. size: size === 'small' ? 'small' : undefined,
  2439. InputLabelProps: getInputLabelProps(),
  2440. InputProps: {
  2441. ref: setAnchorEl,
  2442. className: classes.inputRoot,
  2443. startAdornment: startAdornment,
  2444. endAdornment: /*#__PURE__*/React$1.createElement("div", {
  2445. className: classes.endAdornment
  2446. }, hasClearIcon ? /*#__PURE__*/React$1.createElement(IconButton, _extends$1({}, getClearProps(), {
  2447. "aria-label": clearText,
  2448. title: clearText,
  2449. className: clsx(classes.clearIndicator, dirty && classes.clearIndicatorDirty)
  2450. }), closeIcon) : null, hasPopupIcon ? /*#__PURE__*/React$1.createElement(IconButton, _extends$1({}, getPopupIndicatorProps(), {
  2451. disabled: disabled,
  2452. "aria-label": popupOpen ? closeText : openText,
  2453. title: popupOpen ? closeText : openText,
  2454. className: clsx(classes.popupIndicator, popupOpen && classes.popupIndicatorOpen)
  2455. }), popupIcon) : null)
  2456. },
  2457. inputProps: _extends$1({
  2458. className: clsx(classes.input, focusedTag === -1 && classes.inputFocused),
  2459. disabled: disabled
  2460. }, getInputProps())
  2461. })), popupOpen && anchorEl ? /*#__PURE__*/React$1.createElement(PopperComponent, {
  2462. className: clsx(classes.popper, disablePortal && classes.popperDisablePortal),
  2463. style: {
  2464. width: anchorEl ? anchorEl.clientWidth : null
  2465. },
  2466. role: "presentation",
  2467. anchorEl: anchorEl,
  2468. open: true
  2469. }, /*#__PURE__*/React$1.createElement(PaperComponent, {
  2470. className: classes.paper
  2471. }, loading && groupedOptions.length === 0 ? /*#__PURE__*/React$1.createElement("div", {
  2472. className: classes.loading
  2473. }, loadingText) : null, groupedOptions.length === 0 && !freeSolo && !loading ? /*#__PURE__*/React$1.createElement("div", {
  2474. className: classes.noOptions
  2475. }, noOptionsText) : null, groupedOptions.length > 0 ? /*#__PURE__*/React$1.createElement(ListboxComponent, _extends$1({
  2476. className: classes.listbox
  2477. }, getListboxProps(), ListboxProps), groupedOptions.map(function (option, index) {
  2478. if (groupBy) {
  2479. return renderGroup({
  2480. key: option.key,
  2481. group: option.group,
  2482. children: option.options.map(function (option2, index2) {
  2483. return renderListOption(option2, option.index + index2);
  2484. })
  2485. });
  2486. }
  2487. return renderListOption(option, index);
  2488. })) : null)) : null);
  2489. });
  2490. process.env.NODE_ENV !== "production" ? Autocomplete.propTypes = {
  2491. // ----------------------------- Warning --------------------------------
  2492. // | These PropTypes are generated from the TypeScript type definitions |
  2493. // | To update them edit the d.ts file and run "yarn proptypes" |
  2494. // ----------------------------------------------------------------------
  2495. /**
  2496. * If `true`, the portion of the selected suggestion that has not been typed by the user,
  2497. * known as the completion string, appears inline after the input cursor in the textbox.
  2498. * The inline completion string is visually highlighted and has a selected state.
  2499. */
  2500. autoComplete: propTypes.bool,
  2501. /**
  2502. * If `true`, the first option is automatically highlighted.
  2503. */
  2504. autoHighlight: propTypes.bool,
  2505. /**
  2506. * If `true`, the selected option becomes the value of the input
  2507. * when the Autocomplete loses focus unless the user chooses
  2508. * a different option or changes the character string in the input.
  2509. */
  2510. autoSelect: propTypes.bool,
  2511. /**
  2512. * Control if the input should be blurred when an option is selected:
  2513. *
  2514. * - `false` the input is not blurred.
  2515. * - `true` the input is always blurred.
  2516. * - `touch` the input is blurred after a touch event.
  2517. * - `mouse` the input is blurred after a mouse event.
  2518. */
  2519. blurOnSelect: propTypes.oneOfType([propTypes.oneOf(['mouse', 'touch']), propTypes.bool]),
  2520. /**
  2521. * Props applied to the [`Chip`](/api/chip/) element.
  2522. */
  2523. ChipProps: propTypes.object,
  2524. /**
  2525. * Override or extend the styles applied to the component.
  2526. * See [CSS API](#css) below for more details.
  2527. */
  2528. classes: propTypes.object,
  2529. /**
  2530. * @ignore
  2531. */
  2532. className: propTypes.string,
  2533. /**
  2534. * If `true`, the input's text will be cleared on blur if no value is selected.
  2535. *
  2536. * Set to `true` if you want to help the user enter a new value.
  2537. * Set to `false` if you want to help the user resume his search.
  2538. */
  2539. clearOnBlur: propTypes.bool,
  2540. /**
  2541. * If `true`, clear all values when the user presses escape and the popup is closed.
  2542. */
  2543. clearOnEscape: propTypes.bool,
  2544. /**
  2545. * Override the default text for the *clear* icon button.
  2546. *
  2547. * For localization purposes, you can use the provided [translations](/guides/localization/).
  2548. */
  2549. clearText: propTypes.string,
  2550. /**
  2551. * The icon to display in place of the default close icon.
  2552. */
  2553. closeIcon: propTypes.node,
  2554. /**
  2555. * Override the default text for the *close popup* icon button.
  2556. *
  2557. * For localization purposes, you can use the provided [translations](/guides/localization/).
  2558. */
  2559. closeText: propTypes.string,
  2560. /**
  2561. * If `true`, the popup will ignore the blur event if the input is filled.
  2562. * You can inspect the popup markup with your browser tools.
  2563. * Consider this option when you need to customize the component.
  2564. */
  2565. debug: propTypes.bool,
  2566. /**
  2567. * The default input value. Use when the component is not controlled.
  2568. */
  2569. defaultValue: propTypes.any,
  2570. /**
  2571. * If `true`, the input can't be cleared.
  2572. */
  2573. disableClearable: propTypes
  2574. /* @typescript-to-proptypes-ignore */
  2575. .bool,
  2576. /**
  2577. * If `true`, the popup won't close when a value is selected.
  2578. */
  2579. disableCloseOnSelect: propTypes.bool,
  2580. /**
  2581. * If `true`, the input will be disabled.
  2582. */
  2583. disabled: propTypes.bool,
  2584. /**
  2585. * If `true`, will allow focus on disabled items.
  2586. */
  2587. disabledItemsFocusable: propTypes.bool,
  2588. /**
  2589. * If `true`, the list box in the popup will not wrap focus.
  2590. */
  2591. disableListWrap: propTypes.bool,
  2592. /**
  2593. * Disable the portal behavior.
  2594. * The children stay within it's parent DOM hierarchy.
  2595. */
  2596. disablePortal: propTypes.bool,
  2597. /**
  2598. * A filter function that determines the options that are eligible.
  2599. *
  2600. * @param {T[]} options The options to render.
  2601. * @param {object} state The state of the component.
  2602. * @returns {T[]}
  2603. */
  2604. filterOptions: propTypes.func,
  2605. /**
  2606. * If `true`, hide the selected options from the list box.
  2607. */
  2608. filterSelectedOptions: propTypes.bool,
  2609. /**
  2610. * Force the visibility display of the popup icon.
  2611. */
  2612. forcePopupIcon: propTypes.oneOfType([propTypes.oneOf(['auto']), propTypes.bool]),
  2613. /**
  2614. * If `true`, the Autocomplete is free solo, meaning that the user input is not bound to provided options.
  2615. */
  2616. freeSolo: propTypes
  2617. /* @typescript-to-proptypes-ignore */
  2618. .bool,
  2619. /**
  2620. * If `true`, the input will take up the full width of its container.
  2621. */
  2622. fullWidth: propTypes.bool,
  2623. /**
  2624. * The label to display when the tags are truncated (`limitTags`).
  2625. *
  2626. * @param {number} more The number of truncated tags.
  2627. * @returns {ReactNode}
  2628. */
  2629. getLimitTagsText: propTypes.func,
  2630. /**
  2631. * Used to determine the disabled state for a given option.
  2632. *
  2633. * @param {T} option The option to test.
  2634. * @returns {boolean}
  2635. */
  2636. getOptionDisabled: propTypes.func,
  2637. /**
  2638. * Used to determine the string value for a given option.
  2639. * It's used to fill the input (and the list box options if `renderOption` is not provided).
  2640. *
  2641. * @param {T} option
  2642. * @returns {string}
  2643. */
  2644. getOptionLabel: propTypes.func,
  2645. /**
  2646. * Used to determine if an option is selected, considering the current value.
  2647. * Uses strict equality by default.
  2648. *
  2649. * @param {T} option The option to test.
  2650. * @param {T} value The value to test against.
  2651. * @returns {boolean}
  2652. */
  2653. getOptionSelected: propTypes.func,
  2654. /**
  2655. * If provided, the options will be grouped under the returned string.
  2656. * The groupBy value is also used as the text for group headings when `renderGroup` is not provided.
  2657. *
  2658. * @param {T} options The options to group.
  2659. * @returns {string}
  2660. */
  2661. groupBy: propTypes.func,
  2662. /**
  2663. * If `true`, the component handles the "Home" and "End" keys when the popup is open.
  2664. * It should move focus to the first option and last option, respectively.
  2665. */
  2666. handleHomeEndKeys: propTypes.bool,
  2667. /**
  2668. * This prop is used to help implement the accessibility logic.
  2669. * If you don't provide this prop. It falls back to a randomly generated id.
  2670. */
  2671. id: propTypes.string,
  2672. /**
  2673. * If `true`, the highlight can move to the input.
  2674. */
  2675. includeInputInList: propTypes.bool,
  2676. /**
  2677. * The input value.
  2678. */
  2679. inputValue: propTypes.string,
  2680. /**
  2681. * The maximum number of tags that will be visible when not focused.
  2682. * Set `-1` to disable the limit.
  2683. */
  2684. limitTags: propTypes.number,
  2685. /**
  2686. * The component used to render the listbox.
  2687. */
  2688. ListboxComponent: propTypes.elementType,
  2689. /**
  2690. * Props applied to the Listbox element.
  2691. */
  2692. ListboxProps: propTypes.object,
  2693. /**
  2694. * If `true`, the component is in a loading state.
  2695. */
  2696. loading: propTypes.bool,
  2697. /**
  2698. * Text to display when in a loading state.
  2699. *
  2700. * For localization purposes, you can use the provided [translations](/guides/localization/).
  2701. */
  2702. loadingText: propTypes.node,
  2703. /**
  2704. * If `true`, `value` must be an array and the menu will support multiple selections.
  2705. */
  2706. multiple: propTypes
  2707. /* @typescript-to-proptypes-ignore */
  2708. .bool,
  2709. /**
  2710. * Text to display when there are no options.
  2711. *
  2712. * For localization purposes, you can use the provided [translations](/guides/localization/).
  2713. */
  2714. noOptionsText: propTypes.node,
  2715. /**
  2716. * Callback fired when the value changes.
  2717. *
  2718. * @param {object} event The event source of the callback.
  2719. * @param {T|T[]} value The new value of the component.
  2720. * @param {string} reason One of "create-option", "select-option", "remove-option", "blur" or "clear".
  2721. */
  2722. onChange: propTypes.func,
  2723. /**
  2724. * Callback fired when the popup requests to be closed.
  2725. * Use in controlled mode (see open).
  2726. *
  2727. * @param {object} event The event source of the callback.
  2728. * @param {string} reason Can be: `"toggleInput"`, `"escape"`, `"select-option"`, `"blur"`.
  2729. */
  2730. onClose: propTypes.func,
  2731. /**
  2732. * Callback fired when the highlight option changes.
  2733. *
  2734. * @param {object} event The event source of the callback.
  2735. * @param {T} option The highlighted option.
  2736. * @param {string} reason Can be: `"keyboard"`, `"auto"`, `"mouse"`.
  2737. */
  2738. onHighlightChange: propTypes.func,
  2739. /**
  2740. * Callback fired when the input value changes.
  2741. *
  2742. * @param {object} event The event source of the callback.
  2743. * @param {string} value The new value of the text input.
  2744. * @param {string} reason Can be: `"input"` (user input), `"reset"` (programmatic change), `"clear"`.
  2745. */
  2746. onInputChange: propTypes.func,
  2747. /**
  2748. * Callback fired when the popup requests to be opened.
  2749. * Use in controlled mode (see open).
  2750. *
  2751. * @param {object} event The event source of the callback.
  2752. */
  2753. onOpen: propTypes.func,
  2754. /**
  2755. * Control the popup` open state.
  2756. */
  2757. open: propTypes.bool,
  2758. /**
  2759. * If `true`, the popup will open on input focus.
  2760. */
  2761. openOnFocus: propTypes.bool,
  2762. /**
  2763. * Override the default text for the *open popup* icon button.
  2764. *
  2765. * For localization purposes, you can use the provided [translations](/guides/localization/).
  2766. */
  2767. openText: propTypes.string,
  2768. /**
  2769. * Array of options.
  2770. */
  2771. options: propTypes.array.isRequired,
  2772. /**
  2773. * The component used to render the body of the popup.
  2774. */
  2775. PaperComponent: propTypes.elementType,
  2776. /**
  2777. * The component used to position the popup.
  2778. */
  2779. PopperComponent: propTypes.elementType,
  2780. /**
  2781. * The icon to display in place of the default popup icon.
  2782. */
  2783. popupIcon: propTypes.node,
  2784. /**
  2785. * Render the group.
  2786. *
  2787. * @param {any} option The group to render.
  2788. * @returns {ReactNode}
  2789. */
  2790. renderGroup: propTypes.func,
  2791. /**
  2792. * Render the input.
  2793. *
  2794. * @param {object} params
  2795. * @returns {ReactNode}
  2796. */
  2797. renderInput: propTypes.func.isRequired,
  2798. /**
  2799. * Render the option, use `getOptionLabel` by default.
  2800. *
  2801. * @param {T} option The option to render.
  2802. * @param {object} state The state of the component.
  2803. * @returns {ReactNode}
  2804. */
  2805. renderOption: propTypes.func,
  2806. /**
  2807. * Render the selected value.
  2808. *
  2809. * @param {T[]} value The `value` provided to the component.
  2810. * @param {function} getTagProps A tag props getter.
  2811. * @returns {ReactNode}
  2812. */
  2813. renderTags: propTypes.func,
  2814. /**
  2815. * If `true`, the input's text will be selected on focus.
  2816. * It helps the user clear the selected value.
  2817. */
  2818. selectOnFocus: propTypes.bool,
  2819. /**
  2820. * The size of the autocomplete.
  2821. */
  2822. size: propTypes.oneOf(['medium', 'small']),
  2823. /**
  2824. * The value of the autocomplete.
  2825. *
  2826. * The value must have reference equality with the option in order to be selected.
  2827. * You can customize the equality behavior with the `getOptionSelected` prop.
  2828. */
  2829. value: propTypes.any
  2830. } : void 0;
  2831. var Autocomplete$1 = styles$1.withStyles(styles, {
  2832. name: 'MuiAutocomplete'
  2833. })(Autocomplete);
  2834. var filter = createFilterOptions();
  2835. var BootstrapInput = styles$1.withStyles(function (theme) {
  2836. return {
  2837. root: {
  2838. 'label + &': {
  2839. marginTop: theme.spacing(3)
  2840. }
  2841. },
  2842. input: {
  2843. borderRadius: 4,
  2844. position: 'relative',
  2845. backgroundColor: 'transparent',
  2846. border: '1px solid #ced4da',
  2847. fontSize: 16,
  2848. padding: '10px 26px 10px 12px',
  2849. transition: theme.transitions.create(['border-color', 'box-shadow']),
  2850. fontFamily: ['-apple-system', 'BlinkMacSystemFont', '"Segoe UI"', 'Roboto', '"Helvetica Neue"', 'Arial', 'sans-serif', '"Apple Color Emoji"', '"Segoe UI Emoji"', '"Segoe UI Symbol"'].join(','),
  2851. '&:focus': {
  2852. borderRadius: 4,
  2853. borderColor: '#80bdff',
  2854. boxShadow: '0 0 0 0.2rem rgba(0,123,255,.25)'
  2855. }
  2856. }
  2857. };
  2858. })(core.InputBase);
  2859. var useStyles = styles$1.makeStyles(function (theme) {
  2860. return {
  2861. root: {
  2862. width: '100%'
  2863. },
  2864. paper: {
  2865. width: '100%',
  2866. marginBottom: theme.spacing(2)
  2867. },
  2868. table: {
  2869. minWidth: 750
  2870. },
  2871. visuallyHidden: {
  2872. border: 0,
  2873. clip: 'rect(0 0 0 0)',
  2874. height: 1,
  2875. margin: -1,
  2876. overflow: 'hidden',
  2877. padding: 0,
  2878. position: 'absolute',
  2879. top: 20,
  2880. width: 1
  2881. },
  2882. underline: {
  2883. "&&&:before": {
  2884. borderBottom: "none"
  2885. },
  2886. "&&:after": {
  2887. borderBottom: "none"
  2888. }
  2889. }
  2890. };
  2891. });
  2892. function FieldList(props) {
  2893. var classes = useStyles();
  2894. var _props$fields = props.fields,
  2895. fields = _props$fields === void 0 ? [] : _props$fields,
  2896. _props$updateData = props.updateData,
  2897. updateData = _props$updateData === void 0 ? {} : _props$updateData,
  2898. _props$isNew = props.isNew,
  2899. isNew = _props$isNew === void 0 ? false : _props$isNew,
  2900. currentTabName = props.currentTabName,
  2901. onCanCreateNew = props.onCanCreateNew,
  2902. _props$actions = props.actions,
  2903. actions = _props$actions === void 0 ? [] : _props$actions;
  2904. var _React$useState = React$1__default.useState(updateData != undefined ? updateData : {}),
  2905. data = _React$useState[0],
  2906. setDataField = _React$useState[1];
  2907. var handleTextString = function handleTextString(e, fieldName) {
  2908. var _extends2;
  2909. setDataField(_extends({}, data, (_extends2 = {}, _extends2[fieldName] = e.target.value, _extends2)));
  2910. };
  2911. var handleTextNumber = function handleTextNumber(e, fieldName) {
  2912. var _extends3;
  2913. setDataField(_extends({}, data, (_extends3 = {}, _extends3[fieldName] = e.target.value, _extends3)));
  2914. };
  2915. var handleTextMultiline = function handleTextMultiline(e, fieldName) {
  2916. var _extends4;
  2917. setDataField(_extends({}, data, (_extends4 = {}, _extends4[fieldName] = e.target.value, _extends4)));
  2918. };
  2919. var handleDate = function handleDate(e, fieldName) {
  2920. var _extends5;
  2921. setDataField(_extends({}, data, (_extends5 = {}, _extends5[fieldName] = e.target.value, _extends5)));
  2922. };
  2923. var handleDropDownChange = function handleDropDownChange(e, fieldName) {
  2924. var _extends6;
  2925. var selectedIndex = e.target.options.selectedIndex;
  2926. var selectedValue = e.target.options[selectedIndex].getAttribute('name');
  2927. var fn = fieldName.split('_');
  2928. var fieldId = fn[0] + '_' + 'id';
  2929. setDataField(_extends({}, data, (_extends6 = {}, _extends6[fieldName] = selectedValue, _extends6[fieldId] = e.target.value, _extends6)));
  2930. };
  2931. var handleCanCreateNew = function handleCanCreateNew(data) {
  2932. onCanCreateNew(data);
  2933. };
  2934. var onChangeValue = function onChangeValue(fieldName, value) {
  2935. var fn = fieldName.split('_');
  2936. var fieldId = fn[0] + '_' + 'id';
  2937. var d = value['name'] != undefined ? value['name'] : value['product_desc'];
  2938. if (isNew) {
  2939. var _extends8;
  2940. setDataField(_extends({}, data, (_extends8 = {}, _extends8[fieldName] = d, _extends8[fieldId] = value['id'], _extends8)));
  2941. } else {
  2942. var _extends9;
  2943. setDataField(_extends({}, data, (_extends9 = {}, _extends9[fieldName] = d, _extends9[fieldId] = value['id'], _extends9)));
  2944. }
  2945. };
  2946. return /*#__PURE__*/React$1__default.createElement("div", {
  2947. className: classes.root
  2948. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  2949. container: true
  2950. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  2951. item: true,
  2952. xs: 12
  2953. }, fields.map(function (f, i) {
  2954. if (f.type == 'text_string') {
  2955. return /*#__PURE__*/React$1__default.createElement(core.Grid, {
  2956. key: f.fieldName,
  2957. container: true,
  2958. style: {
  2959. display: 'flex',
  2960. alignItems: 'center',
  2961. marginBottom: '10px'
  2962. }
  2963. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  2964. item: true,
  2965. xs: 12,
  2966. sm: 5
  2967. }, /*#__PURE__*/React$1__default.createElement(core.Box, {
  2968. style: {
  2969. width: '150px'
  2970. }
  2971. }, /*#__PURE__*/React$1__default.createElement(core.Typography, {
  2972. style: {
  2973. paddingRight: '30px',
  2974. color: 'grey'
  2975. }
  2976. }, f.label))), /*#__PURE__*/React$1__default.createElement(core.Grid, {
  2977. item: true,
  2978. xs: 12,
  2979. sm: 7
  2980. }, /*#__PURE__*/React$1__default.createElement(core.TextField, {
  2981. id: f.fieldName,
  2982. variant: "outlined",
  2983. autoComplete: "off",
  2984. size: "small",
  2985. style: {
  2986. width: '100%'
  2987. },
  2988. InputProps: {
  2989. readOnly: f.readOnly ? f.readOnly : false
  2990. },
  2991. value: data != undefined ? data[f.fieldName] : '',
  2992. onChange: function onChange(e) {
  2993. return handleTextString(e, f.fieldName);
  2994. }
  2995. })));
  2996. } else if (f.type == 'text_number') {
  2997. return /*#__PURE__*/React$1__default.createElement(core.Grid, {
  2998. key: f.fieldName,
  2999. container: true,
  3000. style: {
  3001. display: 'flex',
  3002. alignItems: 'center',
  3003. marginBottom: '10px'
  3004. }
  3005. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3006. item: true,
  3007. xs: 12,
  3008. sm: 5
  3009. }, /*#__PURE__*/React$1__default.createElement(core.Box, {
  3010. style: {
  3011. width: '150px'
  3012. }
  3013. }, /*#__PURE__*/React$1__default.createElement(core.Typography, {
  3014. style: {
  3015. paddingRight: '30px',
  3016. color: 'grey'
  3017. }
  3018. }, f.label))), /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3019. item: true,
  3020. xs: 12,
  3021. sm: 7
  3022. }, /*#__PURE__*/React$1__default.createElement(core.TextField, {
  3023. id: f.fieldName,
  3024. variant: "outlined",
  3025. autoComplete: "off",
  3026. size: "small",
  3027. style: {
  3028. width: '100%'
  3029. },
  3030. type: "number",
  3031. value: data != undefined ? data[f.fieldName] : '',
  3032. onChange: function onChange(e) {
  3033. return handleTextNumber(e, f.fieldName);
  3034. }
  3035. })));
  3036. } else if (f.type == 'text_multiline') {
  3037. return /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3038. key: f.fieldName,
  3039. container: true,
  3040. style: {
  3041. display: 'flex',
  3042. alignItems: 'center',
  3043. marginBottom: '10px'
  3044. }
  3045. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3046. item: true,
  3047. xs: 12,
  3048. sm: 5
  3049. }, /*#__PURE__*/React$1__default.createElement(core.Box, {
  3050. style: {
  3051. width: '150px'
  3052. }
  3053. }, /*#__PURE__*/React$1__default.createElement(core.Typography, {
  3054. style: {
  3055. paddingRight: '30px',
  3056. color: 'grey'
  3057. }
  3058. }, f.label))), /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3059. item: true,
  3060. xs: 12,
  3061. sm: 7
  3062. }, /*#__PURE__*/React$1__default.createElement(core.TextField, {
  3063. id: f.fieldName,
  3064. multiline: true,
  3065. autoComplete: "off",
  3066. rows: 3,
  3067. size: "small",
  3068. style: {
  3069. width: '100%'
  3070. },
  3071. value: data != undefined ? data[f.fieldName] : '',
  3072. variant: "outlined",
  3073. onChange: function onChange(e) {
  3074. return handleTextMultiline(e, f.fieldName);
  3075. }
  3076. })));
  3077. } else if (f.type == 'date') {
  3078. return /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3079. key: f.fieldName,
  3080. container: true,
  3081. style: {
  3082. display: 'flex',
  3083. alignItems: 'center',
  3084. marginBottom: '10px'
  3085. }
  3086. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3087. item: true,
  3088. xs: 12,
  3089. sm: 5
  3090. }, /*#__PURE__*/React$1__default.createElement(core.Box, {
  3091. style: {
  3092. width: '150px'
  3093. }
  3094. }, /*#__PURE__*/React$1__default.createElement(core.Typography, {
  3095. style: {
  3096. paddingRight: '30px',
  3097. color: 'grey'
  3098. }
  3099. }, f.label))), /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3100. item: true,
  3101. xs: 12,
  3102. sm: 7
  3103. }, /*#__PURE__*/React$1__default.createElement(core.TextField, {
  3104. id: f.fieldName,
  3105. variant: "outlined",
  3106. autoComplete: "off",
  3107. size: "small",
  3108. value: data != undefined ? data[f.fieldName] : '',
  3109. type: "date",
  3110. style: {
  3111. width: '100%'
  3112. },
  3113. onChange: function onChange(e) {
  3114. return handleDate(e, f.fieldName);
  3115. }
  3116. })));
  3117. } else if (f.type == 'dropdown') {
  3118. if (f.options != undefined) {
  3119. if (f.fieldName == 'priority') {
  3120. var _React$createElement;
  3121. return /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3122. key: f.fieldName,
  3123. container: true,
  3124. style: {
  3125. display: 'flex',
  3126. alignItems: 'center',
  3127. marginBottom: '10px'
  3128. }
  3129. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3130. item: true,
  3131. xs: 12,
  3132. sm: 5
  3133. }, /*#__PURE__*/React$1__default.createElement(core.Box, {
  3134. style: {
  3135. width: '150px'
  3136. }
  3137. }, /*#__PURE__*/React$1__default.createElement(core.Typography, {
  3138. style: {
  3139. paddingRight: '30px',
  3140. color: 'grey'
  3141. }
  3142. }, f.label))), /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3143. item: true,
  3144. xs: 12,
  3145. sm: 7
  3146. }, /*#__PURE__*/React$1__default.createElement(core.NativeSelect, (_React$createElement = {
  3147. id: "demo-customized-select-native",
  3148. value: data != undefined ? data[f.fieldName] : '',
  3149. onChange: function onChange(e) {
  3150. return handleDropDownChange(e, f.fieldName);
  3151. }
  3152. }, _React$createElement["id"] = f.fieldName, _React$createElement.input = /*#__PURE__*/React$1__default.createElement(BootstrapInput, null), _React$createElement.style = {
  3153. width: '100%'
  3154. }, _React$createElement), /*#__PURE__*/React$1__default.createElement("option", {
  3155. "aria-label": "None",
  3156. value: ""
  3157. }, "Select"), f.options.map(function (d, i) {
  3158. return /*#__PURE__*/React$1__default.createElement("option", {
  3159. name: d.name,
  3160. value: d.id
  3161. }, d.name);
  3162. }))));
  3163. } else {
  3164. var fn = f.fieldName.split('_');
  3165. var fieldId = fn[0] + '_' + 'id';
  3166. if (isNew) {
  3167. return /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3168. key: f.fieldName,
  3169. container: true,
  3170. style: {
  3171. display: 'flex',
  3172. alignItems: 'center',
  3173. marginBottom: '10px'
  3174. }
  3175. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3176. item: true,
  3177. xs: 12,
  3178. sm: 5
  3179. }, /*#__PURE__*/React$1__default.createElement(core.Box, {
  3180. style: {
  3181. width: '150px'
  3182. }
  3183. }, /*#__PURE__*/React$1__default.createElement(core.Typography, {
  3184. style: {
  3185. paddingRight: '30px',
  3186. color: 'grey'
  3187. }
  3188. }, f.label))), /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3189. item: true,
  3190. xs: 12,
  3191. sm: 7
  3192. }, /*#__PURE__*/React$1__default.createElement(Autocomplete$1, {
  3193. id: "combo-box-demo",
  3194. options: f.options,
  3195. getOptionLabel: function getOptionLabel(option) {
  3196. if (typeof option === 'string') {
  3197. return option;
  3198. }
  3199. return option[f.fieldName] != undefined ? option[f.fieldName] : option.name != undefined ? option.name : option.product_desc != undefined ? option.product_desc : '';
  3200. },
  3201. style: {
  3202. width: '100%'
  3203. },
  3204. size: "small",
  3205. value: data != undefined ? data[f.fieldName] ? data[f.fieldName] : " " : " ",
  3206. filterOptions: function filterOptions(options, params) {
  3207. console.log("Autocomplete", f.canCreate);
  3208. if (f.canCreate) {
  3209. var newFilter = ['+ Add New'];
  3210. var filtered = filter(options, params);
  3211. return [].concat(newFilter, filtered);
  3212. } else {
  3213. var filtered = filter(options, params);
  3214. return filtered;
  3215. }
  3216. },
  3217. onChange: function onChange(event, newValue) {
  3218. if (typeof newValue === 'string') {
  3219. console.log('f.fieldName', f.fieldName, " f.canCreate", f.canCreate);
  3220. var d = {
  3221. "canCreate": f.canCreate,
  3222. "fields": f.fields,
  3223. "name": f.name,
  3224. "fieldName": f.fieldName
  3225. };
  3226. handleCanCreateNew(d);
  3227. } else {
  3228. if (newValue != null && newValue.inputValue != '' && newValue.product_desc != "") {
  3229. onChangeValue(f.fieldName, newValue);
  3230. }
  3231. }
  3232. },
  3233. renderInput: function renderInput(params) {
  3234. return /*#__PURE__*/React$1__default.createElement(core.TextField, _extends({}, params, {
  3235. variant: "outlined"
  3236. }));
  3237. }
  3238. })));
  3239. } else {
  3240. var _React$createElement2;
  3241. return /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3242. key: f.fieldName,
  3243. container: true,
  3244. style: {
  3245. display: 'flex',
  3246. alignItems: 'center',
  3247. marginBottom: '10px'
  3248. }
  3249. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3250. item: true,
  3251. xs: 12,
  3252. sm: 5
  3253. }, /*#__PURE__*/React$1__default.createElement(core.Box, {
  3254. style: {
  3255. width: '150px'
  3256. }
  3257. }, /*#__PURE__*/React$1__default.createElement(core.Typography, {
  3258. style: {
  3259. paddingRight: '30px',
  3260. color: 'grey'
  3261. }
  3262. }, f.label))), /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3263. item: true,
  3264. xs: 12,
  3265. sm: 7
  3266. }, /*#__PURE__*/React$1__default.createElement(core.NativeSelect, (_React$createElement2 = {
  3267. id: "demo-customized-select-native",
  3268. value: data != undefined ? data[fieldId] : '',
  3269. onChange: function onChange(e) {
  3270. return handleDropDownChange(e, f.fieldName);
  3271. }
  3272. }, _React$createElement2["id"] = f.fieldName, _React$createElement2.input = /*#__PURE__*/React$1__default.createElement(BootstrapInput, null), _React$createElement2.style = {
  3273. width: '100%'
  3274. }, _React$createElement2), /*#__PURE__*/React$1__default.createElement("option", {
  3275. "aria-label": "None",
  3276. value: ""
  3277. }, "Select"), f.options.map(function (d, i) {
  3278. var name = d[f.fieldName] != undefined ? d[f.fieldName] : d.name;
  3279. return /*#__PURE__*/React$1__default.createElement("option", {
  3280. name: name,
  3281. value: d.id
  3282. }, name);
  3283. }))));
  3284. }
  3285. }
  3286. }
  3287. } else if (f.type == 'photo_list') {
  3288. console.log('photo_list:', data);
  3289. return /*#__PURE__*/React$1__default.createElement("div", null, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3290. key: f.fieldName,
  3291. container: true,
  3292. style: {
  3293. display: 'flex',
  3294. alignItems: 'center',
  3295. marginBottom: '10px'
  3296. }
  3297. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3298. item: true,
  3299. xs: 12,
  3300. sm: 5
  3301. }, /*#__PURE__*/React$1__default.createElement(core.Box, {
  3302. style: {
  3303. width: '150px'
  3304. }
  3305. }, /*#__PURE__*/React$1__default.createElement(core.Typography, {
  3306. style: {
  3307. paddingRight: '30px',
  3308. color: 'grey'
  3309. }
  3310. }, f.label))), /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3311. item: true,
  3312. xs: 12,
  3313. sm: 7
  3314. }, /*#__PURE__*/React$1__default.createElement("div", {
  3315. style: {
  3316. display: 'flex',
  3317. alignItems: 'center',
  3318. marginBottom: '10px'
  3319. }
  3320. }, /*#__PURE__*/React$1__default.createElement("form", null, /*#__PURE__*/React$1__default.createElement("div", {
  3321. className: "form-group"
  3322. }, /*#__PURE__*/React$1__default.createElement("input", {
  3323. type: "file",
  3324. name: "imgCollection",
  3325. onChange: function onChange(e) {
  3326. return onFileChange(e, f.fieldName);
  3327. },
  3328. multiple: true
  3329. })))))), data[f.fieldName] != undefined && data[f.fieldName].length != 0 ? /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3330. key: f.fieldName,
  3331. container: true,
  3332. style: {
  3333. display: 'flex',
  3334. alignItems: 'center',
  3335. marginBottom: '10px'
  3336. }
  3337. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3338. item: true,
  3339. xs: 12
  3340. }, /*#__PURE__*/React$1__default.createElement("div", {
  3341. style: {
  3342. display: 'block',
  3343. alignItems: 'center',
  3344. marginBottom: '10px'
  3345. }
  3346. }, /*#__PURE__*/React$1__default.createElement(GridList, {
  3347. className: classes.gridList
  3348. }, data[f.fieldName] == undefined ? /*#__PURE__*/React$1__default.createElement("span", null) : data[f.fieldName].map(function (tile) {
  3349. return /*#__PURE__*/React$1__default.createElement(GridListTile, {
  3350. key: tile,
  3351. style: {
  3352. width: '100px',
  3353. height: '100px'
  3354. }
  3355. }, /*#__PURE__*/React$1__default.createElement("img", {
  3356. src: tile,
  3357. alt: tile,
  3358. onClick: function onClick(e) {
  3359. setSelectedPhoto(tile);
  3360. setOpen(true);
  3361. }
  3362. }));
  3363. })))), /*#__PURE__*/React$1__default.createElement(Dialog, {
  3364. maxWidth: "lg",
  3365. "aria-labelledby": "customized-dialog-title",
  3366. open: open
  3367. }, /*#__PURE__*/React$1__default.createElement(DialogTitle, {
  3368. id: "customized-dialog-title",
  3369. onClose: function onClose(e) {
  3370. return setOpen(false);
  3371. }
  3372. }, "Photos"), /*#__PURE__*/React$1__default.createElement(DialogContent, {
  3373. dividers: true
  3374. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3375. item: true,
  3376. xs: 12
  3377. }, /*#__PURE__*/React$1__default.createElement(core.Grid, null, /*#__PURE__*/React$1__default.createElement("img", {
  3378. src: selectedPhoto,
  3379. className: "show-img",
  3380. alt: "logo"
  3381. })), /*#__PURE__*/React$1__default.createElement("br", null), /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3382. container: true,
  3383. spacing: 3
  3384. }, data[f.fieldName].length > 0 ? data[f.fieldName].map(function (value) {
  3385. return /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3386. key: value,
  3387. item: true
  3388. }, /*#__PURE__*/React$1__default.createElement(core.Box, {
  3389. className: "square"
  3390. }, " ", /*#__PURE__*/React$1__default.createElement("img", {
  3391. src: value,
  3392. className: "thumnail-img",
  3393. alt: "logo",
  3394. onClick: function onClick(e) {
  3395. return setSelectedPhoto(value);
  3396. }
  3397. })));
  3398. }) : /*#__PURE__*/React$1__default.createElement("span", null)))))) : /*#__PURE__*/React$1__default.createElement(core.Grid, null));
  3399. } else if (f.type == 'list') {
  3400. console.log('list', data[f.fieldName]);
  3401. return /*#__PURE__*/React$1__default.createElement("div", null, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3402. key: f.fieldName,
  3403. container: true,
  3404. style: {
  3405. display: 'flex',
  3406. alignItems: 'center',
  3407. marginBottom: '10px'
  3408. }
  3409. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3410. item: true,
  3411. xs: 12,
  3412. sm: 5
  3413. }, /*#__PURE__*/React$1__default.createElement(core.Box, {
  3414. style: {
  3415. width: '150px'
  3416. }
  3417. }, /*#__PURE__*/React$1__default.createElement(core.Typography, {
  3418. style: {
  3419. paddingRight: '30px',
  3420. color: 'grey'
  3421. }
  3422. }, f.label))), /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3423. item: true,
  3424. xs: 12,
  3425. sm: 7
  3426. }, /*#__PURE__*/React$1__default.createElement("div", {
  3427. style: {
  3428. display: 'block',
  3429. alignItems: 'center',
  3430. marginBottom: '10px'
  3431. }
  3432. }, /*#__PURE__*/React$1__default.createElement(core.Box, null, /*#__PURE__*/React$1__default.createElement(core.Button, {
  3433. onClick: handleSelectItemDialog
  3434. }, /*#__PURE__*/React$1__default.createElement(AddIcon, null)))))), /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3435. key: f.fieldName,
  3436. container: true,
  3437. style: {
  3438. display: 'block',
  3439. alignItems: 'center',
  3440. marginBottom: '10px'
  3441. }
  3442. }, /*#__PURE__*/React$1__default.createElement("div", {
  3443. style: {
  3444. display: 'block',
  3445. alignItems: 'center',
  3446. marginBottom: '10px'
  3447. }
  3448. }, /*#__PURE__*/React$1__default.createElement(TableContainer, null, /*#__PURE__*/React$1__default.createElement(Table, {
  3449. className: classes.table,
  3450. size: "small",
  3451. "aria-label": "a dense table"
  3452. }, /*#__PURE__*/React$1__default.createElement(TableHead, null, /*#__PURE__*/React$1__default.createElement(TableRow, null, partHeaders.map(function (h, i) {
  3453. return /*#__PURE__*/React$1__default.createElement(TableCell, {
  3454. key: h.id,
  3455. align: "left"
  3456. }, h.label);
  3457. }))), /*#__PURE__*/React$1__default.createElement(TableBody, null, data[f.fieldName].length > 0 ? data[f.fieldName].map(function (row) {
  3458. return /*#__PURE__*/React$1__default.createElement(TableRow, {
  3459. key: row.name
  3460. }, partHeaders.map(function (h, i) {
  3461. return /*#__PURE__*/React$1__default.createElement(TableCell, {
  3462. key: h.id,
  3463. align: h.numeric ? 'right' : 'left'
  3464. }, row[h.id]);
  3465. }));
  3466. }) : /*#__PURE__*/React$1__default.createElement("span", null)))))));
  3467. } else if (f.type == 'time') {
  3468. return /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3469. key: f.fieldName,
  3470. container: true,
  3471. style: {
  3472. display: 'flex',
  3473. alignItems: 'center',
  3474. marginBottom: '10px'
  3475. }
  3476. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3477. item: true,
  3478. xs: 12,
  3479. sm: 5
  3480. }, /*#__PURE__*/React$1__default.createElement(core.Box, {
  3481. style: {
  3482. width: '150px'
  3483. }
  3484. }, /*#__PURE__*/React$1__default.createElement(core.Typography, {
  3485. style: {
  3486. paddingRight: '30px',
  3487. color: 'grey'
  3488. }
  3489. }, f.label))), /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3490. item: true,
  3491. xs: 12,
  3492. sm: 7
  3493. }, " ", /*#__PURE__*/React$1__default.createElement(core.TextField, {
  3494. id: "time",
  3495. variant: "outlined",
  3496. size: "small",
  3497. type: "time",
  3498. className: classes.textField,
  3499. InputLabelProps: {
  3500. shrink: true
  3501. },
  3502. inputProps: {
  3503. step: 300
  3504. },
  3505. onChange: function onChange(e) {
  3506. return handleTime(e, f.fieldName);
  3507. }
  3508. })));
  3509. }
  3510. })), actions.length > 0 ? currentTabName === 'account' ? /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3511. item: true,
  3512. xs: 12
  3513. }, data != undefined ? actions.map(function (a) {
  3514. if (a.status === data.status) {
  3515. return /*#__PURE__*/React$1__default.createElement(MButton, {
  3516. action: a,
  3517. onCallback: a.callback(data)
  3518. });
  3519. }
  3520. }) : /*#__PURE__*/React$1__default.createElement(core.Grid, null)) : /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3521. item: true,
  3522. xs: 12
  3523. }, actions.map(function (a) {
  3524. if (a.status === data.status && currentTabName !== 'account') {
  3525. return /*#__PURE__*/React$1__default.createElement(MButton, {
  3526. action: a,
  3527. onCallback: a.callback(data)
  3528. });
  3529. }
  3530. })) : /*#__PURE__*/React$1__default.createElement(core.Grid, null)));
  3531. }
  3532. FieldList.propTypes = {
  3533. history: propTypes.object,
  3534. fields: propTypes.array.isRequired,
  3535. updateData: propTypes.object,
  3536. isNew: propTypes.bool,
  3537. currentTabName: propTypes.string,
  3538. onCancel: propTypes.func,
  3539. actions: propTypes.array,
  3540. onCanCreateNew: propTypes.func
  3541. };
  3542. function descendingComparator(a, b, orderBy) {
  3543. if (b[orderBy] < a[orderBy]) {
  3544. return -1;
  3545. }
  3546. if (b[orderBy] > a[orderBy]) {
  3547. return 1;
  3548. }
  3549. return 0;
  3550. }
  3551. function getComparator(order, orderBy) {
  3552. return order === 'desc' ? function (a, b) {
  3553. return descendingComparator(a, b, orderBy);
  3554. } : function (a, b) {
  3555. return -descendingComparator(a, b, orderBy);
  3556. };
  3557. }
  3558. function stableSort(array, comparator) {
  3559. var stabilizedThis = array.map(function (el, index) {
  3560. return [el, index];
  3561. });
  3562. stabilizedThis.sort(function (a, b) {
  3563. var order = comparator(a[0], b[0]);
  3564. if (order !== 0) return order;
  3565. return a[1] - b[1];
  3566. });
  3567. return stabilizedThis.map(function (el) {
  3568. return el[0];
  3569. });
  3570. }
  3571. function EnhancedTableHead(props) {
  3572. var classes = props.classes,
  3573. order = props.order,
  3574. orderBy = props.orderBy,
  3575. onRequestSort = props.onRequestSort,
  3576. onRefreshData = props.onRefreshData,
  3577. headCells = props.headCells;
  3578. var createSortHandler = function createSortHandler(property) {
  3579. return function (event) {
  3580. onRequestSort(event, property);
  3581. onRefreshData();
  3582. };
  3583. };
  3584. return /*#__PURE__*/React$1__default.createElement(TableHead$1, null, /*#__PURE__*/React$1__default.createElement(TableRow$1, null, headCells.map(function (headCell) {
  3585. return /*#__PURE__*/React$1__default.createElement(TableCell$1, {
  3586. key: headCell.id,
  3587. align: headCell.numeric ? 'right' : 'left',
  3588. padding: headCell.disablePadding ? 'none' : 'default',
  3589. sortDirection: orderBy === headCell.id ? order : false
  3590. }, headCell.id != 'id' ? /*#__PURE__*/React$1__default.createElement(TableSortLabel, {
  3591. active: orderBy === headCell.id,
  3592. direction: orderBy === headCell.id ? order : 'asc',
  3593. onClick: createSortHandler(headCell.id)
  3594. }, headCell.label, orderBy === headCell.id ? /*#__PURE__*/React$1__default.createElement("span", {
  3595. className: classes.visuallyHidden
  3596. }, order === 'desc' ? 'sorted descending' : 'sorted ascending') : null) : /*#__PURE__*/React$1__default.createElement(TableSortLabel, {
  3597. hideSortIcon: true
  3598. }, headCell.label));
  3599. })));
  3600. }
  3601. EnhancedTableHead.propTypes = {
  3602. classes: propTypes.object.isRequired,
  3603. numSelected: propTypes.number.isRequired,
  3604. onRequestSort: propTypes.func.isRequired,
  3605. onRefreshData: propTypes.func.isRequired,
  3606. onSelectAllClick: propTypes.func.isRequired,
  3607. order: propTypes.oneOf(['asc', 'desc']).isRequired,
  3608. orderBy: propTypes.string.isRequired,
  3609. rowCount: propTypes.number.isRequired
  3610. };
  3611. var useStyles$1 = styles$1.makeStyles(function (theme) {
  3612. return {
  3613. root: {
  3614. width: '100%'
  3615. },
  3616. paper: {
  3617. width: '100%',
  3618. marginBottom: theme.spacing(2)
  3619. },
  3620. table: {
  3621. minWidth: 750
  3622. },
  3623. visuallyHidden: {
  3624. border: 0,
  3625. clip: 'rect(0 0 0 0)',
  3626. height: 1,
  3627. margin: -1,
  3628. overflow: 'hidden',
  3629. padding: 0,
  3630. position: 'absolute',
  3631. top: 20,
  3632. width: 1
  3633. },
  3634. underline: {
  3635. "&&&:before": {
  3636. borderBottom: "none"
  3637. },
  3638. "&&:after": {
  3639. borderBottom: "none"
  3640. }
  3641. }
  3642. };
  3643. });
  3644. function TableTemplate(props) {
  3645. var _React$createElement;
  3646. var classes = useStyles$1();
  3647. var _props$data = props.data,
  3648. data = _props$data === void 0 ? [] : _props$data,
  3649. _props$headers = props.headers,
  3650. headers = _props$headers === void 0 ? [] : _props$headers,
  3651. onUpdateData = props.onUpdateData,
  3652. onReloadData = props.onReloadData,
  3653. onChangePage = props.onChangePage,
  3654. onChangeRowsPerPage = props.onChangeRowsPerPage,
  3655. _props$rowsPerPage = props.rowsPerPage,
  3656. rowsPerPage = _props$rowsPerPage === void 0 ? 10 : _props$rowsPerPage,
  3657. _props$page = props.page,
  3658. page = _props$page === void 0 ? 0 : _props$page,
  3659. _props$order = props.order,
  3660. order = _props$order === void 0 ? 'asc' : _props$order,
  3661. orderBy = props.orderBy;
  3662. var _React$useState = React$1__default.useState([]),
  3663. selected = _React$useState[0],
  3664. setSelected = _React$useState[1];
  3665. var _React$useState2 = React$1__default.useState(false),
  3666. dense = _React$useState2[0];
  3667. var _React$useState3 = React$1__default.useState(rowsPerPage != undefined ? rowsPerPage : 10),
  3668. rowDataPerPage = _React$useState3[0],
  3669. setRowsPerPage = _React$useState3[1];
  3670. var _React$useState4 = React$1__default.useState(page != undefined ? page : 0),
  3671. paginatePage = _React$useState4[0];
  3672. var _React$useState5 = React$1__default.useState(order != undefined ? order : 'asc'),
  3673. setOrder = _React$useState5[1];
  3674. var _React$useState6 = React$1__default.useState(orderBy != undefined ? orderBy : 'name'),
  3675. setOrderBy = _React$useState6[1];
  3676. var offset = paginatePage * rowDataPerPage;
  3677. var handleRequestSort = function handleRequestSort(event, property) {
  3678. var isAsc = orderBy === property && order === 'asc';
  3679. setOrder(isAsc ? 'desc' : 'asc');
  3680. setOrderBy(property);
  3681. };
  3682. var handleSelectAllClick = function handleSelectAllClick(event) {
  3683. if (event.target.checked) {
  3684. var newSelecteds = data.map(function (n) {
  3685. return n.name;
  3686. });
  3687. setSelected(newSelecteds);
  3688. return;
  3689. }
  3690. setSelected([]);
  3691. };
  3692. var handleClick = function handleClick(event, rowdata) {
  3693. onUpdateData(true, rowdata);
  3694. };
  3695. var handleChangePage = function handleChangePage(event, newPage) {
  3696. onChangePage(newPage);
  3697. };
  3698. var handleReloadData = function handleReloadData() {
  3699. onReloadData();
  3700. };
  3701. var handleChangeRowsPerPage = function handleChangeRowsPerPage(event) {
  3702. setRowsPerPage(parseInt(event.target.value, 10));
  3703. onChangeRowsPerPage(parseInt(event.target.value));
  3704. onReloadData();
  3705. };
  3706. var isSelected = function isSelected(name) {
  3707. return selected.indexOf(name) !== -1;
  3708. };
  3709. var emptyRows = rowsPerPage - Math.min(rowsPerPage, data.length - page * rowsPerPage);
  3710. return /*#__PURE__*/React$1__default.createElement("div", {
  3711. className: classes.root
  3712. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3713. container: true
  3714. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3715. item: true,
  3716. style: {
  3717. marginRight: '10%'
  3718. }
  3719. }, /*#__PURE__*/React$1__default.createElement(TableContainer$1, null, /*#__PURE__*/React$1__default.createElement(Table$1, {
  3720. className: classes.table,
  3721. "aria-labelledby": "tableTitle",
  3722. size: dense ? 'small' : 'medium',
  3723. "aria-label": "enhanced table"
  3724. }, /*#__PURE__*/React$1__default.createElement(EnhancedTableHead, {
  3725. classes: classes,
  3726. numSelected: selected.length,
  3727. headCells: headers,
  3728. order: order,
  3729. orderBy: orderBy,
  3730. onSelectAllClick: handleSelectAllClick,
  3731. onRequestSort: handleRequestSort,
  3732. onRefreshData: handleReloadData,
  3733. rowCount: data.length
  3734. }), /*#__PURE__*/React$1__default.createElement(TableBody$1, null, data.length != 0 ? stableSort(data, getComparator(order, orderBy)).slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage).map(function (row, index) {
  3735. var isItemSelected = isSelected(row.name);
  3736. return /*#__PURE__*/React$1__default.createElement(TableRow$1, {
  3737. hover: true,
  3738. onClick: function onClick(event) {
  3739. return handleClick(event, row);
  3740. },
  3741. role: "checkbox",
  3742. "aria-checked": isItemSelected,
  3743. tabIndex: -1,
  3744. key: index,
  3745. selected: isItemSelected
  3746. }, headers.map(function (h, i) {
  3747. if (h.id == 'id') {
  3748. return /*#__PURE__*/React$1__default.createElement(TableCell$1, {
  3749. key: h.id,
  3750. align: "right"
  3751. }, ++offset);
  3752. } else {
  3753. return /*#__PURE__*/React$1__default.createElement(TableCell$1, {
  3754. key: h.id,
  3755. align: "right"
  3756. }, row[h.id]);
  3757. }
  3758. }));
  3759. }) : /*#__PURE__*/React$1__default.createElement("div", null), emptyRows > 0 && /*#__PURE__*/React$1__default.createElement(TableRow$1, {
  3760. style: {
  3761. height: (dense ? 33 : 53) * emptyRows
  3762. }
  3763. }, /*#__PURE__*/React$1__default.createElement(TableCell$1, {
  3764. colSpan: 6
  3765. }))))), /*#__PURE__*/React$1__default.createElement(TablePagination, (_React$createElement = {
  3766. rowsPerPageOptions: [5, 10, 20, 30],
  3767. labelDisplayedRows: function labelDisplayedRows(_ref) {
  3768. },
  3769. component: "div",
  3770. count: data.length,
  3771. rowsPerPage: rowsPerPage
  3772. }, _React$createElement["rowsPerPage"] = rowsPerPage, _React$createElement.page = page, _React$createElement.onChangePage = handleChangePage, _React$createElement.onChangeRowsPerPage = handleChangeRowsPerPage, _React$createElement)))));
  3773. }
  3774. TableTemplate.propTypes = {
  3775. history: propTypes.object,
  3776. headers: propTypes.array.isRequired,
  3777. data: propTypes.array.isRequired,
  3778. onUpdateData: propTypes.func,
  3779. onReloadData: propTypes.func,
  3780. onChangePage: propTypes.func,
  3781. onChangeRowsPerPage: propTypes.func,
  3782. query: propTypes.object,
  3783. page: propTypes.any,
  3784. rowsPerPage: propTypes.any,
  3785. order: propTypes.any,
  3786. orderBy: propTypes.any
  3787. };
  3788. var useStyles$2 = styles$1.makeStyles(function (theme) {
  3789. var _button, _ref;
  3790. return _ref = {
  3791. root: {
  3792. width: '100%'
  3793. },
  3794. paper: {
  3795. width: '100%',
  3796. marginBottom: theme.spacing(2)
  3797. },
  3798. table: {
  3799. minWidth: 750
  3800. },
  3801. visuallyHidden: {
  3802. border: 0,
  3803. clip: 'rect(0 0 0 0)',
  3804. height: 1,
  3805. margin: -1,
  3806. overflow: 'hidden',
  3807. padding: 0,
  3808. position: 'absolute',
  3809. top: 20,
  3810. width: 1
  3811. },
  3812. underline: {
  3813. "&&&:before": {
  3814. borderBottom: "none"
  3815. },
  3816. "&&:after": {
  3817. borderBottom: "none"
  3818. }
  3819. },
  3820. button: (_button = {
  3821. color: 'white'
  3822. }, _button["color"] = theme.palette.primary.main, _button.width = 150, _button.height = 55, _button),
  3823. closeButton: {
  3824. position: 'absolute',
  3825. right: theme.spacing(1),
  3826. top: theme.spacing(1),
  3827. color: theme.palette.grey[500]
  3828. },
  3829. headText: {
  3830. fontSize: 14,
  3831. "float": "left",
  3832. color: theme.palette.primary.main,
  3833. fontWeight: "bold"
  3834. }
  3835. }, _ref["paper"] = {
  3836. padding: theme.spacing(2),
  3837. textAlign: 'center',
  3838. color: theme.palette.text.secondary
  3839. }, _ref;
  3840. });
  3841. function getDataString(data, fieldName) {
  3842. return data[fieldName];
  3843. }
  3844. function InfoPage(props) {
  3845. var classes = useStyles$2();
  3846. var infoData = props.infoData,
  3847. displayFields = props.displayFields,
  3848. _props$isNew = props.isNew,
  3849. isNew = _props$isNew === void 0 ? false : _props$isNew,
  3850. isEditable = props.isEditable,
  3851. currentTabName = props.currentTabName,
  3852. actions = props.actions;
  3853. var _React$useState = React$1__default.useState(isEditable != undefined ? isEditable : true),
  3854. editable = _React$useState[0],
  3855. setEditable = _React$useState[1];
  3856. var _React$useState2 = React$1__default.useState({}),
  3857. data = _React$useState2[0],
  3858. setData = _React$useState2[1];
  3859. var handleEdit = function handleEdit() {
  3860. setEditable(false);
  3861. };
  3862. var handleUpdateData = function handleUpdateData(data) {
  3863. console.log('handle update date:', data);
  3864. setData(data);
  3865. };
  3866. return /*#__PURE__*/React$1__default.createElement("div", {
  3867. className: classes.root
  3868. }, isNew ? /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3869. container: true,
  3870. style: {
  3871. marginTop: '30px'
  3872. }
  3873. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3874. item: true,
  3875. xs: 12,
  3876. sm: 7
  3877. }, /*#__PURE__*/React$1__default.createElement(FieldList, {
  3878. updateData: infoData,
  3879. fields: displayFields,
  3880. isNew: isNew,
  3881. onDataCallback: function onDataCallback(d) {
  3882. return handleUpdateData(d);
  3883. }
  3884. }))) : /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3885. container: true,
  3886. style: {
  3887. marginTop: '30px'
  3888. }
  3889. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3890. item: true,
  3891. xs: 12,
  3892. sm: 7
  3893. }, !editable ? /*#__PURE__*/React$1__default.createElement(FieldList, {
  3894. fields: displayFields,
  3895. isNew: isNew,
  3896. updateData: infoData,
  3897. onDataCallback: function onDataCallback(d) {
  3898. return handleUpdateData(d);
  3899. }
  3900. }) : displayFields.map(function (d, i) {
  3901. return /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3902. container: true
  3903. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3904. item: true,
  3905. xs: 12,
  3906. style: {
  3907. display: 'flex',
  3908. alignItems: 'center',
  3909. marginBottom: '10px'
  3910. }
  3911. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3912. item: true,
  3913. xs: 12,
  3914. sm: 5
  3915. }, /*#__PURE__*/React$1__default.createElement(core.Box, {
  3916. style: {
  3917. width: '250px'
  3918. }
  3919. }, /*#__PURE__*/React$1__default.createElement(core.Typography, {
  3920. style: {
  3921. paddingRight: '30px',
  3922. color: 'grey'
  3923. }
  3924. }, d.label))), /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3925. item: true,
  3926. xs: 12,
  3927. sm: 7
  3928. }, d.type == 'photo' ? /*#__PURE__*/React$1__default.createElement("img", {
  3929. src: infoData['photo_url'],
  3930. style: {
  3931. width: '120px',
  3932. height: '120px',
  3933. border: '1px solid grey'
  3934. }
  3935. }) : /*#__PURE__*/React$1__default.createElement(core.Typography, {
  3936. style: {
  3937. paddingRight: '30px'
  3938. }
  3939. }, infoData != undefined ? getDataString(infoData, d.fieldName) : ''))));
  3940. })), /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3941. item: true,
  3942. xs: 12,
  3943. sm: 7
  3944. }, /*#__PURE__*/React$1__default.createElement(core.Grid, {
  3945. container: true,
  3946. direction: "row",
  3947. alignItems: "flex-end"
  3948. }, actions.map(function (a, i) {
  3949. if (currentTabName == 'account') {
  3950. if (infoData.status == 'invited') {
  3951. return /*#__PURE__*/React$1__default.createElement(core.Box, null, /*#__PURE__*/React$1__default.createElement(core.Button, {
  3952. style: {
  3953. color: 'white',
  3954. backgroundColor: 'grey',
  3955. "float": 'right',
  3956. marginLeft: '10px'
  3957. },
  3958. onClick: function onClick() {
  3959. return a.callback(data);
  3960. }
  3961. }, a.label));
  3962. }
  3963. if (infoData.status == 'joined') {
  3964. return /*#__PURE__*/React$1__default.createElement(core.Box, null, /*#__PURE__*/React$1__default.createElement(core.Button, {
  3965. style: {
  3966. color: 'white',
  3967. backgroundColor: 'grey',
  3968. "float": 'right',
  3969. marginLeft: '10px'
  3970. },
  3971. onClick: function onClick() {
  3972. return a.callback(data);
  3973. }
  3974. }, a.label));
  3975. }
  3976. if (infoData.status == 'disabled') {
  3977. return /*#__PURE__*/React$1__default.createElement(core.Box, null, /*#__PURE__*/React$1__default.createElement(core.Button, {
  3978. style: {
  3979. color: 'white',
  3980. backgroundColor: 'grey',
  3981. "float": 'right',
  3982. marginLeft: '10px'
  3983. },
  3984. onClick: function onClick() {
  3985. return a.callback(data);
  3986. }
  3987. }, a.label));
  3988. }
  3989. if (infoData.status == 'requested') {
  3990. if (editable) {
  3991. return /*#__PURE__*/React$1__default.createElement(core.Box, null, /*#__PURE__*/React$1__default.createElement(core.Button, {
  3992. style: {
  3993. marginLeft: '10px'
  3994. },
  3995. onClick: handleEdit
  3996. }, a.icon, a.label));
  3997. } else {
  3998. return /*#__PURE__*/React$1__default.createElement(core.Box, null, /*#__PURE__*/React$1__default.createElement(core.Button, {
  3999. style: {
  4000. color: 'white',
  4001. backgroundColor: 'grey',
  4002. "float": 'right',
  4003. marginLeft: '10px'
  4004. },
  4005. onClick: function onClick() {
  4006. return a.callback(data);
  4007. }
  4008. }, a.label));
  4009. }
  4010. }
  4011. } else {
  4012. if (editable) {
  4013. if (a.action_type == 'edit') {
  4014. console.log('type: ', a.action_type, 'editable: ', editable);
  4015. return /*#__PURE__*/React$1__default.createElement(core.Box, null, /*#__PURE__*/React$1__default.createElement(core.Button, {
  4016. style: {
  4017. marginLeft: '10px'
  4018. },
  4019. onClick: handleEdit
  4020. }, a.icon, a.label));
  4021. }
  4022. if (a.action_type == 'delete') {
  4023. return /*#__PURE__*/React$1__default.createElement(core.Box, null, /*#__PURE__*/React$1__default.createElement(core.Button, {
  4024. style: {
  4025. "float": 'right',
  4026. marginLeft: '10px'
  4027. },
  4028. onClick: function onClick() {
  4029. return a.callback(data);
  4030. }
  4031. }, a.icon, a.label));
  4032. }
  4033. } else {
  4034. if (a.action_type == 'save') {
  4035. return /*#__PURE__*/React$1__default.createElement(core.Box, null, /*#__PURE__*/React$1__default.createElement(core.Button, {
  4036. style: {
  4037. marginLeft: '10px'
  4038. },
  4039. onClick: function onClick() {
  4040. return a.callback(data);
  4041. }
  4042. }, a.icon, a.label));
  4043. }
  4044. if (a.action_type == 'cancel') {
  4045. return /*#__PURE__*/React$1__default.createElement(core.Box, null, /*#__PURE__*/React$1__default.createElement(core.Button, {
  4046. style: {
  4047. "float": 'right',
  4048. marginLeft: '10px'
  4049. },
  4050. onClick: function onClick() {
  4051. return a.callback(data);
  4052. }
  4053. }, a.icon, a.label));
  4054. }
  4055. }
  4056. }
  4057. })))));
  4058. }
  4059. InfoPage.propTypes = {
  4060. history: propTypes.object,
  4061. infoData: propTypes.object,
  4062. displayFields: propTypes.array,
  4063. isNew: propTypes.bool,
  4064. isEditable: propTypes.bool,
  4065. actions: propTypes.any
  4066. };
  4067. function CheckboxList() {
  4068. return /*#__PURE__*/React.createElement("div", null, "checkbox list");
  4069. }
  4070. function RadioList() {
  4071. return /*#__PURE__*/React.createElement("div", null, "radio list");
  4072. }
  4073. var useStyles$3 = styles$1.makeStyles(function (theme) {
  4074. return {
  4075. root: {
  4076. width: '100%'
  4077. }
  4078. };
  4079. });
  4080. function MButton(props) {
  4081. var classes = useStyles$3();
  4082. var action = props.action;
  4083. return /*#__PURE__*/React$1__default.createElement("div", {
  4084. className: classes.root
  4085. }, /*#__PURE__*/React$1__default.createElement(core.Box, null, /*#__PURE__*/React$1__default.createElement(core.Button, {
  4086. variant: "contained",
  4087. style: {
  4088. "float": 'right',
  4089. margin: "5px"
  4090. },
  4091. onClick: function onClick(e) {
  4092. }
  4093. }, action.icon, action.label)));
  4094. }
  4095. MButton.propTypes = {
  4096. history: propTypes.object,
  4097. action: propTypes.object,
  4098. onCallback: propTypes.func
  4099. };
  4100. exports.CheckboxList = CheckboxList;
  4101. exports.FieldList = FieldList;
  4102. exports.InfoPage = InfoPage;
  4103. exports.List = List;
  4104. exports.MButton = MButton;
  4105. exports.RadioList = RadioList;
  4106. exports.TableTemplate = TableTemplate;
  4107. //# sourceMappingURL=index.js.map