[IMP] playground: update code to last version of master

The release script only update the owl code itself, not the playground
app code.

.gitignore

@@ -14,8 +14,4 @@ yarn-debug.log*
 yarn-error.log*
 
 package-lock.json
-.vscode
-node_modules
-
-# Extras temp file
-/extras/owl.js
+.vscode

.jshintrc

@@ -1,3 +0,0 @@
-{
-  "esversion": 9
-}

LICENSE

@@ -1,856 +0,0 @@
-OWL is published under the GNU LESSER GENERAL PUBLIC LICENSE, Version 3
-(LGPLv3), as included below. Since the LGPL is a set of additional
-permissions on top of the GPL, the text of the GPL is included at the
-bottom as well.
-
-Some external libraries and contributions bundled with OWL may be published
-under other GPL-compatible licenses. For these, please refer to the relevant
-source files and/or license files, in the source code tree.
-
-**************************************************************************
-
-                   GNU LESSER GENERAL PUBLIC LICENSE
-                       Version 3, 29 June 2007
-
- Copyright (C) 2007 Free Software Foundation, Inc. <http://fsf.org/>
- Everyone is permitted to copy and distribute verbatim copies
- of this license document, but changing it is not allowed.
-
-
-  This version of the GNU Lesser General Public License incorporates
-the terms and conditions of version 3 of the GNU General Public
-License, supplemented by the additional permissions listed below.
-
-  0. Additional Definitions.
-
-  As used herein, "this License" refers to version 3 of the GNU Lesser
-General Public License, and the "GNU GPL" refers to version 3 of the GNU
-General Public License.
-
-  "The Library" refers to a covered work governed by this License,
-other than an Application or a Combined Work as defined below.
-
-  An "Application" is any work that makes use of an interface provided
-by the Library, but which is not otherwise based on the Library.
-Defining a subclass of a class defined by the Library is deemed a mode
-of using an interface provided by the Library.
-
-  A "Combined Work" is a work produced by combining or linking an
-Application with the Library.  The particular version of the Library
-with which the Combined Work was made is also called the "Linked
-Version".
-
-  The "Minimal Corresponding Source" for a Combined Work means the
-Corresponding Source for the Combined Work, excluding any source code
-for portions of the Combined Work that, considered in isolation, are
-based on the Application, and not on the Linked Version.
-
-  The "Corresponding Application Code" for a Combined Work means the
-object code and/or source code for the Application, including any data
-and utility programs needed for reproducing the Combined Work from the
-Application, but excluding the System Libraries of the Combined Work.
-
-  1. Exception to Section 3 of the GNU GPL.
-
-  You may convey a covered work under sections 3 and 4 of this License
-without being bound by section 3 of the GNU GPL.
-
-  2. Conveying Modified Versions.
-
-  If you modify a copy of the Library, and, in your modifications, a
-facility refers to a function or data to be supplied by an Application
-that uses the facility (other than as an argument passed when the
-facility is invoked), then you may convey a copy of the modified
-version:
-
-   a) under this License, provided that you make a good faith effort to
-   ensure that, in the event an Application does not supply the
-   function or data, the facility still operates, and performs
-   whatever part of its purpose remains meaningful, or
-
-   b) under the GNU GPL, with none of the additional permissions of
-   this License applicable to that copy.
-
-  3. Object Code Incorporating Material from Library Header Files.
-
-  The object code form of an Application may incorporate material from
-a header file that is part of the Library.  You may convey such object
-code under terms of your choice, provided that, if the incorporated
-material is not limited to numerical parameters, data structure
-layouts and accessors, or small macros, inline functions and templates
-(ten or fewer lines in length), you do both of the following:
-
-   a) Give prominent notice with each copy of the object code that the
-   Library is used in it and that the Library and its use are
-   covered by this License.
-
-   b) Accompany the object code with a copy of the GNU GPL and this license
-   document.
-
-  4. Combined Works.
-
-  You may convey a Combined Work under terms of your choice that,
-taken together, effectively do not restrict modification of the
-portions of the Library contained in the Combined Work and reverse
-engineering for debugging such modifications, if you also do each of
-the following:
-
-   a) Give prominent notice with each copy of the Combined Work that
-   the Library is used in it and that the Library and its use are
-   covered by this License.
-
-   b) Accompany the Combined Work with a copy of the GNU GPL and this license
-   document.
-
-   c) For a Combined Work that displays copyright notices during
-   execution, include the copyright notice for the Library among
-   these notices, as well as a reference directing the user to the
-   copies of the GNU GPL and this license document.
-
-   d) Do one of the following:
-
-       0) Convey the Minimal Corresponding Source under the terms of this
-       License, and the Corresponding Application Code in a form
-       suitable for, and under terms that permit, the user to
-       recombine or relink the Application with a modified version of
-       the Linked Version to produce a modified Combined Work, in the
-       manner specified by section 6 of the GNU GPL for conveying
-       Corresponding Source.
-
-       1) Use a suitable shared library mechanism for linking with the
-       Library.  A suitable mechanism is one that (a) uses at run time
-       a copy of the Library already present on the user's computer
-       system, and (b) will operate properly with a modified version
-       of the Library that is interface-compatible with the Linked
-       Version.
-
-   e) Provide Installation Information, but only if you would otherwise
-   be required to provide such information under section 6 of the
-   GNU GPL, and only to the extent that such information is
-   necessary to install and execute a modified version of the
-   Combined Work produced by recombining or relinking the
-   Application with a modified version of the Linked Version. (If
-   you use option 4d0, the Installation Information must accompany
-   the Minimal Corresponding Source and Corresponding Application
-   Code. If you use option 4d1, you must provide the Installation
-   Information in the manner specified by section 6 of the GNU GPL
-   for conveying Corresponding Source.)
-
-  5. Combined Libraries.
-
-  You may place library facilities that are a work based on the
-Library side by side in a single library together with other library
-facilities that are not Applications and are not covered by this
-License, and convey such a combined library under terms of your
-choice, if you do both of the following:
-
-   a) Accompany the combined library with a copy of the same work based
-   on the Library, uncombined with any other library facilities,
-   conveyed under the terms of this License.
-
-   b) Give prominent notice with the combined library that part of it
-   is a work based on the Library, and explaining where to find the
-   accompanying uncombined form of the same work.
-
-  6. Revised Versions of the GNU Lesser General Public License.
-
-  The Free Software Foundation may publish revised and/or new versions
-of the GNU Lesser General Public License from time to time. Such new
-versions will be similar in spirit to the present version, but may
-differ in detail to address new problems or concerns.
-
-  Each version is given a distinguishing version number. If the
-Library as you received it specifies that a certain numbered version
-of the GNU Lesser General Public License "or any later version"
-applies to it, you have the option of following the terms and
-conditions either of that published version or of any later version
-published by the Free Software Foundation. If the Library as you
-received it does not specify a version number of the GNU Lesser
-General Public License, you may choose any version of the GNU Lesser
-General Public License ever published by the Free Software Foundation.
-
-  If the Library as you received it specifies that a proxy can decide
-whether future versions of the GNU Lesser General Public License shall
-apply, that proxy's public statement of acceptance of any version is
-permanent authorization for you to choose that version for the
-Library.
-
-**************************************************************************
-
-                    GNU GENERAL PUBLIC LICENSE
-                       Version 3, 29 June 2007
-
- Copyright (C) 2007 Free Software Foundation, Inc. <http://fsf.org/>
- Everyone is permitted to copy and distribute verbatim copies
- of this license document, but changing it is not allowed.
-
-                            Preamble
-
-  The GNU General Public License is a free, copyleft license for
-software and other kinds of works.
-
-  The licenses for most software and other practical works are designed
-to take away your freedom to share and change the works.  By contrast,
-the GNU General Public License is intended to guarantee your freedom to
-share and change all versions of a program--to make sure it remains free
-software for all its users.  We, the Free Software Foundation, use the
-GNU General Public License for most of our software; it applies also to
-any other work released this way by its authors.  You can apply it to
-your programs, too.
-
-  When we speak of free software, we are referring to freedom, not
-price.  Our General Public Licenses are designed to make sure that you
-have the freedom to distribute copies of free software (and charge for
-them if you wish), that you receive source code or can get it if you
-want it, that you can change the software or use pieces of it in new
-free programs, and that you know you can do these things.
-
-  To protect your rights, we need to prevent others from denying you
-these rights or asking you to surrender the rights.  Therefore, you have
-certain responsibilities if you distribute copies of the software, or if
-you modify it: responsibilities to respect the freedom of others.
-
-  For example, if you distribute copies of such a program, whether
-gratis or for a fee, you must pass on to the recipients the same
-freedoms that you received.  You must make sure that they, too, receive
-or can get the source code.  And you must show them these terms so they
-know their rights.
-
-  Developers that use the GNU GPL protect your rights with two steps:
-(1) assert copyright on the software, and (2) offer you this License
-giving you legal permission to copy, distribute and/or modify it.
-
-  For the developers' and authors' protection, the GPL clearly explains
-that there is no warranty for this free software.  For both users' and
-authors' sake, the GPL requires that modified versions be marked as
-changed, so that their problems will not be attributed erroneously to
-authors of previous versions.
-
-  Some devices are designed to deny users access to install or run
-modified versions of the software inside them, although the manufacturer
-can do so.  This is fundamentally incompatible with the aim of
-protecting users' freedom to change the software.  The systematic
-pattern of such abuse occurs in the area of products for individuals to
-use, which is precisely where it is most unacceptable.  Therefore, we
-have designed this version of the GPL to prohibit the practice for those
-products.  If such problems arise substantially in other domains, we
-stand ready to extend this provision to those domains in future versions
-of the GPL, as needed to protect the freedom of users.
-
-  Finally, every program is threatened constantly by software patents.
-States should not allow patents to restrict development and use of
-software on general-purpose computers, but in those that do, we wish to
-avoid the special danger that patents applied to a free program could
-make it effectively proprietary.  To prevent this, the GPL assures that
-patents cannot be used to render the program non-free.
-
-  The precise terms and conditions for copying, distribution and
-modification follow.
-
-                       TERMS AND CONDITIONS
-
-  0. Definitions.
-
-  "This License" refers to version 3 of the GNU General Public License.
-
-  "Copyright" also means copyright-like laws that apply to other kinds of
-works, such as semiconductor masks.
-
-  "The Program" refers to any copyrightable work licensed under this
-License.  Each licensee is addressed as "you".  "Licensees" and
-"recipients" may be individuals or organizations.
-
-  To "modify" a work means to copy from or adapt all or part of the work
-in a fashion requiring copyright permission, other than the making of an
-exact copy.  The resulting work is called a "modified version" of the
-earlier work or a work "based on" the earlier work.
-
-  A "covered work" means either the unmodified Program or a work based
-on the Program.
-
-  To "propagate" a work means to do anything with it that, without
-permission, would make you directly or secondarily liable for
-infringement under applicable copyright law, except executing it on a
-computer or modifying a private copy.  Propagation includes copying,
-distribution (with or without modification), making available to the
-public, and in some countries other activities as well.
-
-  To "convey" a work means any kind of propagation that enables other
-parties to make or receive copies.  Mere interaction with a user through
-a computer network, with no transfer of a copy, is not conveying.
-
-  An interactive user interface displays "Appropriate Legal Notices"
-to the extent that it includes a convenient and prominently visible
-feature that (1) displays an appropriate copyright notice, and (2)
-tells the user that there is no warranty for the work (except to the
-extent that warranties are provided), that licensees may convey the
-work under this License, and how to view a copy of this License.  If
-the interface presents a list of user commands or options, such as a
-menu, a prominent item in the list meets this criterion.
-
-  1. Source Code.
-
-  The "source code" for a work means the preferred form of the work
-for making modifications to it.  "Object code" means any non-source
-form of a work.
-
-  A "Standard Interface" means an interface that either is an official
-standard defined by a recognized standards body, or, in the case of
-interfaces specified for a particular programming language, one that
-is widely used among developers working in that language.
-
-  The "System Libraries" of an executable work include anything, other
-than the work as a whole, that (a) is included in the normal form of
-packaging a Major Component, but which is not part of that Major
-Component, and (b) serves only to enable use of the work with that
-Major Component, or to implement a Standard Interface for which an
-implementation is available to the public in source code form.  A
-"Major Component", in this context, means a major essential component
-(kernel, window system, and so on) of the specific operating system
-(if any) on which the executable work runs, or a compiler used to
-produce the work, or an object code interpreter used to run it.
-
-  The "Corresponding Source" for a work in object code form means all
-the source code needed to generate, install, and (for an executable
-work) run the object code and to modify the work, including scripts to
-control those activities.  However, it does not include the work's
-System Libraries, or general-purpose tools or generally available free
-programs which are used unmodified in performing those activities but
-which are not part of the work.  For example, Corresponding Source
-includes interface definition files associated with source files for
-the work, and the source code for shared libraries and dynamically
-linked subprograms that the work is specifically designed to require,
-such as by intimate data communication or control flow between those
-subprograms and other parts of the work.
-
-  The Corresponding Source need not include anything that users
-can regenerate automatically from other parts of the Corresponding
-Source.
-
-  The Corresponding Source for a work in source code form is that
-same work.
-
-  2. Basic Permissions.
-
-  All rights granted under this License are granted for the term of
-copyright on the Program, and are irrevocable provided the stated
-conditions are met.  This License explicitly affirms your unlimited
-permission to run the unmodified Program.  The output from running a
-covered work is covered by this License only if the output, given its
-content, constitutes a covered work.  This License acknowledges your
-rights of fair use or other equivalent, as provided by copyright law.
-
-  You may make, run and propagate covered works that you do not
-convey, without conditions so long as your license otherwise remains
-in force.  You may convey covered works to others for the sole purpose
-of having them make modifications exclusively for you, or provide you
-with facilities for running those works, provided that you comply with
-the terms of this License in conveying all material for which you do
-not control copyright.  Those thus making or running the covered works
-for you must do so exclusively on your behalf, under your direction
-and control, on terms that prohibit them from making any copies of
-your copyrighted material outside their relationship with you.
-
-  Conveying under any other circumstances is permitted solely under
-the conditions stated below.  Sublicensing is not allowed; section 10
-makes it unnecessary.
-
-  3. Protecting Users' Legal Rights From Anti-Circumvention Law.
-
-  No covered work shall be deemed part of an effective technological
-measure under any applicable law fulfilling obligations under article
-11 of the WIPO copyright treaty adopted on 20 December 1996, or
-similar laws prohibiting or restricting circumvention of such
-measures.
-
-  When you convey a covered work, you waive any legal power to forbid
-circumvention of technological measures to the extent such circumvention
-is effected by exercising rights under this License with respect to
-the covered work, and you disclaim any intention to limit operation or
-modification of the work as a means of enforcing, against the work's
-users, your or third parties' legal rights to forbid circumvention of
-technological measures.
-
-  4. Conveying Verbatim Copies.
-
-  You may convey verbatim copies of the Program's source code as you
-receive it, in any medium, provided that you conspicuously and
-appropriately publish on each copy an appropriate copyright notice;
-keep intact all notices stating that this License and any
-non-permissive terms added in accord with section 7 apply to the code;
-keep intact all notices of the absence of any warranty; and give all
-recipients a copy of this License along with the Program.
-
-  You may charge any price or no price for each copy that you convey,
-and you may offer support or warranty protection for a fee.
-
-  5. Conveying Modified Source Versions.
-
-  You may convey a work based on the Program, or the modifications to
-produce it from the Program, in the form of source code under the
-terms of section 4, provided that you also meet all of these conditions:
-
-    a) The work must carry prominent notices stating that you modified
-    it, and giving a relevant date.
-
-    b) The work must carry prominent notices stating that it is
-    released under this License and any conditions added under section
-    7.  This requirement modifies the requirement in section 4 to
-    "keep intact all notices".
-
-    c) You must license the entire work, as a whole, under this
-    License to anyone who comes into possession of a copy.  This
-    License will therefore apply, along with any applicable section 7
-    additional terms, to the whole of the work, and all its parts,
-    regardless of how they are packaged.  This License gives no
-    permission to license the work in any other way, but it does not
-    invalidate such permission if you have separately received it.
-
-    d) If the work has interactive user interfaces, each must display
-    Appropriate Legal Notices; however, if the Program has interactive
-    interfaces that do not display Appropriate Legal Notices, your
-    work need not make them do so.
-
-  A compilation of a covered work with other separate and independent
-works, which are not by their nature extensions of the covered work,
-and which are not combined with it such as to form a larger program,
-in or on a volume of a storage or distribution medium, is called an
-"aggregate" if the compilation and its resulting copyright are not
-used to limit the access or legal rights of the compilation's users
-beyond what the individual works permit.  Inclusion of a covered work
-in an aggregate does not cause this License to apply to the other
-parts of the aggregate.
-
-  6. Conveying Non-Source Forms.
-
-  You may convey a covered work in object code form under the terms
-of sections 4 and 5, provided that you also convey the
-machine-readable Corresponding Source under the terms of this License,
-in one of these ways:
-
-    a) Convey the object code in, or embodied in, a physical product
-    (including a physical distribution medium), accompanied by the
-    Corresponding Source fixed on a durable physical medium
-    customarily used for software interchange.
-
-    b) Convey the object code in, or embodied in, a physical product
-    (including a physical distribution medium), accompanied by a
-    written offer, valid for at least three years and valid for as
-    long as you offer spare parts or customer support for that product
-    model, to give anyone who possesses the object code either (1) a
-    copy of the Corresponding Source for all the software in the
-    product that is covered by this License, on a durable physical
-    medium customarily used for software interchange, for a price no
-    more than your reasonable cost of physically performing this
-    conveying of source, or (2) access to copy the
-    Corresponding Source from a network server at no charge.
-
-    c) Convey individual copies of the object code with a copy of the
-    written offer to provide the Corresponding Source.  This
-    alternative is allowed only occasionally and noncommercially, and
-    only if you received the object code with such an offer, in accord
-    with subsection 6b.
-
-    d) Convey the object code by offering access from a designated
-    place (gratis or for a charge), and offer equivalent access to the
-    Corresponding Source in the same way through the same place at no
-    further charge.  You need not require recipients to copy the
-    Corresponding Source along with the object code.  If the place to
-    copy the object code is a network server, the Corresponding Source
-    may be on a different server (operated by you or a third party)
-    that supports equivalent copying facilities, provided you maintain
-    clear directions next to the object code saying where to find the
-    Corresponding Source.  Regardless of what server hosts the
-    Corresponding Source, you remain obligated to ensure that it is
-    available for as long as needed to satisfy these requirements.
-
-    e) Convey the object code using peer-to-peer transmission, provided
-    you inform other peers where the object code and Corresponding
-    Source of the work are being offered to the general public at no
-    charge under subsection 6d.
-
-  A separable portion of the object code, whose source code is excluded
-from the Corresponding Source as a System Library, need not be
-included in conveying the object code work.
-
-  A "User Product" is either (1) a "consumer product", which means any
-tangible personal property which is normally used for personal, family,
-or household purposes, or (2) anything designed or sold for incorporation
-into a dwelling.  In determining whether a product is a consumer product,
-doubtful cases shall be resolved in favor of coverage.  For a particular
-product received by a particular user, "normally used" refers to a
-typical or common use of that class of product, regardless of the status
-of the particular user or of the way in which the particular user
-actually uses, or expects or is expected to use, the product.  A product
-is a consumer product regardless of whether the product has substantial
-commercial, industrial or non-consumer uses, unless such uses represent
-the only significant mode of use of the product.
-
-  "Installation Information" for a User Product means any methods,
-procedures, authorization keys, or other information required to install
-and execute modified versions of a covered work in that User Product from
-a modified version of its Corresponding Source.  The information must
-suffice to ensure that the continued functioning of the modified object
-code is in no case prevented or interfered with solely because
-modification has been made.
-
-  If you convey an object code work under this section in, or with, or
-specifically for use in, a User Product, and the conveying occurs as
-part of a transaction in which the right of possession and use of the
-User Product is transferred to the recipient in perpetuity or for a
-fixed term (regardless of how the transaction is characterized), the
-Corresponding Source conveyed under this section must be accompanied
-by the Installation Information.  But this requirement does not apply
-if neither you nor any third party retains the ability to install
-modified object code on the User Product (for example, the work has
-been installed in ROM).
-
-  The requirement to provide Installation Information does not include a
-requirement to continue to provide support service, warranty, or updates
-for a work that has been modified or installed by the recipient, or for
-the User Product in which it has been modified or installed.  Access to a
-network may be denied when the modification itself materially and
-adversely affects the operation of the network or violates the rules and
-protocols for communication across the network.
-
-  Corresponding Source conveyed, and Installation Information provided,
-in accord with this section must be in a format that is publicly
-documented (and with an implementation available to the public in
-source code form), and must require no special password or key for
-unpacking, reading or copying.
-
-  7. Additional Terms.
-
-  "Additional permissions" are terms that supplement the terms of this
-License by making exceptions from one or more of its conditions.
-Additional permissions that are applicable to the entire Program shall
-be treated as though they were included in this License, to the extent
-that they are valid under applicable law.  If additional permissions
-apply only to part of the Program, that part may be used separately
-under those permissions, but the entire Program remains governed by
-this License without regard to the additional permissions.
-
-  When you convey a copy of a covered work, you may at your option
-remove any additional permissions from that copy, or from any part of
-it.  (Additional permissions may be written to require their own
-removal in certain cases when you modify the work.)  You may place
-additional permissions on material, added by you to a covered work,
-for which you have or can give appropriate copyright permission.
-
-  Notwithstanding any other provision of this License, for material you
-add to a covered work, you may (if authorized by the copyright holders of
-that material) supplement the terms of this License with terms:
-
-    a) Disclaiming warranty or limiting liability differently from the
-    terms of sections 15 and 16 of this License; or
-
-    b) Requiring preservation of specified reasonable legal notices or
-    author attributions in that material or in the Appropriate Legal
-    Notices displayed by works containing it; or
-
-    c) Prohibiting misrepresentation of the origin of that material, or
-    requiring that modified versions of such material be marked in
-    reasonable ways as different from the original version; or
-
-    d) Limiting the use for publicity purposes of names of licensors or
-    authors of the material; or
-
-    e) Declining to grant rights under trademark law for use of some
-    trade names, trademarks, or service marks; or
-
-    f) Requiring indemnification of licensors and authors of that
-    material by anyone who conveys the material (or modified versions of
-    it) with contractual assumptions of liability to the recipient, for
-    any liability that these contractual assumptions directly impose on
-    those licensors and authors.
-
-  All other non-permissive additional terms are considered "further
-restrictions" within the meaning of section 10.  If the Program as you
-received it, or any part of it, contains a notice stating that it is
-governed by this License along with a term that is a further
-restriction, you may remove that term.  If a license document contains
-a further restriction but permits relicensing or conveying under this
-License, you may add to a covered work material governed by the terms
-of that license document, provided that the further restriction does
-not survive such relicensing or conveying.
-
-  If you add terms to a covered work in accord with this section, you
-must place, in the relevant source files, a statement of the
-additional terms that apply to those files, or a notice indicating
-where to find the applicable terms.
-
-  Additional terms, permissive or non-permissive, may be stated in the
-form of a separately written license, or stated as exceptions;
-the above requirements apply either way.
-
-  8. Termination.
-
-  You may not propagate or modify a covered work except as expressly
-provided under this License.  Any attempt otherwise to propagate or
-modify it is void, and will automatically terminate your rights under
-this License (including any patent licenses granted under the third
-paragraph of section 11).
-
-  However, if you cease all violation of this License, then your
-license from a particular copyright holder is reinstated (a)
-provisionally, unless and until the copyright holder explicitly and
-finally terminates your license, and (b) permanently, if the copyright
-holder fails to notify you of the violation by some reasonable means
-prior to 60 days after the cessation.
-
-  Moreover, your license from a particular copyright holder is
-reinstated permanently if the copyright holder notifies you of the
-violation by some reasonable means, this is the first time you have
-received notice of violation of this License (for any work) from that
-copyright holder, and you cure the violation prior to 30 days after
-your receipt of the notice.
-
-  Termination of your rights under this section does not terminate the
-licenses of parties who have received copies or rights from you under
-this License.  If your rights have been terminated and not permanently
-reinstated, you do not qualify to receive new licenses for the same
-material under section 10.
-
-  9. Acceptance Not Required for Having Copies.
-
-  You are not required to accept this License in order to receive or
-run a copy of the Program.  Ancillary propagation of a covered work
-occurring solely as a consequence of using peer-to-peer transmission
-to receive a copy likewise does not require acceptance.  However,
-nothing other than this License grants you permission to propagate or
-modify any covered work.  These actions infringe copyright if you do
-not accept this License.  Therefore, by modifying or propagating a
-covered work, you indicate your acceptance of this License to do so.
-
-  10. Automatic Licensing of Downstream Recipients.
-
-  Each time you convey a covered work, the recipient automatically
-receives a license from the original licensors, to run, modify and
-propagate that work, subject to this License.  You are not responsible
-for enforcing compliance by third parties with this License.
-
-  An "entity transaction" is a transaction transferring control of an
-organization, or substantially all assets of one, or subdividing an
-organization, or merging organizations.  If propagation of a covered
-work results from an entity transaction, each party to that
-transaction who receives a copy of the work also receives whatever
-licenses to the work the party's predecessor in interest had or could
-give under the previous paragraph, plus a right to possession of the
-Corresponding Source of the work from the predecessor in interest, if
-the predecessor has it or can get it with reasonable efforts.
-
-  You may not impose any further restrictions on the exercise of the
-rights granted or affirmed under this License.  For example, you may
-not impose a license fee, royalty, or other charge for exercise of
-rights granted under this License, and you may not initiate litigation
-(including a cross-claim or counterclaim in a lawsuit) alleging that
-any patent claim is infringed by making, using, selling, offering for
-sale, or importing the Program or any portion of it.
-
-  11. Patents.
-
-  A "contributor" is a copyright holder who authorizes use under this
-License of the Program or a work on which the Program is based.  The
-work thus licensed is called the contributor's "contributor version".
-
-  A contributor's "essential patent claims" are all patent claims
-owned or controlled by the contributor, whether already acquired or
-hereafter acquired, that would be infringed by some manner, permitted
-by this License, of making, using, or selling its contributor version,
-but do not include claims that would be infringed only as a
-consequence of further modification of the contributor version.  For
-purposes of this definition, "control" includes the right to grant
-patent sublicenses in a manner consistent with the requirements of
-this License.
-
-  Each contributor grants you a non-exclusive, worldwide, royalty-free
-patent license under the contributor's essential patent claims, to
-make, use, sell, offer for sale, import and otherwise run, modify and
-propagate the contents of its contributor version.
-
-  In the following three paragraphs, a "patent license" is any express
-agreement or commitment, however denominated, not to enforce a patent
-(such as an express permission to practice a patent or covenant not to
-sue for patent infringement).  To "grant" such a patent license to a
-party means to make such an agreement or commitment not to enforce a
-patent against the party.
-
-  If you convey a covered work, knowingly relying on a patent license,
-and the Corresponding Source of the work is not available for anyone
-to copy, free of charge and under the terms of this License, through a
-publicly available network server or other readily accessible means,
-then you must either (1) cause the Corresponding Source to be so
-available, or (2) arrange to deprive yourself of the benefit of the
-patent license for this particular work, or (3) arrange, in a manner
-consistent with the requirements of this License, to extend the patent
-license to downstream recipients.  "Knowingly relying" means you have
-actual knowledge that, but for the patent license, your conveying the
-covered work in a country, or your recipient's use of the covered work
-in a country, would infringe one or more identifiable patents in that
-country that you have reason to believe are valid.
-
-  If, pursuant to or in connection with a single transaction or
-arrangement, you convey, or propagate by procuring conveyance of, a
-covered work, and grant a patent license to some of the parties
-receiving the covered work authorizing them to use, propagate, modify
-or convey a specific copy of the covered work, then the patent license
-you grant is automatically extended to all recipients of the covered
-work and works based on it.
-
-  A patent license is "discriminatory" if it does not include within
-the scope of its coverage, prohibits the exercise of, or is
-conditioned on the non-exercise of one or more of the rights that are
-specifically granted under this License.  You may not convey a covered
-work if you are a party to an arrangement with a third party that is
-in the business of distributing software, under which you make payment
-to the third party based on the extent of your activity of conveying
-the work, and under which the third party grants, to any of the
-parties who would receive the covered work from you, a discriminatory
-patent license (a) in connection with copies of the covered work
-conveyed by you (or copies made from those copies), or (b) primarily
-for and in connection with specific products or compilations that
-contain the covered work, unless you entered into that arrangement,
-or that patent license was granted, prior to 28 March 2007.
-
-  Nothing in this License shall be construed as excluding or limiting
-any implied license or other defenses to infringement that may
-otherwise be available to you under applicable patent law.
-
-  12. No Surrender of Others' Freedom.
-
-  If conditions are imposed on you (whether by court order, agreement or
-otherwise) that contradict the conditions of this License, they do not
-excuse you from the conditions of this License.  If you cannot convey a
-covered work so as to satisfy simultaneously your obligations under this
-License and any other pertinent obligations, then as a consequence you may
-not convey it at all.  For example, if you agree to terms that obligate you
-to collect a royalty for further conveying from those to whom you convey
-the Program, the only way you could satisfy both those terms and this
-License would be to refrain entirely from conveying the Program.
-
-  13. Use with the GNU Affero General Public License.
-
-  Notwithstanding any other provision of this License, you have
-permission to link or combine any covered work with a work licensed
-under version 3 of the GNU Affero General Public License into a single
-combined work, and to convey the resulting work.  The terms of this
-License will continue to apply to the part which is the covered work,
-but the special requirements of the GNU Affero General Public License,
-section 13, concerning interaction through a network will apply to the
-combination as such.
-
-  14. Revised Versions of this License.
-
-  The Free Software Foundation may publish revised and/or new versions of
-the GNU General Public License from time to time.  Such new versions will
-be similar in spirit to the present version, but may differ in detail to
-address new problems or concerns.
-
-  Each version is given a distinguishing version number.  If the
-Program specifies that a certain numbered version of the GNU General
-Public License "or any later version" applies to it, you have the
-option of following the terms and conditions either of that numbered
-version or of any later version published by the Free Software
-Foundation.  If the Program does not specify a version number of the
-GNU General Public License, you may choose any version ever published
-by the Free Software Foundation.
-
-  If the Program specifies that a proxy can decide which future
-versions of the GNU General Public License can be used, that proxy's
-public statement of acceptance of a version permanently authorizes you
-to choose that version for the Program.
-
-  Later license versions may give you additional or different
-permissions.  However, no additional obligations are imposed on any
-author or copyright holder as a result of your choosing to follow a
-later version.
-
-  15. Disclaimer of Warranty.
-
-  THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY
-APPLICABLE LAW.  EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT
-HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY
-OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO,
-THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
-PURPOSE.  THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM
-IS WITH YOU.  SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF
-ALL NECESSARY SERVICING, REPAIR OR CORRECTION.
-
-  16. Limitation of Liability.
-
-  IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
-WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS
-THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY
-GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE
-USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF
-DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD
-PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS),
-EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF
-SUCH DAMAGES.
-
-  17. Interpretation of Sections 15 and 16.
-
-  If the disclaimer of warranty and limitation of liability provided
-above cannot be given local legal effect according to their terms,
-reviewing courts shall apply local law that most closely approximates
-an absolute waiver of all civil liability in connection with the
-Program, unless a warranty or assumption of liability accompanies a
-copy of the Program in return for a fee.
-
-                     END OF TERMS AND CONDITIONS
-
-            How to Apply These Terms to Your New Programs
-
-  If you develop a new program, and you want it to be of the greatest
-possible use to the public, the best way to achieve this is to make it
-free software which everyone can redistribute and change under these terms.
-
-  To do so, attach the following notices to the program.  It is safest
-to attach them to the start of each source file to most effectively
-state the exclusion of warranty; and each file should have at least
-the "copyright" line and a pointer to where the full notice is found.
-
-    <one line to give the program's name and a brief idea of what it does.>
-    Copyright (C) <year>  <name of author>
-
-    This program is free software: you can redistribute it and/or modify
-    it under the terms of the GNU General Public License as published by
-    the Free Software Foundation, either version 3 of the License, or
-    (at your option) any later version.
-
-    This program is distributed in the hope that it will be useful,
-    but WITHOUT ANY WARRANTY; without even the implied warranty of
-    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-    GNU General Public License for more details.
-
-    You should have received a copy of the GNU General Public License
-    along with this program.  If not, see <http://www.gnu.org/licenses/>.
-
-Also add information on how to contact you by electronic and paper mail.
-
-  If the program does terminal interaction, make it output a short
-notice like this when it starts in an interactive mode:
-
-    <program>  Copyright (C) <year>  <name of author>
-    This program comes with ABSOLUTELY NO WARRANTY; for details type `show w'.
-    This is free software, and you are welcome to redistribute it
-    under certain conditions; type `show c' for details.
-
-The hypothetical commands `show w' and `show c' should show the appropriate
-parts of the General Public License.  Of course, your program's commands
-might be different; for a GUI interface, you would use an "about box".
-
-  You should also get your employer (if you work as a programmer) or school,
-if any, to sign a "copyright disclaimer" for the program, if necessary.
-For more information on this, and how to apply and follow the GNU GPL, see
-<http://www.gnu.org/licenses/>.
-
-  The GNU General Public License does not permit incorporating your program
-into proprietary programs.  If your program is a subroutine library, you
-may consider it more useful to permit linking proprietary applications with
-the library.  If this is what you want to do, use the GNU Lesser General
-Public License instead of this License.  But first, please read
-<http://www.gnu.org/philosophy/why-not-lgpl.html>.
-
-
-**************************************************************************

README.md

@@ -1,87 +0,0 @@
-<h1 align="center">🦉 <a href="https://odoo.github.io/owl/">Odoo Web Library</a> 🦉</h1>
-
-_A web framework for structured, dynamic and maintainable applications_
-
-## Project Overview
-
-The Odoo Web Library (OWL) is a small
-UI framework intended to be the basis for the [Odoo](https://www.odoo.com/) Web Client, and hopefully many
-other Odoo related projects. OWL's main feature is a _declarative component system_, with QWeb as a template engine, asynchronous rendering, and an underlying virtual dom.
-
-**Try it online!** An online playground is available at [https://odoo.github.io/owl/playground](https://odoo.github.io/owl/playground) to let you experiment with the OWL framework.
-
-## OWL's design principles
-
-OWL is designed to be used in highly dynamic applications where changing
-requirements are common, code needs to be maintained by large teams.
-
-- **XML based**: templates are based on the XML format, which allows interesting
-  applications. For example, they could be stored in a database and modified
-  dynamically with `xpaths`.
-- **templates compilation in the browser**: this may not be a good fit for all
-  applications, but if you need to generate dynamically user interfaces in the
-  browser, this is very powerful. For example, a generic form view component
-  could generate a specific form user interface for each various models, from a XML view.
-- **no toolchain required**: this is extremely useful for some applications, if,
-  for various reasons (security/deployment/dynamic modules/specific assets tools),
-  it is not ok to use standard web tools based on `npm`.
-
-Owl is not designed to be fast or small (even though it is quite good on those
-two topics). If you are interested in a comparison with React or Vue, you will
-find some more information [here](doc/comparison.md).
-
-# Example
-
-Here is a short example to illustrate interactive widgets:
-
-```javascript
-class ClickCounter extends owl.Component {
-  state = { value: 0 };
-
-  increment() {
-    this.state.value++;
-  }
-}
-
-const TEMPLATES = `
-    <button t-name="ClickCounter" t-on-click="increment">
-        Click Me! [<t t-esc="state.value"/>]
-    </button>`;
-
-const qweb = new owl.QWeb(TEMPLATES);
-const counter = new ClickCounter({ qweb });
-counter.mount(document.body);
-```
-
-More interesting examples can be found on the [playground](https://odoo.github.io/owl/playground) application.
-
-## Installing/Building
-
-If you want to use a simple `<script>` tag, the last release can be downloaded here:
-
-- [owl-0.12.0.js](https://github.com/odoo/owl/releases/download/v0.12.0/owl.js)
-- [owl-0.12.0.min.js](https://github.com/odoo/owl/releases/download/v0.12.0/owl.min.js)
-
-Some npm scripts are available:
-
-| Command                | Description                                                                     |
-| ---------------------- | ------------------------------------------------------------------------------- |
-| `npm install`          | install every dependency required for this project                              |
-| `npm run build`        | build a bundle of _owl_ in the _/dist/_ folder                                  |
-| `npm run minify`       | minify the prebuilt owl.js file                                                 |
-| `npm run test`         | run all tests                                                                   |
-| `npm run test:watch`   | run all tests, and keep a watcher                                               |
-| `npm run extras`       | build extras applications, start a static server (see [here](extras/readme.md)) |
-| `npm run extras:watch` | same as `extras`, but with a watcher to rebuild owl                             |
-
-## Documentation
-
-The complete documentation can be found [here](doc/readme.md). The most important sections are:
-
-- [Quick Start](doc/quick_start.md)
-- [Component](doc/component.md)
-- [QWeb](doc/qweb.md)
-
-## License
-
-OWL is [GPL licensed](./LICENSE).

assets/highlight.tomorrow.css

@@ -0,0 +1,72 @@
+/* http://jmblog.github.com/color-themes-for-google-code-highlightjs */
+
+/* Tomorrow Comment */
+.hljs-comment,
+.hljs-quote {
+  color: #8e908c;
+}
+
+/* Tomorrow Red */
+.hljs-variable,
+.hljs-template-variable,
+.hljs-tag,
+.hljs-name,
+.hljs-selector-id,
+.hljs-selector-class,
+.hljs-regexp,
+.hljs-deletion {
+  color: #c82829;
+}
+
+/* Tomorrow Orange */
+.hljs-number,
+.hljs-built_in,
+.hljs-builtin-name,
+.hljs-literal,
+.hljs-type,
+.hljs-params,
+.hljs-meta,
+.hljs-link {
+  color: #f5871f;
+}
+
+/* Tomorrow Yellow */
+.hljs-attribute {
+  color: #eab700;
+}
+
+/* Tomorrow Green */
+.hljs-string,
+.hljs-symbol,
+.hljs-bullet,
+.hljs-addition {
+  color: #718c00;
+}
+
+/* Tomorrow Blue */
+.hljs-title,
+.hljs-section {
+  color: #4271ae;
+}
+
+/* Tomorrow Purple */
+.hljs-keyword,
+.hljs-selector-tag {
+  color: #8959a8;
+}
+
+.hljs {
+  display: block;
+  overflow-x: auto;
+  background: white;
+  color: #4d4d4c;
+  padding: 0.5em;
+}
+
+.hljs-emphasis {
+  font-style: italic;
+}
+
+.hljs-strong {
+  font-weight: bold;
+}

assets/main.css

@@ -0,0 +1,116 @@
+html, body {
+  background-color: #fefefe;
+  font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
+  height: 100%;
+  margin: 0;
+  text-rendering: optimizeLegibility;
+}
+
+body {
+  display: grid;
+  grid-gap: 3rem;
+  grid-template-areas: "header" "nav" "main" "footer";
+  grid-template-columns: 1fr;
+  height: 100%;
+  grid-template-rows: 1fr 3rem 1fr 3rem;
+}
+
+@media screen and (max-width: 800px) {
+  body {
+    grid-template-rows: 1fr 3rem 1fr 5rem;
+  }
+}
+
+a {
+  color: #00A09D;
+  text-decoration: none;
+}
+
+a:hover, a:active, a:visited {
+  text-decoration: underline;
+}
+
+header {
+  grid-area: header;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  justify-content: flex-end;
+  text-align: center;
+  padding-top: 3rem !important;
+}
+
+hgroup > p {
+  margin-bottom: auto;
+}
+
+nav {
+  grid-area: nav;
+}
+
+main {
+  grid-area: main;
+  /*justify-self: center;*/
+  grid-column: 1 / -1;
+  /*max-width: 80rem !important;*/
+  /*margin: 3rem 0;*/
+}
+
+footer {
+  grid-area: footer;
+  padding-bottom: 3rem !important;
+}
+
+header, nav, footer {
+  text-align: center;
+}
+
+article {
+  padding: 3rem 0;
+}
+
+article h3 {
+  font-size: 2rem;
+  font-weight: 700;
+}
+
+article.brand {
+  align-items: center;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  text-align: center;
+}
+
+article.design {
+  background-color: #875A7B;
+  color: #f0eeee;
+}
+
+header .homepage-logo {
+  margin-bottom: 2rem;
+}
+
+@media (min-width: 40rem) {
+  .row {
+    flex-direction: column;
+    margin-left: initial;
+    width: 100%;
+  }
+
+  .row .column {
+    margin-bottom: initial;
+    padding: initial;
+  }
+}
+@media (min-width: 60rem) {
+  .row {
+    flex-direction: row;
+    margin-left: -1.0rem;
+    width: calc(100% + 2.0rem);
+  }
+  .row .column {
+    margin-bottom: inherit;
+    padding: 0 1.0rem;
+  }
+}

assets/milligram.css

@@ -0,0 +1,602 @@
+/*!
+ * Milligram v1.3.0
+ * https://milligram.github.io
+ *
+ * Copyright (c) 2017 CJ Patoilo
+ * Licensed under the MIT license
+ */
+
+*,
+*:after,
+*:before {
+  box-sizing: inherit;
+}
+
+html {
+  box-sizing: border-box;
+  font-size: 62.5%;
+}
+
+body {
+  color: #606c76;
+  font-family: 'Roboto', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
+  font-size: 1.6em;
+  font-weight: 300;
+  letter-spacing: .01em;
+  line-height: 1.6;
+}
+
+blockquote {
+  border-left: 0.3rem solid #d1d1d1;
+  margin-left: 0;
+  margin-right: 0;
+  padding: 1rem 1.5rem;
+}
+
+blockquote *:last-child {
+  margin-bottom: 0;
+}
+
+.button,
+button,
+input[type='button'],
+input[type='reset'],
+input[type='submit'] {
+  background-color: #9b4dca;
+  border: 0.1rem solid #9b4dca;
+  border-radius: .4rem;
+  color: #fff;
+  cursor: pointer;
+  display: inline-block;
+  font-size: 1.1rem;
+  font-weight: 700;
+  height: 3.8rem;
+  letter-spacing: .1rem;
+  line-height: 3.8rem;
+  padding: 0 3.0rem;
+  text-align: center;
+  text-decoration: none;
+  text-transform: uppercase;
+  white-space: nowrap;
+}
+
+.button:focus, .button:hover,
+button:focus,
+button:hover,
+input[type='button']:focus,
+input[type='button']:hover,
+input[type='reset']:focus,
+input[type='reset']:hover,
+input[type='submit']:focus,
+input[type='submit']:hover {
+  background-color: #606c76;
+  border-color: #606c76;
+  color: #fff;
+  outline: 0;
+}
+
+.button[disabled],
+button[disabled],
+input[type='button'][disabled],
+input[type='reset'][disabled],
+input[type='submit'][disabled] {
+  cursor: default;
+  opacity: .5;
+}
+
+.button[disabled]:focus, .button[disabled]:hover,
+button[disabled]:focus,
+button[disabled]:hover,
+input[type='button'][disabled]:focus,
+input[type='button'][disabled]:hover,
+input[type='reset'][disabled]:focus,
+input[type='reset'][disabled]:hover,
+input[type='submit'][disabled]:focus,
+input[type='submit'][disabled]:hover {
+  background-color: #9b4dca;
+  border-color: #9b4dca;
+}
+
+.button.button-outline,
+button.button-outline,
+input[type='button'].button-outline,
+input[type='reset'].button-outline,
+input[type='submit'].button-outline {
+  background-color: transparent;
+  color: #9b4dca;
+}
+
+.button.button-outline:focus, .button.button-outline:hover,
+button.button-outline:focus,
+button.button-outline:hover,
+input[type='button'].button-outline:focus,
+input[type='button'].button-outline:hover,
+input[type='reset'].button-outline:focus,
+input[type='reset'].button-outline:hover,
+input[type='submit'].button-outline:focus,
+input[type='submit'].button-outline:hover {
+  background-color: transparent;
+  border-color: #606c76;
+  color: #606c76;
+}
+
+.button.button-outline[disabled]:focus, .button.button-outline[disabled]:hover,
+button.button-outline[disabled]:focus,
+button.button-outline[disabled]:hover,
+input[type='button'].button-outline[disabled]:focus,
+input[type='button'].button-outline[disabled]:hover,
+input[type='reset'].button-outline[disabled]:focus,
+input[type='reset'].button-outline[disabled]:hover,
+input[type='submit'].button-outline[disabled]:focus,
+input[type='submit'].button-outline[disabled]:hover {
+  border-color: inherit;
+  color: #9b4dca;
+}
+
+.button.button-clear,
+button.button-clear,
+input[type='button'].button-clear,
+input[type='reset'].button-clear,
+input[type='submit'].button-clear {
+  background-color: transparent;
+  border-color: transparent;
+  color: #9b4dca;
+}
+
+.button.button-clear:focus, .button.button-clear:hover,
+button.button-clear:focus,
+button.button-clear:hover,
+input[type='button'].button-clear:focus,
+input[type='button'].button-clear:hover,
+input[type='reset'].button-clear:focus,
+input[type='reset'].button-clear:hover,
+input[type='submit'].button-clear:focus,
+input[type='submit'].button-clear:hover {
+  background-color: transparent;
+  border-color: transparent;
+  color: #606c76;
+}
+
+.button.button-clear[disabled]:focus, .button.button-clear[disabled]:hover,
+button.button-clear[disabled]:focus,
+button.button-clear[disabled]:hover,
+input[type='button'].button-clear[disabled]:focus,
+input[type='button'].button-clear[disabled]:hover,
+input[type='reset'].button-clear[disabled]:focus,
+input[type='reset'].button-clear[disabled]:hover,
+input[type='submit'].button-clear[disabled]:focus,
+input[type='submit'].button-clear[disabled]:hover {
+  color: #9b4dca;
+}
+
+code {
+  background: #f4f5f6;
+  border-radius: .4rem;
+  font-size: 86%;
+  margin: 0 .2rem;
+  padding: .2rem .5rem;
+  white-space: nowrap;
+}
+
+pre {
+  background: #f4f5f6;
+  border-left: 0.3rem solid #9b4dca;
+  overflow-y: hidden;
+}
+
+pre > code {
+  border-radius: 0;
+  display: block;
+  padding: 1rem 1.5rem;
+  white-space: pre;
+}
+
+hr {
+  border: 0;
+  border-top: 0.1rem solid #f4f5f6;
+  margin: 3.0rem 0;
+}
+
+input[type='email'],
+input[type='number'],
+input[type='password'],
+input[type='search'],
+input[type='tel'],
+input[type='text'],
+input[type='url'],
+textarea,
+select {
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  background-color: transparent;
+  border: 0.1rem solid #d1d1d1;
+  border-radius: .4rem;
+  box-shadow: none;
+  box-sizing: inherit;
+  height: 3.8rem;
+  padding: .6rem 1.0rem;
+  width: 100%;
+}
+
+input[type='email']:focus,
+input[type='number']:focus,
+input[type='password']:focus,
+input[type='search']:focus,
+input[type='tel']:focus,
+input[type='text']:focus,
+input[type='url']:focus,
+textarea:focus,
+select:focus {
+  border-color: #9b4dca;
+  outline: 0;
+}
+
+select {
+  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="14" viewBox="0 0 29 14" width="29"><path fill="#d1d1d1" d="M9.37727 3.625l5.08154 6.93523L19.54036 3.625"/></svg>') center right no-repeat;
+  padding-right: 3.0rem;
+}
+
+select:focus {
+  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="14" viewBox="0 0 29 14" width="29"><path fill="#9b4dca" d="M9.37727 3.625l5.08154 6.93523L19.54036 3.625"/></svg>');
+}
+
+textarea {
+  min-height: 6.5rem;
+}
+
+label,
+legend {
+  display: block;
+  font-size: 1.6rem;
+  font-weight: 700;
+  margin-bottom: .5rem;
+}
+
+fieldset {
+  border-width: 0;
+  padding: 0;
+}
+
+input[type='checkbox'],
+input[type='radio'] {
+  display: inline;
+}
+
+.label-inline {
+  display: inline-block;
+  font-weight: normal;
+  margin-left: .5rem;
+}
+
+.container {
+  margin: 0 auto;
+  max-width: 112.0rem;
+  padding: 0 2.0rem;
+  position: relative;
+  width: 100%;
+}
+
+.row {
+  display: flex;
+  flex-direction: column;
+  padding: 0;
+  width: 100%;
+}
+
+.row.row-no-padding {
+  padding: 0;
+}
+
+.row.row-no-padding > .column {
+  padding: 0;
+}
+
+.row.row-wrap {
+  flex-wrap: wrap;
+}
+
+.row.row-top {
+  align-items: flex-start;
+}
+
+.row.row-bottom {
+  align-items: flex-end;
+}
+
+.row.row-center {
+  align-items: center;
+}
+
+.row.row-stretch {
+  align-items: stretch;
+}
+
+.row.row-baseline {
+  align-items: baseline;
+}
+
+.row .column {
+  display: block;
+  flex: 1 1 auto;
+  margin-left: 0;
+  max-width: 100%;
+  width: 100%;
+}
+
+.row .column.column-offset-10 {
+  margin-left: 10%;
+}
+
+.row .column.column-offset-20 {
+  margin-left: 20%;
+}
+
+.row .column.column-offset-25 {
+  margin-left: 25%;
+}
+
+.row .column.column-offset-33, .row .column.column-offset-34 {
+  margin-left: 33.3333%;
+}
+
+.row .column.column-offset-50 {
+  margin-left: 50%;
+}
+
+.row .column.column-offset-66, .row .column.column-offset-67 {
+  margin-left: 66.6666%;
+}
+
+.row .column.column-offset-75 {
+  margin-left: 75%;
+}
+
+.row .column.column-offset-80 {
+  margin-left: 80%;
+}
+
+.row .column.column-offset-90 {
+  margin-left: 90%;
+}
+
+.row .column.column-10 {
+  flex: 0 0 10%;
+  max-width: 10%;
+}
+
+.row .column.column-20 {
+  flex: 0 0 20%;
+  max-width: 20%;
+}
+
+.row .column.column-25 {
+  flex: 0 0 25%;
+  max-width: 25%;
+}
+
+.row .column.column-33, .row .column.column-34 {
+  flex: 0 0 33.3333%;
+  max-width: 33.3333%;
+}
+
+.row .column.column-40 {
+  flex: 0 0 40%;
+  max-width: 40%;
+}
+
+.row .column.column-50 {
+  flex: 0 0 50%;
+  max-width: 50%;
+}
+
+.row .column.column-60 {
+  flex: 0 0 60%;
+  max-width: 60%;
+}
+
+.row .column.column-66, .row .column.column-67 {
+  flex: 0 0 66.6666%;
+  max-width: 66.6666%;
+}
+
+.row .column.column-75 {
+  flex: 0 0 75%;
+  max-width: 75%;
+}
+
+.row .column.column-80 {
+  flex: 0 0 80%;
+  max-width: 80%;
+}
+
+.row .column.column-90 {
+  flex: 0 0 90%;
+  max-width: 90%;
+}
+
+.row .column .column-top {
+  align-self: flex-start;
+}
+
+.row .column .column-bottom {
+  align-self: flex-end;
+}
+
+.row .column .column-center {
+  -ms-grid-row-align: center;
+      align-self: center;
+}
+
+@media (min-width: 40rem) {
+  .row {
+    flex-direction: row;
+    margin-left: -1.0rem;
+    width: calc(100% + 2.0rem);
+  }
+  .row .column {
+    margin-bottom: inherit;
+    padding: 0 1.0rem;
+  }
+}
+
+a {
+  color: #9b4dca;
+  text-decoration: none;
+}
+
+a:focus, a:hover {
+  color: #606c76;
+}
+
+dl,
+ol,
+ul {
+  list-style: none;
+  margin-top: 0;
+  padding-left: 0;
+}
+
+dl dl,
+dl ol,
+dl ul,
+ol dl,
+ol ol,
+ol ul,
+ul dl,
+ul ol,
+ul ul {
+  font-size: 90%;
+  margin: 1.5rem 0 1.5rem 3.0rem;
+}
+
+ol {
+  list-style: decimal inside;
+}
+
+ul {
+  list-style: circle inside;
+}
+
+.button,
+button,
+dd,
+dt,
+li {
+  margin-bottom: 1.0rem;
+}
+
+fieldset,
+input,
+select,
+textarea {
+  margin-bottom: 1.5rem;
+}
+
+blockquote,
+dl,
+figure,
+form,
+ol,
+p,
+pre,
+table,
+ul {
+  margin-bottom: 2.5rem;
+}
+
+table {
+  border-spacing: 0;
+  width: 100%;
+}
+
+td,
+th {
+  border-bottom: 0.1rem solid #e1e1e1;
+  padding: 1.2rem 1.5rem;
+  text-align: left;
+}
+
+td:first-child,
+th:first-child {
+  padding-left: 0;
+}
+
+td:last-child,
+th:last-child {
+  padding-right: 0;
+}
+
+b,
+strong {
+  font-weight: bold;
+}
+
+p {
+  margin-top: 0;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-weight: 300;
+  letter-spacing: -.1rem;
+  margin-bottom: 2.0rem;
+  margin-top: 0;
+}
+
+h1 {
+  font-size: 4.6rem;
+  line-height: 1.2;
+}
+
+h2 {
+  font-size: 3.6rem;
+  line-height: 1.25;
+}
+
+h3 {
+  font-size: 2.8rem;
+  line-height: 1.3;
+}
+
+h4 {
+  font-size: 2.2rem;
+  letter-spacing: -.08rem;
+  line-height: 1.35;
+}
+
+h5 {
+  font-size: 1.8rem;
+  letter-spacing: -.05rem;
+  line-height: 1.5;
+}
+
+h6 {
+  font-size: 1.6rem;
+  letter-spacing: 0;
+  line-height: 1.4;
+}
+
+img {
+  max-width: 100%;
+}
+
+.clearfix:after {
+  clear: both;
+  content: ' ';
+  display: table;
+}
+
+.float-left {
+  float: left;
+}
+
+.float-right {
+  float: right;
+}
+
+/*# sourceMappingURL=milligram.css.map */

assets/normalize.css

@@ -0,0 +1,349 @@
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
+
+/* Document
+   ========================================================================== */
+
+/**
+ * 1. Correct the line height in all browsers.
+ * 2. Prevent adjustments of font size after orientation changes in iOS.
+ */
+
+html {
+  line-height: 1.15; /* 1 */
+  -webkit-text-size-adjust: 100%; /* 2 */
+}
+
+/* Sections
+   ========================================================================== */
+
+/**
+ * Remove the margin in all browsers.
+ */
+
+body {
+  margin: 0;
+}
+
+/**
+ * Render the `main` element consistently in IE.
+ */
+
+main {
+  display: block;
+}
+
+/**
+ * Correct the font size and margin on `h1` elements within `section` and
+ * `article` contexts in Chrome, Firefox, and Safari.
+ */
+
+h1 {
+  font-size: 2em;
+  margin: 0.67em 0;
+}
+
+/* Grouping content
+   ========================================================================== */
+
+/**
+ * 1. Add the correct box sizing in Firefox.
+ * 2. Show the overflow in Edge and IE.
+ */
+
+hr {
+  box-sizing: content-box; /* 1 */
+  height: 0; /* 1 */
+  overflow: visible; /* 2 */
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+pre {
+  font-family: monospace, monospace; /* 1 */
+  font-size: 1em; /* 2 */
+}
+
+/* Text-level semantics
+   ========================================================================== */
+
+/**
+ * Remove the gray background on active links in IE 10.
+ */
+
+a {
+  background-color: transparent;
+}
+
+/**
+ * 1. Remove the bottom border in Chrome 57-
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+ */
+
+abbr[title] {
+  border-bottom: none; /* 1 */
+  text-decoration: underline; /* 2 */
+  text-decoration: underline dotted; /* 2 */
+}
+
+/**
+ * Add the correct font weight in Chrome, Edge, and Safari.
+ */
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+code,
+kbd,
+samp {
+  font-family: monospace, monospace; /* 1 */
+  font-size: 1em; /* 2 */
+}
+
+/**
+ * Add the correct font size in all browsers.
+ */
+
+small {
+  font-size: 80%;
+}
+
+/**
+ * Prevent `sub` and `sup` elements from affecting the line height in
+ * all browsers.
+ */
+
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+/* Embedded content
+   ========================================================================== */
+
+/**
+ * Remove the border on images inside links in IE 10.
+ */
+
+img {
+  border-style: none;
+}
+
+/* Forms
+   ========================================================================== */
+
+/**
+ * 1. Change the font styles in all browsers.
+ * 2. Remove the margin in Firefox and Safari.
+ */
+
+button,
+input,
+optgroup,
+select,
+textarea {
+  font-family: inherit; /* 1 */
+  font-size: 100%; /* 1 */
+  line-height: 1.15; /* 1 */
+  margin: 0; /* 2 */
+}
+
+/**
+ * Show the overflow in IE.
+ * 1. Show the overflow in Edge.
+ */
+
+button,
+input { /* 1 */
+  overflow: visible;
+}
+
+/**
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
+ * 1. Remove the inheritance of text transform in Firefox.
+ */
+
+button,
+select { /* 1 */
+  text-transform: none;
+}
+
+/**
+ * Correct the inability to style clickable types in iOS and Safari.
+ */
+
+button,
+[type="button"],
+[type="reset"],
+[type="submit"] {
+  -webkit-appearance: button;
+}
+
+/**
+ * Remove the inner border and padding in Firefox.
+ */
+
+button::-moz-focus-inner,
+[type="button"]::-moz-focus-inner,
+[type="reset"]::-moz-focus-inner,
+[type="submit"]::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+/**
+ * Restore the focus styles unset by the previous rule.
+ */
+
+button:-moz-focusring,
+[type="button"]:-moz-focusring,
+[type="reset"]:-moz-focusring,
+[type="submit"]:-moz-focusring {
+  outline: 1px dotted ButtonText;
+}
+
+/**
+ * Correct the padding in Firefox.
+ */
+
+fieldset {
+  padding: 0.35em 0.75em 0.625em;
+}
+
+/**
+ * 1. Correct the text wrapping in Edge and IE.
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
+ * 3. Remove the padding so developers are not caught out when they zero out
+ *    `fieldset` elements in all browsers.
+ */
+
+legend {
+  box-sizing: border-box; /* 1 */
+  color: inherit; /* 2 */
+  display: table; /* 1 */
+  max-width: 100%; /* 1 */
+  padding: 0; /* 3 */
+  white-space: normal; /* 1 */
+}
+
+/**
+ * Add the correct vertical alignment in Chrome, Firefox, and Opera.
+ */
+
+progress {
+  vertical-align: baseline;
+}
+
+/**
+ * Remove the default vertical scrollbar in IE 10+.
+ */
+
+textarea {
+  overflow: auto;
+}
+
+/**
+ * 1. Add the correct box sizing in IE 10.
+ * 2. Remove the padding in IE 10.
+ */
+
+[type="checkbox"],
+[type="radio"] {
+  box-sizing: border-box; /* 1 */
+  padding: 0; /* 2 */
+}
+
+/**
+ * Correct the cursor style of increment and decrement buttons in Chrome.
+ */
+
+[type="number"]::-webkit-inner-spin-button,
+[type="number"]::-webkit-outer-spin-button {
+  height: auto;
+}
+
+/**
+ * 1. Correct the odd appearance in Chrome and Safari.
+ * 2. Correct the outline style in Safari.
+ */
+
+[type="search"] {
+  -webkit-appearance: textfield; /* 1 */
+  outline-offset: -2px; /* 2 */
+}
+
+/**
+ * Remove the inner padding in Chrome and Safari on macOS.
+ */
+
+[type="search"]::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+/**
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
+ */
+
+::-webkit-file-upload-button {
+  -webkit-appearance: button; /* 1 */
+  font: inherit; /* 2 */
+}
+
+/* Interactive
+   ========================================================================== */
+
+/*
+ * Add the correct display in Edge, IE 10+, and Firefox.
+ */
+
+details {
+  display: block;
+}
+
+/*
+ * Add the correct display in all browsers.
+ */
+
+summary {
+  display: list-item;
+}
+
+/* Misc
+   ========================================================================== */
+
+/**
+ * Add the correct display in IE 10+.
+ */
+
+template {
+  display: none;
+}
+
+/**
+ * Add the correct display in IE 10.
+ */
+
+[hidden] {
+  display: none;
+}

doc/animations.md

@@ -1,44 +0,0 @@
-# 🦉 Animations 🦉
-
-
-Animation is a complex topic. There are many different use cases, and many
-solutions and technologies. Owl only supports some basic use cases.
-
-## Simple CSS effects
-
-Sometimes, using pure CSS is enough.  For these use cases, Owl is not really
-necessary: it just needs to render a DOM element with a specific class. For
-example:
-
-
-```xml
-<a class="btn flash" t-on-click="doSomething">Click</a>
-```
-
-with the following CSS:
-
-```css
-btn {
-    background-color: gray;
-}
-
-.flash {
-  transition: background 0.5s;
-}
-
-.flash:active {
-  background-color: #41454a;
-  transition: background 0s;
-}
-```
-
-will produce a nice flash effect whenever the user click (or activate with the
-keyboard) the button.
-
-## CSS Transitions (single element)
-
-A more complex situation occurs when we want to transition an element in or out
-of the page.  For example, we may want a fade-in and fade-out effect.
-
-The `t-transition` directive is here to help us (see [QWeb documentation](qweb.md#t-transition-directive)).
-

doc/comparison.md

@@ -1,194 +0,0 @@
-# Comparison with Vue/React
-
-OWL, React and Vue have the same main feature: they allow developers to build
-declarative user interfaces. To do that, all these frameworks uses a virtual dom. However, there are still obviously many differences.
-
-In this page, we try to highlight some of these differences. Obviously, some
-effort was done to be fair. However, if you disagree with some of the points
-discussed, feel free to open an issue/submit a PR to correct this text.
-
-- [Size](#size)
-- [Tooling/Build Step](#toolingbuild-step)
-- [Templating](#templating)
-- [Asynchronous rendering](#asynchronous-rendering)
-- [Reactiveness](#reactiveness)
-- [State Management](#state-management)
-
-### Size
-
-OWL is intended to be small and to work at a slightly lower level of abstraction
-than React and Vue. Also, jQuery is not the same kind of framework, but it is interesting to compare.
-
-| Framework                | Size (minified) | Size (minified, gzipped) |
-| ------------------------ | --------------- | ------------------------ |
-| OWL                      | 32kb            | 11kb                     |
-| Vue + VueX               |                 | 30kb                     |
-| React + ReactDOM + Redux |                 | 40kb                     |
-| jQuery                   | 86kb            | 30kb                     |
-
-### Tooling/Build step
-
-OWL is designed to be easy to use in a standalone way. For various reasons,
-Odoo does not want to rely on standard web tools (such as webpack), and OWL can
-be used by simply adding a script tag to a page.
-
-```html
-<script src="owl.min.js" />
-```
-
-In comparison, React encourages using JSX,
-which necessitate a build step, and most Vue applications uses single file
-components, which also necessitate a build step.
-
-On the flipside, external tooling may make it harder to use in some case, but it
-also brings a lot of benefits. And React/Vue have both a large ecosystem.
-
-### Templating
-
-OWL uses its own QWeb engine, which compiles templates on the
-frontend, as they are needed. This is extremely convenient for our use case, in
-particular because templates are described in XML files, and can be modified by
-XPaths. Since Odoo is at its heart a modular application, this is an important
-feature for us.
-
-```xml
-<div>
-  <button t-on-click="increment">Click Me! [<t t-esc="state.value"/>]</button>
-</div>
-```
-
-Vue is actually kind of similar. Its template language is kind of close to QWeb,
-with the `v` replaced by the `t`. However, it is also more fully featured. For
-example, Vue templates have slots, or event modifiers. A large difference is that
-most Vue applications will need to be built ahead of time, to compile the templates
-into javascript functions. Note that Vue has a separate build which includes the
-template compiler.
-
-In contrast, most React applications do not use a templating language, but write
-some JSX code, which is precompiled into plain JavaScript by a build step.
-
-```jsx
-class Clock extends React.Component {
-  render() {
-    return (
-      <div>
-        <h1>Hello, world!</h1>
-        <h2>It is {this.props.date.toLocaleTimeString()}.</h2>
-      </div>
-    );
-  }
-}
-```
-
-This has the advantage of having the full power of Javascript, but is less
-structured than a template language. Note that the tooling is quite impressive:
-there is a syntax highlighter for jsx here on github!
-
-### Asynchronous rendering
-
-This is actually a big difference between OWL and React/Vue: components in OWL
-are totally asynchronous. They have two asynchronous hooks in their lifecycle:
-
-- `willStart` (before the widget starts rendering)
-- `willUpdateProps` (before new props are set)
-
-Both these methods can be implemented and return a promise. The rendering will
-then wait for these promises to be completed before patching the DOM. This is
-useful for some use cases: for example, a widget may want to fetch an external
-library (a calendar widget may need a specialized calendar rendering library),
-in its willStart hook.
-
-```javascript
-class MyCalendarWidget extends owl.Component {
-    ...
-
-    willStart() {
-        return utils.lazyLoad('static/libs/fullcalendar/fullcalendar.js');
-    }
-    ...
-}
-```
-
-This may be dangerous (to stop the rendering waiting for the network), but it is
-extremely powerful as well, as demonstrated by the Odoo Web Client.
-
-Lazy loading static libraries can obviously be done with React/Vue, but it is
-more convoluted.
-
-### Reactiveness
-
-React has a simple model: whenever the state changes, it is
-replaced with a new state (via the setState method). Then, the DOM is patched.
-This is simple, efficient, and a little bit awkward to write.
-
-Vue is a little bit different: it replace magically the properties in the state
-by getters/setters. With that, it can notify components whenever the state that
-they read was changed.
-
-Owl is closer to vue: it also tracks magically the state properties, but it does
-only increment a counter whenever it changes (and a _deep_ counter for each of
-its parents). This assumes that the state is actually a tree.
-
-### State Management
-
-Managing the state of an application is a tricky issue. Many solutions have
-been proposed these last few years. It also depends on the kind of application we
-are talking about. A small application may not need much more than a simple
-object to contain its state.
-
-However, there are some common solutions for React and Vue: redux and vuex.
-Both of them are a centralized store that own the state, and they dictate how
-the state can be mutated.
-
-**Redux**
-
-In Redux, the state is mutated by reducers. Reducers are functions
-that modify the state by returning a different object:
-
-```javascript
-  ...
-  switch (action.type) {
-    case ADD_TODO: {
-      const { id, content } = action.payload;
-      return {
-        ...state,
-        allIds: [...state.allIds, id],
-        byIds: {
-          ...state.byIds,
-          [id]: {
-            content,
-            completed: false
-          }
-        }
-      };
-    }
-```
-
-This is a little bit awkward to write, but this allows the component system to
-check if a part of the state was changed. This is exactly what is done by the
-`connect` function: it create a _connected_ component, which is subscribed to
-the state and triggers a rerender if some part of the state was modified.
-
-**VueX**
-
-VueX is based on a different principle: the state is mutated through
-some special functions (the mutations), which modify the state in place:
-
-```javascript
-    function ({state}, payload) {
-        const { id, content } = payload;
-        const message = {id, content, completed: false};
-        state.messages.push(message)
-    }
-```
-
-This is simpler, but there is a little bit more happening behind the scene:
-each key from the state is silently replaced by getters and setters, and VueX
-keeps track of who get data, and retrigger a render when it was changed.
-
-**Owl**
-
-Owl store is a little bit like a mix of redux and vuex: it has mutations and
-actions, like VueX, it keeps track of the state changes, but it does not notify
-a component when the state changes.  Instead, components need to connect to the
-store like in redux, with a function that will listen to the relevant state.

doc/component.md

@@ -1,558 +0,0 @@
-# 🦉 OWL Component 🦉
-
-## Content
-
-- [Overview](#overview)
-- [Example](#example)
-- [Composition](#composition)
-- [Reference](#reference)
-  - [Properties](#properties)
-  - [Static Properties](#static-properties)
-  - [Methods](#methods)
-  - [Lifecycle](#lifecycle)
-  - [Semantics](#semantics)
-  - [Props Validation](#props-validation)
-- [Asynchronous rendering](#asynchronous-rendering)
-
-## Overview
-
-OWL components are the building blocks for user interface. They are designed to be:
-
-1. **declarative:** the user interface should be described in term of the state
-   of the application, not as a sequence of imperative steps.
-
-2. **composable:** each widget can seamlessly be created in a parent widget by
-   a simple directive in its template.
-
-3. **asynchronous rendering:** the framework will transparently wait for each
-   subwidgets to be ready before applying the rendering. It uses native promises
-   under the hood.
-
-4. **uses QWeb as a template system:** the templates are described in XML
-   and follow the QWeb specification. This is a requirement for Odoo.
-
-OWL components are defined as a subclass of Component. The rendering is
-exclusively done by a [QWeb](qweb.md) template (which needs to be preloaded in QWeb).
-Rendering a component generates a virtual dom representation
-of the widget, which is then patched to the DOM, in order to apply the changes in an efficient way.
-
-OWL components observe their states, and rerender themselves whenever it is
-changed. This is done by an [observer](observer.md).
-
-## Example
-
-Let us have a look at a simple component:
-
-```javascript
-class ClickCounter extends owl.Component {
-  state = { value: 0 };
-
-  increment() {
-    this.state.value++;
-  }
-}
-```
-
-```xml
-<button t-name="ClickCounter" t-on-click="increment">
-  Click Me! [<t t-esc="state.value"/>]
-</button>
-```
-
-Note that this code is written in ESNext style, so it will only run on the
-latest browsers without a transpilation step.
-
-This example show how a component should be defined: it simply subclasses the
-Component class. If no `template` key is defined, then
-Owl will use the component's name as template name. Here,
-a state object is defined. It is not mandatory to use the state object, but it
-is certainly encouraged. The state object is [observed](observer.md), and any
-change to it will cause a rerendering.
-
-## Composition
-
-The example above shows a QWeb template with a `t-on-click` directive. Widget
-templates are standard [QWeb](qweb.md) templates, but with an extra directive:
-`t-widget`. With the `t-widget` directive, widget templates can declare sub
-widgets:
-
-```xml
-<div t-name="ParentWidget">
-  <span>some text</span>
-  <t t-widget="MyWidget" t-props="{info: 13}"/>
-</div>
-```
-
-```js
-class ParentWidget extends owl.Component {
-    widgets = { MyWidget: MyWidget};
-    ...
-}
-```
-
-In this example, the `ParentWidget`'s template creates a widget `MyWidget` just
-after the span. See the [QWeb](qweb.md) documentation for more information on the
-`t-widget` directive.
-
-Note that the rendering context for the template is the widget itself. This means
-that the template can access `state`, `props`, `env`, or any methods defined in the widget.
-
-**CSS and style:** there is some specific support to allow the parent to declare
-additional css classes or style for the sub widget: css declared in `class`, `style`, `t-att-class` or `t-att-style` will be added to the
-root widget element.
-
-```xml
-<div t-name="ParentWidget">
-  <t t-widget="MyWidget" class="someClass" style="font-weight:bold;" t-props="{info: 13}"/>
-</div>
-```
-
-Warning: there is a small caveat with dynamic class attributes: since Owl needs
-to be able to add/remove proper classes whenever necessary, it needs to be aware
-of the possible classes. Otherwise, it will not be able to make the difference
-between a valid css class added by the component, or some custom code, and a
-class that need to be removed. This is why we only support the explicit syntax
-with a class object:
-
-```xml
-<t t-widget="MyWidget" t-att-class="{a: state.flagA, b: state.flagB}" />
-```
-
-## Reference
-
-An Owl component is a small class which represent a widget or some UI element.
-It exists in the context of an environment (`env`), which is propagated from a
-parent to its children. The environment needs to have a QWeb instance, which
-will be used to render the component template.
-
-Be aware that the name of the component may be significant: if a component does
-not define a `template` key, then Owl will lookup in QWeb to
-find a template with the component name (or one of its ancestor).
-
-### Properties
-
-- **`el`** (HTMLElement | null): reference to the DOM root node of the element. It is `null` when the
-  component is not mounted.
-
-- **`env`** (Object): the component environment, which contains a QWeb instance.
-
-- **`template`** (string, optional): if given, this is the name of the QWeb template that will render
-  the component.
-
-- **`state`** (Object): this is the location of the component's state, if there is
-  any. After the willStart method, the `state` property is observed, and each
-  change will cause the widget to rerender itself.
-
-- **`props`** (Object): this is an object given (in the constructor) by the parent
-  to configure the component. It can be dynamically changed later by the parent,
-  in some case. Note that `props` are owned by the parent, not by the component.
-  As such, it should not ever be modified by the component!!
-
-- **`refs`** (Object): the `refs` object contains all references to sub DOM nodes
-  or sub widgets defined by a `t-ref` directive in the component's template.
-
-### Static Properties
-
-- **`props`** (Object, optional): if given, this is an object that describes the
-  type and shape of the (actual) props given to the component. If Owl mode is
-  `dev`, this will be used to validate the props each time the component is
-  created/updated. See [Props Validation](#props-validation) for more information.
-- **`defaultProps`** (Object, optional): if given, this object define default
-  values for (top-level) props. Whenever `props` are given to the object, they
-  will be altered to add default value (if missing). Note that it does not
-  change the initial object, a new object will be created instead.
-
-### Methods
-
-- **`mount(target)`** (async): this is the main way a component's hierarchy is added to the
-  DOM: the root component is mounted to a target HTMLElement. Obviously, this
-  is asynchronous, since each children need to be created as well. Most applications
-  will need to call `mount` exactly once, on the root component.
-
-- **`unmount()`**: in case a component need to be detached/removed from the DOM, this
-  method can be used. Most applications should not call `unmount`, this is more
-  useful to the underlying component system.
-
-- **`render()`** (async): calling this method directly will cause a rerender. Note
-  that this should be very rare to have to do it manually, the Owl framework is
-  most of the time responsible for doing that at an appropriate moment.
-
-  Note that the render method is asynchronous, so one cannot observe the updated
-  DOM in the same stack frame.
-
-- **`shouldUpdate(nextProps)`**: this method is called each time a component's props
-  are updated. It returns a boolean, which indicates if the widget should
-  ignore a props update. If it returns false, then `willUpdateProps` will not
-  be called, and no rendering will occur. Its default implementation is to
-  always return true. This is an optimization, similar to React's `shouldComponentUpdate`. Most of the time, this should not be used, but it
-  can be useful if we are handling large number of components.
-
-- **`updateEnv(nextEnv)`**: update the environment of a component and all its
-  children. This forces a complete rerender. For example, this could be useful
-  if we have a `isMobile` key in the environment, to decide if we want a mobile
-  interface or a destkop one.
-
-- **`set(target, key, value)`**. This method is necessary in some cases when we
-  need to modify the state of the component in a way that is not visible to the
-  observer (see [observer's technical limitations](observer.md#technical-limitations)).
-  For example, if we need to add a key to the state.
-
-- **`destroy()`**. As its name suggests, this method will remove the component,
-  and perform all necessary cleanup, such as unmounting the component, its children,
-  removing the parent/children relationship. This method should almost never be
-  called directly (except maybe on the root component), but should be done by the
-  framework instead.
-
-### Lifecycle
-
-A solid and robust component system needs useful hooks/methods to help
-developers write components. Here is a complete description of the lifecycle of
-a owl component:
-
-| Method                                           | Description                                           |
-| ------------------------------------------------ | ----------------------------------------------------- |
-| **[constructor](#constructor)**                  | constructor                                           |
-| **[willStart](#willStart)**                      | async, before first rendering                         |
-| **[mounted](#mounted)**                          | just after component is rendered and added to the DOM |
-| **[willUpdateProps](#willupdatepropsnextprops)** | async, before props update                            |
-| **[willPatch](#willpatch)**                      | just before the DOM is patched                        |
-| **[patched](#patchedsnapshot)**                  | just after the DOM is patched                         |
-| **[willUnmount](#willUnmount)**                  | just before removing component from DOM               |
-
-Notes:
-
-- hooks call order is precisely defined: `[willX]` hooks are called first on parent,
-  then on children, and `[Xed]` are called in the reverse order: first children,
-  then parent.
-- no hook method should ever be called manually. They are supposed to be
-  called by the owl framework whenever it is required.
-
-#### `constructor(parent, props)`
-
-The constructor is not exactly a hook, it is the regular,
-normal, constructor of the component. Since it is not a hook, you need to make
-sure that `super` is called.
-
-This is usually where you would set the initial state and the template of the
-component.
-
-```javascript
-  constructor(parent, props) {
-    super(parent, props);
-    this.state = {someValue: true};
-    this.template = 'mytemplate';
-  }
-```
-
-Note that with ESNext class fields, the constructor method does not need to be
-implemented in most cases:
-
-```javascript
-class ClickCounter extends owl.Component {
-  state = { value: 0 };
-
-  ...
-}
-```
-
-#### `willStart()`
-
-willStart is an asynchronous hook that can be implemented to
-perform some action before the initial rendering of a component.
-
-It will be called exactly once before the initial rendering. It is useful
-in some cases, for example, to load external assets (such as a JS library)
-before the widget is rendered. Another use case is to load data from a server.
-
-```javascript
-  async willStart() {
-    await owl.utils.loadJS("my-awesome-lib.js");
-  }
-```
-
-At this point, the component is not yet rendered. Note that a slow `willStart` method will slow down the rendering of the user
-interface. Therefore, some care should be made to make this method as
-fast as possible.
-
-The widget rendering will take place after `willStart` is completed.
-
-#### `mounted()`
-
-`mounted` is called each time a component is attached to the
-DOM, after the initial rendering and possibly later if the component was unmounted
-and remounted. At this point, the component is considered _active_. This is a good place to add some listeners, or to interact with the
-DOM, if the component needs to perform some measure for example.
-
-It is the opposite of `willUnmount`. If a component has been mounted, it will
-always be unmounted at some point in the future.
-
-The mounted method will be called recursively on each of its children. First,
-the parent, then all its children.
-
-Note that the state is now observed. It is however allowed (but not encouraged)
-to modify the state in the `mounted` hook. Doing so will cause a rerender,
-which will not be perceptible by the user, but will slightly slow down the
-component.
-
-#### `willUpdateProps(nextProps)`
-
-The willUpdateProps is an asynchronous hook, called just before new props
-are set. This is useful if the component needs some asynchronous task
-performed, depending on the props (for example, assuming that the props are
-some record Id, fetching the record data).
-
-```javascript
-  willUpdateProps(nextProps) {
-    return this.loadData({id: nextProps.id});
-  }
-```
-
-This hook is not called during the first render (but willStart is called
-and performs a similar job).
-
-#### `willPatch()`
-
-The willPatch hook is called just before the DOM patching process starts.
-It is not called on the initial render. This is useful to read some
-information from the DOM. For example, the current position of the
-scrollbar.
-
-Note that modifying the state object is not allowed here. This method is called just
-before an actual DOM patch, and is only intended to be used to save some local
-DOM state. Also, it will not be called if the widget is not in the DOM (this can
-happen with widgets with `t-keepalive`).
-
-The return value of this method will be given as the first argument of the
-corresponding `patched` call.
-
-#### `patched(snapshot)`
-
-This hook is called whenever a component did actually update its DOM (most
-likely via a change in its state/props or environment).
-
-This method is not called on the initial render. It is useful to interact
-with the DOM (for example, through an external library) whenever the
-component was patched. Note that this hook will not be called if the widget is
-not in the DOM (this can happen with widgets with `t-keepalive`).
-
-The `snapshot` parameter is the result of the previous `willPatch` call.
-
-Updating the widget state in this hook is possible, but not encouraged.
-One need to be careful, because updates here will cause rerender, which in
-turn will cause other calls to patched. So, we need to be particularly
-careful at avoiding endless cycles.
-
-#### `willUnmount()`
-
-willUnmount is a hook that is called each time just before a component is unmounted from
-the DOM. This is a good place to remove some listeners, for example.
-
-```javascript
-  mounted() {
-    this.env.bus.on('someevent', this, this.doSomething);
-  }
-  willUnmount() {
-    this.env.bus.off('someevent', this, this.doSomething);
-  }
-```
-
-This is the opposite method of `mounted`.
-
-### Semantics
-
-We give here an informal description of the way components are created/updated
-in an application. Here, ordered lists describe actions that are executed
-sequentially, bullet lists describe actions that are executed in parallel.
-
-**Scenario 1: initial rendering** Imagine we want to render the following component tree:
-
-```
-        A
-       / \
-      B   C
-         / \
-        D   E
-```
-
-Here is what happen whenever we mount the root
-component (with some code like `app.mount(document.body)`).
-
-1. `willStart` is called on `A`
-
-2. when it is done, template `A` is rendered.
-
-   - widget `B` is created
-     1. `willStart` is called on `B`
-     2. template `B` is rendered
-   - widget `C` is created
-     1. `willStart` is called on `C`
-     2. template `C` is rendered
-        - widget `D` is created
-          1. `willStart` is called on `D`
-          2. template `D` is rendered
-        - widget `E` is created
-          1. `willStart` is called on `E`
-          2. template `E` is rendered
-
-3. widget `A` is patched into a detached DOM element. This will create the actual
-   widget `A` DOM structure. The patching process will cause recursively the
-   patching of the `B`, `C`, `D` and `E` DOM trees. (so the actual full DOM tree is created
-   in one pass)
-
-4. the widget `A` root element is actually appended to `document.body`
-
-5. The method `mounted` is called recursively on all widgets in the following
-   order: `B`, `D`, `E`, `C`, `A`.
-
-**Scenario 2: rerendering a component**. Now, let's assume that the user clicked on some
-button in `C`, and this results in a state update, which is supposed to:
-
-- update `D`,
-- remove `E`,
-- add new widget `F`.
-
-So, the component tree should look like this:
-
-```
-        A
-       / \
-      B   C
-         / \
-        D   F
-```
-
-Here is what Owl will do:
-
-1. because of a state change, the method `render` is called on `C`
-2. template `C` is rendered again
-
-   - widget `D` is updated:
-     1. hook `willUpdateProps` is called on `D` (async)
-     2. template `D` is rerendered
-   - widget `F` is created:
-     1. hook `willStart` is called on `E` (async)
-     2. template `F` is rendered
-
-3. `willPatch` hooks are called recursively on widgets `C`, `D` (not on `F`,
-   because it is not mounted yet)
-
-4. widget `C` is patched, which will cause recursively:
-
-   2. `willUnmount` hook on `E`, then destruction of `E`,
-   3. (initial) patching of `F`, then hook `mounted` is called on `F`
-
-5. patching of `D`
-
-6. `patched` hooks are called on `D`, `C`
-
-### Props Validation
-
-As an application becomes complex, it may be quite unsafe to define props in an informal way. This leads to two issues:
-
-- hard to tell how a component should be used, by looking at its code.
-- unsafe, it is easy to send wrong props into a component, either by refactoring a component, or one of its parent.
-
-A props type system would solve both issues, by describing the types and shapes
-of the props. Here is how it works in Owl:
-
-- `props` key is a static key (so, different from `this.props` in a component instance)
-- it is optional: it is ok for a component to not define a `props` key.
-- props are validated whenever a component is created/updated
-- props are only validated in `dev` mode (see [tooling page](tooling.md#development-mode))
-- if a key does not match the description, an error is thrown
-- it only validates keys defined in (static) `props`. Additional keys in (component) `props` are not validated.
-
-For example:
-
-```js
-class ComponentA extends owl.Component {
-    static props = ['id', 'url'];
-
-    ...
-}
-
-class ComponentB extends owl.Component {
-  static props = {
-    count: {type: Number},
-    messages: {
-      type: Array,
-      element: {type: Object, shape: {id: Boolean, text: 'string' }
-    },
-   date: Date,
-   combinedVal: [Number, Boolean]
-  };
-
-  ...
-}
-```
-
-- it is an object or a list of strings
-- a list of strings is a simplified props definition, which only lists the name
-  of the props.
-- all props are by default required, unless they are defined with `optional: true`
-  (in that case, validation is only done if there is a value)
-- valid types are: `Number, String, Boolean, Object, Array, Date, Function`, and all
-  constructor functions (so, if you have a `Person` class, it can be used as a type)
-- arrays are homogeneous (all elements have the same type/shape)
-
-For each key, a `prop` definition is either a constructor, a list of constructors, or an object:
-
-- a constructor: this should describe the type, for example: `id: Number` describe
-  the props `id` as a number
-- a list of constructors. In that case, this means that we allow more than one
-  type. For example, `id: [Number, String]` means that `id` can be either a string
-  or a number.
-- an object. This makes it possible to have more expressive definition. The following sub keys are then allowed:
-  - `type`: the main type of the prop being validated
-  - `element`: if the type was `Array`, then the `element` key describes the type of each element in the array. It is optional (not set means that we only validate the array, not its elements),
-  - `shape`: if the type was `Object`, then the `shape` key describes the interface of the object. It is optional (not set means that we only validate the object, not its elements)
-
-Examples:
-
-```js
-  // only the existence of those 3 keys is documented
-  static props = ['message', 'id', 'date'];
-```
-
-```js
-  static props = {
-    messageIds: {type: Array, element: Number},  // list of number
-    otherArr: {type: Array},   // just array. no validation is made on sub elements
-    otherArr2: Array,   // same as otherArr
-    someObj: {type: Object},  // just an object, no internal validation
-    someObj2: {
-      type: Object,
-      shape: {
-        id: Number,
-        name: {type: String, optional: true},
-        url: String
-      ]},    // object, with keys id (number), name (string, optional) and url (string)
-    someFlag: Boolean,     // a boolean, mandatory (even if `false`)
-    someVal: [Boolean, Date]   // either a boolean or a date
-  };
-```
-
-## Asynchronous rendering
-
-Working with asynchronous code always adds a lot of complexity to a system. Whenever
-different parts of a system are active at the same time, one needs to think
-carefully about all possible interactions. Clearly, this is also true for Owl
-components.
-
-There are two different common problems with Owl asynchronous rendering model:
-
-- any widget can delay the rendering (initial and subsequent) of the whole
-  application
-- for a given widget, there are two independant situations that will trigger an
-  asynchronous rerendering: a change in the state, or a change in the props.
-  These changes may be done at different times, and Owl has no way of knowing
-  how to reconcile the resulting renderings.
-
-Here are a few tips on how to work with asynchronous widgets:
-
-1. minimize the use of asynchronous widgets!
-2. Maybe move the asynchronous logic in a store, which then triggers (mostly)
-   synchronous renderings
-3. Lazy loading external libraries is a good use case for async rendering. This
-   is mostly fine, because we can assume that it will only takes a fraction of a
-   second, and only once (see `owl.utils.loadJS`)

doc/observer.md

@@ -1,54 +0,0 @@
-# 🦉 Observer 🦉
-
-Owl need to be able to react to state changes. For example, whenever the state
-of a component is changed, we need to rerender it. To help with that, we have
-an Observer class. Its job is to observe some object state, and react to any
-change. To do that, it recursively replace all keys of the observed state by
-getters and setters.
-
-For example, this code will display `update` in the console:
-
-```javascript
-const observer = new owl.Observer();
-observer.notifyCB = () => console.log("update");
-observer.observe(obj);
-
-const obj = { a: { b: 1 } };
-obj.a.b = 2;
-```
-
-## Technical Limitations
-
-Since the observer uses getters and setters, it is actually unable to react to
-changes in two situations:
-
-- adding a key to an object:
-
-  ```javascript
-  const observer = new owl.Observer();
-  const obj = { a: 1 };
-  observer.observe(obj);
-  obj.b = 2; // will do nothing
-  ```
-
-  In that case, we need a way to tell the observer that something happened.
-  This can be done by using the `set` method:
-
-  ```javascript
-  observer.set(obj, "b", 2);
-  ```
-
-- modifying an array by setting a new value at a given index:
-
-  ```javascript
-  const observer = new owl.Observer();
-  const obj = { todos: [{ id: 1, text: "todo" }] };
-  observer.observe(obj);
-  obj[0] = { id: 2, text: "othertodo" }; // will do nothing, and obj[0] is not observed
-  ```
-
-  In that case, the solution is the same, we can simply use the `set` method:
-
-  ```javascript
-  observer.set(obj, 0, { id: 2, text: "othertodo" });
-  ```

doc/quick_start.md

@@ -1,101 +0,0 @@
-# 🦉 Quick Start 🦉
-
-## Static server
-
-Let us assume that we have a static server running somewhere. We could then
-simply add an html page with a few extra files.
-
-### HTML and CSS
-
-In a file `index.html`:
-
-```html
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <title>My OWL App</title>
-    <link href="app.css" rel="stylesheet" />
-    <script src="owl-X.Y.Z.js"></script>
-  </head>
-  <body>
-    <div id="main"></div>
-    <script src="app.js" type="module"></script>
-  </body>
-</html>
-```
-
-In `app.css`:
-
-```css
-button {
-  color: darkred;
-  font-size: 30px;
-  width: 220px;
-}
-```
-
-Also, let's not forget to add a release of OWL (`owl-X.Y.Z.js`)
-
-### XML
-
-In `templates.xml`:
-
-```xml
-<templates>
-   <button t-name="clickcounter" t-on-click="increment">
-      Click Me! [<t t-esc="state.value"/>]
-    </button>
-</templates>
-```
-
-### JS
-
-To build an application (or a sub-part of an application), we need two things:
-
-- an environment: it is the global context in which we are working. It needs to
-  contain a QWeb instance (preloaded with templates), and anything else that we
-  need. In practice, it could context some user session information, some
-  configuration keys (for example, isMobile = true/false if we are in mobile mode).
-
-- a description of the user interface: there should be a root widget, which can
-  have sub widgets
-
-Here are a few steps that we may take to get started:
-
-- get the templates
-- create a qweb engine, with the templates
-- create an environment
-- create an instance of the root widget
-- mount the root widget to a DOM element
-
-Let us now add the javascript to make it work, in `app.js`:
-
-```javascript
-class ClickCounter extends owl.Component {
-  constructor() {
-    super(...arguments);
-    this.template = "clickcounter";
-    this.state = { value: 0 };
-  }
-
-  increment() {
-    this.state.value++;
-  }
-}
-
-//------------------------------------------------------------------------------
-// Application initialization
-//------------------------------------------------------------------------------
-async function start() {
-  const templates = await owl.utils.loadTemplates("templates.xml");
-  const env = {
-    qweb: new owl.QWeb(templates)
-  };
-  const counter = new ClickCounter(env);
-  const target = document.getElementById("main");
-  await counter.mount(target);
-}
-
-start();
-```

doc/qweb.md

@@ -1,679 +0,0 @@
-# 🦉 QWeb 🦉
-
-## Content
-
-- [Overview](#overview)
-- [QWeb Engine](#qweb-engine)
-- [QWeb Specification](#qweb-specification)
-
-  - [Static html nodes](#static-html-nodes)
-  - [`t-esc` directive](#t-esc-directive)
-  - [`t-raw` directive](#t-raw-directive)
-  - [`t-set` directive](#t-set-directive)
-  - [`t-if` directive](#t-if-directive)
-  - [Expression evaluation](#expression-evaluation)
-  - [Dynamic attributes (`t-att` and `t-attf` directives)](#dynamic-attributes-t-att-and-t-attf-directives)
-  - [`t-call` directive (sub templates)](#t-call-directive-sub-templates)
-
-- [JS/OWL Specific Extensions](#jsowl-specific-extensions)
-
-  - [`t-on` directive](#t-on-directive)
-  - [Component: `t-widget`, `t-props`](#component-t-widget-t-props)
-  - [`t-ref` directive](#t-ref-directive)
-  - [`t-key` directive](#t-key-directive)
-  - [`t-transition` directive](#t-transition-directive)
-  - [`t-mounted` directive](#t-mounted-directive)
-  - [Debugging (`t-debug` and `t-log`)](#debugging-t-debug-and-t-log)
-  - [White spaces](#white-spaces)
-  - [Root nodes](#root-nodes)
-
-## Overview
-
-[QWeb](https://www.odoo.com/documentation/12.0/reference/qweb.html) is the primary templating engine used by Odoo. It is based on the XML format, and used
-mostly to generate html. In OWL, QWeb templates are compiled into functions that
-generate a virtual dom representation of the html.
-
-Template directives are specified as XML attributes prefixed with `t-`, for instance `t-if` for conditionals, with elements and other attributes being rendered directly.
-
-To avoid element rendering, a placeholder element `<t>` is also available, which executes its directive but doesn’t generate any output in and of itself.
-
-The QWeb implementation in the OWL project is slightly different. It compiles
-templates into functions that output a virtual DOM instead of a string. This is
-necessary for the component system. In addition, it has a few extra directives
-(see [OWL Specific Extensions](#owlspecificextensions))
-
-## QWeb Engine
-
-This section is about the javascript code that implements the `QWeb` specification.
-Owl exports a `QWeb` class in `owl.QWeb`. To use it, it just needs to be
-instantiated:
-
-```js
-const qweb = new owl.QWeb();
-```
-
-It's API is quite simple:
-
-- **`constructor(data)`**: constructor. Takes an optional string to add initial
-  templates (see `addTemplates` for more information on format of the string).
-
-  ```js
-  const qweb = new owl.QWeb(TEMPLATES);
-  ```
-
-- **`addTemplate(name, xmlStr)`**: add a specific template.
-
-  ```js
-  qweb.addTemplate("mytemplate", "<div>hello</div>");
-  ```
-
-- **`addTemplates(xmlStr)`**: add a list of templates (identified by `t-name`
-  attribute).
-
-  ```js
-  const TEMPLATES = `
-    <templates>
-      <div t-name="App" class="main">main</div>
-      <div t-name="OtherWidget">other widget</div>
-    </templates>`;
-  qweb.addTemplates(TEMPLATES);
-  ```
-
-- **`render(name, context, extra)`**: renders a template. This returns a `vnode`,
-  which is a virtual representation of the DOM (see [vdom doc](vdom.md)).
-
-  ```js
-  const vnode = qweb.render("App", widget);
-  ```
-
-- **`register(name, Component)`**: static function to register an OWL Component
-  to QWeb's global registry. Globally registered Components can be used in
-  templates (see the `t-widget` directive). This is useful for commonly used
-  components accross the application.
-
-  ```js
-  class Dialog extends owl.Component { ... }
-  QWeb.register("Dialog", Dialog);
-
-  ...
-
-  class ParentWidget extends owl.Component { ... }
-  qweb.addTemplate("ParentWidget", "<div><t t-widget='Dialog'/></div>");
-  ```
-
-## QWeb Specification
-
-We define in this section the specification of how `QWeb` templates should be
-rendered.
-
-### Static html nodes
-
-Normal, regular html nodes are rendered into themselves:
-
-```xml
-  <div>hello</div> <!–– rendered as itself ––>
-```
-
-### `t-esc` directive
-
-The `t-esc` directive is necessary whenever you want to add a dynamic text
-expression in a template. The text is escaped to avoid security issues.
-
-```xml
-<p><t t-esc="value"/></p>
-```
-
-rendered with the value `value` set to `42` in the rendering context yields:
-
-```html
-<p>42</p>
-```
-
-### `t-raw` directive
-
-The `t-raw` directive is almost the same as `t-esc`, but without the escaping.
-This is mostly useful to inject a raw html string somewhere. Obviously, this
-is unsafe to do in general, and should only be used for strings known to be safe.
-
-```xml
-<p><t t-esc="value"/></p>
-```
-
-rendered with the value `value` set to `<span>foo</span>` in the rendering context yields:
-
-```html
-<p><span>foo</span></p>
-```
-
-### `t-set` directive
-
-QWeb allows creating variables from within the template, to memoize a computation (to use it multiple times), give a piece of data a clearer name, ...
-
-This is done via the `t-set` directive, which takes the name of the variable to create. The value to set can be provided in two ways:
-
-1. a `t-value` attribute containing an expression, and the result of its
-   evaluation will be set:
-
-   ```xml
-   <t t-set="foo" t-value="2 + 1"/>
-   <t t-esc="foo"/>
-   ```
-
-   will print `3`. Note that the evaluation is done at rendering time, not at
-   compilte time.
-
-2. if there is no `t-value` attribute, the node’s body is saved and its value is
-   set as the variable’s value:
-
-   ```xml
-   <t t-set="foo">
-       <li>ok</li>
-   </t>
-   <t t-esc="foo"/>
-   ```
-
-   will generate `&lt;li&gt;ok&lt;/li&gt;` (the content is escaped as we used the `t-esc` directive)
-
-The `t-set` directive acts like a regular variable in most programming language.
-It is lexically scoped (inner nodes are sub scopes), can be shadowed, ...
-
-### `t-if` directive
-
-The `t-if` directive is useful to conditionally render something. It evaluates
-the expression given as attribute value, and then acts accordingly.
-
-```xml
-<div>
-    <t t-if="condition">
-        <p>ok</p>
-    </t>
-</div>
-```
-
-The element is rendered if the condition (evaluated with the current rendering
-context) is true:
-
-```xml
-<div>
-    <p>ok</p>
-</div>
-```
-
-but if the condition is false it is removed from the result:
-
-```xml
-<div>
-</div>
-```
-
-The conditional rendering applies to the bearer of the directive, which does not
-have to be `<t>`:
-
-```xml
-<div>
-    <p t-if="condition">ok</p>
-</div>
-```
-
-will give the same results as the previous example.
-
-Extra conditional branching directives `t-elif` and `t-else` are also available:
-
-```xml
-<div>
-    <p t-if="user.birthday == today()">Happy bithday!</p>
-    <p t-elif="user.login == 'root'">Welcome master!</p>
-    <p t-else="">Welcome!</p>
-</div>
-```
-
-### Expression evaluation
-
-It is useful to explain the various rules that applies on QWeb expressions. These
-expressions are strings that will be converted to a javascript expression at
-compile time.
-
-1. it should be a simple expression which returns a value. It cannot be a statement.
-
-   ```xml
-   <div><p t-if="1 + 2 === 3">ok</p></div>
-   ```
-
-   is valid, but the following is not valid:
-
-   ```xml
-   <div><p t-if="console.log(1)">NOT valid</p></div>
-   ```
-
-2. it can use anything in the rendering context:
-
-   ```xml
-   <p t-if="user.birthday == today()">Happy bithday!</p>
-   ```
-
-   is valid, and will read the `user` object from the context, and call the
-   `today` function.
-
-3. it can use a few special operators to avoid using symbols such as `<`, `>`,
-   `&` or `|`. This is useful to make sure that we still write valid XML.
-
-   | Word  | will be replaced by |
-   | ----- | ------------------- |
-   | `and` | `&&`                |
-   | `or`  | `\|\|`              |
-   | `gt`  | `>`                 |
-   | `gte` | `>=`                |
-   | `lt`  | `<`                 |
-   | `lte` | `<=`                |
-
-   So, one can write this:
-
-   ```xml
-   <div><p t-if="10 + 2 gt 5">ok</p></div>
-   ```
-
-### Dynamic attributes (`t-att` and `t-attf` directives)
-
-One can use the `t-att-` directive to add dynamic attributes. Its main use is to
-evaluate an expression (at rendering time) and bind an attribute to its result:
-
-For example, if we have `id` set to 32 in the rendering context,
-
-```xml
-<div t-att-data-action-id="id"/> <!-- result: <div data-action-id="32"></div> -->
-```
-
-If an expression evaluates to a falsy value, it will not be set at all:
-
-```xml
-<div t-att-foo="false"/>  <!-- result: <div></div> -->
-```
-
-There is another way to format a string attribute: the `t-attf-` directive. With
-it, you get string interpolation:
-
-```xml
-<div t-attf-foo="a #{value1} is #{value2} of #{value3} ]"/>
-<!-- result if values are set to 1,2 and 3: <div foo="a 0 is 1 of 2 ]"></div> -->
-```
-
-For historical reason, there is an alternate form of string interpolation:
-
-```xml
-<div t-attf-foo="a {{value1}} is {{value2}} of {{value3}} ]"/>
-<!-- result if values are set to 1,2 and 3: <div foo="a 0 is 1 of 2 ]"></div> -->
-```
-
-### `t-call` directive (sub templates)
-
-QWeb templates can be used for top level rendering, but they can also be used
-from within another template (to avoid duplication or give names to parts of
-templates), using the `t-call` directive:
-
-```xml
-<div t-name="other-template">
-    <p><t t-value="var"/></p>
-</div>
-
-<div t-name="main-template">
-    <t t-set="var" t-value="owl"/>
-    <t t-call="other-template"/>
-</div>
-```
-
-will be rendered as `<div><p>owl</p></div>`. This example shows that the sub
-template is rendered with the execution context of the parent. The sub template
-is actually inlined in the main template, but in a sub scope: variables defined
-in the sub template do not escape.
-
-Sometimes, one might want to pass information to the sub template. In that case,
-the content of the body of the `t-call` directive is available as a special
-magic variable `0`:
-
-```xml
-<t t-name="other-template">
-    This template was called with content:
-    <t t-raw="0"/>
-</t>
-
-<div t-name="main-template">
-    <t t-call="other-template">
-        <em>content</em>
-    </t>
-</div>
-```
-
-will result in :
-
-```xml
-<div>
-    This template was called with content:
-    <em>content</em>
-</div>
-```
-
-## JS/OWL Specific Extensions
-
-### `t-on` directive
-
-In a component's template, it is useful to be able to register handlers on some
-elements to some specific events. This
-is what makes a template _alive_. There are two different use cases.
-
-1. Register an event handler on a DOM node
-
-   ```xml
-   <button t-on-click="someMethod">Do something</button>
-   ```
-
-   This will be roughly translated in javascript like this:
-
-   ```js
-   button.addEventListener("click", widget.someMethod.bind(widget));
-   ```
-
-   The suffix (`click` in this example) is simply the name of the actual DOM
-   event.
-
-   In order to remove the DOM event details from the event handlers (like calls
-   to `event.preventDefault`) and let them focus on data logic, _modifiers_ can
-   be specified as additional suffixes of the `t-on` directive.
-
-   | Modifier   | Description                                                       |
-   | ---------- | ----------------------------------------------------------------- |
-   | `.stop`    | calls `event.stopPropagation()` before calling the method         |
-   | `.prevent` | calls `event.preventDefault()` before calling the method          |
-   | `.self`    | calls the method only if the `event.target` is the element itself |
-
-   ```xml
-   <button t-on-click.stop="someMethod">Do something</button>
-   ```
-
-   Note that modifiers can be combined (ex: `t-on-click.stop.prevent`), and that
-   the order may matter. For instance `t-on-click.prevent.self` will prevent all
-   clicks while `t-on-click.self.prevent` will only prevent clicks on the
-   element itself.
-
-2. Register an event handler on a component. This will not capture a DOM event,
-   but rather a _business_ event:
-
-   ```xml
-   <t t-widget="MyWidget" t-on-menuLoaded="someMethod"/>
-   ```
-
-   ```js
-   class MyWidget {
-       someWhere() {
-           const payload = ...;
-           this.trigger('menuLoaded', payload);
-       }
-   }
-   ```
-
-   Here, the parent widget will receive the payload in its `someMethod` handler,
-   whenever the event is triggered.
-
-The `t-on` directive also allows to prebind some arguments. For example,
-
-```xml
-<button t-on-click="someMethod(expr)">Do something</button>
-```
-
-Here, `expr` is a valid Owl expression, so it could be `true` or some variable
-from the rendering context.
-
-### Component: `t-widget`, `t-props`
-
-The `t-widget` and the `t-props` directives are the key to a declarative component
-system. They allow a template to define where and how a sub widget is created
-and/or updated. For example:
-
-```xml
-<div t-name="ParentWidget">
-    <t t-widget="ChildWidget" t-props="{count: state.val}"/>
-</div>
-```
-
-```js
-class ParentWidget {
-  widgets = { ChildWidget };
-  state = { val: 4 };
-}
-```
-
-Whenever the template is rendered, it will automatically create the subwidget
-`ChildWidget` at the correct place. It needs to find the reference to the
-actual component class in the special `widgets` key, or the class registered in
-QWeb's global registry (see `register` function of QWeb). It first looks inside
-the local `widgets` key, then fallbacks on the global registry.
-
-In this example, the child widget will receive the object `{count: 4}` in its
-constructor. This will be assigned to the `props` variable, which can be accessed
-on the widget (and also, in the template). Whenever the state is updated, then
-the subwidget will also be updated automatically.
-
-The `t-widget` directive also accepts dynamic values with string interpolation
-(like the [`t-attf-`](#dynamic-attributes-t-att-and-t-attf-directives) directive):
-
-```xml
-<div t-name="ParentWidget">
-    <t t-widget="ChildWidget#{id}"/>
-</div>
-```
-
-```js
-class ParentWidget {
-  widgets = { ChildWidget1, ChildWidget2 };
-  state = { id: 1 };
-}
-```
-
-Similarly to `t-attf-`, there is an alternate form of string interpolation:
-
-```xml
-<div t-name="ParentWidget">
-    <t t-widget="ChildWidget{{id}}"/>
-</div>
-```
-
-### `t-ref` directive
-
-The `t-ref` directive helps a component keep reference to some inside part of it.
-Like the `t-on` directive, it can work either on a DOM node, or on a component:
-
-```xml
-<div>
-    <div t-ref="someDiv"/>
-    <t t-widget="SubWidget" t-ref="someWidget"/>
-</div>
-```
-
-In this example, the widget will be able to access the `div` and the component
-inside the special `refs` variable:
-
-```js
-this.refs.someDiv;
-this.refs.someWidget;
-```
-
-This is useful for various usecases: for example, integrating with an external
-library that needs to render itself inside an actual DOM node. Or for calling
-some method on a sub widget.
-
-Note: if used on a component, the reference will be set in the `refs`
-variable between `willPatch` and `patched`.
-
-The `t-ref` directive also accepts dynamic values with string interpolation
-(like the [`t-attf-`](#dynamic-attributes-t-att-and-t-attf-directives) and
-[`t-widget-`](#component-t-widget-t-props) directives). For example, if we have
-`id` set to 44 in the rendering context,
-
-```xml
-<div t-ref="widget_#{id}"/>
-```
-
-```js
-this.refs.widget_44;
-```
-
-Similarly to `t-attf-` and `t-widget`, there is an alternate form of string
-interpolation:
-
-```xml
-<div t-ref="widget_{{id}}"/>
-```
-
-### `t-key` directive
-
-Even though Owl tries to be as declarative as possible, some DOM state is still
-locked inside the DOM: for example, the scrolling state, the current user selection,
-the focused element or the state of an input. This is why we use a virtual dom
-algorithm to keep the actual DOM node as much as possible. However, this is
-sometimes not enough, and we need to help Owl decide if an element is actually
-the same, or is different. The `t-key` directive is used to give an identity to an element.
-
-There are three main use cases:
-
-- _elements in a list_:
-
-  ```xml
-    <span t-foreach="todos" t-as="todo" t-key="todo.id">
-        <t t-esc="todo.text"/>
-    </span>
-  ```
-
-- _`t-if`/`t-else`_
-
-- _animations_: give a different identity to a component. Ex: thread id with
-  animations on add/remove message.
-
-### `t-transition` directive
-
-To perform useful transition effects, whenever an element appears or disappears,
-it is necessary to add/remove some css style or class at some precise moment in
-the lifetime of a node. Since this is not easy to do by hand, Owl `t-transition`
-directive is there to help.
-
-Whenever a node has a `t-transition` directive, with a `name` value, the following
-will happen:
-
-At node insertion:
-
-- the css classes `name-enter` and `name-enter-active` will be added directly
-  when the node is inserted into the DOM,
-- on the next animation frame: the css class `name-enter` will be removed and the
-  class `name-enter-to` will be added (so they can be used to trigger css
-  transition effects),
-- the css class `name-enter-active` will be removed whenever a css transition
-  ends.
-
-At node destruction:
-
-- the css classes `name-leave` and `name-leave-active` will be added before the
-  node is removed to the DOM,
-- the css class `name-leave` will be removed on the next animation frame (so it
-  can be used to trigger css transition effects),
-- the css class `name-leave-active` will be removed whenever a css transition
-  ends. Only then will the element be removed from the DOM.
-
-For example, a simple fade in/out effect can be done with this:
-
-```xml
-<div>
-    <div t-if="state.flag" class="square" t-transition="fade">Hello</div>
-</div>
-```
-
-```css
-.fade-enter-active,
-.fade-leave-active {
-  transition: opacity 0.5s;
-}
-.fade-enter,
-.fade-leave-to {
-  opacity: 0;
-}
-```
-
-The `t-transition` directive can be combined with `t-widget`.
-
-Notes:
-
-- more information on animations are available [here](animations.md).
-- the value for `t-transition` must be a single class name. Owl does not support
-  more than one transition on a single node.
-
-### `t-mounted` directive
-
-The `t-mounted` directive allows to register a callback to execute whenever the node
-is inserted into the DOM.
-
-```xml
-<div><input t-ref="someInput" t-mounted="focusMe"/></div>
-```
-
-```js
-class MyWidget extends owl.Component {
-    ...
-    focusMe() {
-        this.refs.someInput.focus();
-    }
-}
-```
-
-### Debugging (`t-debug` and `t-log`)
-
-The javascript QWeb implementation provides two useful debugging directives:
-
-`t-debug` adds a debugger statement during template rendering:
-
-```xml
-<t t-if="a_test">
-    <t t-debug="">
-</t>
-```
-
-will stop execution if the browser dev tools are open.
-
-`t-log` takes an expression parameter, evaluates the expression during rendering and logs its result with console.log:
-
-```xml
-<t t-set="foo" t-value="42"/>
-<t t-log="foo"/>
-```
-
-will print 42 to the console
-
-### White spaces
-
-White spaces in a templates are handled in a special way:
-
-- consecutive whitespaces are always condensed to a single whitespace
-- if a whitespace-only text node contains a linebreak, it is ignored
-- the previous rules do not apply if we are in a `<pre>` tag
-
-### Root nodes
-
-For many reasons, Owl QWeb templates should have a single root node. More
-precisely, the result of a template rendering should have a single root node:
-
-```xml
-<!–– not ok: two root nodes ––>
-<t>
-    <div>foo</div>
-    <div>bar</div>
-</t>
-
-<!–– ok: result has one single root node ––>
-<t>
-    <div t-if="someCondition">foo</div>
-    <span t-else="1">bar</span>
-</t>
-```
-
-Extra root nodes will actually be ignored (even though they will be rendered
-in memory).
-
-Note: this does not apply to subtemplates (see the `t-call` directive). In that
-case, they will be inlined in the main template, and can actually have many
-root nodes.

doc/readme.md

@@ -1,17 +0,0 @@
-# 🦉 OWL Documentation 🦉
-
-
-## Reference
-
-- [Component](component.md)
-- [QWeb](qweb.md)
-- [Store](store.md)
-- [Observer](observer.md)
-- [Virtual DOM](vdom.md)
-- [Utils](utils.md)
-
-## Miscellaneous
-- [Quick Start](quick_start.md)
-- [Animations](animations.md)
-- [Tooling](tooling.md)
-- [Comparison with React/Vue](comparison.md)

doc/store.md

@@ -1,149 +0,0 @@
-# 🦉 Store 🦉
-
-## Content
-
-- [Overview](#overview)
-- [Example](#example)
-- [Reference](#reference)
-  - [Public API](#public-api)
-  - [Mutations](#mutations)
-  - [Actions](#actions)
-  - [Getters](#getters)
-  - [Connecting a component](#connecting-a-component)
-
-## Overview
-
-Managing the state in an application is not an easy task. In some cases, the
-state of an application can be part of the component tree, in a natural way.
-However, there are situations where some part of the state need to be displayed
-in various parts of the user interface, and then, it is not obvious which
-component should own which part of the state.
-
-Owl's solution to this issue is a centralized store. It is a class that owns
-some state, and let the developer update it in a structured way (through
-mutations and actions). Owl components can then connect to the store, and will
-be updated if necessary.
-
-Note: Owl's store is inspired by React Redux and VueX.
-
-## Example
-
-Here is what a simple store look like:
-
-```js
-const actions = {
-    addTodo({commit}, message) {
-        commit('addTodo', message);
-    }
-};
-
-const mutations = {
-    addTodo({state}, message) {
-        const todo = {
-            id: state.nextId++,
-            message,
-            isCompleted: false,
-        };
-        state.todos.push(todo);
-    },
-};
-
-const state = {
-    todos: [],
-    nextId: 1,
-};
-
-const store = new owl.Store({state, actions, mutations});
-store.on('update', () => console.log(store.state));
-
-// updating the state
-store.dispatch('addTodo', 'fix all bugs');
-```
-
-
-## Reference
-
-The store is a simple `owl.EventBus` that triggers `update` events whenever its
-state is changed.  Note that these events are triggered only after a microtask
-tick, so only one event will be triggered for any number of state changes in a
-call stack.
-
-Also, it is important to mention that the state is observed (with a `owl.Observer`),
-which is the reason why it is able to know if it was changed.  This implies that
-state changes need to be done carefully in some cases (adding a new key to an
-object, or modifying an array with the `arr[i] = newValue` syntax).  See the
-[Observer](observer.md)'s documentation for more details.
-
-### Public API
-
-1. `constructor`
-2. `commit`
-3. `dispatch`
-
-### Mutations
-
-Mutations are the only way to modify the state.  Changing the state outside a
-mutation is not allowed (and should throw an error).  Mutations are synchronous.
-
-### Actions
-
-Actions are used to coordinate state changes.  It is also useful whenever some
-asynchronous logic is necessary.  For example, fetching data should be done
-in an action.
-
-```js
-const actions = {
-    async login({commit}) {
-        commit('setLoginState', 'pending');
-        try {
-            const loginInfo = await doSomeRPC('/login/', 'someinfo');
-            commit('setLoginState', loginInfo);
-        } catch {
-            commit('setLoginState', 'error');
-        }
-    }
-};
-```
-
-### Getters
-
-Usually, data contained in the store will be stored in a normalized way. For
-example,
-
-```js
-{
-    posts: [{id: 11, authorId: 4, content: 'Greetings'}],
-    authors: [{id: 4, name: 'John'}]
-}
-```
-
-However, the user interface will probably need some denormalized data like
-
-```js
-{id: 11, author: {id: 4, name: 'John'}, content: 'Greetings'}
-```
-
-This is what `getters` are for: they give a centralized way to process and
-transform the data contained in the store.
-
-```js
-const getters = {
-    getPost({state}, id) {
-        const post = state.posts.find(p => p.id === id);
-        const author = state.authors.find(a => a.id = post.id);
-        return {
-            id,
-            author,
-            content: post.content
-        };
-    },
-};
-
-// somewhere else
-const post = store.getters.getPost(id);
-
-```
-
-### Connecting a component
-
-Todo

doc/tooling.md

@@ -1,18 +0,0 @@
-# 🦉 Tooling 🦉
-
-## Development mode
-
-By default, Owl is in *production* mode, this means that it will try to do its
-job fast, and skip some expensive operations.  However, in some cases, it is
-convenient to have better information on what is going on, this is the purpose
-of the dev mode.
-
-Owl has a mode flag, in `owl.__info__.mode`.  Its default value is `prod`, but
-it can be set to `dev`:
-
-```js
-owl.__info__.mode = 'dev';
-```
-
-Note that templates compiled with the `prod` settings will not be recompiled.
-So, changing this setting is best done at startup.

doc/utils.md

@@ -1,39 +0,0 @@
-# 🦉 Utils 🦉
-
-Owl export a few useful utility functions, to help with common issues. Those
-functions are all available in the `owl.utils` namespace.
-
-## Content
-
-- [`whenReady`](#whenready)
-- [`loadJS`](#loadjs)
-- [`loadTemplates`](#loadtemplates)
-- [`escape`](#escape)
-- [`debounce`](#debounce)
-
-## `whenReady`
-
-The function `whenReady` is useful to register some code that need to be executed
-as soon as the document (page) is ready:
-
-```js
-owl.utils.whenReady(function () {
-    const qweb = new owl.QWeb();
-    const app = new App({ qweb });
-    app.mount(document.body);
-});
-```
-
-## `loadJS`
-
-## `loadTemplates`
-
-## `escape`
-
-## `debounce`
-
-
-
-
-
-

doc/vdom.md

@@ -1,3 +0,0 @@
-# 🦉 VDom 🦉
-
-Owl's virtual dom is a fork of [snabbdom](https://github.com/snabbdom/snabbdom).

extras/benchmarks/odoo-widgets-12.0/app.js

@@ -1,218 +0,0 @@
-import { buildData, startMeasure, stopMeasure } from "../shared/utils.js";
-
-odoo.define("app", function(require) {
-  const Widget = require("web.Widget");
-  var core = require("web.core");
-  var dom = require("web.dom");
-
-  //----------------------------------------------------------------------------
-  // Likes Counter Widget
-  //----------------------------------------------------------------------------
-  var Counter = Widget.extend({
-    template: "counter",
-    events: {
-      "click .o_increment": "_onIncrement"
-    },
-    init: function(parent) {
-      this._super(parent);
-      this.value = 0;
-    },
-    start: function() {
-      this.updateCounter();
-    },
-    on_attach_callback: function() {},
-    on_detach_callback: function() {},
-    updateCounter: function() {
-      this.$(".o_increment").html("Value: " + this.value);
-    },
-    _onIncrement: function(ev) {
-      ev.stopPropagation();
-      this.value += 1;
-      this.updateCounter();
-    }
-  });
-
-  //----------------------------------------------------------------------------
-  // Message Widget
-  //----------------------------------------------------------------------------
-  var Message = Widget.extend({
-    template: "message",
-    events: {
-      "click .remove": "_onRemove"
-    },
-
-    init: function(parent, message) {
-      this._super(parent);
-      this.author = message.author;
-      this.msg = message.msg;
-      this.id = message.id;
-    },
-    willStart: function() {
-      this.counter = new Counter(this);
-      return this.counter.appendTo($("<div>"));
-    },
-
-    start: function() {
-      this.$msg = this.$(".msg");
-      dom.append(this.$el, this.counter.$el, {
-        in_DOM: this.isInDom,
-        callbacks: [{ widget: this.counter }]
-      });
-    },
-    on_attach_callback: function() {
-      this.isInDom = true;
-      if (this.counter) {
-        this.counter.on_attach_callback();
-      }
-    },
-    on_detach_callback: function() {
-      this.isInDom = true;
-      if (this.counter) {
-        this.counter.on_detach_callback();
-      }
-    },
-
-    _onRemove: function() {
-      this.trigger_up("remove_message", { id: this.id });
-    },
-
-    update: function() {
-      this.msg += "!!!";
-      this.$msg.text(this.msg);
-    }
-  });
-
-  //----------------------------------------------------------------------------
-  // Root Widget
-  //----------------------------------------------------------------------------
-  var App = Widget.extend({
-    template: "root",
-    events: {
-      "click .o_btn_msg.100": function() {
-        this.addMessages(100);
-      },
-      "click .o_btn_msg.1000": function() {
-        this.addMessages(1000);
-      },
-      "click .o_btn_msg.10000": function() {
-        this.addMessages(10000);
-      },
-      "click .o_btn_msg.50000": function() {
-        this.addMessages(50000);
-      },
-      "click .updateSomeMessages": function() {
-        this.updateSomeMessages();
-      },
-      "click .clear": function() {
-        this.clear();
-      }
-    },
-    custom_events: {
-      remove_message: "_onRemoveMessage"
-    },
-
-    init: function(parent) {
-      this._super(parent);
-      this.widgets = {};
-      this.isInDom = false;
-      this.messageCount = 0;
-    },
-
-    start: function() {
-      this.$content = this.$(".content");
-      this.$msgCount = this.$(".message_count");
-    },
-    on_attach_callback: function() {
-      this.isInDom = true;
-      for (let widget of Object.values(this.widgets)) {
-        if (widget.on_attach_callback) {
-          widget.on_attach_callback();
-        }
-      }
-    },
-    on_detach_callback: function() {
-      this.isInDom = true;
-      for (let widget of Object.values(this.widgets)) {
-        if (widget.on_detach_callback) {
-          widget.on_detach_callback();
-        }
-      }
-    },
-
-    updateMessageCount() {
-      this.$msgCount.text("Number of msg: " + this.messageCount);
-    },
-
-    addMessages: function(n) {
-      var self = this;
-      startMeasure("add " + n);
-      const defs = [];
-      const messages = buildData(n);
-      for (let message of messages) {
-        const widget = new Message(this, message);
-        this.widgets[message.id] = widget;
-        defs.push(widget.appendTo("<div>"));
-      }
-      $.when
-        .apply($, defs)
-        .then(function() {
-          for (let message of messages) {
-            let widget = self.widgets[message.id];
-            dom.append(self.$content, widget.$el, {
-              in_DOM: this.isInDom,
-              callbacks: [{ widget: widget }]
-            });
-          }
-        })
-        .then(function() {
-          self.messageCount += n;
-          self.updateMessageCount();
-          stopMeasure();
-        });
-    },
-    clear: function() {
-      startMeasure("clear");
-      this.$content.empty();
-      for (let key in this.widgets) {
-        this.widgets[key].destroy();
-        delete this.widgets[key];
-      }
-      this.messageCount = 0;
-      this.updateMessageCount();
-      stopMeasure();
-    },
-    updateSomeMessages: function() {
-      startMeasure("update every 10th");
-      const widgets = Object.values(this.widgets);
-      for (let i = 0; i < widgets.length; i += 10) {
-        widgets[i].update();
-      }
-      stopMeasure();
-    },
-    _onRemoveMessage: function(ev) {
-      startMeasure("remove message");
-      ev.target.destroy();
-      delete this.widgets[ev.data.id];
-      this.messageCount--;
-      this.updateMessageCount();
-      stopMeasure();
-    }
-  });
-
-  //------------------------------------------------------------------------------
-  // Application initialization
-  //------------------------------------------------------------------------------
-  async function start() {
-    // prepare QWeb
-    const templates = await fetch("templates.xml");
-    let strTemplates = await templates.text();
-    strTemplates = strTemplates.replace(/<!--[\s\S]*?-->/g, "");
-    core.qweb.add_template(strTemplates);
-
-    // prepare app
-    const app = new App();
-    await app.appendTo(document.body);
-  }
-
-  start();
-});

extras/benchmarks/odoo-widgets-12.0/index.html

@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <title>Odoo Widget Benchmark (12.0)</title>
-  <link href="../shared/main.css" rel="stylesheet"/>
-  <script src='web.assets_common.js'></script>
-</head>
-<body>
-  <div id='main'></div>
-  <script src='app.js' type="module"></script>
-</body>
-</html>

extras/benchmarks/odoo-widgets-12.0/templates.xml

@@ -1,30 +0,0 @@
-<templates>
-    <div class="main" t-name="root">
-        <div class="left-thing">
-            <div class="message_count">
-                Number of msg: 0
-            </div>
-            <button class="o_btn_msg 100">Add 100 messages</button>
-            <button class="o_btn_msg 1000">Add 1000 messages</button>
-            <button class="o_btn_msg 10000">Add 10000 messages</button>
-            <button class="o_btn_msg 50000">Add 50000 messages</button>
-            <button class="updateSomeMessages">Update every 10th message</button>
-            <button class="clear">Clear</button>
-        </div>
-        <div class="right-thing">
-            <div class="content">
-            </div>
-        </div>
-    </div>
-
-    <div t-name="message" class="message">
-        <span class="author"><t t-esc="widget.author"/></span>
-        <span class="msg"><t t-esc="widget.msg"/></span>
-        <button class="remove" >Remove</button>
-    </div>
-
-  <div t-name="counter">
-    <button class="o_increment"></button>
-  </div>
-
-</templates>

extras/benchmarks/odoo-widgets-12.3/app.js

@@ -1,218 +0,0 @@
-import { buildData, startMeasure, stopMeasure } from "../shared/utils.js";
-
-odoo.define("app", function(require) {
-  const Widget = require("web.Widget");
-  var core = require("web.core");
-  var dom = require("web.dom");
-
-  //----------------------------------------------------------------------------
-  // Likes Counter Widget
-  //----------------------------------------------------------------------------
-  var Counter = Widget.extend({
-    template: "counter",
-    events: {
-      "click .o_increment": "_onIncrement"
-    },
-    init: function(parent) {
-      this._super(parent);
-      this.value = 0;
-    },
-    start: function() {
-      this.updateCounter();
-    },
-    on_attach_callback: function() {},
-    on_detach_callback: function() {},
-    updateCounter: function() {
-      this.$(".o_increment").html("Value: " + this.value);
-    },
-    _onIncrement: function(ev) {
-      ev.stopPropagation();
-      this.value += 1;
-      this.updateCounter();
-    }
-  });
-
-  //----------------------------------------------------------------------------
-  // Message Widget
-  //----------------------------------------------------------------------------
-  var Message = Widget.extend({
-    template: "message",
-    events: {
-      "click .remove": "_onRemove"
-    },
-
-    init: function(parent, message) {
-      this._super(parent);
-      this.author = message.author;
-      this.msg = message.msg;
-      this.id = message.id;
-    },
-    willStart: function() {
-      this.counter = new Counter(this);
-      return this.counter.appendTo($("<div>"));
-    },
-
-    start: function() {
-      this.$msg = this.$(".msg");
-      dom.append(this.$el, this.counter.$el, {
-        in_DOM: this.isInDom,
-        callbacks: [{ widget: this.counter }]
-      });
-    },
-    on_attach_callback: function() {
-      this.isInDom = true;
-      if (this.counter) {
-        this.counter.on_attach_callback();
-      }
-    },
-    on_detach_callback: function() {
-      this.isInDom = true;
-      if (this.counter) {
-        this.counter.on_detach_callback();
-      }
-    },
-
-    _onRemove: function() {
-      this.trigger_up("remove_message", { id: this.id });
-    },
-
-    update: function() {
-      this.msg += "!!!";
-      this.$msg.text(this.msg);
-    }
-  });
-
-  //----------------------------------------------------------------------------
-  // Root Widget
-  //----------------------------------------------------------------------------
-  var App = Widget.extend({
-    template: "root",
-    events: {
-      "click .o_btn_msg.100": function() {
-        this.addMessages(100);
-      },
-      "click .o_btn_msg.1000": function() {
-        this.addMessages(1000);
-      },
-      "click .o_btn_msg.10000": function() {
-        this.addMessages(10000);
-      },
-      "click .o_btn_msg.50000": function() {
-        this.addMessages(50000);
-      },
-      "click .updateSomeMessages": function() {
-        this.updateSomeMessages();
-      },
-      "click .clear": function() {
-        this.clear();
-      }
-    },
-    custom_events: {
-      remove_message: "_onRemoveMessage"
-    },
-
-    init: function(parent) {
-      this._super(parent);
-      this.widgets = {};
-      this.isInDom = false;
-      this.messageCount = 0;
-    },
-
-    start: function() {
-      this.$content = this.$(".content");
-      this.$msgCount = this.$(".message_count");
-    },
-    on_attach_callback: function() {
-      this.isInDom = true;
-      for (let widget of Object.values(this.widgets)) {
-        if (widget.on_attach_callback) {
-          widget.on_attach_callback();
-        }
-      }
-    },
-    on_detach_callback: function() {
-      this.isInDom = true;
-      for (let widget of Object.values(this.widgets)) {
-        if (widget.on_detach_callback) {
-          widget.on_detach_callback();
-        }
-      }
-    },
-
-    updateMessageCount() {
-      this.$msgCount.text("Number of msg: " + this.messageCount);
-    },
-
-    addMessages: function(n) {
-      var self = this;
-      startMeasure("add " + n);
-      const defs = [];
-      const messages = buildData(n);
-      for (let message of messages) {
-        const widget = new Message(this, message);
-        this.widgets[message.id] = widget;
-        defs.push(widget.appendTo("<div>"));
-      }
-      $.when
-        .apply($, defs)
-        .then(function() {
-          for (let message of messages) {
-            let widget = self.widgets[message.id];
-            dom.append(self.$content, widget.$el, {
-              in_DOM: this.isInDom,
-              callbacks: [{ widget: widget }]
-            });
-          }
-        })
-        .then(function() {
-          self.messageCount += n;
-          self.updateMessageCount();
-          stopMeasure();
-        });
-    },
-    clear: function() {
-      startMeasure("clear");
-      this.$content.empty();
-      for (let key in this.widgets) {
-        this.widgets[key].destroy();
-        delete this.widgets[key];
-      }
-      this.messageCount = 0;
-      this.updateMessageCount();
-      stopMeasure();
-    },
-    updateSomeMessages: function() {
-      startMeasure("update every 10th");
-      const widgets = Object.values(this.widgets);
-      for (let i = 0; i < widgets.length; i += 10) {
-        widgets[i].update();
-      }
-      stopMeasure();
-    },
-    _onRemoveMessage: function(ev) {
-      startMeasure("remove message");
-      ev.target.destroy();
-      delete this.widgets[ev.data.id];
-      this.messageCount--;
-      this.updateMessageCount();
-      stopMeasure();
-    }
-  });
-
-  //------------------------------------------------------------------------------
-  // Application initialization
-  //------------------------------------------------------------------------------
-  async function start() {
-    // prepare QWeb
-    const templates = await fetch("templates.xml");
-    let strTemplates = await templates.text();
-    strTemplates = strTemplates.replace(/<!--[\s\S]*?-->/g, "");
-    core.qweb.add_template(strTemplates);
-
-    // prepare app
-    const app = new App();
-    await app.appendTo(document.body);
-  }
-
-  start();
-});

extras/benchmarks/odoo-widgets-12.3/index.html

@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <title>Odoo Widget Benchmark (12.3)</title>
-  <link href="../shared/main.css" rel="stylesheet"/>
-  <script src='web.assets_common.js'></script>
-</head>
-<body>
-  <div id='main'></div>
-  <script src='app.js' type="module"></script>
-</body>
-</html>

extras/benchmarks/odoo-widgets-12.3/templates.xml

@@ -1,30 +0,0 @@
-<templates>
-    <div class="main" t-name="root">
-        <div class="left-thing">
-            <div class="message_count">
-                Number of msg: 0
-            </div>
-            <button class="o_btn_msg 100">Add 100 messages</button>
-            <button class="o_btn_msg 1000">Add 1000 messages</button>
-            <button class="o_btn_msg 10000">Add 10000 messages</button>
-            <button class="o_btn_msg 50000">Add 50000 messages</button>
-            <button class="updateSomeMessages">Update every 10th message</button>
-            <button class="clear">Clear</button>
-        </div>
-        <div class="right-thing">
-            <div class="content">
-            </div>
-        </div>
-    </div>
-
-    <div t-name="message" class="message">
-        <span class="author"><t t-esc="widget.author"/></span>
-        <span class="msg"><t t-esc="widget.msg"/></span>
-        <button class="remove" >Remove</button>
-    </div>
-
-  <div t-name="counter">
-    <button class="o_increment"></button>
-  </div>
-
-</templates>

extras/benchmarks/owl-0.10.0/app.js

@@ -1,84 +0,0 @@
-import { buildData, startMeasure, stopMeasure } from "../shared/utils.js";
-
-//------------------------------------------------------------------------------
-// Likes Counter Widget
-//------------------------------------------------------------------------------
-class Counter extends owl.Component {
-  template = "counter";
-  state = { counter: 0 };
-
-  increment() {
-    this.state.counter++;
-  }
-}
-
-//------------------------------------------------------------------------------
-// Message Widget
-//------------------------------------------------------------------------------
-class Message extends owl.Component {
-  template = "message";
-  widgets = { Counter };
-
-  shouldUpdate(nextProps) {
-    return nextProps !== this.props;
-  }
-  removeMessage() {
-    this.trigger("remove_message", {
-      id: this.props.id
-    });
-  }
-}
-
-//------------------------------------------------------------------------------
-// Root Widget
-//------------------------------------------------------------------------------
-class App extends owl.Component {
-  template = "root";
-  widgets = { Message };
-  state = { messages: [] };
-
-  addMessages(n) {
-    startMeasure("add " + n);
-    const newMessages = buildData(n);
-    this.state.messages.push.apply(this.state.messages, newMessages);
-    stopMeasure();
-  }
-
-  clear() {
-    startMeasure("clear");
-    this.state.messages = [];
-    stopMeasure();
-  }
-
-  updateSomeMessages() {
-    startMeasure("update every 10th");
-    const messages = this.state.messages;
-    for (let i = 0; i < this.state.messages.length; i += 10) {
-      const msg = Object.assign({}, messages[i]);
-      msg.author += '!!!';
-      this.set(messages, i, msg);
-    }
-    stopMeasure();
-  }
-
-  removeMessage(data) {
-    startMeasure("remove message");
-    const index = this.state.messages.findIndex(m => m.id === data.id);
-    this.state.messages.splice(index, 1);
-    stopMeasure();
-  }
-}
-
-//------------------------------------------------------------------------------
-// Application initialization
-//------------------------------------------------------------------------------
-async function start() {
-  const templates = await owl.utils.loadTemplates("templates.xml");
-  const env = {
-    qweb: new owl.QWeb(templates)
-  };
-  const app = new App(env);
-  app.mount(document.body);
-}
-
-start();

extras/benchmarks/owl-0.10.0/index.html

@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <title>OWL 0.10.0 Benchmark</title>
-  <link href="../shared/main.css" rel="stylesheet"/>
-  <script src='owl.js'></script>
-</head>
-<body>
-  <div id='main'></div>
-  <script src='app.js' type="module"></script>
-</body>
-</html>

extras/benchmarks/owl-0.10.0/templates.xml

@@ -1,32 +0,0 @@
-<templates>
-  <div t-name="root" class="main">
-      <div class="left-thing">
-          <div>Number of msg: <t t-esc="state.messages.length"/></div>
-          <button t-on-click="addMessages(100)">Add 100 messages</button>
-          <button t-on-click="addMessages(1000)">Add 1000 messages</button>
-          <button t-on-click="addMessages(10000)">Add 10000 messages</button>
-          <button t-on-click="addMessages(50000)">Add 50000 messages</button>
-          <button t-on-click="updateSomeMessages">Update every 10th message</button>
-          <button t-on-click="clear">Clear</button>
-      </div>
-      <div class="right-thing">
-          <div class="content">
-              <t t-foreach="state.messages" t-as="message">
-                  <t t-widget="Message" t-key="message.id" t-props="message" t-on-remove_message="removeMessage"/>
-              </t>
-          </div>
-      </div>
-  </div>
-
-  <div t-name="message" class="message">
-    <span class="author"><t t-esc="props.author"/></span>
-    <span class="msg"><t t-esc="props.msg"/></span>
-    <button class="remove" t-on-click="removeMessage">Remove</button>
-    <t t-widget="Counter"/>
-  </div>
-
-  <div t-name="counter">
-    <button t-on-click="increment">Value: <t t-esc="state.counter"/></button>
-  </div>
-
-</templates>

extras/benchmarks/owl-0.11.0/app.js

@@ -1,84 +0,0 @@
-import { buildData, startMeasure, stopMeasure } from "../shared/utils.js";
-
-//------------------------------------------------------------------------------
-// Likes Counter Widget
-//------------------------------------------------------------------------------
-class Counter extends owl.Component {
-  template = "counter";
-  state = { counter: 0 };
-
-  increment() {
-    this.state.counter++;
-  }
-}
-
-//------------------------------------------------------------------------------
-// Message Widget
-//------------------------------------------------------------------------------
-class Message extends owl.Component {
-  template = "message";
-  widgets = { Counter };
-
-  shouldUpdate(nextProps) {
-    return nextProps !== this.props;
-  }
-  removeMessage() {
-    this.trigger("remove_message", {
-      id: this.props.id
-    });
-  }
-}
-
-//------------------------------------------------------------------------------
-// Root Widget
-//------------------------------------------------------------------------------
-class App extends owl.Component {
-  template = "root";
-  widgets = { Message };
-  state = { messages: [] };
-
-  addMessages(n) {
-    startMeasure("add " + n);
-    const newMessages = buildData(n);
-    this.state.messages.push.apply(this.state.messages, newMessages);
-    stopMeasure();
-  }
-
-  clear() {
-    startMeasure("clear");
-    this.state.messages = [];
-    stopMeasure();
-  }
-
-  updateSomeMessages() {
-    startMeasure("update every 10th");
-    const messages = this.state.messages;
-    for (let i = 0; i < this.state.messages.length; i += 10) {
-      const msg = Object.assign({}, messages[i]);
-      msg.author += '!!!';
-      this.set(messages, i, msg);
-    }
-    stopMeasure();
-  }
-
-  removeMessage(data) {
-    startMeasure("remove message");
-    const index = this.state.messages.findIndex(m => m.id === data.id);
-    this.state.messages.splice(index, 1);
-    stopMeasure();
-  }
-}
-
-//------------------------------------------------------------------------------
-// Application initialization
-//------------------------------------------------------------------------------
-async function start() {
-  const templates = await owl.utils.loadTemplates("templates.xml");
-  const env = {
-    qweb: new owl.QWeb(templates)
-  };
-  const app = new App(env);
-  app.mount(document.body);
-}
-
-start();

extras/benchmarks/owl-0.11.0/index.html

@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <title>OWL 0.11.0 Benchmark</title>
-  <link href="../shared/main.css" rel="stylesheet"/>
-  <script src='owl.js'></script>
-</head>
-<body>
-  <div id='main'></div>
-  <script src='app.js' type="module"></script>
-</body>
-</html>

extras/benchmarks/owl-0.11.0/templates.xml

@@ -1,32 +0,0 @@
-<templates>
-  <div t-name="root" class="main">
-      <div class="left-thing">
-          <div>Number of msg: <t t-esc="state.messages.length"/></div>
-          <button t-on-click="addMessages(100)">Add 100 messages</button>
-          <button t-on-click="addMessages(1000)">Add 1000 messages</button>
-          <button t-on-click="addMessages(10000)">Add 10000 messages</button>
-          <button t-on-click="addMessages(50000)">Add 50000 messages</button>
-          <button t-on-click="updateSomeMessages">Update every 10th message</button>
-          <button t-on-click="clear">Clear</button>
-      </div>
-      <div class="right-thing">
-          <div class="content">
-              <t t-foreach="state.messages" t-as="message">
-                  <t t-widget="Message" t-key="message.id" t-props="message" t-on-remove_message="removeMessage"/>
-              </t>
-          </div>
-      </div>
-  </div>
-
-  <div t-name="message" class="message">
-    <span class="author"><t t-esc="props.author"/></span>
-    <span class="msg"><t t-esc="props.msg"/></span>
-    <button class="remove" t-on-click="removeMessage">Remove</button>
-    <t t-widget="Counter"/>
-  </div>
-
-  <div t-name="counter">
-    <button t-on-click="increment">Value: <t t-esc="state.counter"/></button>
-  </div>
-
-</templates>

extras/benchmarks/owl-0.7.0/app.js

@@ -1,85 +0,0 @@
-import { buildData, startMeasure, stopMeasure } from "../shared/utils.js";
-
-//------------------------------------------------------------------------------
-// Likes Counter Widget
-//------------------------------------------------------------------------------
-class Counter extends owl.Component {
-  template = "counter";
-  state = { counter: 0 };
-
-  increment() {
-    this.state.counter++;
-  }
-}
-
-//------------------------------------------------------------------------------
-// Message Widget
-//------------------------------------------------------------------------------
-class Message extends owl.Component {
-  template = "message";
-  widgets = { Counter };
-
-  shouldUpdate(nextProps) {
-    return nextProps !== this.props;
-  }
-
-  removeMessage() {
-    this.trigger("remove_message", {
-      id: this.props.id
-    });
-  }
-}
-
-//------------------------------------------------------------------------------
-// Root Widget
-//------------------------------------------------------------------------------
-class App extends owl.Component {
-  template = "root";
-  widgets = { Message };
-  state = { messages: [] };
-
-  addMessages(n) {
-    startMeasure("add " + n);
-    const newMessages = buildData(n);
-    this.state.messages.push.apply(this.state.messages, newMessages);
-    stopMeasure();
-  }
-
-  clear() {
-    startMeasure("clear");
-    this.state.messages = [];
-    stopMeasure();
-  }
-
-  updateSomeMessages() {
-    startMeasure("update every 10th");
-    const messages = this.state.messages;
-    for (let i = 0; i < this.state.messages.length; i += 10) {
-      const msg = Object.assign({}, messages[i]);
-      msg.author += '!!!';
-      this.set(messages, i, msg);
-    }
-    stopMeasure();
-  }
-
-  removeMessage(data) {
-    startMeasure('remove message');
-    const index = this.state.messages.findIndex(m => m.id === data.id);
-    this.state.messages.splice(index, 1);
-    stopMeasure();
-  }
-}
-
-//------------------------------------------------------------------------------
-// Application initialization
-//------------------------------------------------------------------------------
-async function start() {
-  const templates = await owl.utils.loadTemplates("templates.xml");
-  const env = {
-    qweb: new owl.QWeb(templates)
-  };
-  const app = new App(env);
-  app.mount(document.body);
-}
-
-start();

extras/benchmarks/owl-0.7.0/index.html

@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <title>OWL 0.7.0 Benchmark</title>
-  <link href="../shared/main.css" rel="stylesheet"/>
-  <script src='owl.js'></script>
-</head>
-<body>
-  <div id='main'></div>
-  <script src='app.js' type="module"></script>
-</body>
-</html>

extras/benchmarks/owl-0.7.0/templates.xml

@@ -1,32 +0,0 @@
-<templates>
-  <div t-name="root" class="main">
-      <div class="left-thing">
-          <div>Number of msg: <t t-esc="state.messages.length"/></div>
-          <button t-on-click="addMessages(100)">Add 100 messages</button>
-          <button t-on-click="addMessages(1000)">Add 1000 messages</button>
-          <button t-on-click="addMessages(10000)">Add 10000 messages</button>
-          <button t-on-click="addMessages(50000)">Add 50000 messages</button>
-          <button t-on-click="updateSomeMessages">Update every 10th message</button>
-          <button t-on-click="clear">Clear</button>
-      </div>
-      <div class="right-thing">
-          <div class="content">
-              <t t-foreach="state.messages" t-as="message">
-                  <t t-widget="Message" t-key="message.id" t-props="message" t-on-remove_message="removeMessage"/>
-              </t>
-          </div>
-      </div>
-  </div>
-
-  <div t-name="message" class="message">
-    <span class="author"><t t-esc="props.author"/></span>
-    <span class="msg"><t t-esc="props.msg"/></span>
-    <button class="remove" t-on-click="removeMessage">Remove</button>
-    <t t-widget="Counter"/>
-  </div>
-
-  <div t-name="counter">
-    <button t-on-click="increment">Value: <t t-esc="state.counter"/></button>
-  </div>
-
-</templates>

extras/benchmarks/owl-0.8.0/app.js

@@ -1,84 +0,0 @@
-import { buildData, startMeasure, stopMeasure } from "../shared/utils.js";
-
-//------------------------------------------------------------------------------
-// Likes Counter Widget
-//------------------------------------------------------------------------------
-class Counter extends owl.Component {
-  template = "counter";
-  state = { counter: 0 };
-
-  increment() {
-    this.state.counter++;
-  }
-}
-
-//------------------------------------------------------------------------------
-// Message Widget
-//------------------------------------------------------------------------------
-class Message extends owl.Component {
-  template = "message";
-  widgets = { Counter };
-
-  shouldUpdate(nextProps) {
-    return nextProps !== this.props;
-  }
-  removeMessage() {
-    this.trigger("remove_message", {
-      id: this.props.id
-    });
-  }
-}
-
-//------------------------------------------------------------------------------
-// Root Widget
-//------------------------------------------------------------------------------
-class App extends owl.Component {
-  template = "root";
-  widgets = { Message };
-  state = { messages: [] };
-
-  addMessages(n) {
-    startMeasure("add " + n);
-    const newMessages = buildData(n);
-    this.state.messages.push.apply(this.state.messages, newMessages);
-    stopMeasure();
-  }
-
-  clear() {
-    startMeasure("clear");
-    this.state.messages = [];
-    stopMeasure();
-  }
-
-  updateSomeMessages() {
-    startMeasure("update every 10th");
-    const messages = this.state.messages;
-    for (let i = 0; i < this.state.messages.length; i += 10) {
-      const msg = Object.assign({}, messages[i]);
-      msg.author += '!!!';
-      this.set(messages, i, msg);
-    }
-    stopMeasure();
-  }
-
-  removeMessage(data) {
-    startMeasure("remove message");
-    const index = this.state.messages.findIndex(m => m.id === data.id);
-    this.state.messages.splice(index, 1);
-    stopMeasure();
-  }
-}
-
-//------------------------------------------------------------------------------
-// Application initialization
-//------------------------------------------------------------------------------
-async function start() {
-  const templates = await owl.utils.loadTemplates("templates.xml");
-  const env = {
-    qweb: new owl.QWeb(templates)
-  };
-  const app = new App(env);
-  app.mount(document.body);
-}
-
-start();

extras/benchmarks/owl-0.8.0/index.html

@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <title>OWL 0.8.0 Benchmark</title>
-  <link href="../shared/main.css" rel="stylesheet"/>
-  <script src='owl-0.8.0.js'></script>
-</head>
-<body>
-  <div id='main'></div>
-  <script src='app.js' type="module"></script>
-</body>
-</html>

extras/benchmarks/owl-0.8.0/templates.xml

@@ -1,32 +0,0 @@
-<templates>
-  <div t-name="root" class="main">
-      <div class="left-thing">
-          <div>Number of msg: <t t-esc="state.messages.length"/></div>
-          <button t-on-click="addMessages(100)">Add 100 messages</button>
-          <button t-on-click="addMessages(1000)">Add 1000 messages</button>
-          <button t-on-click="addMessages(10000)">Add 10000 messages</button>
-          <button t-on-click="addMessages(50000)">Add 50000 messages</button>
-          <button t-on-click="updateSomeMessages">Update every 10th message</button>
-          <button t-on-click="clear">Clear</button>
-      </div>
-      <div class="right-thing">
-          <div class="content">
-              <t t-foreach="state.messages" t-as="message">
-                  <t t-widget="Message" t-key="message.id" t-props="message" t-on-remove_message="removeMessage"/>
-              </t>
-          </div>
-      </div>
-  </div>
-
-  <div t-name="message" class="message">
-    <span class="author"><t t-esc="props.author"/></span>
-    <span class="msg"><t t-esc="props.msg"/></span>
-    <button class="remove" t-on-click="removeMessage">Remove</button>
-    <t t-widget="Counter"/>
-  </div>
-
-  <div t-name="counter">
-    <button t-on-click="increment">Value: <t t-esc="state.counter"/></button>
-  </div>
-
-</templates>

extras/benchmarks/owl-0.9.0/app.js

@@ -1,84 +0,0 @@
-import { buildData, startMeasure, stopMeasure } from "../shared/utils.js";
-
-//------------------------------------------------------------------------------
-// Likes Counter Widget
-//------------------------------------------------------------------------------
-class Counter extends owl.Component {
-  template = "counter";
-  state = { counter: 0 };
-
-  increment() {
-    this.state.counter++;
-  }
-}
-
-//------------------------------------------------------------------------------
-// Message Widget
-//------------------------------------------------------------------------------
-class Message extends owl.Component {
-  template = "message";
-  widgets = { Counter };
-
-  shouldUpdate(nextProps) {
-    return nextProps !== this.props;
-  }
-  removeMessage() {
-    this.trigger("remove_message", {
-      id: this.props.id
-    });
-  }
-}
-
-//------------------------------------------------------------------------------
-// Root Widget
-//------------------------------------------------------------------------------
-class App extends owl.Component {
-  template = "root";
-  widgets = { Message };
-  state = { messages: [] };
-
-  addMessages(n) {
-    startMeasure("add " + n);
-    const newMessages = buildData(n);
-    this.state.messages.push.apply(this.state.messages, newMessages);
-    stopMeasure();
-  }
-
-  clear() {
-    startMeasure("clear");
-    this.state.messages = [];
-    stopMeasure();
-  }
-
-  updateSomeMessages() {
-    startMeasure("update every 10th");
-    const messages = this.state.messages;
-    for (let i = 0; i < this.state.messages.length; i += 10) {
-      const msg = Object.assign({}, messages[i]);
-      msg.author += '!!!';
-      this.set(messages, i, msg);
-    }
-    stopMeasure();
-  }
-
-  removeMessage(data) {
-    startMeasure("remove message");
-    const index = this.state.messages.findIndex(m => m.id === data.id);
-    this.state.messages.splice(index, 1);
-    stopMeasure();
-  }
-}
-
-//------------------------------------------------------------------------------
-// Application initialization
-//------------------------------------------------------------------------------
-async function start() {
-  const templates = await owl.utils.loadTemplates("templates.xml");
-  const env = {
-    qweb: new owl.QWeb(templates)
-  };
-  const app = new App(env);
-  app.mount(document.body);
-}
-
-start();

extras/benchmarks/owl-0.9.0/index.html

@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <title>OWL 0.9.0 Benchmark</title>
-  <link href="../shared/main.css" rel="stylesheet"/>
-  <script src='owl.js'></script>
-</head>
-<body>
-  <div id='main'></div>
-  <script src='app.js' type="module"></script>
-</body>
-</html>

extras/benchmarks/owl-0.9.0/templates.xml

@@ -1,32 +0,0 @@
-<templates>
-  <div t-name="root" class="main">
-      <div class="left-thing">
-          <div>Number of msg: <t t-esc="state.messages.length"/></div>
-          <button t-on-click="addMessages(100)">Add 100 messages</button>
-          <button t-on-click="addMessages(1000)">Add 1000 messages</button>
-          <button t-on-click="addMessages(10000)">Add 10000 messages</button>
-          <button t-on-click="addMessages(50000)">Add 50000 messages</button>
-          <button t-on-click="updateSomeMessages">Update every 10th message</button>
-          <button t-on-click="clear">Clear</button>
-      </div>
-      <div class="right-thing">
-          <div class="content">
-              <t t-foreach="state.messages" t-as="message">
-                  <t t-widget="Message" t-key="message.id" t-props="message" t-on-remove_message="removeMessage"/>
-              </t>
-          </div>
-      </div>
-  </div>
-
-  <div t-name="message" class="message">
-    <span class="author"><t t-esc="props.author"/></span>
-    <span class="msg"><t t-esc="props.msg"/></span>
-    <button class="remove" t-on-click="removeMessage">Remove</button>
-    <t t-widget="Counter"/>
-  </div>
-
-  <div t-name="counter">
-    <button t-on-click="increment">Value: <t t-esc="state.counter"/></button>
-  </div>
-
-</templates>

extras/benchmarks/owl-master/app.js

@@ -1,81 +0,0 @@
-import { buildData, startMeasure, stopMeasure } from "../shared/utils.js";
-
-//------------------------------------------------------------------------------
-// Likes Counter Widget
-//------------------------------------------------------------------------------
-class Counter extends owl.Component {
-  state = { counter: 0 };
-
-  increment() {
-    this.state.counter++;
-  }
-}
-
-//------------------------------------------------------------------------------
-// Message Widget
-//------------------------------------------------------------------------------
-class Message extends owl.Component {
-  widgets = { Counter };
-
-  shouldUpdate(nextProps) {
-    return nextProps !== this.props;
-  }
-  removeMessage() {
-    this.trigger("remove_message", {
-      id: this.props.id
-    });
-  }
-}
-
-//------------------------------------------------------------------------------
-// Root Widget
-//------------------------------------------------------------------------------
-class App extends owl.Component {
-  widgets = { Message };
-  state = { messages: [] };
-
-  addMessages(n) {
-    startMeasure("add " + n);
-    const newMessages = buildData(n);
-    this.state.messages.push.apply(this.state.messages, newMessages);
-    stopMeasure();
-  }
-
-  clear() {
-    startMeasure("clear");
-    this.state.messages = [];
-    stopMeasure();
-  }
-
-  updateSomeMessages() {
-    startMeasure("update every 10th");
-    const messages = this.state.messages;
-    for (let i = 0; i < this.state.messages.length; i += 10) {
-      const msg = Object.assign({}, messages[i]);
-      msg.author += '!!!';
-      this.set(messages, i, msg);
-    }
-    stopMeasure();
-  }
-
-  removeMessage(data) {
-    startMeasure("remove message");
-    const index = this.state.messages.findIndex(m => m.id === data.id);
-    this.state.messages.splice(index, 1);
-    stopMeasure();
-  }
-}
-
-//------------------------------------------------------------------------------
-// Application initialization
-//------------------------------------------------------------------------------
-async function start() {
-  const templates = await owl.utils.loadTemplates("templates.xml");
-  const env = {
-    qweb: new owl.QWeb(templates)
-  };
-  const app = new App(env);
-  app.mount(document.body);
-}
-
-start();

extras/benchmarks/owl-master/index.html

@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <title>OWL Master Benchmark</title>
-  <link href="../shared/main.css" rel="stylesheet"/>
-  <script src='../../owl.js'></script>
-</head>
-<body>
-  <div id='main'></div>
-  <script src='app.js' type="module"></script>
-</body>
-</html>

extras/benchmarks/owl-master/templates.xml

@@ -1,32 +0,0 @@
-<templates>
-  <div t-name="App" class="main">
-      <div class="left-thing">
-          <div>Number of msg: <t t-esc="state.messages.length"/></div>
-          <button t-on-click="addMessages(100)">Add 100 messages</button>
-          <button t-on-click="addMessages(1000)">Add 1000 messages</button>
-          <button t-on-click="addMessages(10000)">Add 10000 messages</button>
-          <button t-on-click="addMessages(50000)">Add 50000 messages</button>
-          <button t-on-click="updateSomeMessages">Update every 10th message</button>
-          <button t-on-click="clear">Clear</button>
-      </div>
-      <div class="right-thing">
-          <div class="content">
-              <t t-foreach="state.messages" t-as="message">
-                  <t t-widget="Message" t-key="message.id" t-props="message" t-on-remove_message="removeMessage"/>
-              </t>
-          </div>
-      </div>
-  </div>
-
-  <div t-name="Message" class="message">
-    <span class="author"><t t-esc="props.author"/></span>
-    <span class="msg"><t t-esc="props.msg"/></span>
-    <button class="remove" t-on-click="removeMessage">Remove</button>
-    <t t-widget="Counter"/>
-  </div>
-
-  <div t-name="Counter">
-    <button t-on-click="increment">Value: <t t-esc="state.counter"/></button>
-  </div>
-
-</templates>

extras/benchmarks/react/app.js

@@ -1,221 +0,0 @@
-import { buildData, startMeasure, stopMeasure } from "../shared/utils.js";
-
-//------------------------------------------------------------------------------
-// Counter Widget
-//------------------------------------------------------------------------------
-class Counter extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      counter: 0
-    };
-    this.increment = this.increment.bind(this);
-  }
-
-  render() {
-    return React.createElement(
-      "div",
-      null,
-      React.createElement(
-        "button",
-        {
-          onClick: this.increment
-        },
-        "Value: ",
-        this.state.counter
-      )
-    );
-  }
-
-  increment() {
-    this.setState({
-      counter: this.state.counter + 1
-    });
-  }
-}
-//------------------------------------------------------------------------------
-// Message Widget
-//------------------------------------------------------------------------------
-class Message extends React.Component {
-  constructor(props) {
-    super(props);
-    this.removeMessage = this.removeMessage.bind(this);
-  }
-
-  render() {
-    return React.createElement(
-      "div",
-      {
-        className: "message"
-      },
-      React.createElement(
-        "span",
-        {
-          className: "author"
-        },
-        this.props.message.author
-      ),
-      React.createElement(
-        "span",
-        {
-          className: "msg"
-        },
-        this.props.message.msg
-      ),
-      React.createElement(
-        "button",
-        {
-          className: "remove",
-          onClick: this.removeMessage
-        },
-        "Remove"
-      ),
-      React.createElement(Counter, null)
-    );
-  }
-
-  removeMessage() {
-    this.props.removeCB(this.props.message.id);
-  }
-}
-
-//------------------------------------------------------------------------------
-// Root Widget
-//------------------------------------------------------------------------------
-class Main extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      messages: []
-    };
-    this.removeMessage = this.removeMessage.bind(this);
-  }
-
-  render() {
-    const msgList = this.state.messages.map(m =>
-      React.createElement(Message, {
-        key: m.id,
-        message: m,
-        removeCB: this.removeMessage
-      })
-    );
-    return React.createElement(
-      "div",
-      {
-        className: "main"
-      },
-      React.createElement(
-        "div",
-        {
-          className: "left-thing"
-        },
-        React.createElement(
-          "div",
-          null,
-          "Number of msg: ",
-          this.state.messages.length
-        ),
-        React.createElement(
-          "button",
-          {
-            onClick: _ => this.addMessages(100)
-          },
-          "Add 100 messages"
-        ),
-        React.createElement(
-          "button",
-          {
-            onClick: _ => this.addMessages(1000)
-          },
-          "Add 1000 messages"
-        ),
-        React.createElement(
-          "button",
-          {
-            onClick: _ => this.addMessages(10000)
-          },
-          "Add 10000 messages"
-        ),
-        React.createElement(
-          "button",
-          {
-            onClick: _ => this.addMessages(50000)
-          },
-          "Add 50000 messages"
-        ),
-        React.createElement(
-          "button",
-          {
-            onClick: _ => this.updateSomeMessages()
-          },
-          "Update every 10th messags"
-        ),
-        React.createElement(
-          "button",
-          {
-            onClick: _ => this.clear()
-          },
-          "Clear"
-        )
-      ),
-      React.createElement(
-        "div",
-        {
-          className: "right-thing"
-        },
-        React.createElement(
-          "div",
-          {
-            className: "content"
-          },
-          msgList
-        )
-      )
-    );
-  }
-
-  addMessages(n) {
-    startMeasure("add " + n);
-    const newMessages = this.state.messages.concat(buildData(n));
-    this.setState({
-      messages: newMessages
-    });
-    stopMeasure();
-  }
-
-  clear() {
-    startMeasure("clear");
-    this.setState({
-      messages: []
-    });
-    stopMeasure();
-  }
-
-  updateSomeMessages() {
-    startMeasure("update every 10th");
-    const messages = this.state.messages;
-    for (let i = 0; i < messages.length; i += 10) {
-      messages[i].author += "!!!";
-    }
-    this.forceUpdate();
-    stopMeasure();
-  }
-
-  removeMessage(id) {
-    startMeasure("remove message");
-    const index = this.state.messages.findIndex(m => m.id === id);
-    const messages = this.state.messages.slice();
-    messages.splice(index, 1);
-    this.setState({
-      messages
-    });
-    stopMeasure();
-  }
-} //-----------------------------
-// INIT
-//-----------------------------
-
-ReactDOM.render(
-  React.createElement(Main, null),
-  document.getElementById("main")
-);

extras/benchmarks/react/index.html

@@ -1,14 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <title>React Benchmark</title>
-  <link href="../shared/main.css" rel="stylesheet"/>
-  <script src='react.production.min.js'></script>
-  <script src='react-dom.production.min.js'></script>
-</head>
-<body>
-  <div id='main'></div>
-  <script src='app.js' type="module"></script>
-</body>
-</html>

extras/benchmarks/react/react-dom.production.min.js

@@ -1,220 +0,0 @@
-/** @license React v16.8.6
- * react-dom.production.min.js
- *
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-/*
- Modernizr 3.0.0pre (Custom Build) | MIT
-*/
-'use strict';(function(da,pb){"object"===typeof exports&&"undefined"!==typeof module?module.exports=pb(require("react")):"function"===typeof define&&define.amd?define(["react"],pb):da.ReactDOM=pb(da.React)})(this,function(da){function pb(a,b,c,d,e,f,g,h){if(!a){a=void 0;if(void 0===b)a=Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var l=[c,d,e,f,g,h],k=0;a=Error(b.replace(/%s/g,function(){return l[k++]}));
-a.name="Invariant Violation"}a.framesToPop=1;throw a;}}function n(a){for(var b=arguments.length-1,c="https://reactjs.org/docs/error-decoder.html?invariant="+a,d=0;d<b;d++)c+="&args[]="+encodeURIComponent(arguments[d+1]);pb(!1,"Minified React error #"+a+"; visit %s for the full message or use the non-minified dev environment for full errors and additional helpful warnings. ",c)}function rh(a,b,c,d,e,f,g,h,l){qb=!1;$b=null;sh.apply(th,arguments)}function uh(a,b,c,d,e,f,g,h,l){rh.apply(this,arguments);
-if(qb){if(qb){var k=$b;qb=!1;$b=null}else n("198"),k=void 0;ac||(ac=!0,Yc=k)}}function Ee(){if(bc)for(var a in Na){var b=Na[a],c=bc.indexOf(a);-1<c?void 0:n("96",a);if(!cc[c]){b.extractEvents?void 0:n("97",a);cc[c]=b;c=b.eventTypes;for(var d in c){var e=void 0;var f=c[d],g=b,h=d;Zc.hasOwnProperty(h)?n("99",h):void 0;Zc[h]=f;var l=f.phasedRegistrationNames;if(l){for(e in l)l.hasOwnProperty(e)&&Fe(l[e],g,h);e=!0}else f.registrationName?(Fe(f.registrationName,g,h),e=!0):e=!1;e?void 0:n("98",d,a)}}}}
-function Fe(a,b,c){Oa[a]?n("100",a):void 0;Oa[a]=b;$c[a]=b.eventTypes[c].dependencies}function Ge(a,b,c){var d=a.type||"unknown-event";a.currentTarget=He(c);uh(d,b,void 0,a);a.currentTarget=null}function Pa(a,b){null==b?n("30"):void 0;if(null==a)return b;if(Array.isArray(a)){if(Array.isArray(b))return a.push.apply(a,b),a;a.push(b);return a}return Array.isArray(b)?[a].concat(b):[a,b]}function ad(a,b,c){Array.isArray(a)?a.forEach(b,c):a&&b.call(c,a)}function Ie(a,b){var c=a.stateNode;if(!c)return null;
-var d=bd(c);if(!d)return null;c=d[b];a:switch(b){case "onClick":case "onClickCapture":case "onDoubleClick":case "onDoubleClickCapture":case "onMouseDown":case "onMouseDownCapture":case "onMouseMove":case "onMouseMoveCapture":case "onMouseUp":case "onMouseUpCapture":(d=!d.disabled)||(a=a.type,d=!("button"===a||"input"===a||"select"===a||"textarea"===a));a=!d;break a;default:a=!1}if(a)return null;c&&"function"!==typeof c?n("231",b,typeof c):void 0;return c}function cd(a){null!==a&&(rb=Pa(rb,a));a=rb;
-rb=null;if(a&&(ad(a,vh),rb?n("95"):void 0,ac))throw a=Yc,ac=!1,Yc=null,a;}function dc(a){if(a[ea])return a[ea];for(;!a[ea];)if(a.parentNode)a=a.parentNode;else return null;a=a[ea];return 5===a.tag||6===a.tag?a:null}function Je(a){a=a[ea];return!a||5!==a.tag&&6!==a.tag?null:a}function Da(a){if(5===a.tag||6===a.tag)return a.stateNode;n("33")}function dd(a){return a[ec]||null}function fa(a){do a=a.return;while(a&&5!==a.tag);return a?a:null}function Ke(a,b,c){if(b=Ie(a,c.dispatchConfig.phasedRegistrationNames[b]))c._dispatchListeners=
-Pa(c._dispatchListeners,b),c._dispatchInstances=Pa(c._dispatchInstances,a)}function wh(a){if(a&&a.dispatchConfig.phasedRegistrationNames){for(var b=a._targetInst,c=[];b;)c.push(b),b=fa(b);for(b=c.length;0<b--;)Ke(c[b],"captured",a);for(b=0;b<c.length;b++)Ke(c[b],"bubbled",a)}}function ed(a,b,c){a&&c&&c.dispatchConfig.registrationName&&(b=Ie(a,c.dispatchConfig.registrationName))&&(c._dispatchListeners=Pa(c._dispatchListeners,b),c._dispatchInstances=Pa(c._dispatchInstances,a))}function xh(a){a&&a.dispatchConfig.registrationName&&
-ed(a._targetInst,null,a)}function Qa(a){ad(a,wh)}function fc(a,b){var c={};c[a.toLowerCase()]=b.toLowerCase();c["Webkit"+a]="webkit"+b;c["Moz"+a]="moz"+b;return c}function gc(a){if(fd[a])return fd[a];if(!Ra[a])return a;var b=Ra[a],c;for(c in b)if(b.hasOwnProperty(c)&&c in Le)return fd[a]=b[c];return a}function Me(){if(hc)return hc;var a,b=gd,c=b.length,d,e="value"in qa?qa.value:qa.textContent,f=e.length;for(a=0;a<c&&b[a]===e[a];a++);var g=c-a;for(d=1;d<=g&&b[c-d]===e[f-d];d++);return hc=e.slice(a,
-1<d?1-d:void 0)}function ic(){return!0}function jc(){return!1}function J(a,b,c,d){this.dispatchConfig=a;this._targetInst=b;this.nativeEvent=c;a=this.constructor.Interface;for(var e in a)a.hasOwnProperty(e)&&((b=a[e])?this[e]=b(c):"target"===e?this.target=d:this[e]=c[e]);this.isDefaultPrevented=(null!=c.defaultPrevented?c.defaultPrevented:!1===c.returnValue)?ic:jc;this.isPropagationStopped=jc;return this}function yh(a,b,c,d){if(this.eventPool.length){var e=this.eventPool.pop();this.call(e,a,b,c,d);
-return e}return new this(a,b,c,d)}function zh(a){a instanceof this?void 0:n("279");a.destructor();10>this.eventPool.length&&this.eventPool.push(a)}function Ne(a){a.eventPool=[];a.getPooled=yh;a.release=zh}function Oe(a,b){switch(a){case "keyup":return-1!==Ah.indexOf(b.keyCode);case "keydown":return 229!==b.keyCode;case "keypress":case "mousedown":case "blur":return!0;default:return!1}}function Pe(a){a=a.detail;return"object"===typeof a&&"data"in a?a.data:null}function Bh(a,b){switch(a){case "compositionend":return Pe(b);
-case "keypress":if(32!==b.which)return null;Qe=!0;return Re;case "textInput":return a=b.data,a===Re&&Qe?null:a;default:return null}}function Ch(a,b){if(Sa)return"compositionend"===a||!hd&&Oe(a,b)?(a=Me(),hc=gd=qa=null,Sa=!1,a):null;switch(a){case "paste":return null;case "keypress":if(!(b.ctrlKey||b.altKey||b.metaKey)||b.ctrlKey&&b.altKey){if(b.char&&1<b.char.length)return b.char;if(b.which)return String.fromCharCode(b.which)}return null;case "compositionend":return Se&&"ko"!==b.locale?null:b.data;
-default:return null}}function Te(a){if(a=Ue(a)){"function"!==typeof id?n("280"):void 0;var b=bd(a.stateNode);id(a.stateNode,a.type,b)}}function Ve(a){Ta?Ua?Ua.push(a):Ua=[a]:Ta=a}function We(){if(Ta){var a=Ta,b=Ua;Ua=Ta=null;Te(a);if(b)for(a=0;a<b.length;a++)Te(b[a])}}function Xe(a,b){if(jd)return a(b);jd=!0;try{return Ye(a,b)}finally{if(jd=!1,null!==Ta||null!==Ua)Ze(),We()}}function $e(a){var b=a&&a.nodeName&&a.nodeName.toLowerCase();return"input"===b?!!Dh[a.type]:"textarea"===b?!0:!1}function kd(a){a=
-a.target||a.srcElement||window;a.correspondingUseElement&&(a=a.correspondingUseElement);return 3===a.nodeType?a.parentNode:a}function af(a){if(!ra)return!1;a="on"+a;var b=a in document;b||(b=document.createElement("div"),b.setAttribute(a,"return;"),b="function"===typeof b[a]);return b}function bf(a){var b=a.type;return(a=a.nodeName)&&"input"===a.toLowerCase()&&("checkbox"===b||"radio"===b)}function Eh(a){var b=bf(a)?"checked":"value",c=Object.getOwnPropertyDescriptor(a.constructor.prototype,b),d=
-""+a[b];if(!a.hasOwnProperty(b)&&"undefined"!==typeof c&&"function"===typeof c.get&&"function"===typeof c.set){var e=c.get,f=c.set;Object.defineProperty(a,b,{configurable:!0,get:function(){return e.call(this)},set:function(a){d=""+a;f.call(this,a)}});Object.defineProperty(a,b,{enumerable:c.enumerable});return{getValue:function(){return d},setValue:function(a){d=""+a},stopTracking:function(){a._valueTracker=null;delete a[b]}}}}function kc(a){a._valueTracker||(a._valueTracker=Eh(a))}function cf(a){if(!a)return!1;
-var b=a._valueTracker;if(!b)return!0;var c=b.getValue();var d="";a&&(d=bf(a)?a.checked?"true":"false":a.value);a=d;return a!==c?(b.setValue(a),!0):!1}function sb(a){if(null===a||"object"!==typeof a)return null;a=df&&a[df]||a["@@iterator"];return"function"===typeof a?a:null}function sa(a){if(null==a)return null;if("function"===typeof a)return a.displayName||a.name||null;if("string"===typeof a)return a;switch(a){case ld:return"ConcurrentMode";case ta:return"Fragment";case Va:return"Portal";case lc:return"Profiler";
-case md:return"StrictMode";case nd:return"Suspense"}if("object"===typeof a)switch(a.$$typeof){case ef:return"Context.Consumer";case ff:return"Context.Provider";case od:var b=a.render;b=b.displayName||b.name||"";return a.displayName||(""!==b?"ForwardRef("+b+")":"ForwardRef");case pd:return sa(a.type);case gf:if(a=1===a._status?a._result:null)return sa(a)}return null}function qd(a){var b="";do{a:switch(a.tag){case 3:case 4:case 6:case 7:case 10:case 9:var c="";break a;default:var d=a._debugOwner,e=
-a._debugSource,f=sa(a.type);c=null;d&&(c=sa(d.type));d=f;f="";e?f=" (at "+e.fileName.replace(Fh,"")+":"+e.lineNumber+")":c&&(f=" (created by "+c+")");c="\n    in "+(d||"Unknown")+f}b+=c;a=a.return}while(a);return b}function Gh(a){if(hf.call(jf,a))return!0;if(hf.call(kf,a))return!1;if(Hh.test(a))return jf[a]=!0;kf[a]=!0;return!1}function Ih(a,b,c,d){if(null!==c&&0===c.type)return!1;switch(typeof b){case "function":case "symbol":return!0;case "boolean":if(d)return!1;if(null!==c)return!c.acceptsBooleans;
-a=a.toLowerCase().slice(0,5);return"data-"!==a&&"aria-"!==a;default:return!1}}function Jh(a,b,c,d){if(null===b||"undefined"===typeof b||Ih(a,b,c,d))return!0;if(d)return!1;if(null!==c)switch(c.type){case 3:return!b;case 4:return!1===b;case 5:return isNaN(b);case 6:return isNaN(b)||1>b}return!1}function K(a,b,c,d,e){this.acceptsBooleans=2===b||3===b||4===b;this.attributeName=d;this.attributeNamespace=e;this.mustUseProperty=c;this.propertyName=a;this.type=b}function rd(a,b,c,d){var e=A.hasOwnProperty(b)?
-A[b]:null;var f=null!==e?0===e.type:d?!1:!(2<b.length)||"o"!==b[0]&&"O"!==b[0]||"n"!==b[1]&&"N"!==b[1]?!1:!0;f||(Jh(b,c,e,d)&&(c=null),d||null===e?Gh(b)&&(null===c?a.removeAttribute(b):a.setAttribute(b,""+c)):e.mustUseProperty?a[e.propertyName]=null===c?3===e.type?!1:"":c:(b=e.attributeName,d=e.attributeNamespace,null===c?a.removeAttribute(b):(e=e.type,c=3===e||4===e&&!0===c?"":""+c,d?a.setAttributeNS(d,b,c):a.setAttribute(b,c))))}function ua(a){switch(typeof a){case "boolean":case "number":case "object":case "string":case "undefined":return a;
-default:return""}}function sd(a,b){var c=b.checked;return B({},b,{defaultChecked:void 0,defaultValue:void 0,value:void 0,checked:null!=c?c:a._wrapperState.initialChecked})}function lf(a,b){var c=null==b.defaultValue?"":b.defaultValue,d=null!=b.checked?b.checked:b.defaultChecked;c=ua(null!=b.value?b.value:c);a._wrapperState={initialChecked:d,initialValue:c,controlled:"checkbox"===b.type||"radio"===b.type?null!=b.checked:null!=b.value}}function mf(a,b){b=b.checked;null!=b&&rd(a,"checked",b,!1)}function td(a,
-b){mf(a,b);var c=ua(b.value),d=b.type;if(null!=c)if("number"===d){if(0===c&&""===a.value||a.value!=c)a.value=""+c}else a.value!==""+c&&(a.value=""+c);else if("submit"===d||"reset"===d){a.removeAttribute("value");return}b.hasOwnProperty("value")?ud(a,b.type,c):b.hasOwnProperty("defaultValue")&&ud(a,b.type,ua(b.defaultValue));null==b.checked&&null!=b.defaultChecked&&(a.defaultChecked=!!b.defaultChecked)}function nf(a,b,c){if(b.hasOwnProperty("value")||b.hasOwnProperty("defaultValue")){var d=b.type;
-if(!("submit"!==d&&"reset"!==d||void 0!==b.value&&null!==b.value))return;b=""+a._wrapperState.initialValue;c||b===a.value||(a.value=b);a.defaultValue=b}c=a.name;""!==c&&(a.name="");a.defaultChecked=!a.defaultChecked;a.defaultChecked=!!a._wrapperState.initialChecked;""!==c&&(a.name=c)}function ud(a,b,c){if("number"!==b||a.ownerDocument.activeElement!==a)null==c?a.defaultValue=""+a._wrapperState.initialValue:a.defaultValue!==""+c&&(a.defaultValue=""+c)}function of(a,b,c){a=J.getPooled(pf.change,a,b,
-c);a.type="change";Ve(c);Qa(a);return a}function Kh(a){cd(a)}function mc(a){var b=Da(a);if(cf(b))return a}function Lh(a,b){if("change"===a)return b}function qf(){tb&&(tb.detachEvent("onpropertychange",rf),ub=tb=null)}function rf(a){"value"===a.propertyName&&mc(ub)&&(a=of(ub,a,kd(a)),Xe(Kh,a))}function Mh(a,b,c){"focus"===a?(qf(),tb=b,ub=c,tb.attachEvent("onpropertychange",rf)):"blur"===a&&qf()}function Nh(a,b){if("selectionchange"===a||"keyup"===a||"keydown"===a)return mc(ub)}function Oh(a,b){if("click"===
-a)return mc(b)}function Ph(a,b){if("input"===a||"change"===a)return mc(b)}function Qh(a){var b=this.nativeEvent;return b.getModifierState?b.getModifierState(a):(a=Rh[a])?!!b[a]:!1}function vd(a){return Qh}function Ea(a,b){return a===b&&(0!==a||1/a===1/b)||a!==a&&b!==b}function vb(a,b){if(Ea(a,b))return!0;if("object"!==typeof a||null===a||"object"!==typeof b||null===b)return!1;var c=Object.keys(a),d=Object.keys(b);if(c.length!==d.length)return!1;for(d=0;d<c.length;d++)if(!Sh.call(b,c[d])||!Ea(a[c[d]],
-b[c[d]]))return!1;return!0}function wb(a){var b=a;if(a.alternate)for(;b.return;)b=b.return;else{if(0!==(b.effectTag&2))return 1;for(;b.return;)if(b=b.return,0!==(b.effectTag&2))return 1}return 3===b.tag?2:3}function sf(a){2!==wb(a)?n("188"):void 0}function Th(a){var b=a.alternate;if(!b)return b=wb(a),3===b?n("188"):void 0,1===b?null:a;for(var c=a,d=b;;){var e=c.return,f=e?e.alternate:null;if(!e||!f)break;if(e.child===f.child){for(var g=e.child;g;){if(g===c)return sf(e),a;if(g===d)return sf(e),b;g=
-g.sibling}n("188")}if(c.return!==d.return)c=e,d=f;else{g=!1;for(var h=e.child;h;){if(h===c){g=!0;c=e;d=f;break}if(h===d){g=!0;d=e;c=f;break}h=h.sibling}if(!g){for(h=f.child;h;){if(h===c){g=!0;c=f;d=e;break}if(h===d){g=!0;d=f;c=e;break}h=h.sibling}g?void 0:n("189")}}c.alternate!==d?n("190"):void 0}3!==c.tag?n("188"):void 0;return c.stateNode.current===c?a:b}function tf(a){a=Th(a);if(!a)return null;for(var b=a;;){if(5===b.tag||6===b.tag)return b;if(b.child)b.child.return=b,b=b.child;else{if(b===a)break;
-for(;!b.sibling;){if(!b.return||b.return===a)return null;b=b.return}b.sibling.return=b.return;b=b.sibling}}return null}function nc(a){var b=a.keyCode;"charCode"in a?(a=a.charCode,0===a&&13===b&&(a=13)):a=b;10===a&&(a=13);return 32<=a||13===a?a:0}function uf(a,b){var c=a[0];a=a[1];var d="on"+(a[0].toUpperCase()+a.slice(1));b={phasedRegistrationNames:{bubbled:d,captured:d+"Capture"},dependencies:[c],isInteractive:b};vf[a]=b;wd[c]=b}function Uh(a){var b=a.targetInst,c=b;do{if(!c){a.ancestors.push(c);
-break}var d;for(d=c;d.return;)d=d.return;d=3!==d.tag?null:d.stateNode.containerInfo;if(!d)break;a.ancestors.push(c);c=dc(d)}while(c);for(c=0;c<a.ancestors.length;c++){b=a.ancestors[c];var e=kd(a.nativeEvent);d=a.topLevelType;for(var f=a.nativeEvent,g=null,h=0;h<cc.length;h++){var l=cc[h];l&&(l=l.extractEvents(d,b,f,e))&&(g=Pa(g,l))}cd(g)}}function r(a,b){if(!b)return null;var c=(wf(a)?xf:oc).bind(null,a);b.addEventListener(a,c,!1)}function pc(a,b){if(!b)return null;var c=(wf(a)?xf:oc).bind(null,a);
-b.addEventListener(a,c,!0)}function xf(a,b){yf(oc,a,b)}function oc(a,b){if(qc){var c=kd(b);c=dc(c);null===c||"number"!==typeof c.tag||2===wb(c)||(c=null);if(rc.length){var d=rc.pop();d.topLevelType=a;d.nativeEvent=b;d.targetInst=c;a=d}else a={topLevelType:a,nativeEvent:b,targetInst:c,ancestors:[]};try{Xe(Uh,a)}finally{a.topLevelType=null,a.nativeEvent=null,a.targetInst=null,a.ancestors.length=0,10>rc.length&&rc.push(a)}}}function zf(a){Object.prototype.hasOwnProperty.call(a,sc)||(a[sc]=Vh++,Af[a[sc]]=
-{});return Af[a[sc]]}function xd(a){a=a||("undefined"!==typeof document?document:void 0);if("undefined"===typeof a)return null;try{return a.activeElement||a.body}catch(b){return a.body}}function Bf(a){for(;a&&a.firstChild;)a=a.firstChild;return a}function Cf(a,b){var c=Bf(a);a=0;for(var d;c;){if(3===c.nodeType){d=a+c.textContent.length;if(a<=b&&d>=b)return{node:c,offset:b-a};a=d}a:{for(;c;){if(c.nextSibling){c=c.nextSibling;break a}c=c.parentNode}c=void 0}c=Bf(c)}}function Df(a,b){return a&&b?a===
-b?!0:a&&3===a.nodeType?!1:b&&3===b.nodeType?Df(a,b.parentNode):"contains"in a?a.contains(b):a.compareDocumentPosition?!!(a.compareDocumentPosition(b)&16):!1:!1}function Ef(){for(var a=window,b=xd();b instanceof a.HTMLIFrameElement;){try{var c="string"===typeof b.contentWindow.location.href}catch(d){c=!1}if(c)a=b.contentWindow;else break;b=xd(a.document)}return b}function yd(a){var b=a&&a.nodeName&&a.nodeName.toLowerCase();return b&&("input"===b&&("text"===a.type||"search"===a.type||"tel"===a.type||
-"url"===a.type||"password"===a.type)||"textarea"===b||"true"===a.contentEditable)}function Wh(){var a=Ef();if(yd(a)){if("selectionStart"in a)var b={start:a.selectionStart,end:a.selectionEnd};else a:{b=(b=a.ownerDocument)&&b.defaultView||window;var c=b.getSelection&&b.getSelection();if(c&&0!==c.rangeCount){b=c.anchorNode;var d=c.anchorOffset,e=c.focusNode;c=c.focusOffset;try{b.nodeType,e.nodeType}catch(cj){b=null;break a}var f=0,g=-1,h=-1,l=0,k=0,m=a,n=null;b:for(;;){for(var p;;){m!==b||0!==d&&3!==
-m.nodeType||(g=f+d);m!==e||0!==c&&3!==m.nodeType||(h=f+c);3===m.nodeType&&(f+=m.nodeValue.length);if(null===(p=m.firstChild))break;n=m;m=p}for(;;){if(m===a)break b;n===b&&++l===d&&(g=f);n===e&&++k===c&&(h=f);if(null!==(p=m.nextSibling))break;m=n;n=m.parentNode}m=p}b=-1===g||-1===h?null:{start:g,end:h}}else b=null}b=b||{start:0,end:0}}else b=null;return{focusedElem:a,selectionRange:b}}function Xh(a){var b=Ef(),c=a.focusedElem,d=a.selectionRange;if(b!==c&&c&&c.ownerDocument&&Df(c.ownerDocument.documentElement,
-c)){if(null!==d&&yd(c))if(b=d.start,a=d.end,void 0===a&&(a=b),"selectionStart"in c)c.selectionStart=b,c.selectionEnd=Math.min(a,c.value.length);else if(a=(b=c.ownerDocument||document)&&b.defaultView||window,a.getSelection){a=a.getSelection();var e=c.textContent.length,f=Math.min(d.start,e);d=void 0===d.end?f:Math.min(d.end,e);!a.extend&&f>d&&(e=d,d=f,f=e);e=Cf(c,f);var g=Cf(c,d);e&&g&&(1!==a.rangeCount||a.anchorNode!==e.node||a.anchorOffset!==e.offset||a.focusNode!==g.node||a.focusOffset!==g.offset)&&
-(b=b.createRange(),b.setStart(e.node,e.offset),a.removeAllRanges(),f>d?(a.addRange(b),a.extend(g.node,g.offset)):(b.setEnd(g.node,g.offset),a.addRange(b)))}b=[];for(a=c;a=a.parentNode;)1===a.nodeType&&b.push({element:a,left:a.scrollLeft,top:a.scrollTop});"function"===typeof c.focus&&c.focus();for(c=0;c<b.length;c++)a=b[c],a.element.scrollLeft=a.left,a.element.scrollTop=a.top}}function Gf(a,b){var c=b.window===b?b.document:9===b.nodeType?b:b.ownerDocument;if(zd||null==Wa||Wa!==xd(c))return null;c=
-Wa;"selectionStart"in c&&yd(c)?c={start:c.selectionStart,end:c.selectionEnd}:(c=(c.ownerDocument&&c.ownerDocument.defaultView||window).getSelection(),c={anchorNode:c.anchorNode,anchorOffset:c.anchorOffset,focusNode:c.focusNode,focusOffset:c.focusOffset});return xb&&vb(xb,c)?null:(xb=c,a=J.getPooled(Hf.select,Ad,a,b),a.type="select",a.target=Wa,Qa(a),a)}function Yh(a){var b="";da.Children.forEach(a,function(a){null!=a&&(b+=a)});return b}function Bd(a,b){a=B({children:void 0},b);if(b=Yh(b.children))a.children=
-b;return a}function Xa(a,b,c,d){a=a.options;if(b){b={};for(var e=0;e<c.length;e++)b["$"+c[e]]=!0;for(c=0;c<a.length;c++)e=b.hasOwnProperty("$"+a[c].value),a[c].selected!==e&&(a[c].selected=e),e&&d&&(a[c].defaultSelected=!0)}else{c=""+ua(c);b=null;for(e=0;e<a.length;e++){if(a[e].value===c){a[e].selected=!0;d&&(a[e].defaultSelected=!0);return}null!==b||a[e].disabled||(b=a[e])}null!==b&&(b.selected=!0)}}function Cd(a,b){null!=b.dangerouslySetInnerHTML?n("91"):void 0;return B({},b,{value:void 0,defaultValue:void 0,
-children:""+a._wrapperState.initialValue})}function If(a,b){var c=b.value;null==c&&(c=b.defaultValue,b=b.children,null!=b&&(null!=c?n("92"):void 0,Array.isArray(b)&&(1>=b.length?void 0:n("93"),b=b[0]),c=b),null==c&&(c=""));a._wrapperState={initialValue:ua(c)}}function Jf(a,b){var c=ua(b.value),d=ua(b.defaultValue);null!=c&&(c=""+c,c!==a.value&&(a.value=c),null==b.defaultValue&&a.defaultValue!==c&&(a.defaultValue=c));null!=d&&(a.defaultValue=""+d)}function Kf(a){switch(a){case "svg":return"http://www.w3.org/2000/svg";
-case "math":return"http://www.w3.org/1998/Math/MathML";default:return"http://www.w3.org/1999/xhtml"}}function Dd(a,b){return null==a||"http://www.w3.org/1999/xhtml"===a?Kf(b):"http://www.w3.org/2000/svg"===a&&"foreignObject"===b?"http://www.w3.org/1999/xhtml":a}function Lf(a,b,c){return null==b||"boolean"===typeof b||""===b?"":c||"number"!==typeof b||0===b||yb.hasOwnProperty(a)&&yb[a]?(""+b).trim():b+"px"}function Mf(a,b){a=a.style;for(var c in b)if(b.hasOwnProperty(c)){var d=0===c.indexOf("--"),
-e=Lf(c,b[c],d);"float"===c&&(c="cssFloat");d?a.setProperty(c,e):a[c]=e}}function Ed(a,b){b&&(Zh[a]&&(null!=b.children||null!=b.dangerouslySetInnerHTML?n("137",a,""):void 0),null!=b.dangerouslySetInnerHTML&&(null!=b.children?n("60"):void 0,"object"===typeof b.dangerouslySetInnerHTML&&"__html"in b.dangerouslySetInnerHTML?void 0:n("61")),null!=b.style&&"object"!==typeof b.style?n("62",""):void 0)}function Fd(a,b){if(-1===a.indexOf("-"))return"string"===typeof b.is;switch(a){case "annotation-xml":case "color-profile":case "font-face":case "font-face-src":case "font-face-uri":case "font-face-format":case "font-face-name":case "missing-glyph":return!1;
-default:return!0}}function ha(a,b){a=9===a.nodeType||11===a.nodeType?a:a.ownerDocument;var c=zf(a);b=$c[b];for(var d=0;d<b.length;d++){var e=b[d];if(!c.hasOwnProperty(e)||!c[e]){switch(e){case "scroll":pc("scroll",a);break;case "focus":case "blur":pc("focus",a);pc("blur",a);c.blur=!0;c.focus=!0;break;case "cancel":case "close":af(e)&&pc(e,a);break;case "invalid":case "submit":case "reset":break;default:-1===zb.indexOf(e)&&r(e,a)}c[e]=!0}}}function tc(){}function Nf(a,b){switch(a){case "button":case "input":case "select":case "textarea":return!!b.autoFocus}return!1}
-function Gd(a,b){return"textarea"===a||"option"===a||"noscript"===a||"string"===typeof b.children||"number"===typeof b.children||"object"===typeof b.dangerouslySetInnerHTML&&null!==b.dangerouslySetInnerHTML&&null!=b.dangerouslySetInnerHTML.__html}function $h(a,b,c,d,e,f){a[ec]=e;"input"===c&&"radio"===e.type&&null!=e.name&&mf(a,e);Fd(c,d);d=Fd(c,e);for(f=0;f<b.length;f+=2){var g=b[f],h=b[f+1];"style"===g?Mf(a,h):"dangerouslySetInnerHTML"===g?Of(a,h):"children"===g?Ab(a,h):rd(a,g,h,d)}switch(c){case "input":td(a,
-e);break;case "textarea":Jf(a,e);break;case "select":b=a._wrapperState.wasMultiple,a._wrapperState.wasMultiple=!!e.multiple,c=e.value,null!=c?Xa(a,!!e.multiple,c,!1):b!==!!e.multiple&&(null!=e.defaultValue?Xa(a,!!e.multiple,e.defaultValue,!0):Xa(a,!!e.multiple,e.multiple?[]:"",!1))}}function Hd(a){for(a=a.nextSibling;a&&1!==a.nodeType&&3!==a.nodeType;)a=a.nextSibling;return a}function Pf(a){for(a=a.firstChild;a&&1!==a.nodeType&&3!==a.nodeType;)a=a.nextSibling;return a}function D(a,b){0>Ya||(a.current=
-Id[Ya],Id[Ya]=null,Ya--)}function L(a,b,c){Ya++;Id[Ya]=a.current;a.current=b}function Za(a,b){var c=a.type.contextTypes;if(!c)return va;var d=a.stateNode;if(d&&d.__reactInternalMemoizedUnmaskedChildContext===b)return d.__reactInternalMemoizedMaskedChildContext;var e={},f;for(f in c)e[f]=b[f];d&&(a=a.stateNode,a.__reactInternalMemoizedUnmaskedChildContext=b,a.__reactInternalMemoizedMaskedChildContext=e);return e}function E(a){a=a.childContextTypes;return null!==a&&void 0!==a}function uc(a){D(M,a);
-D(F,a)}function Jd(a){D(M,a);D(F,a)}function Qf(a,b,c){F.current!==va?n("168"):void 0;L(F,b,a);L(M,c,a)}function Rf(a,b,c){var d=a.stateNode;a=b.childContextTypes;if("function"!==typeof d.getChildContext)return c;d=d.getChildContext();for(var e in d)e in a?void 0:n("108",sa(b)||"Unknown",e);return B({},c,d)}function vc(a){var b=a.stateNode;b=b&&b.__reactInternalMemoizedMergedChildContext||va;Fa=F.current;L(F,b,a);L(M,M.current,a);return!0}function Sf(a,b,c){var d=a.stateNode;d?void 0:n("169");c?(b=
-Rf(a,b,Fa),d.__reactInternalMemoizedMergedChildContext=b,D(M,a),D(F,a),L(F,b,a)):D(M,a);L(M,c,a)}function Tf(a){return function(b){try{return a(b)}catch(c){}}}function ai(a){if("undefined"===typeof __REACT_DEVTOOLS_GLOBAL_HOOK__)return!1;var b=__REACT_DEVTOOLS_GLOBAL_HOOK__;if(b.isDisabled||!b.supportsFiber)return!0;try{var c=b.inject(a);Kd=Tf(function(a){return b.onCommitFiberRoot(c,a)});Ld=Tf(function(a){return b.onCommitFiberUnmount(c,a)})}catch(d){}return!0}function bi(a,b,c,d){this.tag=a;this.key=
-c;this.sibling=this.child=this.return=this.stateNode=this.type=this.elementType=null;this.index=0;this.ref=null;this.pendingProps=b;this.contextDependencies=this.memoizedState=this.updateQueue=this.memoizedProps=null;this.mode=d;this.effectTag=0;this.lastEffect=this.firstEffect=this.nextEffect=null;this.childExpirationTime=this.expirationTime=0;this.alternate=null}function Md(a){a=a.prototype;return!(!a||!a.isReactComponent)}function ci(a){if("function"===typeof a)return Md(a)?1:0;if(void 0!==a&&
-null!==a){a=a.$$typeof;if(a===od)return 11;if(a===pd)return 14}return 2}function Ga(a,b,c){c=a.alternate;null===c?(c=S(a.tag,b,a.key,a.mode),c.elementType=a.elementType,c.type=a.type,c.stateNode=a.stateNode,c.alternate=a,a.alternate=c):(c.pendingProps=b,c.effectTag=0,c.nextEffect=null,c.firstEffect=null,c.lastEffect=null);c.childExpirationTime=a.childExpirationTime;c.expirationTime=a.expirationTime;c.child=a.child;c.memoizedProps=a.memoizedProps;c.memoizedState=a.memoizedState;c.updateQueue=a.updateQueue;
-c.contextDependencies=a.contextDependencies;c.sibling=a.sibling;c.index=a.index;c.ref=a.ref;return c}function wc(a,b,c,d,e,f){var g=2;d=a;if("function"===typeof a)Md(a)&&(g=1);else if("string"===typeof a)g=5;else a:switch(a){case ta:return wa(c.children,e,f,b);case ld:return Uf(c,e|3,f,b);case md:return Uf(c,e|2,f,b);case lc:return a=S(12,c,b,e|4),a.elementType=lc,a.type=lc,a.expirationTime=f,a;case nd:return a=S(13,c,b,e),b=nd,a.elementType=b,a.type=b,a.expirationTime=f,a;default:if("object"===typeof a&&
-null!==a)switch(a.$$typeof){case ff:g=10;break a;case ef:g=9;break a;case od:g=11;break a;case pd:g=14;break a;case gf:g=16;d=null;break a}n("130",null==a?a:typeof a,"")}b=S(g,c,b,e);b.elementType=a;b.type=d;b.expirationTime=f;return b}function wa(a,b,c,d){a=S(7,a,d,b);a.expirationTime=c;return a}function Uf(a,b,c,d){a=S(8,a,d,b);b=0===(b&1)?md:ld;a.elementType=b;a.type=b;a.expirationTime=c;return a}function Nd(a,b,c){a=S(6,a,null,b);a.expirationTime=c;return a}function Od(a,b,c){b=S(4,null!==a.children?
-a.children:[],a.key,b);b.expirationTime=c;b.stateNode={containerInfo:a.containerInfo,pendingChildren:null,implementation:a.implementation};return b}function Bb(a,b){a.didError=!1;var c=a.earliestPendingTime;0===c?a.earliestPendingTime=a.latestPendingTime=b:c<b?a.earliestPendingTime=b:a.latestPendingTime>b&&(a.latestPendingTime=b);xc(b,a)}function di(a,b){a.didError=!1;if(0===b)a.earliestPendingTime=0,a.latestPendingTime=0,a.earliestSuspendedTime=0,a.latestSuspendedTime=0,a.latestPingedTime=0;else{b<
-a.latestPingedTime&&(a.latestPingedTime=0);var c=a.latestPendingTime;0!==c&&(c>b?a.earliestPendingTime=a.latestPendingTime=0:a.earliestPendingTime>b&&(a.earliestPendingTime=a.latestPendingTime));c=a.earliestSuspendedTime;0===c?Bb(a,b):b<a.latestSuspendedTime?(a.earliestSuspendedTime=0,a.latestSuspendedTime=0,a.latestPingedTime=0,Bb(a,b)):b>c&&Bb(a,b)}xc(0,a)}function Vf(a,b){a.didError=!1;a.latestPingedTime>=b&&(a.latestPingedTime=0);var c=a.earliestPendingTime,d=a.latestPendingTime;c===b?a.earliestPendingTime=
-d===b?a.latestPendingTime=0:d:d===b&&(a.latestPendingTime=c);c=a.earliestSuspendedTime;d=a.latestSuspendedTime;0===c?a.earliestSuspendedTime=a.latestSuspendedTime=b:c<b?a.earliestSuspendedTime=b:d>b&&(a.latestSuspendedTime=b);xc(b,a)}function Wf(a,b){var c=a.earliestPendingTime;a=a.earliestSuspendedTime;c>b&&(b=c);a>b&&(b=a);return b}function xc(a,b){var c=b.earliestSuspendedTime,d=b.latestSuspendedTime,e=b.earliestPendingTime,f=b.latestPingedTime;e=0!==e?e:f;0===e&&(0===a||d<a)&&(e=d);a=e;0!==a&&
-c>a&&(a=c);b.nextExpirationTimeToWorkOn=e;b.expirationTime=a}function P(a,b){if(a&&a.defaultProps){b=B({},b);a=a.defaultProps;for(var c in a)void 0===b[c]&&(b[c]=a[c])}return b}function ei(a){var b=a._result;switch(a._status){case 1:return b;case 2:throw b;case 0:throw b;default:a._status=0;b=a._ctor;b=b();b.then(function(b){0===a._status&&(b=b.default,a._status=1,a._result=b)},function(b){0===a._status&&(a._status=2,a._result=b)});switch(a._status){case 1:return a._result;case 2:throw a._result;
-}a._result=b;throw b;}}function yc(a,b,c,d){b=a.memoizedState;c=c(d,b);c=null===c||void 0===c?b:B({},b,c);a.memoizedState=c;d=a.updateQueue;null!==d&&0===a.expirationTime&&(d.baseState=c)}function Xf(a,b,c,d,e,f,g){a=a.stateNode;return"function"===typeof a.shouldComponentUpdate?a.shouldComponentUpdate(d,f,g):b.prototype&&b.prototype.isPureReactComponent?!vb(c,d)||!vb(e,f):!0}function Yf(a,b,c,d){var e=!1;d=va;var f=b.contextType;"object"===typeof f&&null!==f?f=T(f):(d=E(b)?Fa:F.current,e=b.contextTypes,
-f=(e=null!==e&&void 0!==e)?Za(a,d):va);b=new b(c,f);a.memoizedState=null!==b.state&&void 0!==b.state?b.state:null;b.updater=zc;a.stateNode=b;b._reactInternalFiber=a;e&&(a=a.stateNode,a.__reactInternalMemoizedUnmaskedChildContext=d,a.__reactInternalMemoizedMaskedChildContext=f);return b}function Zf(a,b,c,d){a=b.state;"function"===typeof b.componentWillReceiveProps&&b.componentWillReceiveProps(c,d);"function"===typeof b.UNSAFE_componentWillReceiveProps&&b.UNSAFE_componentWillReceiveProps(c,d);b.state!==
-a&&zc.enqueueReplaceState(b,b.state,null)}function Pd(a,b,c,d){var e=a.stateNode;e.props=c;e.state=a.memoizedState;e.refs=$f;var f=b.contextType;"object"===typeof f&&null!==f?e.context=T(f):(f=E(b)?Fa:F.current,e.context=Za(a,f));f=a.updateQueue;null!==f&&(Cb(a,f,c,e,d),e.state=a.memoizedState);f=b.getDerivedStateFromProps;"function"===typeof f&&(yc(a,b,f,c),e.state=a.memoizedState);"function"===typeof b.getDerivedStateFromProps||"function"===typeof e.getSnapshotBeforeUpdate||"function"!==typeof e.UNSAFE_componentWillMount&&
-"function"!==typeof e.componentWillMount||(b=e.state,"function"===typeof e.componentWillMount&&e.componentWillMount(),"function"===typeof e.UNSAFE_componentWillMount&&e.UNSAFE_componentWillMount(),b!==e.state&&zc.enqueueReplaceState(e,e.state,null),f=a.updateQueue,null!==f&&(Cb(a,f,c,e,d),e.state=a.memoizedState));"function"===typeof e.componentDidMount&&(a.effectTag|=4)}function Db(a,b,c){a=c.ref;if(null!==a&&"function"!==typeof a&&"object"!==typeof a){if(c._owner){c=c._owner;var d=void 0;c&&(1!==
-c.tag?n("309"):void 0,d=c.stateNode);d?void 0:n("147",a);var e=""+a;if(null!==b&&null!==b.ref&&"function"===typeof b.ref&&b.ref._stringRef===e)return b.ref;b=function(a){var b=d.refs;b===$f&&(b=d.refs={});null===a?delete b[e]:b[e]=a};b._stringRef=e;return b}"string"!==typeof a?n("284"):void 0;c._owner?void 0:n("290",a)}return a}function Ac(a,b){"textarea"!==a.type&&n("31","[object Object]"===Object.prototype.toString.call(b)?"object with keys {"+Object.keys(b).join(", ")+"}":b,"")}function ag(a){function b(b,
-c){if(a){var d=b.lastEffect;null!==d?(d.nextEffect=c,b.lastEffect=c):b.firstEffect=b.lastEffect=c;c.nextEffect=null;c.effectTag=8}}function c(c,d){if(!a)return null;for(;null!==d;)b(c,d),d=d.sibling;return null}function d(a,b){for(a=new Map;null!==b;)null!==b.key?a.set(b.key,b):a.set(b.index,b),b=b.sibling;return a}function e(a,b,c){a=Ga(a,b,c);a.index=0;a.sibling=null;return a}function f(b,c,d){b.index=d;if(!a)return c;d=b.alternate;if(null!==d)return d=d.index,d<c?(b.effectTag=2,c):d;b.effectTag=
-2;return c}function g(b){a&&null===b.alternate&&(b.effectTag=2);return b}function h(a,b,c,d){if(null===b||6!==b.tag)return b=Nd(c,a.mode,d),b.return=a,b;b=e(b,c,d);b.return=a;return b}function l(a,b,c,d){if(null!==b&&b.elementType===c.type)return d=e(b,c.props,d),d.ref=Db(a,b,c),d.return=a,d;d=wc(c.type,c.key,c.props,null,a.mode,d);d.ref=Db(a,b,c);d.return=a;return d}function k(a,b,c,d){if(null===b||4!==b.tag||b.stateNode.containerInfo!==c.containerInfo||b.stateNode.implementation!==c.implementation)return b=
-Od(c,a.mode,d),b.return=a,b;b=e(b,c.children||[],d);b.return=a;return b}function m(a,b,c,d,f){if(null===b||7!==b.tag)return b=wa(c,a.mode,d,f),b.return=a,b;b=e(b,c,d);b.return=a;return b}function Ff(a,b,c){if("string"===typeof b||"number"===typeof b)return b=Nd(""+b,a.mode,c),b.return=a,b;if("object"===typeof b&&null!==b){switch(b.$$typeof){case Bc:return c=wc(b.type,b.key,b.props,null,a.mode,c),c.ref=Db(a,null,b),c.return=a,c;case Va:return b=Od(b,a.mode,c),b.return=a,b}if(Cc(b)||sb(b))return b=
-wa(b,a.mode,c,null),b.return=a,b;Ac(a,b)}return null}function p(a,b,c,d){var e=null!==b?b.key:null;if("string"===typeof c||"number"===typeof c)return null!==e?null:h(a,b,""+c,d);if("object"===typeof c&&null!==c){switch(c.$$typeof){case Bc:return c.key===e?c.type===ta?m(a,b,c.props.children,d,e):l(a,b,c,d):null;case Va:return c.key===e?k(a,b,c,d):null}if(Cc(c)||sb(c))return null!==e?null:m(a,b,c,d,null);Ac(a,c)}return null}function r(a,b,c,d,e){if("string"===typeof d||"number"===typeof d)return a=
-a.get(c)||null,h(b,a,""+d,e);if("object"===typeof d&&null!==d){switch(d.$$typeof){case Bc:return a=a.get(null===d.key?c:d.key)||null,d.type===ta?m(b,a,d.props.children,e,d.key):l(b,a,d,e);case Va:return a=a.get(null===d.key?c:d.key)||null,k(b,a,d,e)}if(Cc(d)||sb(d))return a=a.get(c)||null,m(b,a,d,e,null);Ac(b,d)}return null}function u(e,g,h,k){for(var l=null,m=null,n=g,q=g=0,v=null;null!==n&&q<h.length;q++){n.index>q?(v=n,n=null):v=n.sibling;var Q=p(e,n,h[q],k);if(null===Q){null===n&&(n=v);break}a&&
-n&&null===Q.alternate&&b(e,n);g=f(Q,g,q);null===m?l=Q:m.sibling=Q;m=Q;n=v}if(q===h.length)return c(e,n),l;if(null===n){for(;q<h.length;q++)if(n=Ff(e,h[q],k))g=f(n,g,q),null===m?l=n:m.sibling=n,m=n;return l}for(n=d(e,n);q<h.length;q++)if(v=r(n,e,q,h[q],k))a&&null!==v.alternate&&n.delete(null===v.key?q:v.key),g=f(v,g,q),null===m?l=v:m.sibling=v,m=v;a&&n.forEach(function(a){return b(e,a)});return l}function x(e,g,h,k){var l=sb(h);"function"!==typeof l?n("150"):void 0;h=l.call(h);null==h?n("151"):void 0;
-for(var m=l=null,q=g,v=g=0,Q=null,t=h.next();null!==q&&!t.done;v++,t=h.next()){q.index>v?(Q=q,q=null):Q=q.sibling;var u=p(e,q,t.value,k);if(null===u){q||(q=Q);break}a&&q&&null===u.alternate&&b(e,q);g=f(u,g,v);null===m?l=u:m.sibling=u;m=u;q=Q}if(t.done)return c(e,q),l;if(null===q){for(;!t.done;v++,t=h.next())t=Ff(e,t.value,k),null!==t&&(g=f(t,g,v),null===m?l=t:m.sibling=t,m=t);return l}for(q=d(e,q);!t.done;v++,t=h.next())t=r(q,e,v,t.value,k),null!==t&&(a&&null!==t.alternate&&q.delete(null===t.key?
-v:t.key),g=f(t,g,v),null===m?l=t:m.sibling=t,m=t);a&&q.forEach(function(a){return b(e,a)});return l}return function(a,d,f,h){var k="object"===typeof f&&null!==f&&f.type===ta&&null===f.key;k&&(f=f.props.children);var l="object"===typeof f&&null!==f;if(l)switch(f.$$typeof){case Bc:a:{l=f.key;for(k=d;null!==k;){if(k.key===l)if(7===k.tag?f.type===ta:k.elementType===f.type){c(a,k.sibling);d=e(k,f.type===ta?f.props.children:f.props,h);d.ref=Db(a,k,f);d.return=a;a=d;break a}else{c(a,k);break}else b(a,k);
-k=k.sibling}f.type===ta?(d=wa(f.props.children,a.mode,h,f.key),d.return=a,a=d):(h=wc(f.type,f.key,f.props,null,a.mode,h),h.ref=Db(a,d,f),h.return=a,a=h)}return g(a);case Va:a:{for(k=f.key;null!==d;){if(d.key===k)if(4===d.tag&&d.stateNode.containerInfo===f.containerInfo&&d.stateNode.implementation===f.implementation){c(a,d.sibling);d=e(d,f.children||[],h);d.return=a;a=d;break a}else{c(a,d);break}else b(a,d);d=d.sibling}d=Od(f,a.mode,h);d.return=a;a=d}return g(a)}if("string"===typeof f||"number"===
-typeof f)return f=""+f,null!==d&&6===d.tag?(c(a,d.sibling),d=e(d,f,h),d.return=a,a=d):(c(a,d),d=Nd(f,a.mode,h),d.return=a,a=d),g(a);if(Cc(f))return u(a,d,f,h);if(sb(f))return x(a,d,f,h);l&&Ac(a,f);if("undefined"===typeof f&&!k)switch(a.tag){case 1:case 0:h=a.type,n("152",h.displayName||h.name||"Component")}return c(a,d)}}function Ha(a){a===Eb?n("174"):void 0;return a}function Qd(a,b){L(Fb,b,a);L(Gb,a,a);L(U,Eb,a);var c=b.nodeType;switch(c){case 9:case 11:b=(b=b.documentElement)?b.namespaceURI:Dd(null,
-"");break;default:c=8===c?b.parentNode:b,b=c.namespaceURI||null,c=c.tagName,b=Dd(b,c)}D(U,a);L(U,b,a)}function $a(a){D(U,a);D(Gb,a);D(Fb,a)}function bg(a){Ha(Fb.current);var b=Ha(U.current);var c=Dd(b,a.type);b!==c&&(L(Gb,a,a),L(U,c,a))}function Rd(a){Gb.current===a&&(D(U,a),D(Gb,a))}function V(){n("321")}function Sd(a,b){if(null===b)return!1;for(var c=0;c<b.length&&c<a.length;c++)if(!Ea(a[c],b[c]))return!1;return!0}function Td(a,b,c,d,e,f){Hb=f;xa=b;W=null!==a?a.memoizedState:null;Dc.current=null===
-W?fi:cg;b=c(d,e);if(Ib){do Ib=!1,Jb+=1,W=null!==a?a.memoizedState:null,ab=bb,X=G=y=null,Dc.current=cg,b=c(d,e);while(Ib);ia=null;Jb=0}Dc.current=Ud;a=xa;a.memoizedState=bb;a.expirationTime=Kb;a.updateQueue=X;a.effectTag|=Lb;a=null!==y&&null!==y.next;Hb=0;ab=G=bb=W=y=xa=null;Kb=0;X=null;Lb=0;a?n("300"):void 0;return b}function Vd(){Dc.current=Ud;Hb=0;ab=G=bb=W=y=xa=null;Kb=0;X=null;Lb=0;Ib=!1;ia=null;Jb=0}function cb(){var a={memoizedState:null,baseState:null,queue:null,baseUpdate:null,next:null};
-null===G?bb=G=a:G=G.next=a;return G}function Mb(){if(null!==ab)G=ab,ab=G.next,y=W,W=null!==y?y.next:null;else{null===W?n("310"):void 0;y=W;var a={memoizedState:y.memoizedState,baseState:y.baseState,queue:y.queue,baseUpdate:y.baseUpdate,next:null};G=null===G?bb=a:G.next=a;W=y.next}return G}function dg(a,b){return"function"===typeof b?b(a):b}function eg(a,b,c){b=Mb();c=b.queue;null===c?n("311"):void 0;c.lastRenderedReducer=a;if(0<Jb){var d=c.dispatch;if(null!==ia){var e=ia.get(c);if(void 0!==e){ia.delete(c);
-var f=b.memoizedState;do f=a(f,e.action),e=e.next;while(null!==e);Ea(f,b.memoizedState)||(ja=!0);b.memoizedState=f;b.baseUpdate===c.last&&(b.baseState=f);c.lastRenderedState=f;return[f,d]}}return[b.memoizedState,d]}d=c.last;var g=b.baseUpdate;f=b.baseState;null!==g?(null!==d&&(d.next=null),d=g.next):d=null!==d?d.next:null;if(null!==d){var h=e=null,l=d,k=!1;do{var m=l.expirationTime;m<Hb?(k||(k=!0,h=g,e=f),m>Kb&&(Kb=m)):f=l.eagerReducer===a?l.eagerState:a(f,l.action);g=l;l=l.next}while(null!==l&&l!==
-d);k||(h=g,e=f);Ea(f,b.memoizedState)||(ja=!0);b.memoizedState=f;b.baseUpdate=h;b.baseState=e;c.lastRenderedState=f}return[b.memoizedState,c.dispatch]}function Wd(a,b,c,d){a={tag:a,create:b,destroy:c,deps:d,next:null};null===X?(X={lastEffect:null},X.lastEffect=a.next=a):(b=X.lastEffect,null===b?X.lastEffect=a.next=a:(c=b.next,b.next=a,a.next=c,X.lastEffect=a));return a}function Xd(a,b,c,d){var e=cb();Lb|=a;e.memoizedState=Wd(b,c,void 0,void 0===d?null:d)}function Yd(a,b,c,d){var e=Mb();d=void 0===
-d?null:d;var f=void 0;if(null!==y){var g=y.memoizedState;f=g.destroy;if(null!==d&&Sd(d,g.deps)){Wd(db,c,f,d);return}}Lb|=a;e.memoizedState=Wd(b,c,f,d)}function fg(a,b){if("function"===typeof b)return a=a(),b(a),function(){b(null)};if(null!==b&&void 0!==b)return a=a(),b.current=a,function(){b.current=null}}function gg(a,b){}function hg(a,b,c){25>Jb?void 0:n("301");var d=a.alternate;if(a===xa||null!==d&&d===xa)if(Ib=!0,a={expirationTime:Hb,action:c,eagerReducer:null,eagerState:null,next:null},null===
-ia&&(ia=new Map),c=ia.get(b),void 0===c)ia.set(b,a);else{for(b=c;null!==b.next;)b=b.next;b.next=a}else{eb();var e=ka();e=fb(e,a);var f={expirationTime:e,action:c,eagerReducer:null,eagerState:null,next:null},g=b.last;if(null===g)f.next=f;else{var h=g.next;null!==h&&(f.next=h);g.next=f}b.last=f;if(0===a.expirationTime&&(null===d||0===d.expirationTime)&&(d=b.lastRenderedReducer,null!==d))try{var l=b.lastRenderedState,k=d(l,c);f.eagerReducer=d;f.eagerState=k;if(Ea(k,l))return}catch(m){}finally{}ya(a,
-e)}}function ig(a,b){var c=S(5,null,null,0);c.elementType="DELETED";c.type="DELETED";c.stateNode=b;c.return=a;c.effectTag=8;null!==a.lastEffect?(a.lastEffect.nextEffect=c,a.lastEffect=c):a.firstEffect=a.lastEffect=c}function jg(a,b){switch(a.tag){case 5:var c=a.type;b=1!==b.nodeType||c.toLowerCase()!==b.nodeName.toLowerCase()?null:b;return null!==b?(a.stateNode=b,!0):!1;case 6:return b=""===a.pendingProps||3!==b.nodeType?null:b,null!==b?(a.stateNode=b,!0):!1;case 13:return!1;default:return!1}}function kg(a){if(Ia){var b=
-gb;if(b){var c=b;if(!jg(a,b)){b=Hd(c);if(!b||!jg(a,b)){a.effectTag|=2;Ia=!1;la=a;return}ig(la,c)}la=a;gb=Pf(b)}else a.effectTag|=2,Ia=!1,la=a}}function lg(a){for(a=a.return;null!==a&&5!==a.tag&&3!==a.tag&&18!==a.tag;)a=a.return;la=a}function Zd(a){if(a!==la)return!1;if(!Ia)return lg(a),Ia=!0,!1;var b=a.type;if(5!==a.tag||"head"!==b&&"body"!==b&&!Gd(b,a.memoizedProps))for(b=gb;b;)ig(a,b),b=Hd(b);lg(a);gb=la?Hd(a.stateNode):null;return!0}function $d(){gb=la=null;Ia=!1}function N(a,b,c,d){b.child=null===
-a?ae(b,null,c,d):hb(b,a.child,c,d)}function mg(a,b,c,d,e){c=c.render;var f=b.ref;ib(b,e);d=Td(a,b,c,d,f,e);if(null!==a&&!ja)return b.updateQueue=a.updateQueue,b.effectTag&=-517,a.expirationTime<=e&&(a.expirationTime=0),ma(a,b,e);b.effectTag|=1;N(a,b,d,e);return b.child}function ng(a,b,c,d,e,f){if(null===a){var g=c.type;if("function"===typeof g&&!Md(g)&&void 0===g.defaultProps&&null===c.compare&&void 0===c.defaultProps)return b.tag=15,b.type=g,og(a,b,g,d,e,f);a=wc(c.type,null,d,null,b.mode,f);a.ref=
-b.ref;a.return=b;return b.child=a}g=a.child;if(e<f&&(e=g.memoizedProps,c=c.compare,c=null!==c?c:vb,c(e,d)&&a.ref===b.ref))return ma(a,b,f);b.effectTag|=1;a=Ga(g,d,f);a.ref=b.ref;a.return=b;return b.child=a}function og(a,b,c,d,e,f){return null!==a&&vb(a.memoizedProps,d)&&a.ref===b.ref&&(ja=!1,e<f)?ma(a,b,f):be(a,b,c,d,f)}function pg(a,b){var c=b.ref;if(null===a&&null!==c||null!==a&&a.ref!==c)b.effectTag|=128}function be(a,b,c,d,e){var f=E(c)?Fa:F.current;f=Za(b,f);ib(b,e);c=Td(a,b,c,d,f,e);if(null!==
-a&&!ja)return b.updateQueue=a.updateQueue,b.effectTag&=-517,a.expirationTime<=e&&(a.expirationTime=0),ma(a,b,e);b.effectTag|=1;N(a,b,c,e);return b.child}function qg(a,b,c,d,e){if(E(c)){var f=!0;vc(b)}else f=!1;ib(b,e);if(null===b.stateNode)null!==a&&(a.alternate=null,b.alternate=null,b.effectTag|=2),Yf(b,c,d,e),Pd(b,c,d,e),d=!0;else if(null===a){var g=b.stateNode,h=b.memoizedProps;g.props=h;var l=g.context,k=c.contextType;"object"===typeof k&&null!==k?k=T(k):(k=E(c)?Fa:F.current,k=Za(b,k));var m=
-c.getDerivedStateFromProps,n="function"===typeof m||"function"===typeof g.getSnapshotBeforeUpdate;n||"function"!==typeof g.UNSAFE_componentWillReceiveProps&&"function"!==typeof g.componentWillReceiveProps||(h!==d||l!==k)&&Zf(b,g,d,k);za=!1;var p=b.memoizedState;l=g.state=p;var r=b.updateQueue;null!==r&&(Cb(b,r,d,g,e),l=b.memoizedState);h!==d||p!==l||M.current||za?("function"===typeof m&&(yc(b,c,m,d),l=b.memoizedState),(h=za||Xf(b,c,h,d,p,l,k))?(n||"function"!==typeof g.UNSAFE_componentWillMount&&
-"function"!==typeof g.componentWillMount||("function"===typeof g.componentWillMount&&g.componentWillMount(),"function"===typeof g.UNSAFE_componentWillMount&&g.UNSAFE_componentWillMount()),"function"===typeof g.componentDidMount&&(b.effectTag|=4)):("function"===typeof g.componentDidMount&&(b.effectTag|=4),b.memoizedProps=d,b.memoizedState=l),g.props=d,g.state=l,g.context=k,d=h):("function"===typeof g.componentDidMount&&(b.effectTag|=4),d=!1)}else g=b.stateNode,h=b.memoizedProps,g.props=b.type===b.elementType?
-h:P(b.type,h),l=g.context,k=c.contextType,"object"===typeof k&&null!==k?k=T(k):(k=E(c)?Fa:F.current,k=Za(b,k)),m=c.getDerivedStateFromProps,(n="function"===typeof m||"function"===typeof g.getSnapshotBeforeUpdate)||"function"!==typeof g.UNSAFE_componentWillReceiveProps&&"function"!==typeof g.componentWillReceiveProps||(h!==d||l!==k)&&Zf(b,g,d,k),za=!1,l=b.memoizedState,p=g.state=l,r=b.updateQueue,null!==r&&(Cb(b,r,d,g,e),p=b.memoizedState),h!==d||l!==p||M.current||za?("function"===typeof m&&(yc(b,
-c,m,d),p=b.memoizedState),(m=za||Xf(b,c,h,d,l,p,k))?(n||"function"!==typeof g.UNSAFE_componentWillUpdate&&"function"!==typeof g.componentWillUpdate||("function"===typeof g.componentWillUpdate&&g.componentWillUpdate(d,p,k),"function"===typeof g.UNSAFE_componentWillUpdate&&g.UNSAFE_componentWillUpdate(d,p,k)),"function"===typeof g.componentDidUpdate&&(b.effectTag|=4),"function"===typeof g.getSnapshotBeforeUpdate&&(b.effectTag|=256)):("function"!==typeof g.componentDidUpdate||h===a.memoizedProps&&l===
-a.memoizedState||(b.effectTag|=4),"function"!==typeof g.getSnapshotBeforeUpdate||h===a.memoizedProps&&l===a.memoizedState||(b.effectTag|=256),b.memoizedProps=d,b.memoizedState=p),g.props=d,g.state=p,g.context=k,d=m):("function"!==typeof g.componentDidUpdate||h===a.memoizedProps&&l===a.memoizedState||(b.effectTag|=4),"function"!==typeof g.getSnapshotBeforeUpdate||h===a.memoizedProps&&l===a.memoizedState||(b.effectTag|=256),d=!1);return ce(a,b,c,d,f,e)}function ce(a,b,c,d,e,f){pg(a,b);var g=0!==(b.effectTag&
-64);if(!d&&!g)return e&&Sf(b,c,!1),ma(a,b,f);d=b.stateNode;gi.current=b;var h=g&&"function"!==typeof c.getDerivedStateFromError?null:d.render();b.effectTag|=1;null!==a&&g?(b.child=hb(b,a.child,null,f),b.child=hb(b,null,h,f)):N(a,b,h,f);b.memoizedState=d.state;e&&Sf(b,c,!0);return b.child}function rg(a){var b=a.stateNode;b.pendingContext?Qf(a,b.pendingContext,b.pendingContext!==b.context):b.context&&Qf(a,b.context,!1);Qd(a,b.containerInfo)}function sg(a,b,c){var d=b.mode,e=b.pendingProps,f=b.memoizedState;
-if(0===(b.effectTag&64)){f=null;var g=!1}else f={timedOutAt:null!==f?f.timedOutAt:0},g=!0,b.effectTag&=-65;if(null===a)if(g){var h=e.fallback;a=wa(null,d,0,null);0===(b.mode&1)&&(a.child=null!==b.memoizedState?b.child.child:b.child);d=wa(h,d,c,null);a.sibling=d;c=a;c.return=d.return=b}else c=d=ae(b,null,e.children,c);else null!==a.memoizedState?(d=a.child,h=d.sibling,g?(c=e.fallback,e=Ga(d,d.pendingProps,0),0===(b.mode&1)&&(g=null!==b.memoizedState?b.child.child:b.child,g!==d.child&&(e.child=g)),
-d=e.sibling=Ga(h,c,h.expirationTime),c=e,e.childExpirationTime=0,c.return=d.return=b):c=d=hb(b,d.child,e.children,c)):(h=a.child,g?(g=e.fallback,e=wa(null,d,0,null),e.child=h,0===(b.mode&1)&&(e.child=null!==b.memoizedState?b.child.child:b.child),d=e.sibling=wa(g,d,c,null),d.effectTag|=2,c=e,e.childExpirationTime=0,c.return=d.return=b):d=c=hb(b,h,e.children,c)),b.stateNode=a.stateNode;b.memoizedState=f;b.child=c;return d}function ma(a,b,c){null!==a&&(b.contextDependencies=a.contextDependencies);if(b.childExpirationTime<
-c)return null;null!==a&&b.child!==a.child?n("153"):void 0;if(null!==b.child){a=b.child;c=Ga(a,a.pendingProps,a.expirationTime);b.child=c;for(c.return=b;null!==a.sibling;)a=a.sibling,c=c.sibling=Ga(a,a.pendingProps,a.expirationTime),c.return=b;c.sibling=null}return b.child}function hi(a,b,c){var d=b.expirationTime;if(null!==a)if(a.memoizedProps!==b.pendingProps||M.current)ja=!0;else{if(d<c){ja=!1;switch(b.tag){case 3:rg(b);$d();break;case 5:bg(b);break;case 1:E(b.type)&&vc(b);break;case 4:Qd(b,b.stateNode.containerInfo);
-break;case 10:tg(b,b.memoizedProps.value);break;case 13:if(null!==b.memoizedState){d=b.child.childExpirationTime;if(0!==d&&d>=c)return sg(a,b,c);b=ma(a,b,c);return null!==b?b.sibling:null}}return ma(a,b,c)}}else ja=!1;b.expirationTime=0;switch(b.tag){case 2:d=b.elementType;null!==a&&(a.alternate=null,b.alternate=null,b.effectTag|=2);a=b.pendingProps;var e=Za(b,F.current);ib(b,c);e=Td(null,b,d,a,e,c);b.effectTag|=1;if("object"===typeof e&&null!==e&&"function"===typeof e.render&&void 0===e.$$typeof){b.tag=
-1;Vd();if(E(d)){var f=!0;vc(b)}else f=!1;b.memoizedState=null!==e.state&&void 0!==e.state?e.state:null;var g=d.getDerivedStateFromProps;"function"===typeof g&&yc(b,d,g,a);e.updater=zc;b.stateNode=e;e._reactInternalFiber=b;Pd(b,d,a,c);b=ce(null,b,d,!0,f,c)}else b.tag=0,N(null,b,e,c),b=b.child;return b;case 16:e=b.elementType;null!==a&&(a.alternate=null,b.alternate=null,b.effectTag|=2);f=b.pendingProps;a=ei(e);b.type=a;e=b.tag=ci(a);f=P(a,f);g=void 0;switch(e){case 0:g=be(null,b,a,f,c);break;case 1:g=
-qg(null,b,a,f,c);break;case 11:g=mg(null,b,a,f,c);break;case 14:g=ng(null,b,a,P(a.type,f),d,c);break;default:n("306",a,"")}return g;case 0:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:P(d,e),be(a,b,d,e,c);case 1:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:P(d,e),qg(a,b,d,e,c);case 3:rg(b);d=b.updateQueue;null===d?n("282"):void 0;e=b.memoizedState;e=null!==e?e.element:null;Cb(b,d,b.pendingProps,null,c);d=b.memoizedState.element;if(d===e)$d(),b=ma(a,b,c);else{e=b.stateNode;if(e=
-(null===a||null===a.child)&&e.hydrate)gb=Pf(b.stateNode.containerInfo),la=b,e=Ia=!0;e?(b.effectTag|=2,b.child=ae(b,null,d,c)):(N(a,b,d,c),$d());b=b.child}return b;case 5:return bg(b),null===a&&kg(b),d=b.type,e=b.pendingProps,f=null!==a?a.memoizedProps:null,g=e.children,Gd(d,e)?g=null:null!==f&&Gd(d,f)&&(b.effectTag|=16),pg(a,b),1!==c&&b.mode&1&&e.hidden?(b.expirationTime=b.childExpirationTime=1,b=null):(N(a,b,g,c),b=b.child),b;case 6:return null===a&&kg(b),null;case 13:return sg(a,b,c);case 4:return Qd(b,
-b.stateNode.containerInfo),d=b.pendingProps,null===a?b.child=hb(b,null,d,c):N(a,b,d,c),b.child;case 11:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:P(d,e),mg(a,b,d,e,c);case 7:return N(a,b,b.pendingProps,c),b.child;case 8:return N(a,b,b.pendingProps.children,c),b.child;case 12:return N(a,b,b.pendingProps.children,c),b.child;case 10:a:{d=b.type._context;e=b.pendingProps;g=b.memoizedProps;f=e.value;tg(b,f);if(null!==g){var h=g.value;f=Ea(h,f)?0:("function"===typeof d._calculateChangedBits?
-d._calculateChangedBits(h,f):1073741823)|0;if(0===f){if(g.children===e.children&&!M.current){b=ma(a,b,c);break a}}else for(h=b.child,null!==h&&(h.return=b);null!==h;){var l=h.contextDependencies;if(null!==l){g=h.child;for(var k=l.first;null!==k;){if(k.context===d&&0!==(k.observedBits&f)){1===h.tag&&(k=Aa(c),k.tag=Ec,na(h,k));h.expirationTime<c&&(h.expirationTime=c);k=h.alternate;null!==k&&k.expirationTime<c&&(k.expirationTime=c);k=c;for(var m=h.return;null!==m;){var p=m.alternate;if(m.childExpirationTime<
-k)m.childExpirationTime=k,null!==p&&p.childExpirationTime<k&&(p.childExpirationTime=k);else if(null!==p&&p.childExpirationTime<k)p.childExpirationTime=k;else break;m=m.return}l.expirationTime<c&&(l.expirationTime=c);break}k=k.next}}else g=10===h.tag?h.type===b.type?null:h.child:h.child;if(null!==g)g.return=h;else for(g=h;null!==g;){if(g===b){g=null;break}h=g.sibling;if(null!==h){h.return=g.return;g=h;break}g=g.return}h=g}}N(a,b,e.children,c);b=b.child}return b;case 9:return e=b.type,f=b.pendingProps,
-d=f.children,ib(b,c),e=T(e,f.unstable_observedBits),d=d(e),b.effectTag|=1,N(a,b,d,c),b.child;case 14:return e=b.type,f=P(e,b.pendingProps),f=P(e.type,f),ng(a,b,e,f,d,c);case 15:return og(a,b,b.type,b.pendingProps,d,c);case 17:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:P(d,e),null!==a&&(a.alternate=null,b.alternate=null,b.effectTag|=2),b.tag=1,E(d)?(a=!0,vc(b)):a=!1,ib(b,c),Yf(b,d,e,c),Pd(b,d,e,c),ce(null,b,d,!0,a,c)}n("156")}function tg(a,b){var c=a.type._context;L(de,c._currentValue,
-a);c._currentValue=b}function ee(a){var b=de.current;D(de,a);a.type._context._currentValue=b}function ib(a,b){Nb=a;Ob=Ja=null;var c=a.contextDependencies;null!==c&&c.expirationTime>=b&&(ja=!0);a.contextDependencies=null}function T(a,b){if(Ob!==a&&!1!==b&&0!==b){if("number"!==typeof b||1073741823===b)Ob=a,b=1073741823;b={context:a,observedBits:b,next:null};null===Ja?(null===Nb?n("308"):void 0,Ja=b,Nb.contextDependencies={first:b,expirationTime:0}):Ja=Ja.next=b}return a._currentValue}function Fc(a){return{baseState:a,
-firstUpdate:null,lastUpdate:null,firstCapturedUpdate:null,lastCapturedUpdate:null,firstEffect:null,lastEffect:null,firstCapturedEffect:null,lastCapturedEffect:null}}function fe(a){return{baseState:a.baseState,firstUpdate:a.firstUpdate,lastUpdate:a.lastUpdate,firstCapturedUpdate:null,lastCapturedUpdate:null,firstEffect:null,lastEffect:null,firstCapturedEffect:null,lastCapturedEffect:null}}function Aa(a){return{expirationTime:a,tag:ug,payload:null,callback:null,next:null,nextEffect:null}}function Gc(a,
-b){null===a.lastUpdate?a.firstUpdate=a.lastUpdate=b:(a.lastUpdate.next=b,a.lastUpdate=b)}function na(a,b){var c=a.alternate;if(null===c){var d=a.updateQueue;var e=null;null===d&&(d=a.updateQueue=Fc(a.memoizedState))}else d=a.updateQueue,e=c.updateQueue,null===d?null===e?(d=a.updateQueue=Fc(a.memoizedState),e=c.updateQueue=Fc(c.memoizedState)):d=a.updateQueue=fe(e):null===e&&(e=c.updateQueue=fe(d));null===e||d===e?Gc(d,b):null===d.lastUpdate||null===e.lastUpdate?(Gc(d,b),Gc(e,b)):(Gc(d,b),e.lastUpdate=
-b)}function vg(a,b){var c=a.updateQueue;c=null===c?a.updateQueue=Fc(a.memoizedState):wg(a,c);null===c.lastCapturedUpdate?c.firstCapturedUpdate=c.lastCapturedUpdate=b:(c.lastCapturedUpdate.next=b,c.lastCapturedUpdate=b)}function wg(a,b){var c=a.alternate;null!==c&&b===c.updateQueue&&(b=a.updateQueue=fe(b));return b}function xg(a,b,c,d,e,f){switch(c.tag){case yg:return a=c.payload,"function"===typeof a?a.call(f,d,e):a;case ge:a.effectTag=a.effectTag&-2049|64;case ug:a=c.payload;e="function"===typeof a?
-a.call(f,d,e):a;if(null===e||void 0===e)break;return B({},d,e);case Ec:za=!0}return d}function Cb(a,b,c,d,e){za=!1;b=wg(a,b);for(var f=b.baseState,g=null,h=0,l=b.firstUpdate,k=f;null!==l;){var m=l.expirationTime;m<e?(null===g&&(g=l,f=k),h<m&&(h=m)):(k=xg(a,b,l,k,c,d),null!==l.callback&&(a.effectTag|=32,l.nextEffect=null,null===b.lastEffect?b.firstEffect=b.lastEffect=l:(b.lastEffect.nextEffect=l,b.lastEffect=l)));l=l.next}m=null;for(l=b.firstCapturedUpdate;null!==l;){var n=l.expirationTime;n<e?(null===
-m&&(m=l,null===g&&(f=k)),h<n&&(h=n)):(k=xg(a,b,l,k,c,d),null!==l.callback&&(a.effectTag|=32,l.nextEffect=null,null===b.lastCapturedEffect?b.firstCapturedEffect=b.lastCapturedEffect=l:(b.lastCapturedEffect.nextEffect=l,b.lastCapturedEffect=l)));l=l.next}null===g&&(b.lastUpdate=null);null===m?b.lastCapturedUpdate=null:a.effectTag|=32;null===g&&null===m&&(f=k);b.baseState=f;b.firstUpdate=g;b.firstCapturedUpdate=m;a.expirationTime=h;a.memoizedState=k}function zg(a,b,c,d){null!==b.firstCapturedUpdate&&
-(null!==b.lastUpdate&&(b.lastUpdate.next=b.firstCapturedUpdate,b.lastUpdate=b.lastCapturedUpdate),b.firstCapturedUpdate=b.lastCapturedUpdate=null);Ag(b.firstEffect,c);b.firstEffect=b.lastEffect=null;Ag(b.firstCapturedEffect,c);b.firstCapturedEffect=b.lastCapturedEffect=null}function Ag(a,b){for(;null!==a;){var c=a.callback;if(null!==c){a.callback=null;var d=b;"function"!==typeof c?n("191",c):void 0;c.call(d)}a=a.nextEffect}}function Hc(a,b){return{value:a,source:b,stack:qd(b)}}function Pb(a){a.effectTag|=
-4}function Bg(a,b){var c=b.source,d=b.stack;null===d&&null!==c&&(d=qd(c));null!==c&&sa(c.type);b=b.value;null!==a&&1===a.tag&&sa(a.type);try{console.error(b)}catch(e){setTimeout(function(){throw e;})}}function Cg(a){var b=a.ref;if(null!==b)if("function"===typeof b)try{b(null)}catch(c){Ka(a,c)}else b.current=null}function Qb(a,b,c){c=c.updateQueue;c=null!==c?c.lastEffect:null;if(null!==c){var d=c=c.next;do{if((d.tag&a)!==db){var e=d.destroy;d.destroy=void 0;void 0!==e&&e()}(d.tag&b)!==db&&(e=d.create,
-d.destroy=e());d=d.next}while(d!==c)}}function ii(a,b){for(var c=a;;){if(5===c.tag){var d=c.stateNode;if(b)d.style.display="none";else{d=c.stateNode;var e=c.memoizedProps.style;e=void 0!==e&&null!==e&&e.hasOwnProperty("display")?e.display:null;d.style.display=Lf("display",e)}}else if(6===c.tag)c.stateNode.nodeValue=b?"":c.memoizedProps;else if(13===c.tag&&null!==c.memoizedState){d=c.child.sibling;d.return=c;c=d;continue}else if(null!==c.child){c.child.return=c;c=c.child;continue}if(c===a)break;for(;null===
-c.sibling;){if(null===c.return||c.return===a)return;c=c.return}c.sibling.return=c.return;c=c.sibling}}function Dg(a){"function"===typeof Ld&&Ld(a);switch(a.tag){case 0:case 11:case 14:case 15:var b=a.updateQueue;if(null!==b&&(b=b.lastEffect,null!==b)){var c=b=b.next;do{var d=c.destroy;if(void 0!==d){var e=a;try{d()}catch(f){Ka(e,f)}}c=c.next}while(c!==b)}break;case 1:Cg(a);b=a.stateNode;if("function"===typeof b.componentWillUnmount)try{b.props=a.memoizedProps,b.state=a.memoizedState,b.componentWillUnmount()}catch(f){Ka(a,
-f)}break;case 5:Cg(a);break;case 4:Eg(a)}}function Fg(a){return 5===a.tag||3===a.tag||4===a.tag}function Gg(a){a:{for(var b=a.return;null!==b;){if(Fg(b)){var c=b;break a}b=b.return}n("160");c=void 0}var d=b=void 0;switch(c.tag){case 5:b=c.stateNode;d=!1;break;case 3:b=c.stateNode.containerInfo;d=!0;break;case 4:b=c.stateNode.containerInfo;d=!0;break;default:n("161")}c.effectTag&16&&(Ab(b,""),c.effectTag&=-17);a:b:for(c=a;;){for(;null===c.sibling;){if(null===c.return||Fg(c.return)){c=null;break a}c=
-c.return}c.sibling.return=c.return;for(c=c.sibling;5!==c.tag&&6!==c.tag&&18!==c.tag;){if(c.effectTag&2)continue b;if(null===c.child||4===c.tag)continue b;else c.child.return=c,c=c.child}if(!(c.effectTag&2)){c=c.stateNode;break a}}for(var e=a;;){if(5===e.tag||6===e.tag)if(c)if(d){var f=b,g=e.stateNode,h=c;8===f.nodeType?f.parentNode.insertBefore(g,h):f.insertBefore(g,h)}else b.insertBefore(e.stateNode,c);else d?(g=b,h=e.stateNode,8===g.nodeType?(f=g.parentNode,f.insertBefore(h,g)):(f=g,f.appendChild(h)),
-g=g._reactRootContainer,null!==g&&void 0!==g||null!==f.onclick||(f.onclick=tc)):b.appendChild(e.stateNode);else if(4!==e.tag&&null!==e.child){e.child.return=e;e=e.child;continue}if(e===a)break;for(;null===e.sibling;){if(null===e.return||e.return===a)return;e=e.return}e.sibling.return=e.return;e=e.sibling}}function Eg(a){for(var b=a,c=!1,d=void 0,e=void 0;;){if(!c){c=b.return;a:for(;;){null===c?n("160"):void 0;switch(c.tag){case 5:d=c.stateNode;e=!1;break a;case 3:d=c.stateNode.containerInfo;e=!0;
-break a;case 4:d=c.stateNode.containerInfo;e=!0;break a}c=c.return}c=!0}if(5===b.tag||6===b.tag){a:for(var f=b,g=f;;)if(Dg(g),null!==g.child&&4!==g.tag)g.child.return=g,g=g.child;else{if(g===f)break;for(;null===g.sibling;){if(null===g.return||g.return===f)break a;g=g.return}g.sibling.return=g.return;g=g.sibling}e?(f=d,g=b.stateNode,8===f.nodeType?f.parentNode.removeChild(g):f.removeChild(g)):d.removeChild(b.stateNode)}else if(4===b.tag){if(null!==b.child){d=b.stateNode.containerInfo;e=!0;b.child.return=
-b;b=b.child;continue}}else if(Dg(b),null!==b.child){b.child.return=b;b=b.child;continue}if(b===a)break;for(;null===b.sibling;){if(null===b.return||b.return===a)return;b=b.return;4===b.tag&&(c=!1)}b.sibling.return=b.return;b=b.sibling}}function Hg(a,b){switch(b.tag){case 0:case 11:case 14:case 15:Qb(Rb,ji,b);break;case 1:break;case 5:var c=b.stateNode;if(null!=c){var d=b.memoizedProps;a=null!==a?a.memoizedProps:d;var e=b.type,f=b.updateQueue;b.updateQueue=null;null!==f&&$h(c,f,e,a,d,b)}break;case 6:null===
-b.stateNode?n("162"):void 0;b.stateNode.nodeValue=b.memoizedProps;break;case 3:break;case 12:break;case 13:c=b.memoizedState;d=void 0;a=b;null===c?d=!1:(d=!0,a=b.child,0===c.timedOutAt&&(c.timedOutAt=ka()));null!==a&&ii(a,d);c=b.updateQueue;if(null!==c){b.updateQueue=null;var g=b.stateNode;null===g&&(g=b.stateNode=new ki);c.forEach(function(a){var c=li.bind(null,b,a);g.has(a)||(g.add(a),a.then(c,c))})}break;case 17:break;default:n("163")}}function he(a,b,c){c=Aa(c);c.tag=ge;c.payload={element:null};
-var d=b.value;c.callback=function(){ie(d);Bg(a,b)};return c}function Ig(a,b,c){c=Aa(c);c.tag=ge;var d=a.type.getDerivedStateFromError;if("function"===typeof d){var e=b.value;c.payload=function(){return d(e)}}var f=a.stateNode;null!==f&&"function"===typeof f.componentDidCatch&&(c.callback=function(){"function"!==typeof d&&(null===Ba?Ba=new Set([this]):Ba.add(this));var c=b.value,e=b.stack;Bg(a,b);this.componentDidCatch(c,{componentStack:null!==e?e:""})});return c}function mi(a,b){switch(a.tag){case 1:return E(a.type)&&
-uc(a),b=a.effectTag,b&2048?(a.effectTag=b&-2049|64,a):null;case 3:return $a(a),Jd(a),b=a.effectTag,0!==(b&64)?n("285"):void 0,a.effectTag=b&-2049|64,a;case 5:return Rd(a),null;case 13:return b=a.effectTag,b&2048?(a.effectTag=b&-2049|64,a):null;case 18:return null;case 4:return $a(a),null;case 10:return ee(a),null;default:return null}}function Jg(){if(null!==x)for(var a=x.return;null!==a;){var b=a;switch(b.tag){case 1:var c=b.type.childContextTypes;null!==c&&void 0!==c&&uc(b);break;case 3:$a(b);Jd(b);
-break;case 5:Rd(b);break;case 4:$a(b);break;case 10:ee(b)}a=a.return}Y=null;H=0;La=-1;je=!1;x=null}function ni(){for(;null!==p;){var a=p.effectTag;a&16&&Ab(p.stateNode,"");if(a&128){var b=p.alternate;null!==b&&(b=b.ref,null!==b&&("function"===typeof b?b(null):b.current=null))}switch(a&14){case 2:Gg(p);p.effectTag&=-3;break;case 6:Gg(p);p.effectTag&=-3;Hg(p.alternate,p);break;case 4:Hg(p.alternate,p);break;case 8:a=p,Eg(a),a.return=null,a.child=null,a.memoizedState=null,a.updateQueue=null,a=a.alternate,
-null!==a&&(a.return=null,a.child=null,a.memoizedState=null,a.updateQueue=null)}p=p.nextEffect}}function oi(){for(;null!==p;){if(p.effectTag&256)a:{var a=p.alternate,b=p;switch(b.tag){case 0:case 11:case 15:Qb(pi,db,b);break a;case 1:if(b.effectTag&256&&null!==a){var c=a.memoizedProps,d=a.memoizedState;a=b.stateNode;b=a.getSnapshotBeforeUpdate(b.elementType===b.type?c:P(b.type,c),d);a.__reactInternalSnapshotBeforeUpdate=b}break a;case 3:case 5:case 6:case 4:case 17:break a;default:n("163")}}p=p.nextEffect}}
-function qi(a,b){for(;null!==p;){var c=p.effectTag;if(c&36){var d=p.alternate,e=p,f=b;switch(e.tag){case 0:case 11:case 15:Qb(ri,Sb,e);break;case 1:var g=e.stateNode;if(e.effectTag&4)if(null===d)g.componentDidMount();else{var h=e.elementType===e.type?d.memoizedProps:P(e.type,d.memoizedProps);g.componentDidUpdate(h,d.memoizedState,g.__reactInternalSnapshotBeforeUpdate)}d=e.updateQueue;null!==d&&zg(e,d,g,f);break;case 3:d=e.updateQueue;if(null!==d){g=null;if(null!==e.child)switch(e.child.tag){case 5:g=
-e.child.stateNode;break;case 1:g=e.child.stateNode}zg(e,d,g,f)}break;case 5:f=e.stateNode;null===d&&e.effectTag&4&&Nf(e.type,e.memoizedProps)&&f.focus();break;case 6:break;case 4:break;case 12:break;case 13:break;case 17:break;default:n("163")}}c&128&&(e=p.ref,null!==e&&(f=p.stateNode,"function"===typeof e?e(f):e.current=f));c&512&&(ke=a);p=p.nextEffect}}function si(a,b){Ic=Jc=ke=null;var c=w;w=!0;do{if(b.effectTag&512){var d=!1,e=void 0;try{var f=b;Qb(le,db,f);Qb(db,me,f)}catch(g){d=!0,e=g}d&&Ka(b,
-e)}b=b.nextEffect}while(null!==b);w=c;c=a.expirationTime;0!==c&&Kc(a,c);z||w||Z(1073741823,!1)}function eb(){null!==Jc&&ti(Jc);null!==Ic&&Ic()}function ui(a,b){Lc=Ca=!0;a.current===b?n("177"):void 0;var c=a.pendingCommitExpirationTime;0===c?n("261"):void 0;a.pendingCommitExpirationTime=0;var d=b.expirationTime,e=b.childExpirationTime;di(a,e>d?e:d);Kg.current=null;d=void 0;1<b.effectTag?null!==b.lastEffect?(b.lastEffect.nextEffect=b,d=b.firstEffect):d=b:d=b.firstEffect;ne=qc;oe=Wh();qc=!1;for(p=d;null!==
-p;){e=!1;var f=void 0;try{oi()}catch(h){e=!0,f=h}e&&(null===p?n("178"):void 0,Ka(p,f),null!==p&&(p=p.nextEffect))}for(p=d;null!==p;){e=!1;f=void 0;try{ni()}catch(h){e=!0,f=h}e&&(null===p?n("178"):void 0,Ka(p,f),null!==p&&(p=p.nextEffect))}Xh(oe);oe=null;qc=!!ne;ne=null;a.current=b;for(p=d;null!==p;){e=!1;f=void 0;try{qi(a,c)}catch(h){e=!0,f=h}e&&(null===p?n("178"):void 0,Ka(p,f),null!==p&&(p=p.nextEffect))}if(null!==d&&null!==ke){var g=si.bind(null,a,d);Jc=Mc(Lg,function(){return vi(g)});Ic=g}Ca=
-Lc=!1;"function"===typeof Kd&&Kd(b.stateNode);c=b.expirationTime;b=b.childExpirationTime;b=b>c?b:c;0===b&&(Ba=null);wi(a,b)}function Mg(a){for(;;){var b=a.alternate,c=a.return,d=a.sibling;if(0===(a.effectTag&1024)){x=a;a:{var e=b;b=a;var f=H;var g=b.pendingProps;switch(b.tag){case 2:break;case 16:break;case 15:case 0:break;case 1:E(b.type)&&uc(b);break;case 3:$a(b);Jd(b);g=b.stateNode;g.pendingContext&&(g.context=g.pendingContext,g.pendingContext=null);if(null===e||null===e.child)Zd(b),b.effectTag&=
--3;pe(b);break;case 5:Rd(b);var h=Ha(Fb.current);f=b.type;if(null!==e&&null!=b.stateNode)Ng(e,b,f,g,h),e.ref!==b.ref&&(b.effectTag|=128);else if(g){var l=Ha(U.current);if(Zd(b)){g=b;e=g.stateNode;var k=g.type,m=g.memoizedProps,p=h;e[ea]=g;e[ec]=m;f=void 0;h=k;switch(h){case "iframe":case "object":r("load",e);break;case "video":case "audio":for(k=0;k<zb.length;k++)r(zb[k],e);break;case "source":r("error",e);break;case "img":case "image":case "link":r("error",e);r("load",e);break;case "form":r("reset",
-e);r("submit",e);break;case "details":r("toggle",e);break;case "input":lf(e,m);r("invalid",e);ha(p,"onChange");break;case "select":e._wrapperState={wasMultiple:!!m.multiple};r("invalid",e);ha(p,"onChange");break;case "textarea":If(e,m),r("invalid",e),ha(p,"onChange")}Ed(h,m);k=null;for(f in m)m.hasOwnProperty(f)&&(l=m[f],"children"===f?"string"===typeof l?e.textContent!==l&&(k=["children",l]):"number"===typeof l&&e.textContent!==""+l&&(k=["children",""+l]):Oa.hasOwnProperty(f)&&null!=l&&ha(p,f));
-switch(h){case "input":kc(e);nf(e,m,!0);break;case "textarea":kc(e);f=e.textContent;f===e._wrapperState.initialValue&&(e.value=f);break;case "select":case "option":break;default:"function"===typeof m.onClick&&(e.onclick=tc)}f=k;g.updateQueue=f;g=null!==f?!0:!1;g&&Pb(b)}else{m=b;p=f;e=g;k=9===h.nodeType?h:h.ownerDocument;"http://www.w3.org/1999/xhtml"===l&&(l=Kf(p));"http://www.w3.org/1999/xhtml"===l?"script"===p?(e=k.createElement("div"),e.innerHTML="<script>\x3c/script>",k=e.removeChild(e.firstChild)):
-"string"===typeof e.is?k=k.createElement(p,{is:e.is}):(k=k.createElement(p),"select"===p&&(p=k,e.multiple?p.multiple=!0:e.size&&(p.size=e.size))):k=k.createElementNS(l,p);e=k;e[ea]=m;e[ec]=g;Og(e,b,!1,!1);m=e;k=f;p=g;var t=h,y=Fd(k,p);switch(k){case "iframe":case "object":r("load",m);h=p;break;case "video":case "audio":for(h=0;h<zb.length;h++)r(zb[h],m);h=p;break;case "source":r("error",m);h=p;break;case "img":case "image":case "link":r("error",m);r("load",m);h=p;break;case "form":r("reset",m);r("submit",
-m);h=p;break;case "details":r("toggle",m);h=p;break;case "input":lf(m,p);h=sd(m,p);r("invalid",m);ha(t,"onChange");break;case "option":h=Bd(m,p);break;case "select":m._wrapperState={wasMultiple:!!p.multiple};h=B({},p,{value:void 0});r("invalid",m);ha(t,"onChange");break;case "textarea":If(m,p);h=Cd(m,p);r("invalid",m);ha(t,"onChange");break;default:h=p}Ed(k,h);l=void 0;var u=k,w=m,v=h;for(l in v)if(v.hasOwnProperty(l)){var q=v[l];"style"===l?Mf(w,q):"dangerouslySetInnerHTML"===l?(q=q?q.__html:void 0,
-null!=q&&Of(w,q)):"children"===l?"string"===typeof q?("textarea"!==u||""!==q)&&Ab(w,q):"number"===typeof q&&Ab(w,""+q):"suppressContentEditableWarning"!==l&&"suppressHydrationWarning"!==l&&"autoFocus"!==l&&(Oa.hasOwnProperty(l)?null!=q&&ha(t,l):null!=q&&rd(w,l,q,y))}switch(k){case "input":kc(m);nf(m,p,!1);break;case "textarea":kc(m);h=m.textContent;h===m._wrapperState.initialValue&&(m.value=h);break;case "option":null!=p.value&&m.setAttribute("value",""+ua(p.value));break;case "select":h=m;m=p;h.multiple=
-!!m.multiple;p=m.value;null!=p?Xa(h,!!m.multiple,p,!1):null!=m.defaultValue&&Xa(h,!!m.multiple,m.defaultValue,!0);break;default:"function"===typeof h.onClick&&(m.onclick=tc)}(g=Nf(f,g))&&Pb(b);b.stateNode=e}null!==b.ref&&(b.effectTag|=128)}else null===b.stateNode?n("166"):void 0;break;case 6:e&&null!=b.stateNode?Pg(e,b,e.memoizedProps,g):("string"!==typeof g&&(null===b.stateNode?n("166"):void 0),e=Ha(Fb.current),Ha(U.current),Zd(b)?(g=b,f=g.stateNode,e=g.memoizedProps,f[ea]=g,(g=f.nodeValue!==e)&&
-Pb(b)):(f=b,g=(9===e.nodeType?e:e.ownerDocument).createTextNode(g),g[ea]=b,f.stateNode=g));break;case 11:break;case 13:g=b.memoizedState;if(0!==(b.effectTag&64)){b.expirationTime=f;x=b;break a}g=null!==g;f=null!==e&&null!==e.memoizedState;null!==e&&!g&&f&&(e=e.child.sibling,null!==e&&(h=b.firstEffect,null!==h?(b.firstEffect=e,e.nextEffect=h):(b.firstEffect=b.lastEffect=e,e.nextEffect=null),e.effectTag=8));if(g||f)b.effectTag|=4;break;case 7:break;case 8:break;case 12:break;case 4:$a(b);pe(b);break;
-case 10:ee(b);break;case 9:break;case 14:break;case 17:E(b.type)&&uc(b);break;case 18:break;default:n("156")}x=null}b=a;if(1===H||1!==b.childExpirationTime){g=0;for(f=b.child;null!==f;)e=f.expirationTime,h=f.childExpirationTime,e>g&&(g=e),h>g&&(g=h),f=f.sibling;b.childExpirationTime=g}if(null!==x)return x;null!==c&&0===(c.effectTag&1024)&&(null===c.firstEffect&&(c.firstEffect=a.firstEffect),null!==a.lastEffect&&(null!==c.lastEffect&&(c.lastEffect.nextEffect=a.firstEffect),c.lastEffect=a.lastEffect),
-1<a.effectTag&&(null!==c.lastEffect?c.lastEffect.nextEffect=a:c.firstEffect=a,c.lastEffect=a))}else{a=mi(a,H);if(null!==a)return a.effectTag&=1023,a;null!==c&&(c.firstEffect=c.lastEffect=null,c.effectTag|=1024)}if(null!==d)return d;if(null!==c)a=c;else break}return null}function Qg(a){var b=hi(a.alternate,a,H);a.memoizedProps=a.pendingProps;null===b&&(b=Mg(a));Kg.current=null;return b}function Rg(a,b){Ca?n("243"):void 0;eb();Ca=!0;var c=qe.current;qe.current=Ud;var d=a.nextExpirationTimeToWorkOn;
-if(d!==H||a!==Y||null===x)Jg(),Y=a,H=d,x=Ga(Y.current,null,H),a.pendingCommitExpirationTime=0;var e=!1;do{try{if(b)for(;null!==x&&!Nc();)x=Qg(x);else for(;null!==x;)x=Qg(x)}catch(v){if(Ob=Ja=Nb=null,Vd(),null===x)e=!0,ie(v);else{null===x?n("271"):void 0;var f=x,g=f.return;if(null===g)e=!0,ie(v);else{a:{var h=a,l=g,k=f,m=v;g=H;k.effectTag|=1024;k.firstEffect=k.lastEffect=null;if(null!==m&&"object"===typeof m&&"function"===typeof m.then){var p=m;m=l;var t=-1,r=-1;do{if(13===m.tag){var u=m.alternate;
-if(null!==u&&(u=u.memoizedState,null!==u)){r=10*(1073741822-u.timedOutAt);break}u=m.pendingProps.maxDuration;if("number"===typeof u)if(0>=u)t=0;else if(-1===t||u<t)t=u}m=m.return}while(null!==m);m=l;do{if(u=13===m.tag)u=void 0===m.memoizedProps.fallback?!1:null===m.memoizedState;if(u){l=m.updateQueue;null===l?(l=new Set,l.add(p),m.updateQueue=l):l.add(p);if(0===(m.mode&1)){m.effectTag|=64;k.effectTag&=-1957;1===k.tag&&(null===k.alternate?k.tag=17:(g=Aa(1073741823),g.tag=Ec,na(k,g)));k.expirationTime=
-1073741823;break a}k=h;l=g;var w=k.pingCache;null===w?(w=k.pingCache=new xi,u=new Set,w.set(p,u)):(u=w.get(p),void 0===u&&(u=new Set,w.set(p,u)));u.has(l)||(u.add(l),k=yi.bind(null,k,p,l),p.then(k,k));-1===t?h=1073741823:(-1===r&&(r=10*(1073741822-Wf(h,g))-5E3),h=r+t);0<=h&&La<h&&(La=h);m.effectTag|=2048;m.expirationTime=g;break a}m=m.return}while(null!==m);m=Error((sa(k.type)||"A React component")+" suspended while rendering, but no fallback UI was specified.\n\nAdd a <Suspense fallback=...> component higher in the tree to provide a loading indicator or placeholder to display."+
-qd(k))}je=!0;m=Hc(m,k);h=l;do{switch(h.tag){case 3:h.effectTag|=2048;h.expirationTime=g;g=he(h,m,g);vg(h,g);break a;case 1:if(t=m,r=h.type,k=h.stateNode,0===(h.effectTag&64)&&("function"===typeof r.getDerivedStateFromError||null!==k&&"function"===typeof k.componentDidCatch&&(null===Ba||!Ba.has(k)))){h.effectTag|=2048;h.expirationTime=g;g=Ig(h,t,g);vg(h,g);break a}}h=h.return}while(null!==h)}x=Mg(f);continue}}}break}while(1);Ca=!1;qe.current=c;Ob=Ja=Nb=null;Vd();if(e)Y=null,a.finishedWork=null;else if(null!==
-x)a.finishedWork=null;else{c=a.current.alternate;null===c?n("281"):void 0;Y=null;if(je){e=a.latestPendingTime;f=a.latestSuspendedTime;g=a.latestPingedTime;if(0!==e&&e<d||0!==f&&f<d||0!==g&&g<d){Vf(a,d);re(a,c,d,a.expirationTime,-1);return}if(!a.didError&&b){a.didError=!0;d=a.nextExpirationTimeToWorkOn=d;b=a.expirationTime=1073741823;re(a,c,d,b,-1);return}}b&&-1!==La?(Vf(a,d),b=10*(1073741822-Wf(a,d)),b<La&&(La=b),b=10*(1073741822-ka()),b=La-b,re(a,c,d,a.expirationTime,0>b?0:b)):(a.pendingCommitExpirationTime=
-d,a.finishedWork=c)}}function Ka(a,b){for(var c=a.return;null!==c;){switch(c.tag){case 1:var d=c.stateNode;if("function"===typeof c.type.getDerivedStateFromError||"function"===typeof d.componentDidCatch&&(null===Ba||!Ba.has(d))){a=Hc(b,a);a=Ig(c,a,1073741823);na(c,a);ya(c,1073741823);return}break;case 3:a=Hc(b,a);a=he(c,a,1073741823);na(c,a);ya(c,1073741823);return}c=c.return}3===a.tag&&(c=Hc(b,a),c=he(a,c,1073741823),na(a,c),ya(a,1073741823))}function fb(a,b){var c=zi(),d=void 0;if(0===(b.mode&1))d=
-1073741823;else if(Ca&&!Lc)d=H;else{switch(c){case se:d=1073741823;break;case te:d=1073741822-10*(((1073741822-a+15)/10|0)+1);break;case Lg:d=1073741822-25*(((1073741822-a+500)/25|0)+1);break;case Ai:case Bi:d=1;break;default:n("313")}null!==Y&&d===H&&--d}c===te&&(0===oa||d<oa)&&(oa=d);return d}function yi(a,b,c){var d=a.pingCache;null!==d&&d.delete(b);if(null!==Y&&H===c)Y=null;else if(b=a.earliestSuspendedTime,d=a.latestSuspendedTime,0!==b&&c<=b&&c>=d){a.didError=!1;b=a.latestPingedTime;if(0===b||
-b>c)a.latestPingedTime=c;xc(c,a);c=a.expirationTime;0!==c&&Kc(a,c)}}function li(a,b){var c=a.stateNode;null!==c&&c.delete(b);b=ka();b=fb(b,a);a=Sg(a,b);null!==a&&(Bb(a,b),b=a.expirationTime,0!==b&&Kc(a,b))}function Sg(a,b){a.expirationTime<b&&(a.expirationTime=b);var c=a.alternate;null!==c&&c.expirationTime<b&&(c.expirationTime=b);var d=a.return,e=null;if(null===d&&3===a.tag)e=a.stateNode;else for(;null!==d;){c=d.alternate;d.childExpirationTime<b&&(d.childExpirationTime=b);null!==c&&c.childExpirationTime<
-b&&(c.childExpirationTime=b);if(null===d.return&&3===d.tag){e=d.stateNode;break}d=d.return}return e}function ya(a,b){a=Sg(a,b);null!==a&&(!Ca&&0!==H&&b>H&&Jg(),Bb(a,b),Ca&&!Lc&&Y===a||Kc(a,a.expirationTime),Tb>Ci&&(Tb=0,n("185")))}function Tg(a,b,c,d,e){return Mc(se,function(){return a(b,c,d,e)})}function Ub(){aa=1073741822-((ue()-ve)/10|0)}function Ug(a,b){if(0!==Oc){if(b<Oc)return;null!==Pc&&Vg(Pc)}Oc=b;a=ue()-ve;Pc=Wg(Di,{timeout:10*(1073741822-b)-a})}function re(a,b,c,d,e){a.expirationTime=d;
-0!==e||Nc()?0<e&&(a.timeoutHandle=Ei(Fi.bind(null,a,b,c),e)):(a.pendingCommitExpirationTime=c,a.finishedWork=b)}function Fi(a,b,c){a.pendingCommitExpirationTime=c;a.finishedWork=b;Ub();jb=aa;Xg(a,c)}function wi(a,b){a.expirationTime=b;a.finishedWork=null}function ka(){if(w)return jb;Qc();if(0===C||1===C)Ub(),jb=aa;return jb}function Kc(a,b){null===a.nextScheduledRoot?(a.expirationTime=b,null===I?(ba=I=a,a.nextScheduledRoot=a):(I=I.nextScheduledRoot=a,I.nextScheduledRoot=ba)):b>a.expirationTime&&(a.expirationTime=
-b);w||(z?Rc&&(ca=a,C=1073741823,Sc(a,1073741823,!1)):1073741823===b?Z(1073741823,!1):Ug(a,b))}function Qc(){var a=0,b=null;if(null!==I)for(var c=I,d=ba;null!==d;){var e=d.expirationTime;if(0===e){null===c||null===I?n("244"):void 0;if(d===d.nextScheduledRoot){ba=I=d.nextScheduledRoot=null;break}else if(d===ba)ba=e=d.nextScheduledRoot,I.nextScheduledRoot=e,d.nextScheduledRoot=null;else if(d===I){I=c;I.nextScheduledRoot=ba;d.nextScheduledRoot=null;break}else c.nextScheduledRoot=d.nextScheduledRoot,d.nextScheduledRoot=
-null;d=c.nextScheduledRoot}else{e>a&&(a=e,b=d);if(d===I)break;if(1073741823===a)break;c=d;d=d.nextScheduledRoot}}ca=b;C=a}function Nc(){return Tc?!0:Gi()?Tc=!0:!1}function Di(){try{if(!Nc()&&null!==ba){Ub();var a=ba;do{var b=a.expirationTime;0!==b&&aa<=b&&(a.nextExpirationTimeToWorkOn=aa);a=a.nextScheduledRoot}while(a!==ba)}Z(0,!0)}finally{Tc=!1}}function Z(a,b){Qc();if(b)for(Ub(),jb=aa;null!==ca&&0!==C&&a<=C&&!(Tc&&aa>C);)Sc(ca,C,aa>C),Qc(),Ub(),jb=aa;else for(;null!==ca&&0!==C&&a<=C;)Sc(ca,C,!1),
-Qc();b&&(Oc=0,Pc=null);0!==C&&Ug(ca,C);Tb=0;we=null;if(null!==kb)for(a=kb,kb=null,b=0;b<a.length;b++){var c=a[b];try{c._onComplete()}catch(d){lb||(lb=!0,Uc=d)}}if(lb)throw a=Uc,Uc=null,lb=!1,a;}function Xg(a,b){w?n("253"):void 0;ca=a;C=b;Sc(a,b,!1);Z(1073741823,!1)}function Sc(a,b,c){w?n("245"):void 0;w=!0;if(c){var d=a.finishedWork;null!==d?Vc(a,d,b):(a.finishedWork=null,d=a.timeoutHandle,-1!==d&&(a.timeoutHandle=-1,Yg(d)),Rg(a,c),d=a.finishedWork,null!==d&&(Nc()?a.finishedWork=d:Vc(a,d,b)))}else d=
-a.finishedWork,null!==d?Vc(a,d,b):(a.finishedWork=null,d=a.timeoutHandle,-1!==d&&(a.timeoutHandle=-1,Yg(d)),Rg(a,c),d=a.finishedWork,null!==d&&Vc(a,d,b));w=!1}function Vc(a,b,c){var d=a.firstBatch;if(null!==d&&d._expirationTime>=c&&(null===kb?kb=[d]:kb.push(d),d._defer)){a.finishedWork=b;a.expirationTime=0;return}a.finishedWork=null;a===we?Tb++:(we=a,Tb=0);Mc(se,function(){ui(a,b)})}function ie(a){null===ca?n("246"):void 0;ca.expirationTime=0;lb||(lb=!0,Uc=a)}function Zg(a,b){var c=z;z=!0;try{return a(b)}finally{(z=
-c)||w||Z(1073741823,!1)}}function $g(a,b){if(z&&!Rc){Rc=!0;try{return a(b)}finally{Rc=!1}}return a(b)}function ah(a,b,c){z||w||0===oa||(Z(oa,!1),oa=0);var d=z;z=!0;try{return Mc(te,function(){return a(b,c)})}finally{(z=d)||w||Z(1073741823,!1)}}function bh(a,b,c,d,e){var f=b.current;a:if(c){c=c._reactInternalFiber;b:{2===wb(c)&&1===c.tag?void 0:n("170");var g=c;do{switch(g.tag){case 3:g=g.stateNode.context;break b;case 1:if(E(g.type)){g=g.stateNode.__reactInternalMemoizedMergedChildContext;break b}}g=
-g.return}while(null!==g);n("171");g=void 0}if(1===c.tag){var h=c.type;if(E(h)){c=Rf(c,h,g);break a}}c=g}else c=va;null===b.context?b.context=c:b.pendingContext=c;b=e;e=Aa(d);e.payload={element:a};b=void 0===b?null:b;null!==b&&(e.callback=b);eb();na(f,e);ya(f,d);return d}function xe(a,b,c,d){var e=b.current,f=ka();e=fb(f,e);return bh(a,b,c,e,d)}function ye(a){a=a.current;if(!a.child)return null;switch(a.child.tag){case 5:return a.child.stateNode;default:return a.child.stateNode}}function Hi(a,b,c){var d=
-3<arguments.length&&void 0!==arguments[3]?arguments[3]:null;return{$$typeof:Va,key:null==d?null:""+d,children:a,containerInfo:b,implementation:c}}function Vb(a){var b=1073741822-25*(((1073741822-ka()+500)/25|0)+1);b>=ze&&(b=ze-1);this._expirationTime=ze=b;this._root=a;this._callbacks=this._next=null;this._hasChildren=this._didComplete=!1;this._children=null;this._defer=!0}function mb(){this._callbacks=null;this._didCommit=!1;this._onCommit=this._onCommit.bind(this)}function nb(a,b,c){b=S(3,null,null,
-b?3:0);a={current:b,containerInfo:a,pendingChildren:null,pingCache:null,earliestPendingTime:0,latestPendingTime:0,earliestSuspendedTime:0,latestSuspendedTime:0,latestPingedTime:0,didError:!1,pendingCommitExpirationTime:0,finishedWork:null,timeoutHandle:-1,context:null,pendingContext:null,hydrate:c,nextExpirationTimeToWorkOn:0,expirationTime:0,firstBatch:null,nextScheduledRoot:null};this._internalRoot=b.stateNode=a}function ob(a){return!(!a||1!==a.nodeType&&9!==a.nodeType&&11!==a.nodeType&&(8!==a.nodeType||
-" react-mount-point-unstable "!==a.nodeValue))}function Ii(a,b){b||(b=a?9===a.nodeType?a.documentElement:a.firstChild:null,b=!(!b||1!==b.nodeType||!b.hasAttribute("data-reactroot")));if(!b)for(var c;c=a.lastChild;)a.removeChild(c);return new nb(a,!1,b)}function Wc(a,b,c,d,e){var f=c._reactRootContainer;if(f){if("function"===typeof e){var g=e;e=function(){var a=ye(f._internalRoot);g.call(a)}}null!=a?f.legacy_renderSubtreeIntoContainer(a,b,e):f.render(b,e)}else{f=c._reactRootContainer=Ii(c,d);if("function"===
-typeof e){var h=e;e=function(){var a=ye(f._internalRoot);h.call(a)}}$g(function(){null!=a?f.legacy_renderSubtreeIntoContainer(a,b,e):f.render(b,e)})}return ye(f._internalRoot)}function ch(a,b){var c=2<arguments.length&&void 0!==arguments[2]?arguments[2]:null;ob(b)?void 0:n("200");return Hi(a,b,null,c)}da?void 0:n("227");var sh=function(a,b,c,d,e,f,g,h,l){var k=Array.prototype.slice.call(arguments,3);try{b.apply(c,k)}catch(m){this.onError(m)}},qb=!1,$b=null,ac=!1,Yc=null,th={onError:function(a){qb=
-!0;$b=a}},bc=null,Na={},cc=[],Zc={},Oa={},$c={},bd=null,Ue=null,He=null,rb=null,vh=function(a){if(a){var b=a._dispatchListeners,c=a._dispatchInstances;if(Array.isArray(b))for(var d=0;d<b.length&&!a.isPropagationStopped();d++)Ge(a,b[d],c[d]);else b&&Ge(a,b,c);a._dispatchListeners=null;a._dispatchInstances=null;a.isPersistent()||a.constructor.release(a)}},Ae={injectEventPluginOrder:function(a){bc?n("101"):void 0;bc=Array.prototype.slice.call(a);Ee()},injectEventPluginsByName:function(a){var b=!1,c;
-for(c in a)if(a.hasOwnProperty(c)){var d=a[c];Na.hasOwnProperty(c)&&Na[c]===d||(Na[c]?n("102",c):void 0,Na[c]=d,b=!0)}b&&Ee()}},dh=Math.random().toString(36).slice(2),ea="__reactInternalInstance$"+dh,ec="__reactEventHandlers$"+dh,ra=!("undefined"===typeof window||!window.document||!window.document.createElement),Ra={animationend:fc("Animation","AnimationEnd"),animationiteration:fc("Animation","AnimationIteration"),animationstart:fc("Animation","AnimationStart"),transitionend:fc("Transition","TransitionEnd")},
-fd={},Le={};ra&&(Le=document.createElement("div").style,"AnimationEvent"in window||(delete Ra.animationend.animation,delete Ra.animationiteration.animation,delete Ra.animationstart.animation),"TransitionEvent"in window||delete Ra.transitionend.transition);var eh=gc("animationend"),fh=gc("animationiteration"),gh=gc("animationstart"),hh=gc("transitionend"),zb="abort canplay canplaythrough durationchange emptied encrypted ended error loadeddata loadedmetadata loadstart pause play playing progress ratechange seeked seeking stalled suspend timeupdate volumechange waiting".split(" "),
-qa=null,gd=null,hc=null,B=da.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.assign;B(J.prototype,{preventDefault:function(){this.defaultPrevented=!0;var a=this.nativeEvent;a&&(a.preventDefault?a.preventDefault():"unknown"!==typeof a.returnValue&&(a.returnValue=!1),this.isDefaultPrevented=ic)},stopPropagation:function(){var a=this.nativeEvent;a&&(a.stopPropagation?a.stopPropagation():"unknown"!==typeof a.cancelBubble&&(a.cancelBubble=!0),this.isPropagationStopped=ic)},persist:function(){this.isPersistent=
-ic},isPersistent:jc,destructor:function(){var a=this.constructor.Interface,b;for(b in a)this[b]=null;this.nativeEvent=this._targetInst=this.dispatchConfig=null;this.isPropagationStopped=this.isDefaultPrevented=jc;this._dispatchInstances=this._dispatchListeners=null}});J.Interface={type:null,target:null,currentTarget:function(){return null},eventPhase:null,bubbles:null,cancelable:null,timeStamp:function(a){return a.timeStamp||Date.now()},defaultPrevented:null,isTrusted:null};J.extend=function(a){function b(){return c.apply(this,
-arguments)}var c=this,d=function(){};d.prototype=c.prototype;d=new d;B(d,b.prototype);b.prototype=d;b.prototype.constructor=b;b.Interface=B({},c.Interface,a);b.extend=c.extend;Ne(b);return b};Ne(J);var Ji=J.extend({data:null}),Ki=J.extend({data:null}),Ah=[9,13,27,32],hd=ra&&"CompositionEvent"in window,Wb=null;ra&&"documentMode"in document&&(Wb=document.documentMode);var Li=ra&&"TextEvent"in window&&!Wb,Se=ra&&(!hd||Wb&&8<Wb&&11>=Wb),Re=String.fromCharCode(32),pa={beforeInput:{phasedRegistrationNames:{bubbled:"onBeforeInput",
-captured:"onBeforeInputCapture"},dependencies:["compositionend","keypress","textInput","paste"]},compositionEnd:{phasedRegistrationNames:{bubbled:"onCompositionEnd",captured:"onCompositionEndCapture"},dependencies:"blur compositionend keydown keypress keyup mousedown".split(" ")},compositionStart:{phasedRegistrationNames:{bubbled:"onCompositionStart",captured:"onCompositionStartCapture"},dependencies:"blur compositionstart keydown keypress keyup mousedown".split(" ")},compositionUpdate:{phasedRegistrationNames:{bubbled:"onCompositionUpdate",
-captured:"onCompositionUpdateCapture"},dependencies:"blur compositionupdate keydown keypress keyup mousedown".split(" ")}},Qe=!1,Sa=!1,Mi={eventTypes:pa,extractEvents:function(a,b,c,d){var e=void 0;var f=void 0;if(hd)b:{switch(a){case "compositionstart":e=pa.compositionStart;break b;case "compositionend":e=pa.compositionEnd;break b;case "compositionupdate":e=pa.compositionUpdate;break b}e=void 0}else Sa?Oe(a,c)&&(e=pa.compositionEnd):"keydown"===a&&229===c.keyCode&&(e=pa.compositionStart);e?(Se&&
-"ko"!==c.locale&&(Sa||e!==pa.compositionStart?e===pa.compositionEnd&&Sa&&(f=Me()):(qa=d,gd="value"in qa?qa.value:qa.textContent,Sa=!0)),e=Ji.getPooled(e,b,c,d),f?e.data=f:(f=Pe(c),null!==f&&(e.data=f)),Qa(e),f=e):f=null;(a=Li?Bh(a,c):Ch(a,c))?(b=Ki.getPooled(pa.beforeInput,b,c,d),b.data=a,Qa(b)):b=null;return null===f?b:null===b?f:[f,b]}},id=null,Ta=null,Ua=null,Ye=function(a,b){return a(b)},yf=function(a,b,c){return a(b,c)},Ze=function(){},jd=!1,Dh={color:!0,date:!0,datetime:!0,"datetime-local":!0,
-email:!0,month:!0,number:!0,password:!0,range:!0,search:!0,tel:!0,text:!0,time:!0,url:!0,week:!0},Ma=da.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;Ma.hasOwnProperty("ReactCurrentDispatcher")||(Ma.ReactCurrentDispatcher={current:null});var Fh=/^(.*)[\\\/]/,O="function"===typeof Symbol&&Symbol.for,Bc=O?Symbol.for("react.element"):60103,Va=O?Symbol.for("react.portal"):60106,ta=O?Symbol.for("react.fragment"):60107,md=O?Symbol.for("react.strict_mode"):60108,lc=O?Symbol.for("react.profiler"):60114,
-ff=O?Symbol.for("react.provider"):60109,ef=O?Symbol.for("react.context"):60110,ld=O?Symbol.for("react.concurrent_mode"):60111,od=O?Symbol.for("react.forward_ref"):60112,nd=O?Symbol.for("react.suspense"):60113,pd=O?Symbol.for("react.memo"):60115,gf=O?Symbol.for("react.lazy"):60116,df="function"===typeof Symbol&&Symbol.iterator,Hh=/^[:A-Z_a-z\u00C0-\u00D6\u00D8-\u00F6\u00F8-\u02FF\u0370-\u037D\u037F-\u1FFF\u200C-\u200D\u2070-\u218F\u2C00-\u2FEF\u3001-\uD7FF\uF900-\uFDCF\uFDF0-\uFFFD][:A-Z_a-z\u00C0-\u00D6\u00D8-\u00F6\u00F8-\u02FF\u0370-\u037D\u037F-\u1FFF\u200C-\u200D\u2070-\u218F\u2C00-\u2FEF\u3001-\uD7FF\uF900-\uFDCF\uFDF0-\uFFFD\-.0-9\u00B7\u0300-\u036F\u203F-\u2040]*$/,
-hf=Object.prototype.hasOwnProperty,kf={},jf={},A={};"children dangerouslySetInnerHTML defaultValue defaultChecked innerHTML suppressContentEditableWarning suppressHydrationWarning style".split(" ").forEach(function(a){A[a]=new K(a,0,!1,a,null)});[["acceptCharset","accept-charset"],["className","class"],["htmlFor","for"],["httpEquiv","http-equiv"]].forEach(function(a){var b=a[0];A[b]=new K(b,1,!1,a[1],null)});["contentEditable","draggable","spellCheck","value"].forEach(function(a){A[a]=new K(a,2,!1,
-a.toLowerCase(),null)});["autoReverse","externalResourcesRequired","focusable","preserveAlpha"].forEach(function(a){A[a]=new K(a,2,!1,a,null)});"allowFullScreen async autoFocus autoPlay controls default defer disabled formNoValidate hidden loop noModule noValidate open playsInline readOnly required reversed scoped seamless itemScope".split(" ").forEach(function(a){A[a]=new K(a,3,!1,a.toLowerCase(),null)});["checked","multiple","muted","selected"].forEach(function(a){A[a]=new K(a,3,!0,a,null)});["capture",
-"download"].forEach(function(a){A[a]=new K(a,4,!1,a,null)});["cols","rows","size","span"].forEach(function(a){A[a]=new K(a,6,!1,a,null)});["rowSpan","start"].forEach(function(a){A[a]=new K(a,5,!1,a.toLowerCase(),null)});var Be=/[\-:]([a-z])/g,Ce=function(a){return a[1].toUpperCase()};"accent-height alignment-baseline arabic-form baseline-shift cap-height clip-path clip-rule color-interpolation color-interpolation-filters color-profile color-rendering dominant-baseline enable-background fill-opacity fill-rule flood-color flood-opacity font-family font-size font-size-adjust font-stretch font-style font-variant font-weight glyph-name glyph-orientation-horizontal glyph-orientation-vertical horiz-adv-x horiz-origin-x image-rendering letter-spacing lighting-color marker-end marker-mid marker-start overline-position overline-thickness paint-order panose-1 pointer-events rendering-intent shape-rendering stop-color stop-opacity strikethrough-position strikethrough-thickness stroke-dasharray stroke-dashoffset stroke-linecap stroke-linejoin stroke-miterlimit stroke-opacity stroke-width text-anchor text-decoration text-rendering underline-position underline-thickness unicode-bidi unicode-range units-per-em v-alphabetic v-hanging v-ideographic v-mathematical vector-effect vert-adv-y vert-origin-x vert-origin-y word-spacing writing-mode xmlns:xlink x-height".split(" ").forEach(function(a){var b=
-a.replace(Be,Ce);A[b]=new K(b,1,!1,a,null)});"xlink:actuate xlink:arcrole xlink:href xlink:role xlink:show xlink:title xlink:type".split(" ").forEach(function(a){var b=a.replace(Be,Ce);A[b]=new K(b,1,!1,a,"http://www.w3.org/1999/xlink")});["xml:base","xml:lang","xml:space"].forEach(function(a){var b=a.replace(Be,Ce);A[b]=new K(b,1,!1,a,"http://www.w3.org/XML/1998/namespace")});["tabIndex","crossOrigin"].forEach(function(a){A[a]=new K(a,1,!1,a.toLowerCase(),null)});var pf={change:{phasedRegistrationNames:{bubbled:"onChange",
-captured:"onChangeCapture"},dependencies:"blur change click focus input keydown keyup selectionchange".split(" ")}},tb=null,ub=null,De=!1;ra&&(De=af("input")&&(!document.documentMode||9<document.documentMode));var Ni={eventTypes:pf,_isInputEventSupported:De,extractEvents:function(a,b,c,d){var e=b?Da(b):window,f=void 0,g=void 0,h=e.nodeName&&e.nodeName.toLowerCase();"select"===h||"input"===h&&"file"===e.type?f=Lh:$e(e)?De?f=Ph:(f=Nh,g=Mh):(h=e.nodeName)&&"input"===h.toLowerCase()&&("checkbox"===e.type||
-"radio"===e.type)&&(f=Oh);if(f&&(f=f(a,b)))return of(f,c,d);g&&g(a,e,b);"blur"===a&&(a=e._wrapperState)&&a.controlled&&"number"===e.type&&ud(e,"number",e.value)}},Xb=J.extend({view:null,detail:null}),Rh={Alt:"altKey",Control:"ctrlKey",Meta:"metaKey",Shift:"shiftKey"},ih=0,jh=0,kh=!1,lh=!1,Yb=Xb.extend({screenX:null,screenY:null,clientX:null,clientY:null,pageX:null,pageY:null,ctrlKey:null,shiftKey:null,altKey:null,metaKey:null,getModifierState:vd,button:null,buttons:null,relatedTarget:function(a){return a.relatedTarget||
-(a.fromElement===a.srcElement?a.toElement:a.fromElement)},movementX:function(a){if("movementX"in a)return a.movementX;var b=ih;ih=a.screenX;return kh?"mousemove"===a.type?a.screenX-b:0:(kh=!0,0)},movementY:function(a){if("movementY"in a)return a.movementY;var b=jh;jh=a.screenY;return lh?"mousemove"===a.type?a.screenY-b:0:(lh=!0,0)}}),mh=Yb.extend({pointerId:null,width:null,height:null,pressure:null,tangentialPressure:null,tiltX:null,tiltY:null,twist:null,pointerType:null,isPrimary:null}),Zb={mouseEnter:{registrationName:"onMouseEnter",
-dependencies:["mouseout","mouseover"]},mouseLeave:{registrationName:"onMouseLeave",dependencies:["mouseout","mouseover"]},pointerEnter:{registrationName:"onPointerEnter",dependencies:["pointerout","pointerover"]},pointerLeave:{registrationName:"onPointerLeave",dependencies:["pointerout","pointerover"]}},Oi={eventTypes:Zb,extractEvents:function(a,b,c,d){var e="mouseover"===a||"pointerover"===a,f="mouseout"===a||"pointerout"===a;if(e&&(c.relatedTarget||c.fromElement)||!f&&!e)return null;e=d.window===
-d?d:(e=d.ownerDocument)?e.defaultView||e.parentWindow:window;f?(f=b,b=(b=c.relatedTarget||c.toElement)?dc(b):null):f=null;if(f===b)return null;var g=void 0,h=void 0,l=void 0,k=void 0;if("mouseout"===a||"mouseover"===a)g=Yb,h=Zb.mouseLeave,l=Zb.mouseEnter,k="mouse";else if("pointerout"===a||"pointerover"===a)g=mh,h=Zb.pointerLeave,l=Zb.pointerEnter,k="pointer";var m=null==f?e:Da(f);e=null==b?e:Da(b);a=g.getPooled(h,f,c,d);a.type=k+"leave";a.target=m;a.relatedTarget=e;c=g.getPooled(l,b,c,d);c.type=
-k+"enter";c.target=e;c.relatedTarget=m;d=b;if(f&&d)a:{b=f;e=d;k=0;for(g=b;g;g=fa(g))k++;g=0;for(l=e;l;l=fa(l))g++;for(;0<k-g;)b=fa(b),k--;for(;0<g-k;)e=fa(e),g--;for(;k--;){if(b===e||b===e.alternate)break a;b=fa(b);e=fa(e)}b=null}else b=null;e=b;for(b=[];f&&f!==e;){k=f.alternate;if(null!==k&&k===e)break;b.push(f);f=fa(f)}for(f=[];d&&d!==e;){k=d.alternate;if(null!==k&&k===e)break;f.push(d);d=fa(d)}for(d=0;d<b.length;d++)ed(b[d],"bubbled",a);for(d=f.length;0<d--;)ed(f[d],"captured",c);return[a,c]}},
-Sh=Object.prototype.hasOwnProperty,Pi=J.extend({animationName:null,elapsedTime:null,pseudoElement:null}),Qi=J.extend({clipboardData:function(a){return"clipboardData"in a?a.clipboardData:window.clipboardData}}),Ri=Xb.extend({relatedTarget:null}),Si={Esc:"Escape",Spacebar:" ",Left:"ArrowLeft",Up:"ArrowUp",Right:"ArrowRight",Down:"ArrowDown",Del:"Delete",Win:"OS",Menu:"ContextMenu",Apps:"ContextMenu",Scroll:"ScrollLock",MozPrintableKey:"Unidentified"},Ti={8:"Backspace",9:"Tab",12:"Clear",13:"Enter",
-16:"Shift",17:"Control",18:"Alt",19:"Pause",20:"CapsLock",27:"Escape",32:" ",33:"PageUp",34:"PageDown",35:"End",36:"Home",37:"ArrowLeft",38:"ArrowUp",39:"ArrowRight",40:"ArrowDown",45:"Insert",46:"Delete",112:"F1",113:"F2",114:"F3",115:"F4",116:"F5",117:"F6",118:"F7",119:"F8",120:"F9",121:"F10",122:"F11",123:"F12",144:"NumLock",145:"ScrollLock",224:"Meta"},Ui=Xb.extend({key:function(a){if(a.key){var b=Si[a.key]||a.key;if("Unidentified"!==b)return b}return"keypress"===a.type?(a=nc(a),13===a?"Enter":
-String.fromCharCode(a)):"keydown"===a.type||"keyup"===a.type?Ti[a.keyCode]||"Unidentified":""},location:null,ctrlKey:null,shiftKey:null,altKey:null,metaKey:null,repeat:null,locale:null,getModifierState:vd,charCode:function(a){return"keypress"===a.type?nc(a):0},keyCode:function(a){return"keydown"===a.type||"keyup"===a.type?a.keyCode:0},which:function(a){return"keypress"===a.type?nc(a):"keydown"===a.type||"keyup"===a.type?a.keyCode:0}}),Vi=Yb.extend({dataTransfer:null}),Wi=Xb.extend({touches:null,targetTouches:null,
-changedTouches:null,altKey:null,metaKey:null,ctrlKey:null,shiftKey:null,getModifierState:vd}),Xi=J.extend({propertyName:null,elapsedTime:null,pseudoElement:null}),Yi=Yb.extend({deltaX:function(a){return"deltaX"in a?a.deltaX:"wheelDeltaX"in a?-a.wheelDeltaX:0},deltaY:function(a){return"deltaY"in a?a.deltaY:"wheelDeltaY"in a?-a.wheelDeltaY:"wheelDelta"in a?-a.wheelDelta:0},deltaZ:null,deltaMode:null}),Zi=[["abort","abort"],[eh,"animationEnd"],[fh,"animationIteration"],[gh,"animationStart"],["canplay",
-"canPlay"],["canplaythrough","canPlayThrough"],["drag","drag"],["dragenter","dragEnter"],["dragexit","dragExit"],["dragleave","dragLeave"],["dragover","dragOver"],["durationchange","durationChange"],["emptied","emptied"],["encrypted","encrypted"],["ended","ended"],["error","error"],["gotpointercapture","gotPointerCapture"],["load","load"],["loadeddata","loadedData"],["loadedmetadata","loadedMetadata"],["loadstart","loadStart"],["lostpointercapture","lostPointerCapture"],["mousemove","mouseMove"],
-["mouseout","mouseOut"],["mouseover","mouseOver"],["playing","playing"],["pointermove","pointerMove"],["pointerout","pointerOut"],["pointerover","pointerOver"],["progress","progress"],["scroll","scroll"],["seeking","seeking"],["stalled","stalled"],["suspend","suspend"],["timeupdate","timeUpdate"],["toggle","toggle"],["touchmove","touchMove"],[hh,"transitionEnd"],["waiting","waiting"],["wheel","wheel"]],vf={},wd={};[["blur","blur"],["cancel","cancel"],["click","click"],["close","close"],["contextmenu",
-"contextMenu"],["copy","copy"],["cut","cut"],["auxclick","auxClick"],["dblclick","doubleClick"],["dragend","dragEnd"],["dragstart","dragStart"],["drop","drop"],["focus","focus"],["input","input"],["invalid","invalid"],["keydown","keyDown"],["keypress","keyPress"],["keyup","keyUp"],["mousedown","mouseDown"],["mouseup","mouseUp"],["paste","paste"],["pause","pause"],["play","play"],["pointercancel","pointerCancel"],["pointerdown","pointerDown"],["pointerup","pointerUp"],["ratechange","rateChange"],["reset",
-"reset"],["seeked","seeked"],["submit","submit"],["touchcancel","touchCancel"],["touchend","touchEnd"],["touchstart","touchStart"],["volumechange","volumeChange"]].forEach(function(a){uf(a,!0)});Zi.forEach(function(a){uf(a,!1)});var nh={eventTypes:vf,isInteractiveTopLevelEventType:function(a){a=wd[a];return void 0!==a&&!0===a.isInteractive},extractEvents:function(a,b,c,d){var e=wd[a];if(!e)return null;switch(a){case "keypress":if(0===nc(c))return null;case "keydown":case "keyup":a=Ui;break;case "blur":case "focus":a=
-Ri;break;case "click":if(2===c.button)return null;case "auxclick":case "dblclick":case "mousedown":case "mousemove":case "mouseup":case "mouseout":case "mouseover":case "contextmenu":a=Yb;break;case "drag":case "dragend":case "dragenter":case "dragexit":case "dragleave":case "dragover":case "dragstart":case "drop":a=Vi;break;case "touchcancel":case "touchend":case "touchmove":case "touchstart":a=Wi;break;case eh:case fh:case gh:a=Pi;break;case hh:a=Xi;break;case "scroll":a=Xb;break;case "wheel":a=
-Yi;break;case "copy":case "cut":case "paste":a=Qi;break;case "gotpointercapture":case "lostpointercapture":case "pointercancel":case "pointerdown":case "pointermove":case "pointerout":case "pointerover":case "pointerup":a=mh;break;default:a=J}b=a.getPooled(e,b,c,d);Qa(b);return b}},wf=nh.isInteractiveTopLevelEventType,rc=[],qc=!0,Af={},Vh=0,sc="_reactListenersID"+(""+Math.random()).slice(2),$i=ra&&"documentMode"in document&&11>=document.documentMode,Hf={select:{phasedRegistrationNames:{bubbled:"onSelect",
-captured:"onSelectCapture"},dependencies:"blur contextmenu dragend focus keydown keyup mousedown mouseup selectionchange".split(" ")}},Wa=null,Ad=null,xb=null,zd=!1,aj={eventTypes:Hf,extractEvents:function(a,b,c,d){var e=d.window===d?d.document:9===d.nodeType?d:d.ownerDocument,f;if(!(f=!e)){a:{e=zf(e);f=$c.onSelect;for(var g=0;g<f.length;g++){var h=f[g];if(!e.hasOwnProperty(h)||!e[h]){e=!1;break a}}e=!0}f=!e}if(f)return null;e=b?Da(b):window;switch(a){case "focus":if($e(e)||"true"===e.contentEditable)Wa=
-e,Ad=b,xb=null;break;case "blur":xb=Ad=Wa=null;break;case "mousedown":zd=!0;break;case "contextmenu":case "mouseup":case "dragend":return zd=!1,Gf(c,d);case "selectionchange":if($i)break;case "keydown":case "keyup":return Gf(c,d)}return null}};Ae.injectEventPluginOrder("ResponderEventPlugin SimpleEventPlugin EnterLeaveEventPlugin ChangeEventPlugin SelectEventPlugin BeforeInputEventPlugin".split(" "));(function(a,b,c){bd=a;Ue=b;He=c})(dd,Je,Da);Ae.injectEventPluginsByName({SimpleEventPlugin:nh,EnterLeaveEventPlugin:Oi,
-ChangeEventPlugin:Ni,SelectEventPlugin:aj,BeforeInputEventPlugin:Mi});var Xc=void 0,Of=function(a){return"undefined"!==typeof MSApp&&MSApp.execUnsafeLocalFunction?function(b,c,d,e){MSApp.execUnsafeLocalFunction(function(){return a(b,c,d,e)})}:a}(function(a,b){if("http://www.w3.org/2000/svg"!==a.namespaceURI||"innerHTML"in a)a.innerHTML=b;else{Xc=Xc||document.createElement("div");Xc.innerHTML="<svg>"+b+"</svg>";for(b=Xc.firstChild;a.firstChild;)a.removeChild(a.firstChild);for(;b.firstChild;)a.appendChild(b.firstChild)}}),
-Ab=function(a,b){if(b){var c=a.firstChild;if(c&&c===a.lastChild&&3===c.nodeType){c.nodeValue=b;return}}a.textContent=b},yb={animationIterationCount:!0,borderImageOutset:!0,borderImageSlice:!0,borderImageWidth:!0,boxFlex:!0,boxFlexGroup:!0,boxOrdinalGroup:!0,columnCount:!0,columns:!0,flex:!0,flexGrow:!0,flexPositive:!0,flexShrink:!0,flexNegative:!0,flexOrder:!0,gridArea:!0,gridRow:!0,gridRowEnd:!0,gridRowSpan:!0,gridRowStart:!0,gridColumn:!0,gridColumnEnd:!0,gridColumnSpan:!0,gridColumnStart:!0,fontWeight:!0,
-lineClamp:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,tabSize:!0,widows:!0,zIndex:!0,zoom:!0,fillOpacity:!0,floodOpacity:!0,stopOpacity:!0,strokeDasharray:!0,strokeDashoffset:!0,strokeMiterlimit:!0,strokeOpacity:!0,strokeWidth:!0},bj=["Webkit","ms","Moz","O"];Object.keys(yb).forEach(function(a){bj.forEach(function(b){b=b+a.charAt(0).toUpperCase()+a.substring(1);yb[b]=yb[a]})});var Zh=B({menuitem:!0},{area:!0,base:!0,br:!0,col:!0,embed:!0,hr:!0,img:!0,input:!0,keygen:!0,link:!0,meta:!0,param:!0,
-source:!0,track:!0,wbr:!0}),R=da.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.Scheduler,Vg=R.unstable_cancelCallback,ue=R.unstable_now,Wg=R.unstable_scheduleCallback,Gi=R.unstable_shouldYield,Mc=R.unstable_runWithPriority,zi=R.unstable_getCurrentPriorityLevel,se=R.unstable_ImmediatePriority,te=R.unstable_UserBlockingPriority,Lg=R.unstable_NormalPriority,Ai=R.unstable_LowPriority,Bi=R.unstable_IdlePriority,ne=null,oe=null,Ei="function"===typeof setTimeout?setTimeout:void 0,Yg="function"===typeof clearTimeout?
-clearTimeout:void 0,vi=Wg,ti=Vg;new Set;var Id=[],Ya=-1,va={},F={current:va},M={current:!1},Fa=va,Kd=null,Ld=null,S=function(a,b,c,d){return new bi(a,b,c,d)},$f=(new da.Component).refs,zc={isMounted:function(a){return(a=a._reactInternalFiber)?2===wb(a):!1},enqueueSetState:function(a,b,c){a=a._reactInternalFiber;var d=ka();d=fb(d,a);var e=Aa(d);e.payload=b;void 0!==c&&null!==c&&(e.callback=c);eb();na(a,e);ya(a,d)},enqueueReplaceState:function(a,b,c){a=a._reactInternalFiber;var d=ka();d=fb(d,a);var e=
-Aa(d);e.tag=yg;e.payload=b;void 0!==c&&null!==c&&(e.callback=c);eb();na(a,e);ya(a,d)},enqueueForceUpdate:function(a,b){a=a._reactInternalFiber;var c=ka();c=fb(c,a);var d=Aa(c);d.tag=Ec;void 0!==b&&null!==b&&(d.callback=b);eb();na(a,d);ya(a,c)}},Cc=Array.isArray,hb=ag(!0),ae=ag(!1),Eb={},U={current:Eb},Gb={current:Eb},Fb={current:Eb},db=0,pi=2,Rb=4,ji=8,ri=16,Sb=32,me=64,le=128,Dc=Ma.ReactCurrentDispatcher,Hb=0,xa=null,y=null,W=null,bb=null,G=null,ab=null,Kb=0,X=null,Lb=0,Ib=!1,ia=null,Jb=0,Ud={readContext:T,
-useCallback:V,useContext:V,useEffect:V,useImperativeHandle:V,useLayoutEffect:V,useMemo:V,useReducer:V,useRef:V,useState:V,useDebugValue:V},fi={readContext:T,useCallback:function(a,b){cb().memoizedState=[a,void 0===b?null:b];return a},useContext:T,useEffect:function(a,b){return Xd(516,le|me,a,b)},useImperativeHandle:function(a,b,c){c=null!==c&&void 0!==c?c.concat([a]):null;return Xd(4,Rb|Sb,fg.bind(null,b,a),c)},useLayoutEffect:function(a,b){return Xd(4,Rb|Sb,a,b)},useMemo:function(a,b){var c=cb();
-b=void 0===b?null:b;a=a();c.memoizedState=[a,b];return a},useReducer:function(a,b,c){var d=cb();b=void 0!==c?c(b):b;d.memoizedState=d.baseState=b;a=d.queue={last:null,dispatch:null,lastRenderedReducer:a,lastRenderedState:b};a=a.dispatch=hg.bind(null,xa,a);return[d.memoizedState,a]},useRef:function(a){var b=cb();a={current:a};return b.memoizedState=a},useState:function(a){var b=cb();"function"===typeof a&&(a=a());b.memoizedState=b.baseState=a;a=b.queue={last:null,dispatch:null,lastRenderedReducer:dg,
-lastRenderedState:a};a=a.dispatch=hg.bind(null,xa,a);return[b.memoizedState,a]},useDebugValue:gg},cg={readContext:T,useCallback:function(a,b){var c=Mb();b=void 0===b?null:b;var d=c.memoizedState;if(null!==d&&null!==b&&Sd(b,d[1]))return d[0];c.memoizedState=[a,b];return a},useContext:T,useEffect:function(a,b){return Yd(516,le|me,a,b)},useImperativeHandle:function(a,b,c){c=null!==c&&void 0!==c?c.concat([a]):null;return Yd(4,Rb|Sb,fg.bind(null,b,a),c)},useLayoutEffect:function(a,b){return Yd(4,Rb|Sb,
-a,b)},useMemo:function(a,b){var c=Mb();b=void 0===b?null:b;var d=c.memoizedState;if(null!==d&&null!==b&&Sd(b,d[1]))return d[0];a=a();c.memoizedState=[a,b];return a},useReducer:eg,useRef:function(a){return Mb().memoizedState},useState:function(a){return eg(dg,a)},useDebugValue:gg},la=null,gb=null,Ia=!1,gi=Ma.ReactCurrentOwner,ja=!1,de={current:null},Nb=null,Ja=null,Ob=null,ug=0,yg=1,Ec=2,ge=3,za=!1,Og=void 0,pe=void 0,Ng=void 0,Pg=void 0;Og=function(a,b,c,d){for(c=b.child;null!==c;){if(5===c.tag||
-6===c.tag)a.appendChild(c.stateNode);else if(4!==c.tag&&null!==c.child){c.child.return=c;c=c.child;continue}if(c===b)break;for(;null===c.sibling;){if(null===c.return||c.return===b)return;c=c.return}c.sibling.return=c.return;c=c.sibling}};pe=function(a){};Ng=function(a,b,c,d,e){var f=a.memoizedProps;if(f!==d){var g=b.stateNode;Ha(U.current);a=null;switch(c){case "input":f=sd(g,f);d=sd(g,d);a=[];break;case "option":f=Bd(g,f);d=Bd(g,d);a=[];break;case "select":f=B({},f,{value:void 0});d=B({},d,{value:void 0});
-a=[];break;case "textarea":f=Cd(g,f);d=Cd(g,d);a=[];break;default:"function"!==typeof f.onClick&&"function"===typeof d.onClick&&(g.onclick=tc)}Ed(c,d);g=c=void 0;var h=null;for(c in f)if(!d.hasOwnProperty(c)&&f.hasOwnProperty(c)&&null!=f[c])if("style"===c){var l=f[c];for(g in l)l.hasOwnProperty(g)&&(h||(h={}),h[g]="")}else"dangerouslySetInnerHTML"!==c&&"children"!==c&&"suppressContentEditableWarning"!==c&&"suppressHydrationWarning"!==c&&"autoFocus"!==c&&(Oa.hasOwnProperty(c)?a||(a=[]):(a=a||[]).push(c,
-null));for(c in d){var k=d[c];l=null!=f?f[c]:void 0;if(d.hasOwnProperty(c)&&k!==l&&(null!=k||null!=l))if("style"===c)if(l){for(g in l)!l.hasOwnProperty(g)||k&&k.hasOwnProperty(g)||(h||(h={}),h[g]="");for(g in k)k.hasOwnProperty(g)&&l[g]!==k[g]&&(h||(h={}),h[g]=k[g])}else h||(a||(a=[]),a.push(c,h)),h=k;else"dangerouslySetInnerHTML"===c?(k=k?k.__html:void 0,l=l?l.__html:void 0,null!=k&&l!==k&&(a=a||[]).push(c,""+k)):"children"===c?l===k||"string"!==typeof k&&"number"!==typeof k||(a=a||[]).push(c,""+
-k):"suppressContentEditableWarning"!==c&&"suppressHydrationWarning"!==c&&(Oa.hasOwnProperty(c)?(null!=k&&ha(e,c),a||l===k||(a=[])):(a=a||[]).push(c,k))}h&&(a=a||[]).push("style",h);e=a;(b.updateQueue=e)&&Pb(b)}};Pg=function(a,b,c,d){c!==d&&Pb(b)};var ki="function"===typeof WeakSet?WeakSet:Set,xi="function"===typeof WeakMap?WeakMap:Map,qe=Ma.ReactCurrentDispatcher,Kg=Ma.ReactCurrentOwner,ze=1073741822,Ca=!1,x=null,Y=null,H=0,La=-1,je=!1,p=null,Lc=!1,ke=null,Jc=null,Ic=null,Ba=null,ba=null,I=null,Oc=
-0,Pc=void 0,w=!1,ca=null,C=0,oa=0,lb=!1,Uc=null,z=!1,Rc=!1,kb=null,ve=ue(),aa=1073741822-(ve/10|0),jb=aa,Ci=50,Tb=0,we=null,Tc=!1;id=function(a,b,c){switch(b){case "input":td(a,c);b=c.name;if("radio"===c.type&&null!=b){for(c=a;c.parentNode;)c=c.parentNode;c=c.querySelectorAll("input[name="+JSON.stringify(""+b)+'][type="radio"]');for(b=0;b<c.length;b++){var d=c[b];if(d!==a&&d.form===a.form){var e=dd(d);e?void 0:n("90");cf(d);td(d,e)}}}break;case "textarea":Jf(a,c);break;case "select":b=c.value,null!=
-b&&Xa(a,!!c.multiple,b,!1)}};Vb.prototype.render=function(a){this._defer?void 0:n("250");this._hasChildren=!0;this._children=a;var b=this._root._internalRoot,c=this._expirationTime,d=new mb;bh(a,b,null,c,d._onCommit);return d};Vb.prototype.then=function(a){if(this._didComplete)a();else{var b=this._callbacks;null===b&&(b=this._callbacks=[]);b.push(a)}};Vb.prototype.commit=function(){var a=this._root._internalRoot,b=a.firstBatch;this._defer&&null!==b?void 0:n("251");if(this._hasChildren){var c=this._expirationTime;
-if(b!==this){this._hasChildren&&(c=this._expirationTime=b._expirationTime,this.render(this._children));for(var d=null,e=b;e!==this;)d=e,e=e._next;null===d?n("251"):void 0;d._next=e._next;this._next=b;a.firstBatch=this}this._defer=!1;Xg(a,c);b=this._next;this._next=null;b=a.firstBatch=b;null!==b&&b._hasChildren&&b.render(b._children)}else this._next=null,this._defer=!1};Vb.prototype._onComplete=function(){if(!this._didComplete){this._didComplete=!0;var a=this._callbacks;if(null!==a)for(var b=0;b<a.length;b++)(0,a[b])()}};
-mb.prototype.then=function(a){if(this._didCommit)a();else{var b=this._callbacks;null===b&&(b=this._callbacks=[]);b.push(a)}};mb.prototype._onCommit=function(){if(!this._didCommit){this._didCommit=!0;var a=this._callbacks;if(null!==a)for(var b=0;b<a.length;b++){var c=a[b];"function"!==typeof c?n("191",c):void 0;c()}}};nb.prototype.render=function(a,b){var c=this._internalRoot,d=new mb;b=void 0===b?null:b;null!==b&&d.then(b);xe(a,c,null,d._onCommit);return d};nb.prototype.unmount=function(a){var b=
-this._internalRoot,c=new mb;a=void 0===a?null:a;null!==a&&c.then(a);xe(null,b,null,c._onCommit);return c};nb.prototype.legacy_renderSubtreeIntoContainer=function(a,b,c){var d=this._internalRoot,e=new mb;c=void 0===c?null:c;null!==c&&e.then(c);xe(b,d,a,e._onCommit);return e};nb.prototype.createBatch=function(){var a=new Vb(this),b=a._expirationTime,c=this._internalRoot,d=c.firstBatch;if(null===d)c.firstBatch=a,a._next=null;else{for(c=null;null!==d&&d._expirationTime>=b;)c=d,d=d._next;a._next=d;null!==
-c&&(c._next=a)}return a};(function(a,b,c){Ye=a;yf=b;Ze=c})(Zg,ah,function(){w||0===oa||(Z(oa,!1),oa=0)});var oh={createPortal:ch,findDOMNode:function(a){if(null==a)return null;if(1===a.nodeType)return a;var b=a._reactInternalFiber;void 0===b&&("function"===typeof a.render?n("188"):n("268",Object.keys(a)));a=tf(b);a=null===a?null:a.stateNode;return a},hydrate:function(a,b,c){ob(b)?void 0:n("200");return Wc(null,a,b,!0,c)},render:function(a,b,c){ob(b)?void 0:n("200");return Wc(null,a,b,!1,c)},unstable_renderSubtreeIntoContainer:function(a,
-b,c,d){ob(c)?void 0:n("200");null==a||void 0===a._reactInternalFiber?n("38"):void 0;return Wc(a,b,c,!1,d)},unmountComponentAtNode:function(a){ob(a)?void 0:n("40");return a._reactRootContainer?($g(function(){Wc(null,null,a,!1,function(){a._reactRootContainer=null})}),!0):!1},unstable_createPortal:function(){return ch.apply(void 0,arguments)},unstable_batchedUpdates:Zg,unstable_interactiveUpdates:ah,flushSync:function(a,b){w?n("187"):void 0;var c=z;z=!0;try{return Tg(a,b)}finally{z=c,Z(1073741823,!1)}},
-unstable_createRoot:function(a,b){ob(a)?void 0:n("299","unstable_createRoot");return new nb(a,!0,null!=b&&!0===b.hydrate)},unstable_flushControlled:function(a){var b=z;z=!0;try{Tg(a)}finally{(z=b)||w||Z(1073741823,!1)}},__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:{Events:[Je,Da,dd,Ae.injectEventPluginsByName,Zc,Qa,function(a){ad(a,xh)},Ve,We,oc,cd]}};(function(a){var b=a.findFiberByHostInstance;return ai(B({},a,{overrideProps:null,currentDispatcherRef:Ma.ReactCurrentDispatcher,findHostInstanceByFiber:function(a){a=
-tf(a);return null===a?null:a.stateNode},findFiberByHostInstance:function(a){return b?b(a):null}}))})({findFiberByHostInstance:dc,bundleType:0,version:"16.8.6",rendererPackageName:"react-dom"});var ph={default:oh},qh=ph&&oh||ph;return qh.default||qh});

extras/benchmarks/react/react.production.min.js

@@ -1,33 +0,0 @@
-/** @license React v16.8.6
- * react.production.min.js
- *
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-'use strict';(function(N,q){"object"===typeof exports&&"undefined"!==typeof module?module.exports=q():"function"===typeof define&&define.amd?define(q):N.React=q()})(this,function(){function N(a,b,d,g,p,c,e,h){if(!a){a=void 0;if(void 0===b)a=Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var n=[d,g,p,c,e,h],f=0;a=Error(b.replace(/%s/g,function(){return n[f++]}));a.name="Invariant Violation"}a.framesToPop=1;
-throw a;}}function q(a){for(var b=arguments.length-1,d="https://reactjs.org/docs/error-decoder.html?invariant="+a,g=0;g<b;g++)d+="&args[]="+encodeURIComponent(arguments[g+1]);N(!1,"Minified React error #"+a+"; visit %s for the full message or use the non-minified dev environment for full errors and additional helpful warnings. ",d)}function t(a,b,d){this.props=a;this.context=b;this.refs=ba;this.updater=d||ca}function da(){}function O(a,b,d){this.props=a;this.context=b;this.refs=ba;this.updater=d||
-ca}function u(){if(!x){var a=c.expirationTime;C?P():C=!0;D(ta,a)}}function Q(){var a=c,b=c.next;if(c===b)c=null;else{var d=c.previous;c=d.next=b;b.previous=d}a.next=a.previous=null;d=a.callback;b=a.expirationTime;a=a.priorityLevel;var g=f,p=E;f=a;E=b;try{var n=d()}finally{f=g,E=p}if("function"===typeof n)if(n={callback:n,priorityLevel:a,expirationTime:b,next:null,previous:null},null===c)c=n.next=n.previous=n;else{d=null;a=c;do{if(a.expirationTime>=b){d=a;break}a=a.next}while(a!==c);null===d?d=c:d===
-c&&(c=n,u());b=d.previous;b.next=d.previous=n;n.next=d;n.previous=b}}function F(){if(-1===k&&null!==c&&1===c.priorityLevel){x=!0;try{do Q();while(null!==c&&1===c.priorityLevel)}finally{x=!1,null!==c?u():C=!1}}}function ta(a){x=!0;var b=G;G=a;try{if(a)for(;null!==c;){var d=l();if(c.expirationTime<=d){do Q();while(null!==c&&c.expirationTime<=d)}else break}else if(null!==c){do Q();while(null!==c&&!H())}}finally{x=!1,G=b,null!==c?u():C=!1,F()}}function ea(a,b,d){var g=void 0,p={},c=null,e=null;if(null!=
-b)for(g in void 0!==b.ref&&(e=b.ref),void 0!==b.key&&(c=""+b.key),b)fa.call(b,g)&&!ha.hasOwnProperty(g)&&(p[g]=b[g]);var h=arguments.length-2;if(1===h)p.children=d;else if(1<h){for(var f=Array(h),k=0;k<h;k++)f[k]=arguments[k+2];p.children=f}if(a&&a.defaultProps)for(g in h=a.defaultProps,h)void 0===p[g]&&(p[g]=h[g]);return{$$typeof:y,type:a,key:c,ref:e,props:p,_owner:R.current}}function ua(a,b){return{$$typeof:y,type:a.type,key:b,ref:a.ref,props:a.props,_owner:a._owner}}function S(a){return"object"===
-typeof a&&null!==a&&a.$$typeof===y}function va(a){var b={"=":"=0",":":"=2"};return"$"+(""+a).replace(/[=:]/g,function(a){return b[a]})}function ia(a,b,d,g){if(I.length){var c=I.pop();c.result=a;c.keyPrefix=b;c.func=d;c.context=g;c.count=0;return c}return{result:a,keyPrefix:b,func:d,context:g,count:0}}function ja(a){a.result=null;a.keyPrefix=null;a.func=null;a.context=null;a.count=0;10>I.length&&I.push(a)}function T(a,b,d,g){var c=typeof a;if("undefined"===c||"boolean"===c)a=null;var e=!1;if(null===
-a)e=!0;else switch(c){case "string":case "number":e=!0;break;case "object":switch(a.$$typeof){case y:case wa:e=!0}}if(e)return d(g,a,""===b?"."+U(a,0):b),1;e=0;b=""===b?".":b+":";if(Array.isArray(a))for(var f=0;f<a.length;f++){c=a[f];var h=b+U(c,f);e+=T(c,h,d,g)}else if(null===a||"object"!==typeof a?h=null:(h=ka&&a[ka]||a["@@iterator"],h="function"===typeof h?h:null),"function"===typeof h)for(a=h.call(a),f=0;!(c=a.next()).done;)c=c.value,h=b+U(c,f++),e+=T(c,h,d,g);else"object"===c&&(d=""+a,q("31",
-"[object Object]"===d?"object with keys {"+Object.keys(a).join(", ")+"}":d,""));return e}function V(a,b,d){return null==a?0:T(a,"",b,d)}function U(a,b){return"object"===typeof a&&null!==a&&null!=a.key?va(a.key):b.toString(36)}function xa(a,b,d){a.func.call(a.context,b,a.count++)}function ya(a,b,d){var g=a.result,c=a.keyPrefix;a=a.func.call(a.context,b,a.count++);Array.isArray(a)?W(a,g,d,function(a){return a}):null!=a&&(S(a)&&(a=ua(a,c+(!a.key||b&&b.key===a.key?"":(""+a.key).replace(la,"$&/")+"/")+
-d)),g.push(a))}function W(a,b,d,g,c){var e="";null!=d&&(e=(""+d).replace(la,"$&/")+"/");b=ia(b,e,g,c);V(a,ya,b);ja(b)}function m(){var a=ma.current;null===a?q("321"):void 0;return a}var e="function"===typeof Symbol&&Symbol.for,y=e?Symbol.for("react.element"):60103,wa=e?Symbol.for("react.portal"):60106,r=e?Symbol.for("react.fragment"):60107,X=e?Symbol.for("react.strict_mode"):60108,za=e?Symbol.for("react.profiler"):60114,Aa=e?Symbol.for("react.provider"):60109,Ba=e?Symbol.for("react.context"):60110,
-Ca=e?Symbol.for("react.concurrent_mode"):60111,Da=e?Symbol.for("react.forward_ref"):60112,Ea=e?Symbol.for("react.suspense"):60113,Fa=e?Symbol.for("react.memo"):60115,Ga=e?Symbol.for("react.lazy"):60116,ka="function"===typeof Symbol&&Symbol.iterator,na=Object.getOwnPropertySymbols,Ha=Object.prototype.hasOwnProperty,Ia=Object.prototype.propertyIsEnumerable,J=function(){try{if(!Object.assign)return!1;var a=new String("abc");a[5]="de";if("5"===Object.getOwnPropertyNames(a)[0])return!1;var b={};for(a=
-0;10>a;a++)b["_"+String.fromCharCode(a)]=a;if("0123456789"!==Object.getOwnPropertyNames(b).map(function(a){return b[a]}).join(""))return!1;var d={};"abcdefghijklmnopqrst".split("").forEach(function(a){d[a]=a});return"abcdefghijklmnopqrst"!==Object.keys(Object.assign({},d)).join("")?!1:!0}catch(g){return!1}}()?Object.assign:function(a,b){if(null===a||void 0===a)throw new TypeError("Object.assign cannot be called with null or undefined");var d=Object(a);for(var c,e=1;e<arguments.length;e++){var f=Object(arguments[e]);
-for(var k in f)Ha.call(f,k)&&(d[k]=f[k]);if(na){c=na(f);for(var h=0;h<c.length;h++)Ia.call(f,c[h])&&(d[c[h]]=f[c[h]])}}return d},ca={isMounted:function(a){return!1},enqueueForceUpdate:function(a,b,d){},enqueueReplaceState:function(a,b,d,c){},enqueueSetState:function(a,b,d,c){}},ba={};t.prototype.isReactComponent={};t.prototype.setState=function(a,b){"object"!==typeof a&&"function"!==typeof a&&null!=a?q("85"):void 0;this.updater.enqueueSetState(this,a,b,"setState")};t.prototype.forceUpdate=function(a){this.updater.enqueueForceUpdate(this,
-a,"forceUpdate")};da.prototype=t.prototype;e=O.prototype=new da;e.constructor=O;J(e,t.prototype);e.isPureReactComponent=!0;var c=null,G=!1,f=3,k=-1,E=-1,x=!1,C=!1,Ja=Date,Ka="function"===typeof setTimeout?setTimeout:void 0,La="function"===typeof clearTimeout?clearTimeout:void 0,oa="function"===typeof requestAnimationFrame?requestAnimationFrame:void 0,pa="function"===typeof cancelAnimationFrame?cancelAnimationFrame:void 0,qa,ra,Y=function(a){qa=oa(function(b){La(ra);a(b)});ra=Ka(function(){pa(qa);
-a(l())},100)};if("object"===typeof performance&&"function"===typeof performance.now){var Ma=performance;var l=function(){return Ma.now()}}else l=function(){return Ja.now()};e=null;"undefined"!==typeof window?e=window:"undefined"!==typeof global&&(e=global);if(e&&e._schedMock){e=e._schedMock;var D=e[0];var P=e[1];var H=e[2];l=e[3]}else if("undefined"===typeof window||"function"!==typeof MessageChannel){var v=null,Na=function(a){if(null!==v)try{v(a)}finally{v=null}};D=function(a,b){null!==v?setTimeout(D,
-0,a):(v=a,setTimeout(Na,0,!1))};P=function(){v=null};H=function(){return!1}}else{"undefined"!==typeof console&&("function"!==typeof oa&&console.error("This browser doesn't support requestAnimationFrame. Make sure that you load a polyfill in older browsers. https://fb.me/react-polyfills"),"function"!==typeof pa&&console.error("This browser doesn't support cancelAnimationFrame. Make sure that you load a polyfill in older browsers. https://fb.me/react-polyfills"));var w=null,K=!1,z=-1,A=!1,Z=!1,L=0,
-M=33,B=33;H=function(){return L<=l()};e=new MessageChannel;var sa=e.port2;e.port1.onmessage=function(a){K=!1;a=w;var b=z;w=null;z=-1;var d=l(),c=!1;if(0>=L-d)if(-1!==b&&b<=d)c=!0;else{A||(A=!0,Y(aa));w=a;z=b;return}if(null!==a){Z=!0;try{a(c)}finally{Z=!1}}};var aa=function(a){if(null!==w){Y(aa);var b=a-L+B;b<B&&M<B?(8>b&&(b=8),B=b<M?M:b):M=b;L=a+B;K||(K=!0,sa.postMessage(void 0))}else A=!1};D=function(a,b){w=a;z=b;Z||0>b?sa.postMessage(void 0):A||(A=!0,Y(aa))};P=function(){w=null;K=!1;z=-1}}var Oa=
-0,ma={current:null},R={current:null};e={ReactCurrentDispatcher:ma,ReactCurrentOwner:R,assign:J};J(e,{Scheduler:{unstable_cancelCallback:function(a){var b=a.next;if(null!==b){if(b===a)c=null;else{a===c&&(c=b);var d=a.previous;d.next=b;b.previous=d}a.next=a.previous=null}},unstable_shouldYield:function(){return!G&&(null!==c&&c.expirationTime<E||H())},unstable_now:l,unstable_scheduleCallback:function(a,b){var d=-1!==k?k:l();if("object"===typeof b&&null!==b&&"number"===typeof b.timeout)b=d+b.timeout;
-else switch(f){case 1:b=d+-1;break;case 2:b=d+250;break;case 5:b=d+1073741823;break;case 4:b=d+1E4;break;default:b=d+5E3}a={callback:a,priorityLevel:f,expirationTime:b,next:null,previous:null};if(null===c)c=a.next=a.previous=a,u();else{d=null;var g=c;do{if(g.expirationTime>b){d=g;break}g=g.next}while(g!==c);null===d?d=c:d===c&&(c=a,u());b=d.previous;b.next=d.previous=a;a.next=d;a.previous=b}return a},unstable_runWithPriority:function(a,b){switch(a){case 1:case 2:case 3:case 4:case 5:break;default:a=
-3}var d=f,c=k;f=a;k=l();try{return b()}finally{f=d,k=c,F()}},unstable_next:function(a){switch(f){case 1:case 2:case 3:var b=3;break;default:b=f}var d=f,c=k;f=b;k=l();try{return a()}finally{f=d,k=c,F()}},unstable_wrapCallback:function(a){var b=f;return function(){var d=f,c=k;f=b;k=l();try{return a.apply(this,arguments)}finally{f=d,k=c,F()}}},unstable_getFirstCallbackNode:function(){return c},unstable_pauseExecution:function(){},unstable_continueExecution:function(){null!==c&&u()},unstable_getCurrentPriorityLevel:function(){return f},
-unstable_IdlePriority:5,unstable_ImmediatePriority:1,unstable_LowPriority:4,unstable_NormalPriority:3,unstable_UserBlockingPriority:2},SchedulerTracing:{__interactionsRef:null,__subscriberRef:null,unstable_clear:function(a){return a()},unstable_getCurrent:function(){return null},unstable_getThreadID:function(){return++Oa},unstable_subscribe:function(a){},unstable_trace:function(a,b,d){return d()},unstable_unsubscribe:function(a){},unstable_wrap:function(a){return a}}});var fa=Object.prototype.hasOwnProperty,
-ha={key:!0,ref:!0,__self:!0,__source:!0},la=/\/+/g,I=[];r={Children:{map:function(a,b,d){if(null==a)return a;var c=[];W(a,c,null,b,d);return c},forEach:function(a,b,d){if(null==a)return a;b=ia(null,null,b,d);V(a,xa,b);ja(b)},count:function(a){return V(a,function(){return null},null)},toArray:function(a){var b=[];W(a,b,null,function(a){return a});return b},only:function(a){S(a)?void 0:q("143");return a}},createRef:function(){return{current:null}},Component:t,PureComponent:O,createContext:function(a,
-b){void 0===b&&(b=null);a={$$typeof:Ba,_calculateChangedBits:b,_currentValue:a,_currentValue2:a,_threadCount:0,Provider:null,Consumer:null};a.Provider={$$typeof:Aa,_context:a};return a.Consumer=a},forwardRef:function(a){return{$$typeof:Da,render:a}},lazy:function(a){return{$$typeof:Ga,_ctor:a,_status:-1,_result:null}},memo:function(a,b){return{$$typeof:Fa,type:a,compare:void 0===b?null:b}},useCallback:function(a,b){return m().useCallback(a,b)},useContext:function(a,b){return m().useContext(a,b)},
-useEffect:function(a,b){return m().useEffect(a,b)},useImperativeHandle:function(a,b,d){return m().useImperativeHandle(a,b,d)},useDebugValue:function(a,b){},useLayoutEffect:function(a,b){return m().useLayoutEffect(a,b)},useMemo:function(a,b){return m().useMemo(a,b)},useReducer:function(a,b,d){return m().useReducer(a,b,d)},useRef:function(a){return m().useRef(a)},useState:function(a){return m().useState(a)},Fragment:r,StrictMode:X,Suspense:Ea,createElement:ea,cloneElement:function(a,b,d){null===a||
-void 0===a?q("267",a):void 0;var c=void 0,e=J({},a.props),f=a.key,k=a.ref,h=a._owner;if(null!=b){void 0!==b.ref&&(k=b.ref,h=R.current);void 0!==b.key&&(f=""+b.key);var l=void 0;a.type&&a.type.defaultProps&&(l=a.type.defaultProps);for(c in b)fa.call(b,c)&&!ha.hasOwnProperty(c)&&(e[c]=void 0===b[c]&&void 0!==l?l[c]:b[c])}c=arguments.length-2;if(1===c)e.children=d;else if(1<c){l=Array(c);for(var m=0;m<c;m++)l[m]=arguments[m+2];e.children=l}return{$$typeof:y,type:a.type,key:f,ref:k,props:e,_owner:h}},
-createFactory:function(a){var b=ea.bind(null,a);b.type=a;return b},isValidElement:S,version:"16.8.6",unstable_ConcurrentMode:Ca,unstable_Profiler:za,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:e};r=(X={default:r},r)||X;return r.default||r});

extras/benchmarks/shared/main.css

@@ -1,42 +0,0 @@
-.main {
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 0;
-  bottom: 0;
-
-  display: grid;
-  grid-template-columns: 220px 1fr;
-}
-
-.left-thing {
-  background-color: gray;
-  padding: 20px;
-  color: white;
-}
-
-.left-thing button {
-  width: 100%;
-}
-
-.right-thing {
-  padding: 20px;
-  overflow: auto;
-}
-
-/* Message widget */
-.message .author {
-  font-weight: bold;
-}
-
-.message {
-  width: 400px;
-  background-color: lightblue;
-  margin: 10px 5px;
-  border-radius: 5px;
-  padding: 5px;
-}
-
-.remove {
-  float: right;
-}

extras/benchmarks/shared/utils.js

@@ -1,49 +0,0 @@
-//------------------------------------------------------------------------------
-// Generating demo data
-//------------------------------------------------------------------------------
-const AUTHORS = ["Aaron", "David", "Vincent"];
-const CONTENT = [
-  "Lorem ipsum dolor sit amet",
-  "Sed ut perspiciatis unde omnis iste natus error sit voluptatem",
-  "Excepteur sint occaecat cupidatat non proident"
-];
-
-function chooseRandomly(array) {
-  const index = Math.floor(Math.random() * array.length);
-  return array[index];
-}
-
-let nextId = 1;
-export function buildData(n = 1000) {
-  const data = [];
-  for (let i = 0; i < n; i++) {
-      let id = nextId++;
-    data.push({
-      id: id,
-      author: chooseRandomly(AUTHORS),
-      msg: `${id}: ${chooseRandomly(CONTENT)}`,
-      likes: 0
-    });
-  }
-  return data;
-}
-
-//------------------------------------------------------------------------------
-// Measuring helpers
-//------------------------------------------------------------------------------
-let startTime;
-let lastMeasure;
-export function startMeasure(descr) {
-  startTime = performance.now();
-  lastMeasure = descr;
-}
-export function stopMeasure() {
-  let last = lastMeasure;
-  if (lastMeasure) {
-    window.setTimeout(function() {
-      lastMeasure = null;
-      const stop = performance.now();
-      console.log(`[${last}] took  ${Number(stop - startTime).toFixed()}ms`);
-    }, 0);
-  }
-}

extras/benchmarks/vue/app.js

@@ -1,106 +0,0 @@
-import { buildData, startMeasure, stopMeasure } from "../shared/utils.js";
-
-//------------------------------------------------------------------------------
-// Counter Widget
-//------------------------------------------------------------------------------
-Vue.component("likes-counter", {
-  data: function() {
-    return {
-      counter: 0
-    };
-  },
-  methods: {
-    increment() {
-      this.counter++;
-    }
-  },
-  template: `
-    <div>
-      <button @click="increment">Value: {{counter}}</button>
-    </div>`
-});
-
-//------------------------------------------------------------------------------
-// Message Widget
-//------------------------------------------------------------------------------
-Vue.component("my-message", {
-  props: ["msg"],
-  methods: {
-    removeMessage() {
-      this.$emit("removeMessage", this.msg.id);
-    }
-  },
-  template: `
-    <div class="message">
-        <span class="author">{{msg.author}}</span>
-        <span class="msg">{{msg.msg}}</span>
-        <button class="remove" @click="removeMessage">Remove</button>
-        <likes-counter></likes-counter>
-    </div>`
-});
-
-//------------------------------------------------------------------------------
-// Root Widget
-//------------------------------------------------------------------------------
-const App = {
-  name: "App",
-  data() {
-    return { messages: [] };
-  },
-  methods: {
-    addMessages(n) {
-      startMeasure("add " + n);
-      const newMessages = buildData(n);
-      this.messages.push.apply(this.messages, newMessages);
-      stopMeasure();
-    },
-
-    clear() {
-      startMeasure("clear");
-      this.messages = [];
-      stopMeasure();
-    },
-
-    updateSomeMessages() {
-      startMeasure("update every 10th");
-      const messages = this.messages;
-      for (let i = 0; i < this.messages.length; i += 10) {
-        messages[i].author += "!!!";
-      }
-      stopMeasure();
-    },
-
-    removeMessage(id) {
-      startMeasure("remove message");
-      const index = this.messages.findIndex(m => m.id === id);
-      this.messages.splice(index, 1);
-      stopMeasure();
-    }
-  },
-  template: `
-    <div class="main">
-        <div class="left-thing">
-            <div>Number of msg: {{messages.length}}</div>
-            <button @click="addMessages(100)">Add 100 messages</button>
-            <button @click="addMessages(1000)">Add 1000 messages</button>
-            <button @click="addMessages(10000)">Add 10000 messages</button>
-            <button @click="addMessages(50000)">Add 50000 messages</button>
-            <button @click="updateSomeMessages">Update every 10th message</button>
-            <button @click="clear">Clear</button>
-        </div>
-        <div class="right-thing">
-            <div class="content">
-                <my-message v-for="msg in messages" v-bind:key="msg.id" v-bind:msg="msg" @removeMessage="removeMessage"></my-message>
-            </div>
-        </div>
-    </div>
-  `
-};
-
-//------------------------------------------------------------------------------
-// Application initialization
-//------------------------------------------------------------------------------
-
-new Vue({
-  render: h => h(App)
-}).$mount(`#main`);

extras/benchmarks/vue/index.html

@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <title>Vue.js Benchmark</title>
-  <link href="../shared/main.css" rel="stylesheet"/>
-  <script src='vue.min.js'></script>
-</head>
-<body>
-  <div id='main'></div>
-  <script src='app.js' type="module"></script>
-</body>
-</html>

extras/index.html

@@ -1,43 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <title>OWL Extras</title>
-    <link rel="stylesheet" href="main.css">
-</head>
-<body>
-
-    <div class="title">
-        <h1>🦉 OWL Extra Stuff 🦉</h1>
-        <div>Mysterious OWL: A web framework for structured, dynamic and maintainable applications</div>
-    </div>
-
-    <div class="section misc">
-        <h2>Misc</h2>
-        <div class="links">
-            <a href="playground">Playground (local)</a>
-            <a href="https://github.com/odoo/owl">Github</a>
-            <a href="https://odoo.github.io/owl/">Owl main page</a>
-            <a href="https://github.com/odoo/owl/blob/master/doc/readme.md">Owl Documentation</a>
-        </div>
-    </div>
-
-    <div class="section benchmarks">
-        <h2>Benchmarks</h2>
-
-        <ul>
-            <li><a href="benchmarks/odoo-widgets-12.0">Odoo Widgets (12.0)</a></li>
-            <li><a href="benchmarks/odoo-widgets-12.3">Odoo Widgets (12.3)</a></li>
-            <li><a href="benchmarks/owl-0.7.0">OWL 0.7.0</a></li>
-            <li><a href="benchmarks/owl-0.8.0">OWL 0.8.0</a></li>
-            <li><a href="benchmarks/owl-0.9.0">OWL 0.9.0</a></li>
-            <li><a href="benchmarks/owl-0.10.0">OWL 0.10.0</a></li>
-            <li><a href="benchmarks/owl-0.11.0">OWL 0.11.0</a></li>
-            <li><a href="benchmarks/owl-master">OWL Master</a></li>
-            <li><a href="benchmarks/vue">Vue</a></li>
-            <li><a href="benchmarks/react">React</a></li>
-        </ul>
-    </div>
-
-</body>
-</html>

extras/main.css

@@ -1,23 +0,0 @@
-body {
-    font-family: sans-serif;
-}
-
-.title, .section {
-    width: 768px;
-    margin: auto;
-}
-
-.title div {
-    color: #333333;
-    font-style: italic;
-}
-.section {
-    background-color: #d5d5d5;
-    padding: 16px;
-    margin-top: 10px;
-    margin-bottom: 10px;
-}
-
-.links a {
-    margin: 10px 5px;
-}

extras/playground/app.js

@@ -1,359 +0,0 @@
-import { SAMPLES } from "./samples.js";
-
-//------------------------------------------------------------------------------
-// Constants, helpers, utils
-//------------------------------------------------------------------------------
-let owlJS;
-
-async function owlSourceCode() {
-  if (owlJS) {
-    return owlJS;
-  }
-  const result = await fetch("../owl.js");
-  owlJS = await result.text();
-  return owlJS;
-}
-
-const MODES = {
-  js: "ace/mode/javascript",
-  css: "ace/mode/css",
-  xml: "ace/mode/xml"
-};
-
-const DEFAULT_XML = `<templates>
-</templates>`;
-
-const DEFAULT_HTML = `<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8">
-    <title>OWL App</title>
-    <link rel="icon" href="data:,">
-
-    <script src="owl.js"></script>
-    <link rel="stylesheet" href="app.css">
-    <script src="app.js"></script>
-  </head>
-  <body>
-  </body>
-</html>
-`;
-
-const APP_PY = `import sys
-import thread
-import webbrowser
-import time
-
-import BaseHTTPServer, SimpleHTTPServer
-
-def start_server():
-    httpd = BaseHTTPServer.HTTPServer(('127.0.0.1', 3600), SimpleHTTPServer.SimpleHTTPRequestHandler)
-    httpd.serve_forever()
-
-thread.start_new_thread(start_server,())
-url = 'http://127.0.0.1:3600'
-webbrowser.open_new(url)
-
-while True:
-    try:
-        time.sleep(1)
-    except KeyboardInterrupt:
-        sys.exit(0)
-`;
-
-/**
- * Make an iframe, with all the js, css and xml properly injected.
- */
-function makeCodeIframe(js, css, xml, errorHandler) {
-  // check templates
-  var qweb = new owl.QWeb();
-  const sanitizedXML = xml.replace(/<!--[\s\S]*?-->/g, "");
-
-  // will throw error if there is something wrong with xml
-  qweb.addTemplates(sanitizedXML);
-
-  // create iframe
-  const iframe = document.createElement("iframe");
-
-  iframe.onload = () => {
-    const doc = iframe.contentDocument;
-    // inject js
-    const owlScript = doc.createElement("script");
-    owlScript.type = "text/javascript";
-    owlScript.src = "../owl.js";
-    owlScript.addEventListener("load", () => {
-      const script = doc.createElement("script");
-      script.type = "text/javascript";
-      const content = `owl.__info__.mode = 'dev';\nwindow.TEMPLATES = \`${sanitizedXML}\`\n${js}`;
-      script.innerHTML = content;
-      iframe.contentWindow.addEventListener("error", errorHandler);
-      iframe.contentWindow.addEventListener("unhandledrejection", errorHandler);
-      setTimeout(function() {
-        if (iframe.contentWindow) {
-          iframe.contentWindow.removeEventListener("error", errorHandler);
-          iframe.contentWindow.removeEventListener(
-            "unhandledrejection",
-            errorHandler
-          );
-        }
-      }, 200);
-      doc.body.appendChild(script);
-    });
-    doc.head.appendChild(owlScript);
-
-    // inject css
-    const style = document.createElement("style");
-    style.innerHTML = css;
-    doc.head.appendChild(style);
-  };
-  return iframe;
-}
-
-/**
- * Make a zip file containing a functioning application
- */
-async function makeApp(js, css, xml) {
-  await owl.utils.loadJS("libs/jszip.min.js");
-
-  const zip = new JSZip();
-  const processedJS = js
-    .split("\n")
-    .map(l => (l === "" ? "" : "  " + l))
-    .join("\n");
-
-  const JS = `async function startApp() {
-  // Loading templates
-  let TEMPLATES;
-  try {
-    TEMPLATES = await owl.utils.loadTemplates('app.xml');
-  } catch(e) {
-    document.write(\`This app requires a static server.  If you have python installed, try 'python app.py'\`);
-    return;
-  }
-
-  // Application code
-${processedJS}
-}
-
-// wait for DOM ready before starting
-owl.utils.whenReady(startApp);`;
-
-  zip.file("app.js", JS);
-  zip.file("app.css", css);
-  zip.file("app.py", APP_PY);
-  zip.file("app.xml", xml);
-  zip.file("index.html", DEFAULT_HTML);
-  zip.file("owl.js", owlSourceCode());
-  return zip.generateAsync({ type: "blob" });
-}
-
-//------------------------------------------------------------------------------
-// MAIN APP
-//------------------------------------------------------------------------------
-class App extends owl.Component {
-  constructor(...args) {
-    super(...args);
-    this.version = owl.__info__.version;
-    this.SAMPLES = SAMPLES;
-    this.widgets = { TabbedEditor };
-
-    this.state = {
-      js: SAMPLES[0].code,
-      css: SAMPLES[0].css || "",
-      xml: SAMPLES[0].xml || DEFAULT_XML,
-      error: false,
-      displayWelcome: true,
-      splitLayout: true,
-      leftPaneWidth: Math.ceil(window.innerWidth / 2),
-      topPanelHeight: null
-    };
-
-    this.toggleLayout = owl.utils.debounce(this.toggleLayout, 250, true);
-    this.runCode = owl.utils.debounce(this.runCode, 250, true);
-    this.downloadCode = owl.utils.debounce(this.downloadCode, 250, true);
-  }
-
-  displayError(error) {
-    this.state.error = error;
-    if (error) {
-      setTimeout(() => {
-        this.refs.content.innerHTML = "";
-      });
-      return;
-    }
-  }
-
-  runCode() {
-    this.state.displayWelcome = false;
-    let subiframe;
-    let error = false;
-    const errorHandler = e => this.displayError(e.message || e.reason.message);
-    try {
-      const { js, css, xml } = this.state;
-      subiframe = makeCodeIframe(js, css, xml, errorHandler);
-    } catch (e) {
-      //probably problem with the templates
-      error = e;
-    }
-    if (error) {
-      this.displayError(error.message);
-      return;
-    } else {
-      this.state.error = false;
-    }
-    this.refs.content.innerHTML = "";
-    this.refs.content.appendChild(subiframe);
-  }
-
-  setSample(ev) {
-    const sample = SAMPLES.find(s => s.description === ev.target.value);
-    this.state.js = sample.code;
-    this.state.css = sample.css || "";
-    this.state.xml = sample.xml || DEFAULT_XML;
-  }
-
-  get leftPaneStyle() {
-    return `width:${this.state.leftPaneWidth}px`;
-  }
-
-  get rightPaneStyle() {
-    return `width:${window.innerWidth - 6 - this.state.leftPaneWidth}px`;
-  }
-
-  get topEditorStyle() {
-    return `flex: 0 0 ${this.state.topPanelHeight}px`;
-  }
-
-  onMouseDown() {
-    const resizer = ev => {
-      this.state.leftPaneWidth = ev.clientX;
-    };
-
-    document.body.addEventListener("mousemove", resizer);
-    for (let iframe of document.getElementsByTagName("iframe")) {
-      iframe.classList.add("disabled");
-    }
-
-    document.body.addEventListener("mouseup", () => {
-      document.body.removeEventListener("mousemove", resizer);
-      for (let iframe of document.getElementsByTagName("iframe")) {
-        iframe.classList.remove("disabled");
-      }
-    });
-  }
-  updateCode(ev) {
-    this.state[ev.type] = ev.value;
-  }
-  toggleLayout() {
-    this.state.splitLayout = !this.state.splitLayout;
-  }
-  updatePanelHeight(ev) {
-    if (!ev.delta) {
-      return;
-    }
-    let height = this.state.topPanelHeight;
-    if (!height) {
-      height = document.getElementsByClassName("tabbed-editor")[0].clientHeight;
-    }
-    this.state.topPanelHeight = height + ev.delta;
-  }
-
-  async downloadCode() {
-    const { js, css, xml } = this.state;
-    const content = await makeApp(js, css, xml);
-    await owl.utils.loadJS("libs/FileSaver.min.js");
-    saveAs(content, "app.zip");
-  }
-}
-
-//------------------------------------------------------------------------------
-// Tabbed editor
-//------------------------------------------------------------------------------
-class TabbedEditor extends owl.Component {
-  constructor(parent, props) {
-    super(parent, props);
-    this.state = {
-      currentTab: props.js ? "js" : props.xml ? "xml" : "css"
-    };
-    this.setTab = owl.utils.debounce(this.setTab, 250, true);
-
-    this.sessions = {};
-    for (let tab of ["js", "xml", "css"]) {
-      if (props[tab]) {
-        this.sessions[tab] = new ace.EditSession(props[tab], MODES[tab]);
-        this.sessions[tab].setOption("useWorker", false);
-        const tabSize = tab === "xml" ? 2 : 4;
-        this.sessions[tab].setOption("tabSize", tabSize);
-        this.sessions[tab].setUndoManager(new ace.UndoManager());
-      }
-    }
-  }
-
-  mounted() {
-    this.editor = ace.edit(this.refs.editor);
-
-    this.editor.setValue(this.props[this.state.currentTab], -1);
-    this.editor.setFontSize("12px");
-    this.editor.setTheme("ace/theme/monokai");
-    this.editor.setSession(this.sessions[this.state.currentTab]);
-    const tabSize = this.state.currentTab === "xml" ? 2 : 4;
-    this.editor.session.setOption("tabSize", tabSize);
-    this.editor.on("blur", () => {
-      const editorValue = this.editor.getValue();
-      const propsValue = this.props[this.state.currentTab];
-      if (editorValue !== propsValue) {
-        this.trigger("updateCode", {
-          type: this.state.currentTab,
-          value: editorValue
-        });
-      }
-    });
-  }
-
-  patched() {
-    const session = this.sessions[this.state.currentTab];
-    session.setValue(this.props[this.state.currentTab], -1);
-    this.editor.setSession(session);
-  }
-
-  willUnmount() {
-    this.editor.destroy();
-    delete this.editor;
-  }
-
-  setTab(tab) {
-      if (this.state.currentTab !== tab) {
-        this.state.currentTab = tab;
-        const session = this.sessions[this.state.currentTab];
-        session.doc.setValue(this.props[tab], -1);
-        this.editor.setSession(session);
-      }
-  }
-
-  onMouseDown(ev) {
-    if (ev.target.tagName === "DIV") {
-      let y = ev.clientY;
-      const resizer = ev => {
-        const delta = ev.clientY - y;
-        y = ev.clientY;
-        this.trigger("updatePanelHeight", { delta });
-      };
-      document.body.addEventListener("mousemove", resizer);
-      document.body.addEventListener("mouseup", () => {
-        document.body.removeEventListener("mousemove", resizer);
-      });
-    }
-  }
-}
-
-//------------------------------------------------------------------------------
-// Application initialization
-//------------------------------------------------------------------------------
-document.title = `${document.title} (v${owl.__info__.version})`;
-document.addEventListener("DOMContentLoaded", async function() {
-  const templates = await owl.utils.loadTemplates("templates.xml");
-  const qweb = new owl.QWeb(templates);
-  const env = { qweb };
-  const app = new App(env);
-  app.mount(document.body);
-});

extras/readme.md

@@ -1,21 +0,0 @@
-# 🦉 Extra Stuff 🦉
-
-To help work/improve/learn with OWL, we have here:
-
-- a benchmarks application
-- a playground application
-
-Both of them can be accessed by using a static http server.  A simple python
-server is available in `server.py`.  There is also a npm script to start it:
-`npm run extras` (and its version with a watcher: `npm run extras:watch`).
-
-## Benchmarks
-
-The benchmarks application is a very small application, implemented in different
-frameworks, and in different versions of Owl.  This is a simple internal tool,
-useful to compare various performance metrics on some tasks.
-
-## Playground
-
-The playground is an important application designed to help learning and
-experimenting with Owl.  It is available [online](https://odoo.github.io/owl/playground/).

extras/server.py

@@ -1,38 +0,0 @@
-import sys
-import thread
-import webbrowser
-import time
-
-import BaseHTTPServer
-import SimpleHTTPServer
-
-HOST = '127.0.0.1'
-PORT = 8000
-URL = 'http://{0}:{1}/extras'.format(HOST, PORT)
-
-
-# We define our own handler here to remap owl.js GET requests to the Owl build
-# in dist/.  This is useful for the benchmarks and playground applications.
-# With this, we can simply copy the playground folder as is in the gh-page when
-# we want to update the playground.
-class OWLHandler(SimpleHTTPServer.SimpleHTTPRequestHandler):
-    def do_GET(self):
-        if self.path == '/extras/owl.js':
-            self.path = '/dist/owl.js'
-        return SimpleHTTPServer.SimpleHTTPRequestHandler.do_GET(self)
-
-
-def start_server():
-    httpd = BaseHTTPServer.HTTPServer((HOST, PORT), OWLHandler)
-    httpd.serve_forever()
-
-
-if __name__ == "__main__":
-    thread.start_new_thread(start_server, ())
-    webbrowser.open_new(URL)
-
-    while True:
-        try:
-            time.sleep(1)
-        except KeyboardInterrupt:
-            sys.exit(0)

index.html

@@ -0,0 +1,109 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>OWL Framework</title>
+  <link rel="icon" href="data:,">
+  <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic">
+  <link rel="stylesheet" href="assets/normalize.css">
+  <link rel="stylesheet" href="assets/milligram.css">
+  <link rel="stylesheet" href="assets/highlight.tomorrow.css">
+  <link rel="stylesheet" href="assets/main.css">
+  <script src="./owl.js"></script>
+</head>
+<body>
+  <header class="container">
+    <img class="homepage-logo" src="assets/owl_1f989.png" alt="OWL Logo">
+    <hgroup>
+      <h1>OWL Framework</h1>
+      <p>Mysterious OWL: A web framework for structured, dynamic and maintainable applications</p>
+    </hgroup>
+  </header>
+  <nav class="container">
+    <p>
+      <a href="https://github.com/odoo/owl" title="https://github.com/odoo/owl">Github</a>
+      &bull;
+      <a href="https://github.com/odoo/owl/blob/master/doc/readme.md">Documentation</a>
+      &bull;
+      <a href="playground/">Playground</a>
+    </p>
+  </nav>
+  <main>
+    <article class="design">
+      <div class="container">
+        <h2>Why OWL?</h2>
+        <div class="row">
+          <section class="column">
+            <h3>XML based</h3>
+            <p>Templates are based on the XML format, which allows interesting applications. For example, they could be stored in a database and modified dynamically with <tt>xpaths</tt>.</p>
+          </section>
+          <section class="column">
+            <h3>Templates compiled in the browser</h3>
+            <p>This may not be a good fit for all applications, but if you need to generate dynamically user interfaces in the browser, this is very powerful. For example, a generic form view component could generate a specific form user interface for each various models, from a XML view.</p>
+          </section>
+          <section class="column">
+            <h3>No toolchain required</h3>
+            <p>This is extremely useful for some applications, if, for various reasons (security/deployment/dynamic modules/specific assets tools), it is not ok to use standard web tools based on <tt>npm</tt>.</p>
+          </section>
+        </div>
+      </div>
+    </article>
+    <article class="example">
+      <div class="container">
+        <h2>Example</h2>
+        <div class="row">
+          <section class="column">
+<pre><code class="javascript">import { mount, Component, useState } from "owl";
+
+class Counter extends Component {
+  setup() {
+    this.state = useState({ value: 0 });
+  }
+
+  increment() {
+    this.state.value++;
+  }
+}
+
+mount(Counter, document.body);</code></pre>
+          </section>
+          <section class="column">
+<pre><code class="xml">&lt;templates&gt;
+  &lt;t t-name=&quot;Counter&quot;&gt;
+    &lt;button t-on-click=&quot;increment&quot;&gt;
+      Click Me! [&lt;t t-esc=&quot;state.value&quot;/&gt;]
+    &lt;/button&gt;
+  &lt;/t&gt;
+&lt;/templates&gt;</code></pre>
+            <div id="app-container"></div>
+            <script>
+const { mount, Component, useState, xml } = owl;
+
+class Counter extends Component {
+  setup() {
+    this.state = useState({ value: 0 });
+  }
+
+  increment() {
+    this.state.value++;
+  }
+}
+Counter.template = xml`<button t-on-click="increment">
+  Click Me! [<t t-esc="state.value"/>]
+</button>`;
+
+mount(Counter, document.getElementById("app-container"));
+            </script>
+          </section>
+        </div>
+      </div>
+    </article>
+  </main>
+  <footer>
+    <p><a href=".">OWL</a> is licensed under LGPLv3.<br>Logo from <a href="https://github.com/googlefonts/noto-emoji">Google Noto Emoji Font</a>, licensed under Apache License 2.0</p>
+  </footer>
+  <script src="assets/highlight.pack.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script>
+</body>
+</html>

package.json

@@ -1,63 +0,0 @@
-{
-  "name": "owl",
-  "version": "0.12.0",
-  "description": "Odoo Web Library (OWL)",
-  "main": "src/index.ts",
-  "scripts": {
-    "build:js": "tsc --target esnext --module es6 --outDir dist/owl src/*",
-    "build:bundle": "rollup -c",
-    "build": "npm run build:js && npm run build:bundle",
-    "minify": "uglifyjs dist/owl.js -o dist/owl.min.js --compress --mangle",
-    "test": "jest",
-    "test:watch": "jest --watch",
-    "extras:serve": "python extras/server.py",
-    "extras": "npm run build && npm run extras:serve",
-    "extras:watch": "npm-run-all  --parallel extras:serve \"build:* -- --watch\""
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/odoo/owl.git"
-  },
-  "author": "Odoo",
-  "license": "GPL-3.0-or-later",
-  "bugs": {
-    "url": "https://github.com/odoo/owl/issues"
-  },
-  "homepage": "https://github.com/odoo/owl#readme",
-  "devDependencies": {
-    "@types/jest": "^23.3.12",
-    "cpx": "^1.5.0",
-    "git-rev-sync": "^1.12.0",
-    "jest": "^23.6.0",
-    "live-server": "^1.2.1",
-    "npm-run-all": "^4.1.5",
-    "rollup": "^1.6.0",
-    "rollup-plugin-typescript2": "^0.20.1",
-    "sass": "^1.16.1",
-    "source-map-support": "^0.5.10",
-    "ts-jest": "^23.10.5",
-    "typescript": "^3.2.2",
-    "uglify-es": "^3.3.9",
-    "jest-environment-jsdom": "^24.7.1"
-  },
-  "dependencies": {},
-  "jest": {
-    "roots": [
-      "<rootDir>/src",
-      "<rootDir>/tests"
-    ],
-    "transform": {
-      "^.+\\.ts?$": "ts-jest"
-    },
-    "verbose": false,
-    "testRegex": "(/tests/.*(test|spec))\\.ts?$",
-    "moduleFileExtensions": [
-      "ts",
-      "tsx",
-      "js",
-      "jsx",
-      "json",
-      "node"
-    ]
-  }
-}

playground/app.js

@@ -0,0 +1,346 @@
+import { SAMPLES } from "./samples.js";
+import { debounce, loadJS } from "./utils.js";
+import { exportStandaloneApp } from "./export_snippet.js";
+const { useState, useRef, onMounted, onWillUnmount, onPatched, onWillUpdateProps } = owl;
+
+//------------------------------------------------------------------------------
+// Constants, helpers, utils
+//------------------------------------------------------------------------------
+
+const MODES = {
+  js: "ace/mode/javascript",
+  css: "ace/mode/css",
+  xml: "ace/mode/xml"
+};
+
+const DEFAULT_XML = `<templates>
+</templates>`;
+
+/**
+ * Make an iframe, with all the js, css and xml properly injected.
+ */
+function makeCodeIframe(js, css, xml) {
+  const sanitizedXML = xml.replace(/<!--[\s\S]*?-->/g, "").replace(/`/g, '\\\`');
+
+  // create iframe
+  const iframe = document.createElement("iframe");
+
+  iframe.onload = () => {
+    const doc = iframe.contentDocument;
+    const utilsMod = doc.createElement("script");
+    utilsMod.setAttribute("type", "module");
+    utilsMod.setAttribute("src", "utils.js");
+    doc.head.appendChild(utilsMod);
+    // inject js
+    const owlScript = doc.createElement("script");
+    owlScript.type = "text/javascript";
+    owlScript.src = "../owl.js";
+    owlScript.addEventListener("load", () => {
+      const script = doc.createElement("script");
+      script.type = "module";
+      const content = `
+        (async function(TEMPLATES) {
+          ${js}
+        })(\`${sanitizedXML}\`)`;
+      script.innerHTML = content;
+      doc.body.appendChild(script);
+    });
+    doc.head.appendChild(owlScript);
+
+    // inject css
+    const style = document.createElement("style");
+    style.innerHTML = css;
+    doc.head.appendChild(style);
+  };
+  return iframe;
+}
+
+//------------------------------------------------------------------------------
+// SAMPLES
+//------------------------------------------------------------------------------
+function loadSamples() {
+  let result = SAMPLES.slice();
+  const localSample = localStorage.getItem("owl-playground-local-sample");
+  if (localSample) {
+    const { js, css, xml } = JSON.parse(localSample);
+    result.unshift({
+      description: "Local Storage Code",
+      code: js,
+      xml,
+      css
+    });
+  }
+  return result;
+}
+
+function saveLocalSample(js, css, xml) {
+  const str = JSON.stringify({ js, css, xml });
+  localStorage.setItem("owl-playground-local-sample", str);
+}
+
+function deleteLocalSample() {
+  localStorage.removeItem("owl-playground-local-sample");
+}
+
+function useSamples() {
+  const samples = loadSamples();
+  const component = owl.useComponent();
+  let interval;
+
+  onMounted(() => {
+    const state = component.state;
+    interval = setInterval(() => {
+      if (component.isDirty) {
+        saveLocalSample(state.js, state.css, state.xml);
+      }
+    }, 1000);
+  });
+  onWillUnmount(() => {
+    clearInterval(interval);
+  });
+  return samples;
+}
+
+//------------------------------------------------------------------------------
+// Tabbed editor
+//------------------------------------------------------------------------------
+class TabbedEditor extends owl.Component {
+  setup() {
+    const props = this.props;
+    this.state = useState({
+      currentTab: props.js !== false ? "js" : props.xml ? "xml" : "css"
+    });
+    this.setTab = debounce(this.setTab.bind(this), 250, true);
+
+    this.sessions = {};
+    this._setupSessions(props);
+    this.editorNode = useRef("editor");
+    this._updateCode = this._updateCode.bind(this);
+
+    onMounted(() => {
+      this.editor = this.editor || ace.edit(this.editorNode.el);
+
+      this.editor.setValue(this.props[this.state.currentTab], -1);
+      this.editor.setFontSize("12px");
+      this.editor.setTheme("ace/theme/monokai");
+      this.editor.setSession(this.sessions[this.state.currentTab]);
+      const tabSize = this.state.currentTab === "xml" ? 2 : 4;
+      this.editor.session.setOption("tabSize", tabSize);
+      this.editor.on("blur", this._updateCode);
+      this.interval = setInterval(this._updateCode, 3000);
+    });
+
+    onPatched(() => {
+      const session = this.sessions[this.state.currentTab];
+      let content = this.props[this.state.currentTab];
+      if (content === false) {
+        const tab = this.props.js !== false ? "js" : this.props.xml ? "xml" : "css";
+        content = this.props[tab];
+        this.state.currentTab = tab;
+      }
+      if (this.editor.getValue() !== content) {
+        session.setValue(content, -1);
+        this.editor.setSession(session);
+        this.editor.resize();
+      }
+    });
+
+    onWillUpdateProps((nextProps) => this._setupSessions(nextProps));
+
+    onWillUnmount(() => {
+      clearInterval(this.interval);
+      this.editor.off("blur", this._updateCode);
+    });
+  }
+
+  setTab(tab) {
+    if (this.state.currentTab !== tab) {
+      this.state.currentTab = tab;
+      const session = this.sessions[this.state.currentTab];
+      session.doc.setValue(this.props[tab], -1);
+      this.editor.setSession(session);
+    }
+  }
+
+  onMouseDown(ev) {
+    if (ev.target.tagName === "DIV") {
+      let y = ev.clientY;
+      const resizer = ev => {
+        const delta = ev.clientY - y;
+        y = ev.clientY;
+        this.trigger("updatePanelHeight", { delta });
+      };
+      document.body.addEventListener("mousemove", resizer);
+      document.body.addEventListener("mouseup", () => {
+        document.body.removeEventListener("mousemove", resizer);
+      });
+    }
+  }
+
+  _setupSessions(props) {
+    for (let tab of ["js", "xml", "css"]) {
+      if (props[tab] !== false && !this.sessions[tab]) {
+        this.sessions[tab] = new ace.EditSession(props[tab], MODES[tab]);
+        this.sessions[tab].setOption("useWorker", false);
+        const tabSize = tab === "xml" ? 2 : 4;
+        this.sessions[tab].setOption("tabSize", tabSize);
+        this.sessions[tab].setUndoManager(new ace.UndoManager());
+      }
+    }
+  }
+
+  _updateCode() {
+    const editorValue = this.editor.getValue();
+    const propsValue = this.props[this.state.currentTab];
+    if (editorValue !== propsValue) {
+      this.props.updateCode({
+        type: this.state.currentTab,
+        value: editorValue
+      });
+    }
+  }
+}
+TabbedEditor.template = "TabbedEditor";
+
+//------------------------------------------------------------------------------
+// MAIN APP
+//------------------------------------------------------------------------------
+class App extends owl.Component {
+  setup() {
+    this.version = owl.__info__.version;
+    this.SAMPLES = useSamples();
+    this.isDirty = false;
+
+    this.state = useState({
+      js: this.SAMPLES[0].code,
+      css: this.SAMPLES[0].css || "",
+      xml: this.SAMPLES[0].xml || DEFAULT_XML,
+      displayWelcome: true,
+      splitLayout: true,
+      leftPaneWidth: Math.ceil(window.innerWidth / 2),
+      topPanelHeight: null
+    });
+
+    this.toggleLayout = debounce(this.toggleLayout, 250, true);
+    this.runCode = debounce(this.runCode, 250, true);
+    this.downloadCode = debounce(this.downloadCode, 250, true);
+    this.content = useRef("content");
+    this.updateCode = this.updateCode.bind(this);
+    if (window.location.hash) {
+      try {
+        const { js, css, xml } = JSON.parse(atob(decodeURIComponent(window.location.hash.slice(1))));
+        if (![js, css, xml].every(item => typeof item === "string")) {
+          return;
+        }
+        Object.assign(this.state, { js, css, xml });
+      } catch {}
+    }
+  }
+
+  runCode() {
+    this.content.el.innerHTML = "";
+    this.state.displayWelcome = false;
+
+    const { js, css, xml } = this.state;
+    const subiframe = makeCodeIframe(js, css, xml);
+    this.content.el.appendChild(subiframe);
+  }
+
+  shareCode() {
+    const state = btoa(JSON.stringify({ js: this.state.js, css: this.state.css, xml: this.state.xml }));
+    const link = new URL(window.location.href);
+    link.hash = state;
+    if (navigator.clipboard) {
+      navigator.clipboard.writeText(link.href);
+      clearTimeout(this.state.copied)
+      this.state.copied = setTimeout(() => this.state.copied = null, 2000);
+    }
+    window.location.href = link.href;
+  }
+
+  setSample(ev) {
+    const sample = this.SAMPLES.find(s => s.description === ev.target.value);
+    this.state.js = sample.code;
+    this.state.css = sample.css || "";
+    this.state.xml = sample.xml || DEFAULT_XML;
+    deleteLocalSample();
+    this.isDirty = false;
+  }
+
+  get leftPaneStyle() {
+    return `width:${this.state.leftPaneWidth}px`;
+  }
+
+  get rightPaneStyle() {
+    return `width:${window.innerWidth - 6 - this.state.leftPaneWidth}px`;
+  }
+
+  get topEditorStyle() {
+    return `flex: 0 0 ${this.state.topPanelHeight}px`;
+  }
+
+  onMouseDown() {
+    const resizer = ev => {
+      this.state.leftPaneWidth = ev.clientX;
+    };
+
+    document.body.addEventListener("mousemove", resizer);
+    for (let iframe of document.getElementsByTagName("iframe")) {
+      iframe.classList.add("disabled");
+    }
+
+    document.body.addEventListener("mouseup", () => {
+      document.body.removeEventListener("mousemove", resizer);
+      for (let iframe of document.getElementsByTagName("iframe")) {
+        iframe.classList.remove("disabled");
+      }
+    });
+  }
+  updateCode({type, value}) {
+    if (this.state[type] !== value) {
+      this.state[type] = value;
+      this.isDirty = true;
+    }
+  }
+  toggleLayout() {
+    this.state.splitLayout = !this.state.splitLayout;
+  }
+  updatePanelHeight(ev) {
+    if (!ev.detail.delta) {
+      return;
+    }
+    let height = this.state.topPanelHeight;
+    if (!height) {
+      height = document.getElementsByClassName("tabbed-editor")[0].clientHeight;
+    }
+    this.state.topPanelHeight = height + ev.detail.delta;
+  }
+
+  async downloadCode() {
+    const { js, css, xml } = this.state;
+    const content = await exportStandaloneApp(js, css, xml);
+    await loadJS("libs/FileSaver.min.js");
+    saveAs(content, "app.zip");
+  }
+}
+App.components = { TabbedEditor };
+App.template = "App";
+
+//------------------------------------------------------------------------------
+// Application initialization
+//------------------------------------------------------------------------------
+async function start() {
+  document.title = `${document.title} (v${owl.__info__.version})`;
+  const commit = `https://github.com/odoo/owl/commit/${owl.__info__.hash}`;
+  console.info(`This application is using Owl built with the following commit:`, commit);
+  const [templates] = await Promise.all([
+    owl.loadFile("templates.xml"),
+    owl.whenReady()
+  ]);
+  const rootApp = new owl.App(App);
+  rootApp.addTemplates(templates);
+
+  await  rootApp.mount(document.body);
+}
+
+start();

playground/export_snippet.js

@@ -0,0 +1,123 @@
+import { loadJS } from "./utils.js";
+
+const sourceCache = new Map();
+async function getSourceCode(filePath) {
+    if (sourceCache.has(filePath)) {
+        return sourceCache.get(filePath);
+    }
+    let source = await fetch(`${filePath}.js`);
+    source = await source.text();
+    sourceCache.set(filePath, source);
+    return source;
+}
+
+const DEFAULT_HTML = `<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title>OWL App</title>
+    <link rel="icon" href="data:,">
+
+    <script src="owl.js"></script>
+    <link rel="stylesheet" href="app.css">
+    <script type="module" src="app.js"></script>
+    <script type="module" src="utils.js"></script>
+  </head>
+  <body>
+  </body>
+</html>
+`;
+
+const APP_PY = `#!/usr/bin/env python3
+
+import threading
+import time
+
+from http.server import SimpleHTTPRequestHandler, HTTPServer
+
+def start_server():
+    SimpleHTTPRequestHandler.extensions_map['.js'] = 'application/javascript'
+    httpd = HTTPServer(('0.0.0.0', 3600), SimpleHTTPRequestHandler)
+    httpd.serve_forever()
+
+url = 'http://127.0.0.1:3600'
+
+if __name__ == "__main__":
+    print("Owl Application")
+    print("---------------")
+    print("Server running on: {}".format(url))
+    threading.Thread(target=start_server, daemon=True).start()
+
+    while True:
+        try:
+            time.sleep(1)
+        except KeyboardInterrupt:
+            httpd.server_close()
+            quit(0)
+`;
+
+/**
+ * Make a zip file containing a functioning application
+ */
+export async function exportStandaloneApp(js, css, xml) {
+  await loadJS("libs/jszip.min.js");
+
+  const zip = new JSZip();
+  const processedJS = js
+    .split("\n")
+    .map(l => (l === "" ? "" : "  " + l))
+    .join("\n");
+
+  const JS = `
+/**
+ * This is the javascript code defined in the playground.
+ * In a larger application, this code should probably be moved in different
+ * sub files.
+ */
+import * as utils from "./utils.js";
+async function app() {
+${processedJS}
+}
+
+/**
+ * Initialization code
+ * This code load templates, and make sure everything is properly connected.
+ */
+function prepareOWLApp(templates) {
+  const _configure = owl.App.prototype.configure;
+  owl.App.prototype.configure = function configureOverriden(config) {
+    config = Object.assign({ dev: true }, config); 
+    this.addTemplates(templates);
+    return _configure.call(this, config);
+  }
+}
+
+async function start() {
+  let templates;
+  try {
+    templates = await owl.loadFile('app.xml');
+  } catch(e) {
+    console.error(\`This app requires a static server.  If you have python installed, try 'python app.py'\`);
+    return;
+  }
+  prepareOWLApp(templates);
+  app();
+}
+
+start();
+`;
+
+  const [owlSrc, utilsSrc] = await Promise.all([
+    getSourceCode("../owl"),
+    getSourceCode("./utils"),
+  ]);
+
+  zip.file("app.js", JS);
+  zip.file("utils.js", utilsSrc);
+  zip.file("app.css", css);
+  zip.file("app.py", APP_PY);
+  zip.file("app.xml", xml);
+  zip.file("index.html", DEFAULT_HTML);
+  zip.file("owl.js", owlSrc);
+  return zip.generateAsync({ type: "blob" });
+}

playground/index.html

@@ -12,6 +12,8 @@
 
     <!-- Application JS/CSS -->
     <link rel="stylesheet" href="playground.css">
+    <script type="module" src="export_snippet.js"></script>
+    <script type="module" src="utils.js"></script>
     <script type="module" src="app.js"></script>
 
   </head>

playground/playground.css

@@ -2,9 +2,7 @@
 html,
 body {
   height: 100%;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
-    Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Arial,
-    sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
 }
 
 body {
@@ -81,6 +79,19 @@ body {
   margin: 5px;
 }
 
+.share-code {
+  position: relative;
+}
+
+.copied-notification {
+  font-size: x-small;
+  position: absolute;
+  bottom: -5px;
+  white-space: nowrap;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
 /* TABBED EDITOR ****************************************/
 
 .tabbed-editor {
@@ -175,14 +186,9 @@ body {
 }
 
 .right-pane .note {
-  font-size: 20px;
+  font-size: 18px;
+  text-align: left;
   margin-top: 20px;
+  padding: 5%;
 }
 
-.right-pane .error {
-  height: 100%;
-  padding-top: 40%;
-  font-size: 30px;
-  color: darkred;
-  text-align: center;
-}

playground/templates.xml

@@ -1,8 +1,8 @@
 <templates>
   <div t-name="TabbedEditor" class="tabbed-editor">
     <div class="tabBar" t-att-class="{resizeable: props.resizeable}" t-on-mousedown="onMouseDown">
-        <t t-foreach="['js', 'xml', 'css']" t-as="tab">
-            <a t-ref="{{tab}}" t-if="props[tab]" t-key="tab" class="tab flash" t-att-class="{active: state.currentTab===tab}" t-on-click="setTab(tab)">
+        <t t-foreach="['js', 'xml', 'css']" t-as="tab" t-key="tab">
+            <a t-ref="{{tab}}" t-if="props[tab] !== false" t-key="tab" class="tab flash" t-att-class="{active: state.currentTab===tab}" t-on-click="() => setTab(tab)">
                 <t t-esc="tab"/>
             </a>
         </t>
@@ -11,7 +11,8 @@
   </div>
 
   <div t-name="App" class="playground">
-      <div class="left-bar" t-att-style="leftPaneStyle" t-att-class="{split: state.splitLayout}">
+      <div class="left-bar" t-att-class="{split: state.splitLayout}"
+           t-att-style="leftPaneStyle">
         <div class="menubar">
           <a class="btn run-code flash" t-on-click="runCode" title="Execute this Code">▶ Run</a>
           <select t-on-change="setSample">
@@ -21,20 +22,23 @@
           </select>
           <a class="btn flash" t-on-click="downloadCode" title="Download a Zip with this Code"><i class="fas fa-download"></i></a>
           <a class="layout-selector flash" t-on-click="toggleLayout" title="Toggle Layout"><i class="fas"  t-att-class="state.splitLayout ?  'fa-toggle-on' : 'fa-toggle-off'"></i></a>
+          <a class="btn flash share-code" t-on-click="shareCode" title="Copy a link to this playground"><span>Share</span><span class="copied-notification" t-if="state.copied">Copied link to clipboard!</span></a>
         </div>
+        <TabbedEditor
+            js="state.js"
+            css="!state.splitLayout and state.css"
+            xml="!state.splitLayout and state.xml"
+            style="topEditorStyle"
+            updateCode="updateCode"/>
         <t t-if="state.splitLayout">
-          <t t-widget="TabbedEditor"
-             t-props="{js:state.js, css:false, xml: false}"
-             t-on-updateCode="updateCode"
-             t-att-style="topEditorStyle"/>
           <div class="separator horizontal"/>
-          <t t-widget="TabbedEditor" t-keepalive="1"
-             t-props="{js:false, css:state.css, xml: state.xml, resizeable: true}"
-             t-on-updateCode="updateCode"
-             t-on-updatePanelHeight="updatePanelHeight"/>
-        </t>
-        <t t-else="1">
-          <t t-widget="TabbedEditor" t-props="{js:state.js, css:state.css, xml: state.xml, display: 'js|xml|css'}" t-on-updateCode="updateCode"/>
+          <TabbedEditor
+             js="false"
+             css="state.css"
+             xml="state.xml"
+             resizeable="true"
+             onUpdatePanelHeight="updatePanelHeight"
+             updateCode="updateCode"/>
         </t>
       </div>
       <div class="separator vertical" t-on-mousedown="onMouseDown"/>
@@ -43,10 +47,11 @@
           <div>🦉 Odoo Web Library 🦉</div>
           <div>v<t t-esc="version"/></div>
           <div class="url"><a href="https://github.com/odoo/owl">https://github.com/odoo/owl</a></div>
-          <div class="note">Note: these examples require a recent browser to work without a transpilation step. </div>
-        </div>
-        <div t-if="state.error" class="error">
-          <t t-esc="state.error"/>
+          <div class="note">
+            <p>Note: these examples are using recent features of Javascript, and require a recent browser to work without a transpilation step!
+              For example, it makes use of class fields and class static fields. These examples should work in a recent Chrome version.
+            </p>
+          </div>
         </div>
         <div class="content" t-ref="content"/>
       </div>

playground/utils.js

@@ -0,0 +1,49 @@
+export function debounce(func, wait, immediate) {
+  let timeout;
+  return function () {
+    const context = this;
+    const args = arguments;
+    function later() {
+      timeout = null;
+      if (!immediate) {
+        func.apply(context, args);
+      }
+    }
+    const callNow = immediate && !timeout;
+    clearTimeout(timeout);
+    timeout = setTimeout(later, wait);
+    if (callNow) {
+      func.apply(context, args);
+    }
+  };
+}
+
+export function useBus(bus, evName, cb) {
+  bus.addEventListener(evName, cb);
+  owl.onWillUnmount(() => {
+    bus.removeEventListener(evName, cb);
+  });
+}
+
+const loadedScripts = {};
+
+export function loadJS(url) {
+  if (url in loadedScripts) {
+    return loadedScripts[url];
+  }
+  const promise = new Promise(function (resolve, reject) {
+    const script = document.createElement("script");
+    script.type = "text/javascript";
+    script.src = url;
+    script.onload = function () {
+      resolve();
+    };
+    script.onerror = function () {
+      reject(`Error loading file '${url}'`);
+    };
+    const head = document.head || document.getElementsByTagName("head")[0];
+    head.appendChild(script);
+  });
+  loadedScripts[url] = promise;
+  return promise;
+}

release-notes.md

@@ -0,0 +1,8 @@
+# v1.0.5
+
+- lots of doc improvements
+- qweb: ignore comments between t-if/t-elif/t-else
+- qweb: support attributes with inside quotes
+- component: concurrency bug fix
+- component: cancel previous mounting operations if necessary
+- transition: no crash if element added/removed quickly

rollup.config.js

@@ -1,14 +0,0 @@
-import { version } from "./package.json";
-import git from "git-rev-sync";
-
-// rollup.config.js
-export default {
-  input: "dist/owl/index.js",
-  output: {
-    file: "dist/owl.js",
-    format: "iife",
-    name: "owl",
-    extend: true,
-    outro: `exports.__info__.version = '${version}';\nexports.__info__.date = '${new Date().toISOString()}';\nexports.__info__.hash = '${git.short()}';\nexports.__info__.url = 'https://github.com/odoo/owl';`
-  }
-};

src/component.ts

@@ -1,610 +0,0 @@
-import { EventBus } from "./event_bus";
-import { Observer } from "./observer";
-import { QWeb, CompiledTemplate } from "./qweb_core";
-import { h, patch, VNode } from "./vdom";
-
-/**
- * Owl Component System
- *
- * This file introduces a declarative and composable component system. It
- * contains:
- *
- * - the Env interface (generic type for the environment)
- * - the Meta interface (the owl specific metadata attached to a component)
- * - the Component class
- */
-
-//------------------------------------------------------------------------------
-// Types/helpers
-//------------------------------------------------------------------------------
-
-export interface Env {
-  qweb: QWeb;
-}
-
-export interface Meta<T extends Env, Props> {
-  readonly id: number;
-  vnode: VNode | null;
-  isMounted: boolean;
-  isDestroyed: boolean;
-  parent: Component<T, any, any> | null;
-  children: { [key: number]: Component<T, any, any> };
-  // children mapping: from templateID to widgetID
-  // should it be a map number => Widget?
-  cmap: { [key: number]: number };
-
-  renderId: number;
-  renderProps: Props | null;
-  renderPromise: Promise<VNode> | null;
-  boundHandlers: { [key: number]: any };
-  observer?: Observer;
-  render?: CompiledTemplate;
-  mountedHandlers: { [key: number]: Function };
-}
-
-// If a component does not define explicitely a template
-// key, it needs to find a template with its name (or a parent's).  This is
-// qweb dependant, so we need a place to store this information indexed by
-// qweb instances.
-const TEMPLATE_MAP: { [key: number]: { [name: string]: string } } = {};
-
-//------------------------------------------------------------------------------
-// Widget
-//------------------------------------------------------------------------------
-let nextId = 1;
-
-export class Component<
-  T extends Env,
-  Props extends {},
-  State extends {}
-> extends EventBus {
-  readonly __owl__: Meta<Env, Props>;
-  template?: string;
-
-  get el(): HTMLElement | null {
-    return this.__owl__.vnode ? (<any>this).__owl__.vnode.elm : null;
-  }
-
-  env: T;
-  state?: State;
-  props: Props;
-
-  // type of props is not easily representable in typescript...
-  static props?: any;
-  static defaultProps?: any;
-
-  refs: {
-    [key: string]: Component<T, any, any> | HTMLElement | undefined;
-  } = {};
-
-  //--------------------------------------------------------------------------
-  // Lifecycle
-  //--------------------------------------------------------------------------
-
-  /**
-   * Creates an instance of Component.
-   *
-   * The root widget of a component tree needs an environment:
-   *
-   * ```javascript
-   *   const root = new RootWidget(env, props);
-   * ```
-   *
-   * Every other widget simply needs a reference to its parent:
-   *
-   * ```javascript
-   *   const child = new SomeWidget(parent, props);
-   * ```
-   *
-   * Note that most of the time, only the root widget needs to be created by
-   * hand.  Other widgets should be created automatically by the framework (with
-   * the t-widget directive in a template)
-   */
-  constructor(parent: Component<T, any, any> | T, props?: Props) {
-    super();
-
-    const defaultProps = (<any>this.constructor).defaultProps;
-    if (defaultProps) {
-      props = this._applyDefaultProps(props, defaultProps);
-    }
-    if (QWeb.dev) {
-      this._validateProps(props || {});
-    }
-    // is this a good idea?
-    //   Pro: if props is empty, we can create easily a widget
-    //   Con: this is not really safe
-    //   Pro: but creating widget (by a template) is always unsafe anyway
-    this.props = <Props>props || <Props>{};
-    let id: number = nextId++;
-    let p: Component<T, any, any> | null = null;
-    if (parent instanceof Component) {
-      p = parent;
-      this.env = parent.env;
-      parent.__owl__.children[id] = this;
-    } else {
-      this.env = parent;
-    }
-    this.__owl__ = {
-      id: id,
-      vnode: null,
-      isMounted: false,
-      isDestroyed: false,
-      parent: p,
-      children: {},
-      cmap: {},
-      renderId: 1,
-      renderPromise: null,
-      renderProps: props || null,
-      boundHandlers: {},
-      mountedHandlers: {}
-    };
-  }
-
-  /**
-   * willStart is an asynchronous hook that can be implemented to perform some
-   * action before the initial rendering of a component.
-   *
-   * It will be called exactly once before the initial rendering. It is useful
-   * in some cases, for example, to load external assets (such as a JS library)
-   * before the widget is rendered.
-   *
-   * Note that a slow willStart method will slow down the rendering of the user
-   * interface.  Therefore, some effort should be made to make this method as
-   * fast as possible.
-   *
-   * Note: this method should not be called manually.
-   */
-  async willStart() {}
-
-  /**
-   * mounted is a hook that is called each time a component is attached to the
-   * DOM. This is a good place to add some listeners, or to interact with the
-   * DOM, if the component needs to perform some measure for example.
-   *
-   * Note: this method should not be called manually.
-   *
-   * @see willUnmount
-   */
-  mounted() {}
-
-  /**
-   * The willUpdateProps is an asynchronous hook, called just before new props
-   * are set. This is useful if the component needs some asynchronous task
-   * performed, depending on the props (for example, assuming that the props are
-   * some record Id, fetching the record data).
-   *
-   * This hook is not called during the first render (but willStart is called
-   * and performs a similar job).
-   */
-  async willUpdateProps(nextProps: Props) {}
-
-  /**
-   * The willPatch hook is called just before the DOM patching process starts.
-   * It is not called on the initial render.  This is useful to get some
-   * information which are in the DOM.  For example, the current position of the
-   * scrollbar
-   *
-   * The return value of willPatch will be given to the patched function.
-   */
-  willPatch(): any {}
-
-  /**
-   * This hook is called whenever a component did actually update its props,
-   * state or env.
-   *
-   * This method is not called on the initial render. It is useful to interact
-   * with the DOM (for example, through an external library) whenever the
-   * component was updated.
-   *
-   * Updating the widget state in this hook is possible, but not encouraged.
-   * One need to be careful, because updates here will cause rerender, which in
-   * turn will cause other calls to updated. So, we need to be particularly
-   * careful at avoiding endless cycles.
-   *
-   * The snapshot parameter is the result of the call to willPatch.
-   */
-  patched(snapshot: any) {}
-
-  /**
-   * willUnmount is a hook that is called each time just before a component is
-   * unmounted from the DOM. This is a good place to remove some listeners, for
-   * example.
-   *
-   * Note: this method should not be called manually.
-   *
-   * @see mounted
-   */
-  willUnmount() {}
-
-  //--------------------------------------------------------------------------
-  // Public
-  //--------------------------------------------------------------------------
-
-  async mount(target: HTMLElement): Promise<void> {
-    const vnode = await this._prepare();
-    if (this.__owl__.isDestroyed) {
-      // widget was destroyed before we get here...
-      return;
-    }
-    this._patch(vnode);
-    target.appendChild(this.el!);
-
-    if (document.body.contains(target)) {
-      this._callMounted();
-    }
-  }
-
-  _callMounted() {
-    const __owl__ = this.__owl__;
-    const children = __owl__.children;
-    for (let id in children) {
-      const comp = children[id];
-      if (!comp.__owl__.isMounted && this.el!.contains(comp.el)) {
-        comp._callMounted();
-      }
-    }
-    __owl__.isMounted = true;
-    const handlers = __owl__.mountedHandlers;
-    for (let key in handlers) {
-      handlers[key]();
-    }
-    this.mounted();
-  }
-
-  _callWillUnmount() {
-    this.willUnmount();
-    const __owl__ = this.__owl__;
-    __owl__.isMounted = false;
-    const children = __owl__.children;
-    for (let id in children) {
-      const comp = children[id];
-      if (comp.__owl__.isMounted) {
-        comp._callWillUnmount();
-      }
-    }
-  }
-
-  unmount() {
-    if (this.__owl__.isMounted) {
-      this._callWillUnmount();
-      this.el!.remove();
-    }
-  }
-
-  async render(force: boolean = false, patchQueue?: any[]): Promise<void> {
-    const __owl__ = this.__owl__;
-    if (!__owl__.isMounted) {
-      return;
-    }
-    const shouldPatch: boolean = !patchQueue;
-    if (shouldPatch) {
-      patchQueue = [];
-    }
-    const renderVDom = this._render(force, patchQueue);
-    const renderId = __owl__.renderId;
-    await renderVDom;
-
-    if (shouldPatch && __owl__.isMounted && renderId === __owl__.renderId) {
-      // we only update the vnode and the actual DOM if no other rendering
-      // occurred between now and when the render method was initially called.
-      const patchLen = patchQueue!.length;
-      for (let i = 0; i < patchLen; i++) {
-        const patch = patchQueue![i];
-        patch.push(patch[0].willPatch());
-      }
-      for (let i = 0; i < patchLen; i++) {
-        const patch = patchQueue![i];
-        patch[0]._patch(patch[1]);
-      }
-
-      for (let i = patchLen - 1; i >= 0; i--) {
-        const patch = patchQueue![i];
-        patch[0].patched(patch[2]);
-      }
-    }
-  }
-
-  destroy() {
-    const __owl__ = this.__owl__;
-    if (!__owl__.isDestroyed) {
-      const el = this.el;
-      this._destroy(__owl__.parent);
-      if (el) {
-        el.remove();
-      }
-    }
-  }
-
-  _destroy(parent) {
-    const __owl__ = this.__owl__;
-    const isMounted = __owl__.isMounted;
-    if (isMounted) {
-      this.willUnmount();
-      __owl__.isMounted = false;
-    }
-    const children = __owl__.children;
-    for (let key in children) {
-      children[key]._destroy(this);
-    }
-    if (parent) {
-      let id = __owl__.id;
-      delete parent.__owl__.children[id];
-      __owl__.parent = null;
-    }
-    this.clear();
-    __owl__.isDestroyed = true;
-    delete __owl__.vnode;
-  }
-
-  shouldUpdate(nextProps: Props): boolean {
-    return true;
-  }
-
-  /**
-   * This method is the correct way to update the environment of a widget. Doing
-   * this will cause a full rerender of the widget and its children, so this is
-   * an operation that should not be done frequently.
-   *
-   * A good usecase for updating the environment would be to update some mostly
-   * static config keys, such as a boolean to determine if we are in mobile
-   * mode or not.
-   */
-  async updateEnv(nextEnv: Partial<T>): Promise<void> {
-    const __owl__ = this.__owl__;
-    if (__owl__.parent && __owl__.parent.env === this.env) {
-      this.env = Object.create(this.env);
-    }
-    Object.assign(this.env, nextEnv);
-    if (__owl__.isMounted) {
-      await this.render(true);
-    }
-  }
-
-  set(target: any, key: string | number, value: any) {
-    this.__owl__.observer!.set(target, key, value);
-  }
-
-  //--------------------------------------------------------------------------
-  // Private
-  //--------------------------------------------------------------------------
-
-  async _updateProps(
-    nextProps: Props,
-    forceUpdate: boolean = false,
-    patchQueue?: any[]
-  ): Promise<void> {
-    const shouldUpdate = forceUpdate || this.shouldUpdate(nextProps);
-    if (shouldUpdate) {
-      const defaultProps = (<any>this.constructor).defaultProps;
-      if (defaultProps) {
-        nextProps = this._applyDefaultProps(nextProps, defaultProps);
-      }
-      if (QWeb.dev) {
-        this._validateProps(nextProps);
-      }
-      await this.willUpdateProps(nextProps);
-      this.props = nextProps;
-      await this.render(forceUpdate, patchQueue);
-    }
-  }
-
-  _patch(vnode) {
-    const __owl__ = this.__owl__;
-    __owl__.renderPromise = null;
-    const target = __owl__.vnode || document.createElement(vnode.sel!);
-    __owl__.vnode = patch(target, vnode);
-  }
-  _prepare(): Promise<VNode> {
-    const __owl__ = this.__owl__;
-    __owl__.renderProps = this.props;
-    __owl__.renderPromise = this._prepareAndRender();
-    return __owl__.renderPromise;
-  }
-
-  async _prepareAndRender(): Promise<VNode> {
-    await this.willStart();
-      const __owl__ = this.__owl__;
-    if (__owl__.isDestroyed) {
-      return Promise.resolve(h("div"));
-    }
-    const qweb = this.env.qweb;
-    if (!this.template) {
-      let tmap = TEMPLATE_MAP[qweb.id];
-      if (!tmap) {
-        tmap = {};
-        TEMPLATE_MAP[qweb.id] = tmap;
-      }
-      let p = (<any>this).constructor;
-      let name: string = p.name;
-      let template = tmap[name];
-      if (template) {
-        this.template = template;
-      } else {
-        while (
-          (template = p.name) &&
-          !(template in qweb.templates) &&
-          p !== Component
-        ) {
-          p = p.__proto__;
-        }
-        if (p === Component) {
-          this.template = "default";
-        } else {
-          tmap[name] = template;
-          this.template = template;
-        }
-      }
-    }
-    __owl__.render = qweb.render.bind(qweb, this.template);
-    this._observeState();
-    return this._render();
-  }
-  async _render(
-    force: boolean = false,
-    patchQueue: any[] = []
-  ): Promise<VNode> {
-      const __owl__ = this.__owl__;
-    __owl__.renderId++;
-    const promises: Promise<void>[] = [];
-    const patch: any[] = [this];
-    if (__owl__.isMounted) {
-      patchQueue.push(patch);
-    }
-    if (__owl__.observer) {
-      __owl__.observer.allowMutations = false;
-    }
-    let vnode = __owl__.render!(this, {
-      promises,
-      handlers: __owl__.boundHandlers,
-      mountedHandlers: __owl__.mountedHandlers,
-      forceUpdate: force,
-      patchQueue
-    });
-    patch.push(vnode);
-    if (__owl__.observer) {
-      __owl__.observer.allowMutations = true;
-    }
-
-    // this part is critical for the patching process to be done correctly. The
-    // tricky part is that a child widget can be rerendered on its own, which
-    // will update its own vnode representation without the knowledge of the
-    // parent widget.  With this, we make sure that the parent widget will be
-    // able to patch itself properly after
-    vnode.key = __owl__.id;
-    __owl__.renderProps = this.props;
-    __owl__.renderPromise = Promise.all(promises).then(() => vnode);
-    return __owl__.renderPromise;
-  }
-
-  /**
-   * Only called by qweb t-widget directive
-   */
-  _mount(vnode: VNode, elm: HTMLElement): VNode {
-      const __owl__ = this.__owl__;
-    __owl__.vnode = patch(elm, vnode);
-    if (__owl__.parent!.__owl__.isMounted && !__owl__.isMounted) {
-      this._callMounted();
-    }
-    return __owl__.vnode;
-  }
-
-  /**
-   * Only called by qweb t-widget directive (when t-keepalive is set)
-   */
-  _remount() {
-      const __owl__ = this.__owl__;
-    if (!__owl__.isMounted) {
-      __owl__.isMounted = true;
-      this.mounted();
-    }
-  }
-
-  _observeState() {
-    if (this.state) {
-      const __owl__ = this.__owl__;
-      __owl__.observer = new Observer();
-      __owl__.observer.observe(this.state);
-      __owl__.observer.notifyCB = this.render.bind(this);
-    }
-  }
-
-  /**
-   * Apply default props (only top level).
-   *
-   * Note that this method does not modify in place the props, it returns a new
-   * prop object
-   */
-  _applyDefaultProps(props: Object | undefined, defaultProps: Object): Props {
-    props = props ? Object.create(props) : {};
-    for (let propName in defaultProps) {
-      if (props![propName] === undefined) {
-        props![propName] = defaultProps[propName];
-      }
-    }
-    return <Props>props;
-  }
-
-  /**
-   * Validate the component props (or next props) against the (static) props
-   * description.  This is potentially an expensive operation: it may needs to
-   * visit recursively the props and all the children to check if they are valid.
-   * This is why it is only done in 'dev' mode.
-   */
-  _validateProps(props: Object) {
-    const propsDef = (<any>this.constructor).props;
-    if (propsDef instanceof Array) {
-      // list of strings (prop names)
-      for (let i = 0, l = propsDef.length; i < l; i++) {
-        if (!(propsDef[i] in props)) {
-          throw new Error(
-            `Missing props '${propsDef[i]}' (widget '${this.constructor.name}')`
-          );
-        }
-      }
-    } else if (propsDef) {
-      // propsDef is an object now
-      for (let propName in propsDef) {
-        if (!(propName in props)) {
-          if (propsDef[propName] && !propsDef[propName].optional) {
-            throw new Error(
-              `Missing props '${propName}' (widget '${this.constructor.name}')`
-            );
-          } else {
-            break;
-          }
-        }
-        let isValid = isValidProp(props[propName], propsDef[propName]);
-        if (!isValid) {
-          throw new Error(
-            `Props '${propName}' of invalid type in widget '${
-              this.constructor.name
-            }'`
-          );
-        }
-      }
-    }
-  }
-}
-
-//------------------------------------------------------------------------------
-// Prop validation helper
-//------------------------------------------------------------------------------
-
-/**
- * Check if an invidual prop value matches its (static) prop definition
- */
-function isValidProp(prop, propDef): boolean {
-  if (typeof propDef === "function") {
-    // Check if a value is constructed by some Constructor.  Note that there is a
-    // slight abuse of language: we want to consider primitive values as well.
-    //
-    // So, even though 1 is not an instance of Number, we want to consider that
-    // it is valid.
-    if (typeof prop === "object") {
-      return prop instanceof propDef;
-    }
-    return typeof prop === propDef.name.toLowerCase();
-  } else if (propDef instanceof Array) {
-    // If this code is executed, this means that we want to check if a prop
-    // matches at least one of its descriptor.
-    let result = false;
-    for (let i = 0, iLen = propDef.length; i < iLen; i++) {
-      result = result || isValidProp(prop, propDef[i]);
-    }
-    return result;
-  }
-  // propsDef is an object
-  let result = isValidProp(prop, propDef.type);
-  if (propDef.type === Array) {
-    for (let i = 0, iLen = prop.length; i < iLen; i++) {
-      result = result && isValidProp(prop[i], propDef.element);
-    }
-  }
-  if (propDef.type === Object) {
-    const shape = propDef.shape;
-    for (let key in shape) {
-      result = result && isValidProp(prop[key], shape[key]);
-    }
-  }
-  return result;
-}

src/event_bus.ts

@@ -1,79 +0,0 @@
-/**
- * We define here a simple event bus: it can
- * - emit events
- * - add/remove listeners.
- *
- * This is a useful pattern of communication in many cases.  For OWL, each
- * components and stores are event buses.
- */
-
-//------------------------------------------------------------------------------
-// Types
-//------------------------------------------------------------------------------
-
-export type Callback = (...args: any[]) => void;
-
-export interface Subscription {
-  owner: any;
-  callback: Callback;
-}
-
-//------------------------------------------------------------------------------
-// EventBus
-//------------------------------------------------------------------------------
-
-export class EventBus {
-  subscriptions: { [eventType: string]: Subscription[] } = {};
-
-  /**
-   * Add a listener for the 'eventType' events.
-   *
-   * Note that the 'owner' of this event can be anything, but will more likely
-   * be a widget or a class. The idea is that the callback will be called with
-   * the proper owner bound.
-   *
-   * Also, the owner should be kind of unique. This will be used to remove the
-   * listener.
-   */
-  on(eventType: string, owner: any, callback: Callback) {
-    if (!callback) {
-      throw new Error("Missing callback");
-    }
-    if (!this.subscriptions[eventType]) {
-      this.subscriptions[eventType] = [];
-    }
-    this.subscriptions[eventType].push({
-      owner,
-      callback
-    });
-  }
-
-  /**
-   * Remove a listener
-   */
-  off(eventType: string, owner: any) {
-    const subs = this.subscriptions[eventType];
-    if (subs) {
-      this.subscriptions[eventType] = subs.filter(s => s.owner !== owner);
-    }
-  }
-
-  /**
-   * Emit an event of type 'eventType'.  Any extra arguments will be passed to
-   * the listeners callback.
-   */
-  trigger(eventType: string, ...args: any[]) {
-    const subs = this.subscriptions[eventType] || [];
-    for (let i = 0, iLen = subs.length; i < iLen; i++) {
-      const sub = subs[i];
-      sub.callback.call(sub.owner, ...args);
-    }
-  }
-
-  /**
-   * Remove all subscriptions.
-   */
-  clear() {
-    this.subscriptions = {};
-  }
-}

src/index.ts

@@ -1,39 +0,0 @@
-/**
- * This file is the main file packaged by rollup (see rollup.config.js).  From
- * this file, we export all public owl elements.
- *
- * Note that dynamic values, such as a date or a commit hash are added by rollup
- */
-export { Component } from "./component";
-export { EventBus } from "./event_bus";
-export { Observer } from "./observer";
-
-// we need to import manually the extra directives so they can register
-// themselves in QWeb, otherwise these files will not even be loaded.
-import "./qweb_directives";
-import "./qweb_extensions";
-import { QWeb } from "./qweb_core";
-export { QWeb };
-
-export { connect, Store } from "./store";
-import * as _utils from "./utils";
-
-export const __info__ = {};
-
-Object.defineProperty(__info__, "mode", {
-  get() {
-    return QWeb.dev ? "dev" : "prod";
-  },
-  set(mode: string) {
-    QWeb.dev = mode === "dev";
-    if (QWeb.dev) {
-      const url = `https://github.com/odoo/owl/blob/master/doc/tooling.md#development-mode`;
-      console.warn(
-        `Owl is running in 'dev' mode.  This is not suitable for production use. See ${url} for more information.`
-      );
-    } else {
-        console.log(`Owl is now running in 'prod' mode.`)
-    }
-  }
-});
-export const utils = _utils;

src/observer.ts

@@ -1,167 +0,0 @@
-/**
- * Owl Observer
- *
- * This code contains the logic that allows Owl to observe and react to state
- * changes.
- *
- * This is a Observer class that can observe any JS values.  The way it works
- * can be summarized thusly:
- * - primitive values are not observed at all
- * - Objects are observed by replacing all their keys with getters/setters
- *   (recursively)
- * - Arrays are observed by replacing their prototype with a customized version,
- *   which wrap some methods to allow the tracking of each state change.
- *
- * Note that this code is inspired by Vue.
- */
-
-//------------------------------------------------------------------------------
-// Modified Array prototype
-//------------------------------------------------------------------------------
-
-// we define here a new modified Array prototype, which basically override all
-// Array methods that change some state to be able to track their changes
-const methodsToPatch = [
-  "push",
-  "pop",
-  "shift",
-  "unshift",
-  "splice",
-  "sort",
-  "reverse"
-];
-const methodLen = methodsToPatch.length;
-
-const ArrayProto = Array.prototype;
-const ModifiedArrayProto = Object.create(ArrayProto);
-
-for (let i = 0; i < methodLen; i++) {
-  const method = methodsToPatch[i];
-  const initialMethod = ArrayProto[method];
-  ModifiedArrayProto[method] = function(...args) {
-    if (!this.__observer__.allowMutations) {
-      throw new Error(`Array cannot be changed here")`);
-    }
-    this.__observer__.rev++;
-    this.__observer__.notifyChange();
-    this.__owl__.rev++;
-    let parent = this;
-    do {
-      parent.__owl__.deepRev++;
-    } while ((parent = parent.__owl__.parent));
-    let inserted;
-    switch (method) {
-      case "push":
-      case "unshift":
-        inserted = args;
-        break;
-      case "splice":
-        inserted = args.slice(2);
-        break;
-    }
-    if (inserted) {
-      for (let i = 0, iLen = inserted.length; i < iLen; i++) {
-        this.__observer__.observe(inserted[i], this);
-      }
-    }
-    return initialMethod.call(this, ...args);
-  };
-}
-
-//------------------------------------------------------------------------------
-// Observer
-//------------------------------------------------------------------------------
-export class Observer {
-  rev: number = 1;
-  allowMutations: boolean = true;
-  dirty: boolean = false;
-
-  notifyCB() {}
-  notifyChange() {
-    this.dirty = true;
-    Promise.resolve().then(() => {
-      if (this.dirty) {
-        this.dirty = false;
-        this.notifyCB();
-      }
-    });
-  }
-
-  observe(value: any, parent?: any) {
-    if (value === null) {
-      // fun fact: typeof null === 'object'
-      return;
-    }
-    if (typeof value !== "object") {
-      return;
-    }
-    if ("__owl__" in value) {
-      // already observed
-      value.__owl__.parent = parent;
-      return;
-    }
-    if (Array.isArray(value)) {
-      this._observeArr(value, parent);
-    } else {
-      this._observeObj(value, parent);
-    }
-  }
-
-  set(target: any, key: number | string, value: any) {
-    this.rev++;
-    this._addProp(target, key, value);
-    target.__owl__.rev++;
-    this.notifyChange();
-  }
-
-  _observeObj<T extends { __owl__?: any }>(obj: T, parent?: any) {
-    obj.__owl__ = { rev: this.rev, deepRev: this.rev, parent };
-    Object.defineProperty(obj, "__owl__", { enumerable: false });
-    for (let key in obj) {
-      this._addProp(obj, key, obj[key]);
-    }
-  }
-
-  _observeArr(arr: Array<any>, parent?: any) {
-    (<any>arr).__owl__ = { rev: this.rev, deepRev: this.rev, parent };
-    Object.defineProperty(arr, "__owl__", { enumerable: false });
-    (<any>arr).__proto__ = Object.create(ModifiedArrayProto);
-    (<any>arr).__proto__.__observer__ = this;
-    for (let i = 0, iLen = arr.length; i < iLen; i++) {
-      this.observe(arr[i], arr);
-    }
-  }
-
-  _addProp<T extends { __owl__?: any }>(
-    obj: T,
-    key: string | number,
-    value: any
-  ) {
-    var self = this;
-    Object.defineProperty(obj, key, {
-      enumerable: true,
-      get() {
-        return value;
-      },
-      set(newVal) {
-        if (newVal !== value) {
-          self.rev++;
-          if (!self.allowMutations) {
-            throw new Error(
-              `Observed state cannot be changed here! (key: "${key}", val: "${newVal}")`
-            );
-          }
-          value = newVal;
-          self.observe(newVal, obj);
-          obj.__owl__.rev!++;
-          let parent = obj;
-          do {
-            parent.__owl__.deepRev++;
-          } while ((parent = parent.__owl__.parent) && parent !== obj);
-          self.notifyChange();
-        }
-      }
-    });
-    this.observe(value, obj);
-  }
-}

src/qweb_core.ts

@@ -1,778 +0,0 @@
-import { VNode, h } from "./vdom";
-
-/**
- * Owl QWeb Engine
- *
- * In this file, you will find a QWeb engine/template compiler.  It is the core
- * of how Owl component works.
- *
- * Briefly, Owl QWeb compiles XML templates into functions that output a virtual
- * DOM representation.
- *
- * We have here:
- * - a CompilationContext class, which is an internal object that contains all
- *   compilation specific information, while a template is being compiled.
- * - a QWeb class: this is the code of the QWeb compiler.
- *
- * Note that this file does not contain the implementation of the QWeb
- * directives (see qweb_directives.ts and qweb_extensions.ts).
- */
-
-//------------------------------------------------------------------------------
-// Types
-//------------------------------------------------------------------------------
-export type EvalContext = { [key: string]: any };
-export type CompiledTemplate = (context: EvalContext, extra: any) => VNode;
-
-interface Template {
-  elem: Element;
-  fn: CompiledTemplate;
-}
-
-interface CompilationInfo {
-  node: Element;
-  qweb: QWeb;
-  ctx: Context;
-  fullName: string;
-  value: string;
-}
-
-interface NodeCreationCompilationInfo extends CompilationInfo {
-  nodeID: number;
-  addNodeHook: Function;
-}
-
-export interface Directive {
-  name: string;
-  extraNames?: string[];
-  priority: number;
-  // if return true, then directive is fully applied and there is no need to
-  // keep processing node. Otherwise, we keep going.
-  atNodeEncounter?(info: CompilationInfo): boolean | void;
-  atNodeCreation?(info: NodeCreationCompilationInfo): void;
-  finalize?(info: CompilationInfo): void;
-}
-
-//------------------------------------------------------------------------------
-// Const/global stuff/helpers
-//------------------------------------------------------------------------------
-const RESERVED_WORDS = "true,false,NaN,null,undefined,debugger,console,window,in,instanceof,new,function,return,this,typeof,eval,void,Math,RegExp,Array,Object,Date".split(
-  ","
-);
-
-const WORD_REPLACEMENT = {
-  and: "&&",
-  or: "||",
-  gt: ">",
-  gte: ">=",
-  lt: "<",
-  lte: "<="
-};
-
-const DISABLED_TAGS = [
-  "input",
-  "textarea",
-  "button",
-  "select",
-  "option",
-  "optgroup"
-];
-
-const lineBreakRE = /[\r\n]/;
-const whitespaceRE = /\s+/g;
-
-const DIRECTIVE_NAMES = {
-  name: 1,
-  att: 1,
-  attf: 1,
-  key: 1
-};
-
-const DIRECTIVES: Directive[] = [];
-
-const NODE_HOOKS_PARAMS = {
-  create: "(_, n)",
-  insert: "vn",
-  remove: "(vn, rm)"
-};
-
-interface Utils {
-  h: typeof h;
-  objectToAttrString(obj: Object): string;
-  [key: string]: any;
-}
-
-export const UTILS: Utils = {
-  h: h,
-  objectToAttrString(obj: Object): string {
-    let classes: string[] = [];
-    for (let k in obj) {
-      if (obj[k]) {
-        classes.push(k);
-      }
-    }
-    return classes.join(" ");
-  }
-};
-
-function parseXML(xml: string): Document {
-  const parser = new DOMParser();
-  const doc = parser.parseFromString(xml, "text/xml");
-  if (doc.getElementsByTagName("parsererror").length) {
-    throw new Error("Invalid XML in template");
-  }
-  return doc;
-}
-
-let nextID = 1;
-
-//------------------------------------------------------------------------------
-// QWeb rendering engine
-//------------------------------------------------------------------------------
-export class QWeb {
-  templates: { [name: string]: Template } = {};
-  utils = UTILS;
-  static widgets = Object.create(null);
-
-  // dev mode enables better error messages or more costly validations
-  static dev: boolean = false;
-
-  // the id field is useful to be able to hash qweb instances.  The current
-  // use case is that component's templates are qweb dependant, and need to be
-  // able to map a qweb instance to a template name.
-  id = nextID++;
-
-  constructor(data?: string) {
-    if (data) {
-      this.addTemplates(data);
-    }
-    this.addTemplate("default", "<div></div>");
-  }
-
-  static addDirective(directive: Directive) {
-    DIRECTIVES.push(directive);
-    DIRECTIVE_NAMES[directive.name] = 1;
-    DIRECTIVES.sort((d1, d2) => d1.priority - d2.priority);
-    if (directive.extraNames) {
-      directive.extraNames.forEach(n => (DIRECTIVE_NAMES[n] = 1));
-    }
-  }
-
-  static register(name: string, Component: any) {
-    if (QWeb.widgets[name]) {
-      throw new Error(`Component '${name}' has already been registered`);
-    }
-    QWeb.widgets[name] = Component;
-  }
-
-  /**
-   * Add a template to the internal template map.  Note that it is not
-   * immediately compiled.
-   */
-  addTemplate(name: string, xmlString: string) {
-    const doc = parseXML(xmlString);
-    if (!doc.firstChild) {
-      throw new Error("Invalid template (should not be empty)");
-    }
-    this._addTemplate(name, <Element>doc.firstChild);
-  }
-
-  /**
-   * Load templates from a xml (as a string).  This will look up for the first
-   * <templates> tag, and will consider each child of this as a template, with
-   * the name given by the t-name attribute.
-   */
-  addTemplates(xmlstr: string) {
-    const doc = parseXML(xmlstr);
-    const templates = doc.getElementsByTagName("templates")[0];
-    if (!templates) {
-      return;
-    }
-    for (let elem of <any>templates.children) {
-      const name = elem.getAttribute("t-name");
-      this._addTemplate(name, elem);
-    }
-  }
-
-  _addTemplate(name: string, elem: Element) {
-    if (name in this.templates) {
-      throw new Error(`Template ${name} already defined`);
-    }
-    this._processTemplate(elem);
-    const template = {
-      elem,
-      fn: (context, extra) => {
-        const compiledFunction = this._compile(name, elem);
-        template.fn = compiledFunction;
-        return compiledFunction.call(this, context, extra);
-      }
-    };
-    this.templates[name] = template;
-  }
-
-  _processTemplate(elem: Element) {
-    let tbranch = elem.querySelectorAll("[t-elif], [t-else]");
-    for (let i = 0, ilen = tbranch.length; i < ilen; i++) {
-      let node = tbranch[i];
-      let prevElem = node.previousElementSibling!;
-      let pattr = function(name) {
-        return prevElem.getAttribute(name);
-      };
-      let nattr = function(name) {
-        return +!!node.getAttribute(name);
-      };
-      if (prevElem && (pattr("t-if") || pattr("t-elif"))) {
-        if (pattr("t-foreach")) {
-          throw new Error(
-            "t-if cannot stay at the same level as t-foreach when using t-elif or t-else"
-          );
-        }
-        if (
-          ["t-if", "t-elif", "t-else"].map(nattr).reduce(function(a, b) {
-            return a + b;
-          }) > 1
-        ) {
-          throw new Error(
-            "Only one conditional branching directive is allowed per node"
-          );
-        }
-        // All text nodes between branch nodes are removed
-        let textNode;
-        while ((textNode = node.previousSibling) !== prevElem) {
-          if (textNode.nodeValue.trim().length) {
-            throw new Error("text is not allowed between branching directives");
-          }
-          textNode.remove();
-        }
-      } else {
-        throw new Error(
-          "t-elif and t-else directives must be preceded by a t-if or t-elif directive"
-        );
-      }
-    }
-  }
-  /**
-   * Render a template
-   *
-   * @param {string} name the template should already have been added
-   */
-  render(name: string, context: EvalContext = {}, extra: any = null): VNode {
-    const template = this.templates[name];
-    if (!template) {
-      throw new Error(`Template ${name} does not exist`);
-    }
-    return template.fn.call(this, context, extra);
-  }
-
-  _compile(name: string, elem: Element): CompiledTemplate {
-    const isDebug = elem.attributes.hasOwnProperty("t-debug");
-    const ctx = new Context(name);
-    this._compileNode(elem, ctx);
-
-    if (ctx.shouldProtectContext) {
-      ctx.code.unshift("    context = Object.create(context);");
-    }
-    if (ctx.shouldDefineOwner) {
-      // this is necessary to prevent some directives (t-forach for ex) to
-      // pollute the rendering context by adding some keys in it.
-      ctx.code.unshift("    let owner = context;");
-    }
-    if (ctx.shouldDefineQWeb) {
-      ctx.code.unshift("    let QWeb = this.constructor;");
-    }
-    if (ctx.shouldDefineUtils) {
-      ctx.code.unshift("    let utils = this.utils;");
-    }
-
-    if (!ctx.rootNode) {
-      throw new Error("A template should have one root node");
-    }
-    ctx.addLine(`return vn${ctx.rootNode};`);
-    let template;
-    try {
-      template = new Function(
-        "context",
-        "extra",
-        ctx.code.join("\n")
-      ) as CompiledTemplate;
-    } catch (e) {
-      throw new Error(
-        `Invalid generated code while compiling template '${ctx.templateName.replace(
-          /`/g,
-          "'"
-        )}': ${e.message}`
-      );
-    }
-    if (isDebug) {
-      console.log(
-        `Template: ${this.templates[name].elem.outerHTML}\nCompiled code:\n` +
-          template.toString()
-      );
-    }
-    return template;
-  }
-
-  /**
-   * Generate code from an xml node
-   *
-   */
-  _compileNode(node: ChildNode, ctx: Context) {
-    if (!(node instanceof Element)) {
-      // this is a text node, there are no directive to apply
-      let text = node.textContent!;
-      if (!ctx.inPreTag) {
-        if (lineBreakRE.test(text) && !text.trim()) {
-          return;
-        }
-        text = text.replace(whitespaceRE, " ");
-      }
-      if (ctx.parentNode) {
-        ctx.addLine(`c${ctx.parentNode}.push({text: \`${text}\`});`);
-      } else {
-        // this is an unusual situation: this text node is the result of the
-        // template rendering.
-        let nodeID = ctx.generateID();
-        ctx.addLine(`var vn${nodeID} = {text: \`${text}\`};`);
-        ctx.rootContext.rootNode = nodeID;
-        ctx.rootContext.parentNode = nodeID;
-      }
-      return;
-    }
-
-    const attributes = (<Element>node).attributes;
-
-    const validDirectives: {
-      directive: Directive;
-      value: string;
-      fullName: string;
-    }[] = [];
-
-    let withHandlers = false;
-
-    // maybe this is not optimal: we iterate on all attributes here, and again
-    // just after for each directive.
-    for (let i = 0; i < attributes.length; i++) {
-      let attrName = attributes[i].name;
-      if (attrName.startsWith("t-")) {
-        let dName = attrName.slice(2).split("-")[0];
-        if (!(dName in DIRECTIVE_NAMES)) {
-          throw new Error(`Unknown QWeb directive: '${attrName}'`);
-        }
-      }
-    }
-
-    const DIR_N = DIRECTIVES.length;
-    const ATTR_N = attributes.length;
-    for (let i = 0; i < DIR_N; i++) {
-      let directive = DIRECTIVES[i];
-      let fullName;
-      let value;
-      for (let j = 0; j < ATTR_N; j++) {
-        const name = attributes[j].name;
-        if (
-          name === "t-" + directive.name ||
-          name.startsWith("t-" + directive.name + "-")
-        ) {
-          fullName = name;
-          value = attributes[j].textContent;
-          validDirectives.push({ directive, value, fullName });
-          if (directive.name === "on") {
-            withHandlers = true;
-          }
-        }
-      }
-    }
-    for (let { directive, value, fullName } of validDirectives) {
-      if (directive.atNodeEncounter) {
-        const isDone = directive.atNodeEncounter({
-          node,
-          qweb: this,
-          ctx,
-          fullName,
-          value
-        });
-        if (isDone) {
-          return;
-        }
-      }
-    }
-
-    if (node.nodeName !== "t") {
-      let nodeID = this._compileGenericNode(node, ctx, withHandlers);
-      ctx = ctx.withParent(nodeID);
-      let nodeHooks = {};
-      let addNodeHook = function(hook, handler) {
-        nodeHooks[hook] = nodeHooks[hook] || [];
-        nodeHooks[hook].push(handler);
-      };
-
-      for (let { directive, value, fullName } of validDirectives) {
-        if (directive.atNodeCreation) {
-          directive.atNodeCreation({
-            node,
-            qweb: this,
-            ctx,
-            fullName,
-            value,
-            nodeID,
-            addNodeHook
-          });
-        }
-      }
-
-      if (Object.keys(nodeHooks).length) {
-        ctx.addLine(`p${nodeID}.hook = {`);
-        for (let hook in nodeHooks) {
-          ctx.addLine(`  ${hook}: ${NODE_HOOKS_PARAMS[hook]} => {`);
-          for (let handler of nodeHooks[hook]) {
-            ctx.addLine(`    ${handler}`);
-          }
-          ctx.addLine(`  },`);
-        }
-        ctx.addLine(`};`);
-      }
-    }
-    if (node.nodeName === "pre") {
-      ctx = ctx.subContext("inPreTag", true);
-    }
-
-    this._compileChildren(node, ctx);
-
-    for (let { directive, value, fullName } of validDirectives) {
-      if (directive.finalize) {
-        directive.finalize({ node, qweb: this, ctx, fullName, value });
-      }
-    }
-  }
-
-  _compileGenericNode(
-    node: ChildNode,
-    ctx: Context,
-    withHandlers: boolean = true
-  ): number {
-    // nodeType 1 is generic tag
-    if (node.nodeType !== 1) {
-      throw new Error("unsupported node type");
-    }
-    const attributes = (<Element>node).attributes;
-    const attrs: string[] = [];
-    const props: string[] = [];
-    const tattrs: number[] = [];
-
-    function handleBooleanProps(key, val) {
-      let isProp = false;
-      if (node.nodeName === "input" && key === "checked") {
-        let type = (<Element>node).getAttribute("type");
-        if (type === "checkbox" || type === "radio") {
-          isProp = true;
-        }
-      }
-      if (node.nodeName === "option" && key === "selected") {
-        isProp = true;
-      }
-      if (key === "disabled" && DISABLED_TAGS.indexOf(node.nodeName) > -1) {
-        isProp = true;
-      }
-      if (
-        (key === "readonly" && node.nodeName === "input") ||
-        node.nodeName === "textarea"
-      ) {
-        isProp = true;
-      }
-      if (isProp) {
-        props.push(`${key}: _${val}`);
-      }
-    }
-
-    for (let i = 0; i < attributes.length; i++) {
-      let name = attributes[i].name;
-      const value = attributes[i].textContent!;
-
-      // regular attributes
-      if (
-        !name.startsWith("t-") &&
-        !(<Element>node).getAttribute("t-attf-" + name)
-      ) {
-        const attID = ctx.generateID();
-        ctx.addLine(`var _${attID} = '${value}';`);
-        if (!name.match(/^[a-zA-Z]+$/)) {
-          // attribute contains 'non letters' => we want to quote it
-          name = '"' + name + '"';
-        }
-        attrs.push(`${name}: _${attID}`);
-        handleBooleanProps(name, attID);
-      }
-
-      // dynamic attributes
-      if (name.startsWith("t-att-")) {
-        let attName = name.slice(6);
-        let formattedValue = ctx.formatExpression(ctx.getValue(value!));
-        if (
-          formattedValue[0] === "{" &&
-          formattedValue[formattedValue.length - 1] === "}"
-        ) {
-          formattedValue = `this.utils.objectToAttrString(${formattedValue})`;
-        }
-        const attID = ctx.generateID();
-        if (!attName.match(/^[a-zA-Z]+$/)) {
-          // attribute contains 'non letters' => we want to quote it
-          attName = '"' + attName + '"';
-        }
-        // we need to combine dynamic with non dynamic attributes:
-        // class="a" t-att-class="'yop'" should be rendered as class="a yop"
-        const attValue = (<Element>node).getAttribute(attName);
-        if (attValue) {
-          const attValueID = ctx.generateID();
-          ctx.addLine(`var _${attValueID} = ${formattedValue};`);
-          formattedValue = `'${attValue}' + (_${attValueID} ? ' ' + _${attValueID} : '')`;
-          const attrIndex = attrs.findIndex(att =>
-            att.startsWith(attName + ":")
-          );
-          attrs.splice(attrIndex, 1);
-        }
-        ctx.addLine(`var _${attID} = ${formattedValue};`);
-        attrs.push(`${attName}: _${attID}`);
-        handleBooleanProps(attName, attID);
-      }
-
-      if (name.startsWith("t-attf-")) {
-        let attName = name.slice(7);
-        if (!attName.match(/^[a-zA-Z]+$/)) {
-          // attribute contains 'non letters' => we want to quote it
-          attName = '"' + attName + '"';
-        }
-        const formattedExpr = ctx.interpolate(value);
-        const attID = ctx.generateID();
-        let staticVal = (<Element>node).getAttribute(attName);
-        if (staticVal) {
-          ctx.addLine(`var _${attID} = '${staticVal} ' + ${formattedExpr};`);
-        } else {
-          ctx.addLine(`var _${attID} = ${formattedExpr};`);
-        }
-        attrs.push(`${attName}: _${attID}`);
-      }
-
-      // t-att= attributes
-      if (name === "t-att") {
-        let id = ctx.generateID();
-        ctx.addLine(`var _${id} = ${ctx.formatExpression(value!)};`);
-        tattrs.push(id);
-      }
-    }
-    let nodeID = ctx.generateID();
-    let nodeKey: any = (<Element>node).getAttribute("t-key");
-    if (nodeKey) {
-      nodeKey = ctx.formatExpression(nodeKey);
-    } else {
-      nodeKey = nodeID;
-    }
-    const parts = [`key:${nodeKey}`];
-    if (attrs.length + tattrs.length > 0) {
-      parts.push(`attrs:{${attrs.join(",")}}`);
-    }
-    if (props.length > 0) {
-      parts.push(`props:{${props.join(",")}}`);
-    }
-    if (withHandlers) {
-      parts.push(`on:{}`);
-    }
-
-    ctx.addLine(`let c${nodeID} = [], p${nodeID} = {${parts.join(",")}};`);
-    for (let id of tattrs) {
-      ctx.addIf(`_${id} instanceof Array`);
-      ctx.addLine(`p${nodeID}.attrs[_${id}[0]] = _${id}[1];`);
-      ctx.addElse();
-      ctx.addLine(`for (let key in _${id}) {`);
-      ctx.indent();
-      ctx.addLine(`p${nodeID}.attrs[key] = _${id}[key];`);
-      ctx.dedent();
-      ctx.addLine(`}`);
-      ctx.closeIf();
-    }
-    ctx.addLine(
-      `var vn${nodeID} = h('${node.nodeName}', p${nodeID}, c${nodeID});`
-    );
-    if (ctx.parentNode) {
-      ctx.addLine(`c${ctx.parentNode}.push(vn${nodeID});`);
-    }
-
-    return nodeID;
-  }
-
-  _compileChildren(node: ChildNode, ctx: Context) {
-    if (node.childNodes.length > 0) {
-      for (let child of Array.from(node.childNodes)) {
-        this._compileNode(child, ctx);
-      }
-    }
-  }
-}
-
-//------------------------------------------------------------------------------
-// Compilation Context
-//------------------------------------------------------------------------------
-export class Context {
-  nextID: number = 1;
-  code: string[] = [];
-  variables: { [key: string]: any } = {};
-  definedVariables: { [key: string]: string } = {};
-  escaping: boolean = false;
-  parentNode: number | null = null;
-  rootNode: number | null = null;
-  indentLevel: number = 0;
-  rootContext: Context;
-  caller: Element | undefined;
-  shouldDefineOwner: boolean = false;
-  shouldDefineQWeb: boolean = false;
-  shouldDefineUtils: boolean = false;
-  shouldProtectContext: boolean = false;
-  inLoop: boolean = false;
-  inPreTag: boolean = false;
-  templateName: string;
-
-  constructor(name?: string) {
-    this.rootContext = this;
-    this.templateName = name || "noname";
-    this.addLine("var h = this.utils.h;");
-  }
-
-  generateID(): number {
-    const id = this.rootContext.nextID++;
-    return id;
-  }
-
-  withParent(node: number): Context {
-    if (this === this.rootContext && this.parentNode) {
-      throw new Error("A template should not have more than one root node");
-    }
-    if (!this.rootContext.rootNode) {
-      this.rootContext.rootNode = node;
-    }
-    return this.subContext("parentNode", node);
-  }
-
-  subContext(key: keyof Context, value: any): Context {
-    const newContext = Object.create(this);
-    newContext[key] = value;
-    return newContext;
-  }
-
-  indent() {
-    this.indentLevel++;
-  }
-
-  dedent() {
-    this.indentLevel--;
-  }
-
-  addLine(line: string) {
-    const prefix = new Array(this.indentLevel + 2).join("    ");
-    this.code.push(prefix + line);
-  }
-
-  addIf(condition: string) {
-    this.addLine(`if (${condition}) {`);
-    this.indent();
-  }
-
-  addElse() {
-    this.dedent();
-    this.addLine("} else {");
-    this.indent();
-  }
-
-  closeIf() {
-    this.dedent();
-    this.addLine("}");
-  }
-
-  getValue(val: any): any {
-    return val in this.variables ? this.getValue(this.variables[val]) : val;
-  }
-
-  formatExpression(e: string): string {
-    e = e.trim();
-    if (e[0] === "{" && e[e.length - 1] === "}") {
-      const innerExpr = e
-        .slice(1, -1)
-        .split(",")
-        .map(p => {
-          let [key, val] = p.trim().split(":");
-          if (key === "") {
-            return "";
-          }
-          if (!val) {
-            val = key;
-          }
-          return `${key}: ${this.formatExpression(val)}`;
-        })
-        .join(",");
-      return "{" + innerExpr + "}";
-    }
-
-    // Thanks CHM for this code...
-    const chars = e.split("");
-    let instring = "";
-    let invar = "";
-    let invarPos = 0;
-    let r = "";
-    chars.push(" ");
-    for (let i = 0, ilen = chars.length; i < ilen; i++) {
-      let c = chars[i];
-      if (instring.length) {
-        if (c === instring && chars[i - 1] !== "\\") {
-          instring = "";
-        }
-      } else if (c === '"' || c === "'") {
-        instring = c;
-      } else if (c.match(/[a-zA-Z_\$]/) && !invar.length) {
-        invar = c;
-        invarPos = i;
-        continue;
-      } else if (c.match(/\W/) && invar.length) {
-        // TODO: Should check for possible spaces before dot
-        if (chars[invarPos - 1] !== "." && RESERVED_WORDS.indexOf(invar) < 0) {
-          if (!(invar in this.definedVariables)) {
-            invar =
-              WORD_REPLACEMENT[invar] ||
-              (invar in this.variables &&
-                this.formatExpression(this.variables[invar])) ||
-              "context['" + invar + "']";
-          }
-        }
-        r += invar;
-        invar = "";
-      } else if (invar.length) {
-        invar += c;
-        continue;
-      }
-      r += c;
-    }
-    const result = r.slice(0, -1);
-    return result;
-  }
-
-  /**
-   * Perform string interpolation on the given string. Note that if the whole
-   * string is an expression, it simply returns it (formatted).
-   * For instance:
-   *   'Hello {{x}}!' -> `Hello ${x}`
-   *   '{{x}}' -> x
-   */
-  interpolate(s: string): string {
-    let matches = s.match(/\{\{.*?\}\}/g);
-    if (matches && matches[0].length === s.length) {
-      return this.formatExpression(s.slice(2, -2));
-    }
-    matches = s.match(/\#\{.*?\}/g);
-    if (matches && matches[0].length === s.length) {
-      return this.formatExpression(s.slice(2, -1));
-    }
-
-    let formatter = expr => "${" + this.formatExpression(expr) + "}";
-    let r = s
-      .replace(/\{\{.*?\}\}/g, s => formatter(s.slice(2, -2)))
-      .replace(/\#\{.*?\}/g, s => formatter(s.slice(2, -1)));
-    return "`" + r + "`";
-  }
-}

src/qweb_directives.ts

@@ -1,318 +0,0 @@
-import { Context, QWeb, UTILS } from "./qweb_core";
-
-/**
- * Owl QWeb Directives
- *
- * This file contains the implementation of most standard QWeb directives:
- * - t-esc
- * - t-raw
- * - t-set/t-value
- * - t-if/t-elif/t-else
- * - t-call
- * - t-foreach/t-as
- * - t-debug
- * - t-log
- */
-
-
-//------------------------------------------------------------------------------
-// t-esc and t-raw
-//------------------------------------------------------------------------------
-(<any>UTILS).getFragment = function(str: string): DocumentFragment {
-  const temp = document.createElement("template");
-  temp.innerHTML = str;
-  return temp.content;
-};
-
-function compileValueNode(value: any, node: Element, qweb: QWeb, ctx: Context) {
-  if (value === "0" && ctx.caller) {
-    qweb._compileNode(ctx.caller, ctx);
-    return;
-  }
-
-  if (typeof value === "string") {
-    let exprID = value;
-    if (!(value in ctx.definedVariables)) {
-      exprID = `_${ctx.generateID()}`;
-      ctx.addLine(`var ${exprID} = ${ctx.formatExpression(value)};`);
-    }
-    ctx.addIf(`${exprID} || ${exprID} === 0`);
-    if (!ctx.parentNode) {
-      throw new Error("Should not have a text node without a parent");
-    }
-    if (ctx.escaping) {
-      ctx.addLine(`c${ctx.parentNode}.push({text: ${exprID}});`);
-    } else {
-      let fragID = ctx.generateID();
-      ctx.addLine(`var frag${fragID} = this.utils.getFragment(${exprID})`);
-      let tempNodeID = ctx.generateID();
-      ctx.addLine(`var p${tempNodeID} = {hook: {`);
-      ctx.addLine(
-        `  insert: n => n.elm.parentNode.replaceChild(frag${fragID}, n.elm),`
-      );
-      ctx.addLine(`}};`);
-      ctx.addLine(`var vn${tempNodeID} = h('div', p${tempNodeID})`);
-      ctx.addLine(`c${ctx.parentNode}.push(vn${tempNodeID});`);
-    }
-    if (node.childNodes.length) {
-      ctx.addElse();
-      qweb._compileChildren(node, ctx);
-    }
-    ctx.closeIf();
-    return;
-  }
-  if (value instanceof NodeList) {
-    for (let node of Array.from(value)) {
-      qweb._compileNode(<ChildNode>node, ctx);
-    }
-  }
-}
-
-QWeb.addDirective({
-  name: "esc",
-  priority: 70,
-  atNodeEncounter({ node, qweb, ctx }): boolean {
-    if (node.nodeName !== "t") {
-      let nodeID = qweb._compileGenericNode(node, ctx);
-      ctx = ctx.withParent(nodeID);
-    }
-    let value = ctx.getValue(node.getAttribute("t-esc")!);
-    compileValueNode(value, node, qweb, ctx.subContext("escaping", true));
-    return true;
-  }
-});
-
-QWeb.addDirective({
-  name: "raw",
-  priority: 80,
-  atNodeEncounter({ node, qweb, ctx }): boolean {
-    if (node.nodeName !== "t") {
-      let nodeID = qweb._compileGenericNode(node, ctx);
-      ctx = ctx.withParent(nodeID);
-    }
-    let value = ctx.getValue(node.getAttribute("t-raw")!);
-    compileValueNode(value, node, qweb, ctx);
-    return true;
-  }
-});
-
-//------------------------------------------------------------------------------
-// t-set
-//------------------------------------------------------------------------------
-QWeb.addDirective({
-  name: "set",
-  extraNames: ["value"],
-  priority: 60,
-  atNodeEncounter({ node, ctx }): boolean {
-    const variable = node.getAttribute("t-set")!;
-    let value = node.getAttribute("t-value")!;
-    if (value) {
-      const formattedValue = ctx.formatExpression(value);
-      if (ctx.variables.hasOwnProperty(variable)) {
-        ctx.addLine(`${ctx.variables[variable]} = ${formattedValue}`);
-      } else {
-        const varName = `_${ctx.generateID()}`;
-        ctx.addLine(`var ${varName} = ${formattedValue};`);
-        ctx.definedVariables[varName] = formattedValue;
-        ctx.variables[variable] = varName;
-      }
-    } else {
-      ctx.variables[variable] = node.childNodes;
-    }
-    return true;
-  }
-});
-
-//------------------------------------------------------------------------------
-// t-if, t-elif, t-else
-//------------------------------------------------------------------------------
-QWeb.addDirective({
-  name: "if",
-  priority: 20,
-  atNodeEncounter({ node, ctx }): boolean {
-    let cond = ctx.getValue(node.getAttribute("t-if")!);
-    ctx.addIf(`${ctx.formatExpression(cond)}`);
-    return false;
-  },
-  finalize({ ctx }) {
-    ctx.closeIf();
-  }
-});
-
-QWeb.addDirective({
-  name: "elif",
-  priority: 30,
-  atNodeEncounter({ node, ctx }): boolean {
-    let cond = ctx.getValue(node.getAttribute("t-elif")!);
-    ctx.addLine(`else if (${ctx.formatExpression(cond)}) {`);
-    ctx.indent();
-    return false;
-  },
-  finalize({ ctx }) {
-    ctx.closeIf();
-  }
-});
-
-QWeb.addDirective({
-  name: "else",
-  priority: 40,
-  atNodeEncounter({ ctx }): boolean {
-    ctx.addLine(`else {`);
-    ctx.indent();
-    return false;
-  },
-  finalize({ ctx }) {
-    ctx.closeIf();
-  }
-});
-
-//------------------------------------------------------------------------------
-// t-call
-//------------------------------------------------------------------------------
-QWeb.addDirective({
-  name: "call",
-  priority: 50,
-  atNodeEncounter({ node, qweb, ctx }): boolean {
-    if (node.nodeName !== "t") {
-      throw new Error("Invalid tag for t-call directive (should be 't')");
-    }
-    const subTemplate = node.getAttribute("t-call")!;
-    const nodeTemplate = qweb.templates[subTemplate];
-    if (!nodeTemplate) {
-      throw new Error(`Cannot find template "${subTemplate}" (t-call)`);
-    }
-    const nodeCopy = node.cloneNode(true) as Element;
-    nodeCopy.removeAttribute("t-call");
-
-    // extract variables from nodecopy
-    const tempCtx = new Context();
-    tempCtx.nextID = ctx.rootContext.nextID;
-    qweb._compileNode(nodeCopy, tempCtx);
-    const vars = Object.assign({}, ctx.variables, tempCtx.variables);
-    var definedVariables = Object.assign(
-      {},
-      ctx.definedVariables,
-      tempCtx.definedVariables
-    );
-    ctx.rootContext.nextID = tempCtx.nextID;
-
-    // open new scope, if necessary
-    const hasNewVariables = Object.keys(definedVariables).length > 0;
-    if (hasNewVariables) {
-      ctx.addLine("{");
-      ctx.indent();
-    }
-
-    // add new variables, if any
-    for (let key in definedVariables) {
-      ctx.addLine(`let ${key} = ${definedVariables[key]}`);
-    }
-
-    // compile sub template
-    const subCtx = ctx
-      .subContext("caller", nodeCopy)
-      .subContext("variables", Object.create(vars))
-      .subContext("definedVariables", Object.create(definedVariables));
-
-    qweb._compileNode(nodeTemplate.elem, subCtx);
-
-    // close new scope
-    if (hasNewVariables) {
-      ctx.dedent();
-      ctx.addLine("}");
-    }
-
-    return true;
-  }
-});
-
-//------------------------------------------------------------------------------
-// t-foreach
-//------------------------------------------------------------------------------
-QWeb.addDirective({
-  name: "foreach",
-  extraNames: ["as"],
-  priority: 10,
-  atNodeEncounter({ node, qweb, ctx }): boolean {
-    ctx.rootContext.shouldProtectContext = true;
-    ctx = ctx.subContext("inLoop", true);
-    const elems = node.getAttribute("t-foreach")!;
-    const name = node.getAttribute("t-as")!;
-    let arrayID = ctx.generateID();
-    ctx.addLine(`var _${arrayID} = ${ctx.formatExpression(elems)};`);
-    ctx.addLine(
-      `if (!_${arrayID}) { throw new Error('QWeb error: Invalid loop expression')}`
-    );
-    ctx.addLine(
-      `if (typeof _${arrayID} === 'number') { _${arrayID} = Array.from(Array(_${arrayID}).keys())}`
-    );
-    let keysID = ctx.generateID();
-    ctx.addLine(
-      `var _${keysID} = _${arrayID} instanceof Array ? _${arrayID} : Object.keys(_${arrayID});`
-    );
-    ctx.addLine(`var _length${keysID} = _${keysID}.length;`);
-    let valuesID = ctx.generateID();
-    ctx.addLine(
-      `var _${valuesID} = _${arrayID} instanceof Array ? _${arrayID} : Object.values(_${arrayID});`
-    );
-    ctx.addLine(`for (let i = 0; i < _length${keysID}; i++) {`);
-    ctx.indent();
-    ctx.addLine(`context.${name}_first = i === 0;`);
-    ctx.addLine(`context.${name}_last = i === _length${keysID} - 1;`);
-    ctx.addLine(`context.${name}_parity = i % 2 === 0 ? 'even' : 'odd';`);
-    ctx.addLine(`context.${name}_index = i;`);
-    ctx.addLine(`context.${name} = _${keysID}[i];`);
-    ctx.addLine(`context.${name}_value = _${valuesID}[i];`);
-    const nodeCopy = <Element>node.cloneNode(true);
-    let shouldWarn =
-      nodeCopy.tagName !== "t" && !nodeCopy.hasAttribute("t-key");
-    if (!shouldWarn && node.tagName === "t") {
-      if (node.hasAttribute("t-widget") && !node.hasAttribute("t-key")) {
-        shouldWarn = true;
-      }
-      if (
-        !shouldWarn &&
-        node.children.length === 1 &&
-        node.children[0].tagName !== "t" &&
-        !node.children[0].hasAttribute("t-key")
-      ) {
-        shouldWarn = true;
-      }
-    }
-    if (shouldWarn) {
-      console.warn(
-        `Directive t-foreach should always be used with a t-key! (in template: '${
-          ctx.templateName
-        }')`
-      );
-    }
-    nodeCopy.removeAttribute("t-foreach");
-    qweb._compileNode(nodeCopy, ctx);
-    ctx.dedent();
-    ctx.addLine("}");
-    return true;
-  }
-});
-
-//------------------------------------------------------------------------------
-// t-debug
-//------------------------------------------------------------------------------
-QWeb.addDirective({
-  name: "debug",
-  priority: 99,
-  atNodeEncounter({ ctx }) {
-    ctx.addLine("debugger;");
-  }
-});
-
-//------------------------------------------------------------------------------
-// t-log
-//------------------------------------------------------------------------------
-QWeb.addDirective({
-  name: "log",
-  priority: 99,
-  atNodeEncounter({ ctx, value }) {
-    const expr = ctx.formatExpression(value);
-    ctx.addLine(`console.log(${expr})`);
-  }
-});

src/qweb_extensions.ts

@@ -1,556 +0,0 @@
-import { QWeb, UTILS } from "./qweb_core";
-
-/**
- * Owl QWeb Extensions
- *
- * This file contains the implementation of non standard QWeb directives, added
- * by Owl and that will only work on Owl projects:
- *
- * - t-on
- * - t-ref
- * - t-transition
- * - t-widget/t-props/t-keepalive
- * - t-mounted
- */
-
-//------------------------------------------------------------------------------
-// t-on
-//------------------------------------------------------------------------------
-// these are pieces of code that will be injected into the event handler if
-// modifiers are specified
-const MODS_CODE = {
-  prevent: "e.preventDefault();",
-  self: "if (e.target !== this.elm) {return}",
-  stop: "e.stopPropagation();"
-};
-
-QWeb.addDirective({
-  name: "on",
-  priority: 90,
-  atNodeCreation({ ctx, fullName, value, nodeID }) {
-    ctx.rootContext.shouldDefineOwner = true;
-    const [eventName, ...mods] = fullName.slice(5).split(".");
-    if (!eventName) {
-      throw new Error("Missing event name with t-on directive");
-    }
-    let extraArgs;
-    let handlerName = value.replace(/\(.*\)/, function(args) {
-      extraArgs = args.slice(1, -1);
-      return "";
-    });
-    ctx.addIf(`!context['${handlerName}']`);
-    ctx.addLine(
-      `throw new Error('Missing handler \\'' + '${handlerName}' + \`\\' when evaluating template '${ctx.templateName.replace(
-        /`/g,
-        "'"
-      )}'\`)`
-    );
-    ctx.closeIf();
-    let params = extraArgs
-      ? `owner, ${ctx.formatExpression(extraArgs)}`
-      : "owner";
-    let handler;
-    if (mods.length > 0) {
-      handler = `function (e) {`;
-      handler += mods
-        .map(function(mod) {
-          return MODS_CODE[mod];
-        })
-        .join("");
-      handler += `context['${handlerName}'].call(${params}, e);}`;
-    } else {
-      handler = `context['${handlerName}'].bind(${params})`;
-    }
-    if (extraArgs) {
-      ctx.addLine(`p${nodeID}.on['${eventName}'] = ${handler};`);
-    } else {
-      ctx.addLine(
-        `extra.handlers['${eventName}' + ${nodeID}] = extra.handlers['${eventName}' + ${nodeID}] || ${handler};`
-      );
-      ctx.addLine(
-        `p${nodeID}.on['${eventName}'] = extra.handlers['${eventName}' + ${nodeID}];`
-      );
-    }
-  }
-});
-
-//------------------------------------------------------------------------------
-// t-ref
-//------------------------------------------------------------------------------
-QWeb.addDirective({
-  name: "ref",
-  priority: 95,
-  atNodeCreation({ ctx, value, addNodeHook }) {
-    const refKey = `ref${ctx.generateID()}`;
-    ctx.addLine(`const ${refKey} = ${ctx.interpolate(value)};`);
-    addNodeHook("create", `context.refs[${refKey}] = n.elm;`);
-  }
-});
-
-//------------------------------------------------------------------------------
-// t-transition
-//------------------------------------------------------------------------------
-UTILS.nextFrame = function(cb: () => void) {
-  requestAnimationFrame(() => requestAnimationFrame(cb));
-};
-
-UTILS.transitionInsert = function(elm: HTMLElement, name: string) {
-  elm.classList.add(name + "-enter");
-  elm.classList.add(name + "-enter-active");
-  const finalize = () => {
-    elm.classList.remove(name + "-enter-active");
-    elm.classList.remove(name + "-enter-to");
-  };
-  this.nextFrame(() => {
-    elm.classList.remove(name + "-enter");
-    elm.classList.add(name + "-enter-to");
-    whenTransitionEnd(elm, finalize);
-  });
-};
-
-UTILS.transitionRemove = function(
-  elm: HTMLElement,
-  name: string,
-  rm: () => void
-) {
-  elm.classList.add(name + "-leave");
-  elm.classList.add(name + "-leave-active");
-  const finalize = () => {
-    elm.classList.remove(name + "-leave-active");
-    elm.classList.remove(name + "-leave-to");
-    rm();
-  };
-  this.nextFrame(() => {
-    elm.classList.remove(name + "-leave");
-    elm.classList.add(name + "-leave-to");
-    whenTransitionEnd(elm, finalize);
-  });
-};
-
-function getTimeout(delays: Array<string>, durations: Array<string>): number {
-  /* istanbul ignore next */
-  while (delays.length < durations.length) {
-    delays = delays.concat(delays);
-  }
-
-  return Math.max.apply(
-    null,
-    durations.map((d, i) => {
-      return toMs(d) + toMs(delays[i]);
-    })
-  );
-}
-
-// Old versions of Chromium (below 61.0.3163.100) formats floating pointer numbers
-// in a locale-dependent way, using a comma instead of a dot.
-// If comma is not replaced with a dot, the input will be rounded down (i.e. acting
-// as a floor function) causing unexpected behaviors
-function toMs(s: string): number {
-  return Number(s.slice(0, -1).replace(",", ".")) * 1000;
-}
-
-function whenTransitionEnd(elm: HTMLElement, cb) {
-  const styles = window.getComputedStyle(elm);
-  const delays: Array<string> = (styles.transitionDelay || "").split(", ");
-  const durations: Array<string> = (styles.transitionDuration || "").split(
-    ", "
-  );
-  const timeout: number = getTimeout(delays, durations);
-  if (timeout > 0) {
-    elm.addEventListener("transitionend", cb, { once: true });
-  } else {
-    cb();
-  }
-}
-
-QWeb.addDirective({
-  name: "transition",
-  priority: 96,
-  atNodeCreation({ value, addNodeHook }) {
-    let name = value;
-    const hooks = {
-      insert: `this.utils.transitionInsert(vn.elm, '${name}');`,
-      remove: `this.utils.transitionRemove(vn.elm, '${name}', rm);`
-    };
-    for (let hookName in hooks) {
-      addNodeHook(hookName, hooks[hookName]);
-    }
-  }
-});
-
-//------------------------------------------------------------------------------
-// t-widget
-//------------------------------------------------------------------------------
-
-/**
- * The t-widget directive is certainly a complicated and hard to maintain piece
- * of code.  To help you, fellow developer, if you have to maintain it, I offer
- * you this advice: Good luck...
- *
- * Since it is not 'direct' code, but rather code that generates other code, it
- * is not easy to understand.  To help you, here  is a detailed and commented
- * explanation of the code generated by the t-widget directive for the following
- * situation:
- * ```xml
- *   <t t-widget="child"
- *      t-key="'somestring'"
- *      t-props="{flag:state.flag}"
- *      t-transition="fade"/>
- * ```
- *
- * ```js
- * // this is the virtual node representing the parent div
- * let c1 = [], p1 = { key: 1 };
- * var vn1 = h("div", p1, c1);
- *
- * // t-widget directive: we start by evaluating the expression given by t-key:
- * let key5 = "somestring";
- *
- * // We keep the index of the position of the widget in the closure.  We push
- * // null to reserve the slot, and will replace it later by the widget vnode,
- * // when it will be ready (do not forget that preparing/rendering a widget is
- * // asynchronous)
- * let _2_index = c1.length;
- * c1.push(null);
- *
- * // def3 is the deferred that will contain later either the new widget
- * // creation, or the props update...
- * let def3;
- *
- * // this is kind of tricky: we need here to find if the widget was already
- * // created by a previous rendering.  This is done by checking the internal
- * // `cmap` (children map) of the parent widget: it maps keys to widget ids,
- * // and, then, if there is an id, we look into the children list to get the
- * // instance
- * let w4 =
- *   key5 in context.__owl__.cmap
- *   ? context.__owl__.children[context.__owl__.cmap[key5]]
- *   : false;
- *
- * // we evaluate here the props given to the component. It is done here to be
- * // able to easily reference it later, and also, it might be an expensive
- * // computation, so it is certainly better to do it only once
- * let props4 = { flag: context["state"].flag };
- *
- * // If we have a widget, currently rendering, but not ready yet, and which was
- * // rendered with different props, we do not want to wait for it to be ready,
- * // then update it. We simply destroy it, and start anew.
- * if (
- *   w4 &&
- *   w4.__owl__.renderPromise &&
- *   !w4.__owl__.isStarted &&
- *   props4 !== w4.__owl__.renderProps
- * ) {
- *   w4.destroy();
- *   w4 = false;
- * }
- *
- * if (!w4) {
- *   // in this situation, we need to create a new widget.  First step is
- *   // to get a reference to the class, then create an instance with
- *   // current context as parent, and the props.
- *   let W4 = context.widgets["child"];
- *   if (!W4) {
- *     throw new Error("Cannot find the definition of widget 'child'");
- *   }
- *   w4 = new W4(owner, props4);
- *
- *   let utils = this.utils;
- *
- *   // Whenever we rerender the parent widget, we need to be sure that we
- *   // are able to find the widget instance. To do that, we register it to
- *   // the parent cmap (children map).  Note that the 'template' key is
- *   // used here, since this is what identify the widget from the template
- *   // perspective.
- *   context.__owl__.cmap[key5] = w4.__owl__.id;
- *
- *   // _prepare is called, to basically call willStart, then render the
- *   // widget
- *   def3 = w4._prepare();
- *
- *   def3 = def3.then(vnode => {
- *     // we create here a virtual node for the parent (NOT the widget). This
- *     // means that the vdom of the parent will be stopped here, and from
- *     // the parent's perspective, it simply is a vnode with no children.
- *     // However, it shares the same dom element with the component root
- *     // vnode.
- *     let pvnode = h(vnode.sel, { key: key5 });
- *
- *     // we add hooks to the parent vnode so we can interact with the new
- *     // widget at the proper time
- *     pvnode.data.hook = {
- *       insert(vn) {
- *         // the _mount method will patch the widget vdom into the elm vn.elm,
- *         // then call the mounted hooks. However, suprisingly, the snabbdom
- *         // patch method actually replace the elm by a new elm, so we need
- *         // to synchronise the pvnode elm with the resulting elm
- *         let nvn = w4._mount(vnode, vn.elm);
- *         pvnode.elm = nvn.elm;
- *         // what follows is only present if there are animations on the widget
- *         utils.transitionInsert(vn.elm, "fade");
- *       },
- *       remove() {
- *         // override with empty function to prevent from removing the node
- *         // directly. It will be removed when destroy is called anyway, which
- *         // delays the removal if there are animations.
- *       },
- *       destroy() {
- *         // if there are animations, we delay the call to destroy on the
- *         // widget, if not, we call it directly.
- *         let finalize = () => {
- *           w4.destroy();
- *         };
- *         utils.transitionRemove(vn.elm, "fade", finalize);
- *       }
- *     };
- *     // the pvnode is inserted at the correct position in the div's children
- *     c1[_2_index] = pvnode;
- *
- *     // we keep here a reference to the parent vnode (representing the
- *     // widget, so we can reuse it later whenever we update the widget
- *     w4.__owl__.pvnode = pvnode;
- *   });
- * } else {
- *   // this is the 'update' path of the directive.
- *   // the call to _updateProps is the actual widget update
- *   def3 = w4._updateProps(props4, extra.forceUpdate, extra.patchQueue);
- *   def3 = def3.then(() => {
- *     // if widget was destroyed in the meantime, we do nothing (so, this
- *     // means that the parent's element children list will have a null in
- *     // the widget's position, which will cause the pvnode to be removed
- *     // when it is patched.
- *     if (w4.__owl__.isDestroyed) {
- *       return;
- *     }
- *     // like above, we register the pvnode to the children list, so it
- *     // will not be patched out of the dom.
- *     let pvnode = w4.__owl__.pvnode;
- *     c1[_2_index] = pvnode;
- *   });
- * }
- *
- * // we register the deferred here so the parent can coordinate its patch operation
- * // with all the children.
- * extra.promises.push(def3);
- * return vn1;
- * ```
- */
-
-QWeb.addDirective({
-  name: "widget",
-  extraNames: ["props", "keepalive"],
-  priority: 100,
-  atNodeEncounter({ ctx, value, node }): boolean {
-    ctx.addLine("//WIDGET");
-    ctx.rootContext.shouldDefineOwner = true;
-    ctx.rootContext.shouldDefineQWeb = true;
-    ctx.rootContext.shouldDefineUtils = true;
-    let props = node.getAttribute("t-props");
-    let keepAlive = node.getAttribute("t-keepalive") ? true : false;
-
-    // t-on- events and t-transition
-    const events: [string, string][] = [];
-    let transition: string = "";
-    const attributes = (<Element>node).attributes;
-    for (let i = 0; i < attributes.length; i++) {
-      const name = attributes[i].name;
-      if (name.startsWith("t-on-")) {
-        events.push([name.slice(5), attributes[i].textContent!]);
-      } else if (name === "t-transition") {
-        transition = attributes[i].textContent!;
-      }
-    }
-
-    let key = node.getAttribute("t-key");
-    if (key) {
-      key = ctx.formatExpression(key);
-    }
-    if (props) {
-      props = ctx.formatExpression(props);
-    }
-    let dummyID = ctx.generateID();
-    let defID = ctx.generateID();
-    let widgetID = ctx.generateID();
-    let keyID = key && ctx.generateID();
-    if (key) {
-      // we bind a variable to the key (could be a complex expression, so we
-      // want to evaluate it only once)
-      ctx.addLine(`let key${keyID} = ${key};`);
-    }
-    ctx.addLine(`let _${dummyID}_index = c${ctx.parentNode}.length;`);
-    ctx.addLine(`c${ctx.parentNode}.push(null);`);
-    ctx.addLine(`let def${defID};`);
-    let templateID = key
-      ? `key${keyID}`
-      : ctx.inLoop
-      ? `String(-${widgetID} - i)`
-      : String(widgetID);
-
-    let ref = node.getAttribute("t-ref");
-    let refExpr = "";
-    let refKey: string = "";
-    if (ref) {
-      refKey = `ref${ctx.generateID()}`;
-      ctx.addLine(`const ${refKey} = ${ctx.interpolate(ref)};`);
-      refExpr = `context.refs[${refKey}] = w${widgetID};`;
-    }
-    let transitionsInsertCode = "";
-    if (transition) {
-      transitionsInsertCode = `utils.transitionInsert(vn.elm, '${transition}');`;
-    }
-    let finalizeWidgetCode = `w${widgetID}.${
-      keepAlive ? "unmount" : "destroy"
-    }();`;
-    if (ref) {
-      finalizeWidgetCode += `delete context.refs[${refKey}];`; // FIXME: shouldn't we keep ref if keepAlive is true?
-    }
-    if (transition) {
-      finalizeWidgetCode = `let finalize = () => {
-          ${finalizeWidgetCode}
-        };
-        utils.transitionRemove(vn.elm, '${transition}', finalize);`;
-    }
-
-    let createHook = "";
-    let classAttr = node.getAttribute("class");
-    let tattClass = node.getAttribute("t-att-class");
-    let styleAttr = node.getAttribute("style");
-    let tattStyle = node.getAttribute("t-att-style");
-    if (tattStyle) {
-      const attVar = `_${ctx.generateID()}`;
-      ctx.addLine(`const ${attVar} = ${ctx.formatExpression(tattStyle)};`);
-      tattStyle = attVar;
-    }
-    let updateClassCode = "";
-    if (classAttr || tattClass || styleAttr || tattStyle) {
-      let classCode = "";
-      if (classAttr) {
-        classCode =
-          classAttr
-            .split(" ")
-            .map(c => `vn.elm.classList.add('${c}')`)
-            .join(";") + ";";
-      }
-      if (tattClass) {
-        const attVar = `_${ctx.generateID()}`;
-        ctx.addLine(`const ${attVar} = ${ctx.formatExpression(tattClass)};`);
-        classCode = `for (let k in ${attVar}) {
-              if (${attVar}[k]) {
-                  vn.elm.classList.add(k);
-              }
-          }`;
-        updateClassCode = `let cl=w${widgetID}.el.classList;for (let k in ${attVar}) {if (${attVar}[k]) {cl.add(k)} else {cl.remove(k)}}`;
-      }
-      const styleExpr = tattStyle || (styleAttr ? `'${styleAttr}'` : false);
-      const styleCode = styleExpr ? `vn.elm.style = ${styleExpr}` : "";
-      createHook = `vnode.data.hook = {create(_, vn){${classCode}${styleCode}}};`;
-    }
-
-    ctx.addLine(
-      `let w${widgetID} = ${templateID} in context.__owl__.cmap ? context.__owl__.children[context.__owl__.cmap[${templateID}]] : false;`
-    );
-    ctx.addLine(`let props${widgetID} = ${props || "{}"};`);
-    ctx.addIf(
-      `w${widgetID} && w${widgetID}.__owl__.renderPromise && !w${widgetID}.__owl__.vnode && props${widgetID} !== w${widgetID}.__owl__.renderProps`
-    );
-    ctx.addLine(`w${widgetID}.destroy();`);
-    ctx.addLine(`w${widgetID} = false`);
-    ctx.closeIf();
-
-    ctx.addIf(`!w${widgetID}`);
-    // new widget
-    ctx.addLine(`let widgetKey${widgetID} = ${ctx.interpolate(value)};`);
-    ctx.addLine(
-      `let W${widgetID} = context.widgets && context.widgets[widgetKey${widgetID}] || QWeb.widgets[widgetKey${widgetID}];`
-    );
-
-    // maybe only do this in dev mode...
-    ctx.addLine(
-      `if (!W${widgetID}) {throw new Error('Cannot find the definition of widget "' + widgetKey${widgetID} + '"')}`
-    );
-    ctx.addLine(`w${widgetID} = new W${widgetID}(owner, props${widgetID});`);
-    ctx.addLine(
-      `context.__owl__.cmap[${templateID}] = w${widgetID}.__owl__.id;`
-    );
-    for (let [event, method] of events) {
-      ctx.addLine(`w${widgetID}.on('${event}', owner, owner['${method}'])`);
-    }
-    ctx.addLine(`def${defID} = w${widgetID}._prepare();`);
-    // hack: specify empty remove hook to prevent the node from being removed from the DOM
-    // FIXME: click to re-add widget during remove transition -> leak
-    ctx.addLine(
-      `def${defID} = def${defID}.then(vnode=>{${createHook}let pvnode=h(vnode.sel, {key: ${templateID}, hook: {insert(vn) {let nvn=w${widgetID}._mount(vnode, pvnode.elm);pvnode.elm=nvn.elm;${refExpr}${transitionsInsertCode}},remove() {},destroy(vn) {${finalizeWidgetCode}}}});c${
-        ctx.parentNode
-      }[_${dummyID}_index]=pvnode;w${widgetID}.__owl__.pvnode = pvnode;});`
-    );
-
-    ctx.addElse();
-    // need to update widget
-    ctx.addLine(
-      `def${defID} = w${widgetID}._updateProps(props${widgetID}, extra.forceUpdate, extra.patchQueue);`
-    );
-    let keepAliveCode = "";
-    if (keepAlive) {
-      keepAliveCode = `pvnode.data.hook.insert = vn => {vn.elm.parentNode.replaceChild(w${widgetID}.el,vn.elm);vn.elm=w${widgetID}.el;w${widgetID}._remount();};`;
-    }
-    ctx.addLine(
-      `def${defID} = def${defID}.then(()=>{if (w${widgetID}.__owl__.isDestroyed) {return};${
-        tattStyle ? `w${widgetID}.el.style=${tattStyle};` : ""
-      }${updateClassCode}let pvnode=w${widgetID}.__owl__.pvnode;${keepAliveCode}c${
-        ctx.parentNode
-      }[_${dummyID}_index]=pvnode;});`
-    );
-    ctx.closeIf();
-
-    ctx.addLine(`extra.promises.push(def${defID});`);
-
-    if (
-      node.hasAttribute("t-if") ||
-      node.hasAttribute("t-else") ||
-      node.hasAttribute("t-elif")
-    ) {
-      ctx.closeIf();
-    }
-
-    return true;
-  }
-});
-
-//------------------------------------------------------------------------------
-// t-mounted
-//------------------------------------------------------------------------------
-QWeb.addDirective({
-  name: "mounted",
-  priority: 97,
-  atNodeCreation({ ctx, fullName, value, nodeID, addNodeHook }) {
-    ctx.rootContext.shouldDefineOwner = true;
-    const eventName = fullName.slice(5);
-    if (!eventName) {
-      throw new Error("Missing event name with t-on directive");
-    }
-    let extraArgs;
-    let handler = value.replace(/\(.*\)/, function(args) {
-      extraArgs = args.slice(1, -1);
-      return "";
-    });
-    let error = `(function () {throw new Error('Missing handler \\'' + '${handler}' + \`\\' when evaluating template '${ctx.templateName.replace(
-      /`/g,
-      "'"
-    )}'\`)})()`;
-    if (extraArgs) {
-      ctx.addLine(
-        `extra.mountedHandlers[${nodeID}] = (context['${handler}'] || ${error}).bind(owner, ${ctx.formatExpression(
-          extraArgs
-        )});`
-      );
-    } else {
-      ctx.addLine(
-        `extra.mountedHandlers[${nodeID}] = extra.mountedHandlers[${nodeID}] || (context['${handler}'] || ${error}).bind(owner);`
-      );
-    }
-    addNodeHook(
-      "insert",
-      `if (context.__owl__.isMounted) { extra.mountedHandlers[${nodeID}](); }`
-    );
-  }
-});

src/store.ts

@@ -1,283 +0,0 @@
-import { Component, Env } from "./component";
-import { EventBus } from "./event_bus";
-import { Observer } from "./observer";
-
-/**
- * Owl Store
- *
- * We have here:
- * - a Store class
- * - a connect function
- *
- * The Owl store is our answer to the problem of managing complex state across
- * components. The main idea is that the store owns some state, allow external
- * code to modify it through actions/mutations, and for each state changes,
- * connected component will be notified, and updated if necessary.
- *
- * Note that this code is partly inspired by VueX and React/Redux
- */
-
-//------------------------------------------------------------------------------
-// Store Definition
-//------------------------------------------------------------------------------
-
-type Mutation = ({ state, commit, set, getters }, payload: any) => void;
-type Action = ({ commit, state, dispatch, env, getters }, payload: any) => void;
-type Getter = ({ state, getters }, payload) => any;
-
-interface StoreConfig {
-  env?: Env;
-  state?: any;
-  actions?: { [name: string]: Action };
-  getters?: { [name: string]: Getter };
-  mutations?: { [name: string]: Mutation };
-}
-
-interface StoreOption {
-  debug?: boolean;
-}
-
-export class Store extends EventBus {
-  state: any;
-  actions: any;
-  mutations: any;
-  _commitLevel: number = 0;
-  history: any[] = [];
-  debug: boolean;
-  env: any;
-  observer: Observer;
-  set: any;
-  getters: { [name: string]: (payload?) => any };
-
-  constructor(config: StoreConfig, options: StoreOption = {}) {
-    super();
-    this.debug = options.debug || false;
-    this.state = config.state || {};
-    this.actions = config.actions;
-    this.mutations = config.mutations;
-    this.env = config.env;
-    this.observer = new Observer();
-    this.observer.notifyCB = this.trigger.bind(this, "update");
-    this.observer.allowMutations = false;
-    this.observer.observe(this.state);
-    this.getters = {};
-
-    if (this.debug) {
-      this.history.push({ state: this.state });
-    }
-    this.set = this.observer.set.bind(this.observer);
-
-    for (let entry of Object.entries(config.getters || {})) {
-      const name: string = entry[0];
-      const func: (...any) => any = entry[1];
-      this.getters[name] = payload => {
-        return func({ state: this.state, getters: this.getters }, payload);
-      };
-    }
-  }
-
-  dispatch(action: string, payload?: any): Promise<void> | void {
-    if (!this.actions[action]) {
-      throw new Error(`[Error] action ${action} is undefined`);
-    }
-    const result = this.actions[action](
-      {
-        commit: this.commit.bind(this),
-        dispatch: this.dispatch.bind(this),
-        env: this.env,
-        state: this.state,
-        getters: this.getters
-      },
-      payload
-    );
-    if (result instanceof Promise) {
-      return new Promise((resolve, reject) => {
-        result.then(() => resolve());
-        result.catch(reject);
-      });
-    }
-  }
-
-  commit(type: string, payload?: any): any {
-    if (!this.mutations[type]) {
-      throw new Error(`[Error] mutation ${type} is undefined`);
-    }
-    this._commitLevel++;
-    this.observer.allowMutations = true;
-
-    const res = this.mutations[type].call(
-      null,
-      {
-        commit: this.commit.bind(this),
-        state: this.state,
-        set: this.set,
-        getters: this.getters
-      },
-      payload
-    );
-
-    if (this._commitLevel === 1) {
-      this.observer.allowMutations = false;
-      if (this.debug) {
-        this.history.push({
-          state: this.state,
-          mutation: type,
-          payload: payload
-        });
-      }
-    }
-    this._commitLevel--;
-    return res;
-  }
-}
-
-//------------------------------------------------------------------------------
-// Connect function
-//------------------------------------------------------------------------------
-
-function revNumber<T extends Object>(o: T): number {
-  if (o !== null && typeof o === "object" && (<any>o).__owl__) {
-    return (<any>o).__owl__.rev;
-  }
-  return 0;
-}
-
-function deepRevNumber<T extends Object>(o: T): number {
-  if (o !== null && typeof o === "object" && (<any>o).__owl__) {
-    return (<any>o).__owl__.deepRev;
-  }
-  return 0;
-}
-
-type Constructor<T> = new (...args: any[]) => T;
-interface EnvWithStore extends Env {
-  store: Store;
-}
-
-let nextID = 1;
-
-export function connect(mapStateToProps, options: any = {}) {
-  let hashFunction = options.hashFunction || null;
-
-  if (!hashFunction) {
-    let deep = "deep" in options ? options.deep : true;
-    let defaultRevFunction = deep ? deepRevNumber : revNumber;
-    hashFunction = function({ storeProps }, options) {
-      const { currentStoreProps } = options;
-      if ("__owl__" in storeProps) {
-        return defaultRevFunction(storeProps);
-      }
-      let hash = 0;
-      for (let key in storeProps) {
-        const val = storeProps[key];
-        const hashVal = defaultRevFunction(val);
-        if (hashVal === 0) {
-          if (val !== currentStoreProps[key]) {
-            options.didChange = true;
-          }
-        } else {
-          hash += hashVal;
-        }
-      }
-      return hash;
-    };
-  }
-
-  return function<E extends EnvWithStore, P, S>(
-    Comp: Constructor<Component<E, P, S>>
-  ) {
-    const Result = class extends Comp {
-      constructor(parent, props?: any) {
-        const env = parent instanceof Component ? parent.env : parent;
-        const ownProps = Object.assign({}, props || {});
-        const storeProps = mapStateToProps(
-          env.store.state,
-          ownProps,
-          env.store.getters
-        );
-        const mergedProps = Object.assign({}, props || {}, storeProps);
-        super(parent, mergedProps);
-        (<any>this.__owl__).ownProps = ownProps;
-        (<any>this.__owl__).currentStoreProps = storeProps;
-        (<any>this.__owl__).storeHash = hashFunction(
-          {
-            state: env.store.state,
-            storeProps: storeProps,
-            revNumber,
-            deepRevNumber
-          },
-          {
-            currentStoreProps: storeProps
-          }
-        );
-      }
-      /**
-       * We do not use the mounted hook here for a subtle reason: we want the
-       * updates to be called for the parents before the children.  However,
-       * if we use the mounted hook, this will be done in the reverse order.
-       */
-      _callMounted() {
-        this.env.store.on("update", this, this._checkUpdate);
-        super._callMounted();
-      }
-      willUnmount() {
-        this.env.store.off("update", this);
-        super.willUnmount();
-      }
-
-      _checkUpdate() {
-        const ownProps = (<any>this.__owl__).ownProps;
-        const storeProps = mapStateToProps(
-          this.env.store.state,
-          ownProps,
-          this.env.store.getters
-        );
-        const options: any = {
-          currentStoreProps: (<any>this.__owl__).currentStoreProps
-        };
-        const storeHash = hashFunction(
-          {
-            state: this.env.store.state,
-            storeProps: storeProps,
-            revNumber,
-            deepRevNumber
-          },
-          options
-        );
-        let didChange = options.didChange;
-        if (storeHash !== (<any>this.__owl__).storeHash) {
-          didChange = true;
-          (<any>this.__owl__).storeHash = storeHash;
-        }
-        if (didChange) {
-          (<any>this.__owl__).currentStoreProps = storeProps;
-          this._updateProps(ownProps, false);
-        }
-      }
-      _updateProps(nextProps, forceUpdate, patchQueue?: any[]) {
-        if ((<any>this.__owl__).ownProps !== nextProps) {
-          (<any>this.__owl__).currentStoreProps = mapStateToProps(
-            this.env.store.state,
-            nextProps,
-            this.env.store.getters
-          );
-        }
-        (<any>this.__owl__).ownProps = nextProps;
-        const mergedProps = Object.assign(
-          {},
-          nextProps,
-          (<any>this.__owl__).currentStoreProps
-        );
-        return super._updateProps(mergedProps, forceUpdate, patchQueue);
-      }
-    };
-
-    // we assign here a unique name to the resulting anonymous class.
-    // this is necessary for Owl to be able to properly deduce templates.
-    // Otherwise, all connected components would have the same name, and then
-    // each component after the first will necessarily have the same template.
-    let name = `ConnectedComponent${nextID++}`;
-    Object.defineProperty(Result, "name", { value: name });
-    return Result;
-  };
-}

src/utils.ts

@@ -1,99 +0,0 @@
-/**
- * Owl Utils
- *
- * We have here a small collection of utility functions:
- *
- * - whenReady
- * - loadJS
- * - loadTemplates
- * - escape
- * - debounce
- */
-
-export function whenReady(fn) {
-  if (document.readyState === "complete") {
-    fn();
-  } else {
-    document.addEventListener("DOMContentLoaded", fn, false);
-  }
-}
-
-const loadedScripts: { [key: string]: Promise<void> } = {};
-
-export function loadJS(url: string): Promise<void> {
-  if (url in loadedScripts) {
-    return loadedScripts[url];
-  }
-  const promise: Promise<void> = new Promise(function(resolve, reject) {
-    const script = document.createElement("script");
-    script.type = "text/javascript";
-    script.src = url;
-    script.onload = function() {
-      resolve();
-    };
-    script.onerror = function() {
-      reject(`Error loading file '${url}'`);
-    };
-    const head = document.head || document.getElementsByTagName("head")[0];
-    head.appendChild(script);
-  });
-  loadedScripts[url] = promise;
-  return promise;
-}
-
-export async function loadTemplates(url: string): Promise<string> {
-  const result = await fetch(url);
-  if (!result.ok) {
-    throw new Error("Error while fetching xml templates");
-  }
-  let templates = await result.text();
-  templates = templates.replace(/<!--[\s\S]*?-->/g, "");
-  return templates;
-}
-
-export function escape(str: string | number | undefined): string {
-  if (str === undefined) {
-    return "";
-  }
-  if (typeof str === "number") {
-    return String(str);
-  }
-  return str
-    .replace(/&/g, "&amp;")
-    .replace(/</g, "&lt;")
-    .replace(/>/g, "&gt;")
-    .replace(/"/g, "&#x27;")
-    .replace(/`/g, "&#x60;");
-}
-
-/**
- * Returns a function, that, as long as it continues to be invoked, will not
- * be triggered. The function will be called after it stops being called for
- * N milliseconds. If `immediate` is passed, trigger the function on the
- * leading edge, instead of the trailing.
- *
- * Inspired by https://davidwalsh.name/javascript-debounce-function
- */
-export function debounce(
-  func: Function,
-  wait: number,
-  immediate?: boolean
-): Function {
-  let timeout;
-  return function(this: any) {
-    const context = this;
-    const args = arguments;
-    function later() {
-      timeout = null;
-      if (!immediate) {
-        func.apply(context, args);
-      }
-    }
-    const callNow = immediate && !timeout;
-    clearTimeout(timeout);
-    timeout = setTimeout(later, wait);
-    if (callNow) {
-      func.apply(context, args);
-    }
-  };
-}

src/vdom.ts

@@ -1,948 +0,0 @@
-/**
- * Owl VDOM
- *
- * This file contains an implementation of a virtual DOM, which is a system that
- * can generate in-memory representations of a DOM tree, compare them, and
- * eventually change a concrete DOM tree to match its representation, in an
- * hopefully efficient way.
- *
- * Note that this code is a fork of Snabbdom, slightly tweaked/optimized for our
- * needs (see https://github.com/snabbdom/snabbdom).
- *
- * The main exported values are:
- * - interface VNode
- * - h function (a helper function to generate a vnode)
- * - patch function (to apply a vnode to an actual DOM node)
- */
-
-// because those in TypeScript are too restrictive: https://github.com/Microsoft/TSJS-lib-generator/pull/237
-declare global {
-  interface Element {
-    setAttribute(name: string, value: string | number | boolean): void;
-    setAttributeNS(
-      namespaceURI: string,
-      qualifiedName: string,
-      value: string | number | boolean
-    ): void;
-  }
-}
-
-//------------------------------------------------------------------------------
-// vnode.ts
-//------------------------------------------------------------------------------
-type Key = string | number;
-
-export interface VNode {
-  sel: string | undefined;
-  data: VNodeData | undefined;
-  children: Array<VNode | string> | undefined;
-  elm: Node | undefined;
-  text: string | undefined;
-  key: Key | undefined;
-}
-
-interface VNodeData {
-  props?: Props;
-  attrs?: Attrs;
-  on?: On;
-  hook?: Hooks;
-  key?: Key;
-  ns?: string; // for SVGs
-  [key: string]: any; // for any other 3rd party module
-}
-
-function vnode(
-  sel: string | undefined,
-  data: any | undefined,
-  children: Array<VNode | string> | undefined,
-  text: string | undefined,
-  elm: Element | Text | undefined
-): VNode {
-  let key = data === undefined ? undefined : data.key;
-  return {
-    sel: sel,
-    data: data,
-    children: children,
-    text: text,
-    elm: elm,
-    key: key
-  };
-}
-
-//------------------------------------------------------------------------------
-// snabbdom.ts
-//------------------------------------------------------------------------------
-function isUndef(s: any): boolean {
-  return s === undefined;
-}
-function isDef(s: any): boolean {
-  return s !== undefined;
-}
-
-type VNodeQueue = Array<VNode>;
-
-const emptyNode = vnode("", {}, [], undefined, undefined);
-
-function sameVnode(vnode1: VNode, vnode2: VNode): boolean {
-  return vnode1.key === vnode2.key && vnode1.sel === vnode2.sel;
-}
-
-function isVnode(vnode: any): vnode is VNode {
-  return vnode.sel !== undefined;
-}
-
-type KeyToIndexMap = { [key: string]: number };
-
-type ArraysOf<T> = { [K in keyof T]: (T[K])[] };
-
-type ModuleHooks = ArraysOf<Module>;
-
-function createKeyToOldIdx(
-  children: Array<VNode>,
-  beginIdx: number,
-  endIdx: number
-): KeyToIndexMap {
-  let i: number,
-    map: KeyToIndexMap = {},
-    key: Key | undefined,
-    ch;
-  for (i = beginIdx; i <= endIdx; ++i) {
-    ch = children[i];
-    if (ch != null) {
-      key = ch.key;
-      if (key !== undefined) map[key] = i;
-    }
-  }
-  return map;
-}
-
-const hooks: (keyof Module)[] = [
-  "create",
-  "update",
-  "remove",
-  "destroy",
-  "pre",
-  "post"
-];
-
-export function init(modules: Array<Partial<Module>>, domApi?: DOMAPI) {
-  let i: number,
-    j: number,
-    cbs = {} as ModuleHooks;
-
-  const api: DOMAPI = domApi !== undefined ? domApi : htmlDomApi;
-
-  for (i = 0; i < hooks.length; ++i) {
-    cbs[hooks[i]] = [];
-    for (j = 0; j < modules.length; ++j) {
-      const hook = modules[j][hooks[i]];
-      if (hook !== undefined) {
-        (cbs[hooks[i]] as Array<any>).push(hook);
-      }
-    }
-  }
-
-  function emptyNodeAt(elm: Element) {
-    const id = elm.id ? "#" + elm.id : "";
-    const c = elm.className ? "." + elm.className.split(" ").join(".") : "";
-    return vnode(
-      api.tagName(elm).toLowerCase() + id + c,
-      {},
-      [],
-      undefined,
-      elm
-    );
-  }
-
-  function createRmCb(childElm: Node, listeners: number) {
-    return function rmCb() {
-      if (--listeners === 0) {
-        const parent = api.parentNode(childElm);
-        api.removeChild(parent, childElm);
-      }
-    };
-  }
-
-  function createElm(vnode: VNode, insertedVnodeQueue: VNodeQueue): Node {
-    let i: any,
-      iLen: number,
-      data = vnode.data;
-    if (data !== undefined) {
-      if (isDef((i = data.hook)) && isDef((i = i.init))) {
-        i(vnode);
-        data = vnode.data;
-      }
-    }
-    let children = vnode.children,
-      sel = vnode.sel;
-    if (sel === "!") {
-      if (isUndef(vnode.text)) {
-        vnode.text = "";
-      }
-      vnode.elm = api.createComment(vnode.text as string);
-    } else if (sel !== undefined) {
-      // Parse selector
-      const hashIdx = sel.indexOf("#");
-      const dotIdx = sel.indexOf(".", hashIdx);
-      const hash = hashIdx > 0 ? hashIdx : sel.length;
-      const dot = dotIdx > 0 ? dotIdx : sel.length;
-      const tag =
-        hashIdx !== -1 || dotIdx !== -1
-          ? sel.slice(0, Math.min(hash, dot))
-          : sel;
-      const elm = (vnode.elm =
-        isDef(data) && isDef((i = (data as VNodeData).ns))
-          ? api.createElementNS(i, tag)
-          : api.createElement(tag));
-      if (hash < dot) elm.setAttribute("id", sel.slice(hash + 1, dot));
-      if (dotIdx > 0)
-        elm.setAttribute("class", sel.slice(dot + 1).replace(/\./g, " "));
-      for (i = 0, iLen = cbs.create.length; i < iLen; ++i)
-        cbs.create[i](emptyNode, vnode);
-      if (array(children)) {
-        for (i = 0, iLen = children.length; i < iLen; ++i) {
-          const ch = children[i];
-          if (ch != null) {
-            api.appendChild(elm, createElm(ch as VNode, insertedVnodeQueue));
-          }
-        }
-      } else if (primitive(vnode.text)) {
-        api.appendChild(elm, api.createTextNode(vnode.text));
-      }
-      i = (vnode.data as VNodeData).hook; // Reuse variable
-      if (isDef(i)) {
-        if (i.create) i.create(emptyNode, vnode);
-        if (i.insert) insertedVnodeQueue.push(vnode);
-      }
-    } else {
-      vnode.elm = api.createTextNode(vnode.text as string);
-    }
-    return vnode.elm;
-  }
-
-  function addVnodes(
-    parentElm: Node,
-    before: Node | null,
-    vnodes: Array<VNode>,
-    startIdx: number,
-    endIdx: number,
-    insertedVnodeQueue: VNodeQueue
-  ) {
-    for (; startIdx <= endIdx; ++startIdx) {
-      const ch = vnodes[startIdx];
-      if (ch != null) {
-        api.insertBefore(parentElm, createElm(ch, insertedVnodeQueue), before);
-      }
-    }
-  }
-
-  function invokeDestroyHook(vnode: VNode) {
-    let i: any,
-      iLen: number,
-      j: number,
-      jLen: number,
-      data = vnode.data;
-    if (data !== undefined) {
-      if (isDef((i = data.hook)) && isDef((i = i.destroy))) i(vnode);
-      for (i = 0, iLen = cbs.destroy.length; i < iLen; ++i)
-        cbs.destroy[i](vnode);
-      if (vnode.children !== undefined) {
-        for (j = 0, jLen = vnode.children.length; j < jLen; ++j) {
-          i = vnode.children[j];
-          if (i != null && typeof i !== "string") {
-            invokeDestroyHook(i);
-          }
-        }
-      }
-    }
-  }
-
-  function removeVnodes(
-    parentElm: Node,
-    vnodes: Array<VNode>,
-    startIdx: number,
-    endIdx: number
-  ): void {
-    for (; startIdx <= endIdx; ++startIdx) {
-      let i: any,
-        iLen: number,
-        listeners: number,
-        rm: () => void,
-        ch = vnodes[startIdx];
-      if (ch != null) {
-        if (isDef(ch.sel)) {
-          invokeDestroyHook(ch);
-          listeners = cbs.remove.length + 1;
-          rm = createRmCb(ch.elm as Node, listeners);
-          for (i = 0, iLen = cbs.remove.length; i < iLen; ++i)
-            cbs.remove[i](ch, rm);
-          if (
-            isDef((i = ch.data)) &&
-            isDef((i = i.hook)) &&
-            isDef((i = i.remove))
-          ) {
-            i(ch, rm);
-          } else {
-            rm();
-          }
-        } else {
-          // Text node
-          api.removeChild(parentElm, ch.elm as Node);
-        }
-      }
-    }
-  }
-
-  function updateChildren(
-    parentElm: Node,
-    oldCh: Array<VNode>,
-    newCh: Array<VNode>,
-    insertedVnodeQueue: VNodeQueue
-  ) {
-    let oldStartIdx = 0,
-      newStartIdx = 0;
-    let oldEndIdx = oldCh.length - 1;
-    let oldStartVnode = oldCh[0];
-    let oldEndVnode = oldCh[oldEndIdx];
-    let newEndIdx = newCh.length - 1;
-    let newStartVnode = newCh[0];
-    let newEndVnode = newCh[newEndIdx];
-    let oldKeyToIdx: any;
-    let idxInOld: number;
-    let elmToMove: VNode;
-    let before: any;
-
-    while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
-      if (oldStartVnode == null) {
-        oldStartVnode = oldCh[++oldStartIdx]; // Vnode might have been moved left
-      } else if (oldEndVnode == null) {
-        oldEndVnode = oldCh[--oldEndIdx];
-      } else if (newStartVnode == null) {
-        newStartVnode = newCh[++newStartIdx];
-      } else if (newEndVnode == null) {
-        newEndVnode = newCh[--newEndIdx];
-      } else if (sameVnode(oldStartVnode, newStartVnode)) {
-        patchVnode(oldStartVnode, newStartVnode, insertedVnodeQueue);
-        oldStartVnode = oldCh[++oldStartIdx];
-        newStartVnode = newCh[++newStartIdx];
-      } else if (sameVnode(oldEndVnode, newEndVnode)) {
-        patchVnode(oldEndVnode, newEndVnode, insertedVnodeQueue);
-        oldEndVnode = oldCh[--oldEndIdx];
-        newEndVnode = newCh[--newEndIdx];
-      } else if (sameVnode(oldStartVnode, newEndVnode)) {
-        // Vnode moved right
-        patchVnode(oldStartVnode, newEndVnode, insertedVnodeQueue);
-        api.insertBefore(
-          parentElm,
-          oldStartVnode.elm as Node,
-          api.nextSibling(oldEndVnode.elm as Node)
-        );
-        oldStartVnode = oldCh[++oldStartIdx];
-        newEndVnode = newCh[--newEndIdx];
-      } else if (sameVnode(oldEndVnode, newStartVnode)) {
-        // Vnode moved left
-        patchVnode(oldEndVnode, newStartVnode, insertedVnodeQueue);
-        api.insertBefore(
-          parentElm,
-          oldEndVnode.elm as Node,
-          oldStartVnode.elm as Node
-        );
-        oldEndVnode = oldCh[--oldEndIdx];
-        newStartVnode = newCh[++newStartIdx];
-      } else {
-        if (oldKeyToIdx === undefined) {
-          oldKeyToIdx = createKeyToOldIdx(oldCh, oldStartIdx, oldEndIdx);
-        }
-        idxInOld = oldKeyToIdx[newStartVnode.key as string];
-        if (isUndef(idxInOld)) {
-          // New element
-          api.insertBefore(
-            parentElm,
-            createElm(newStartVnode, insertedVnodeQueue),
-            oldStartVnode.elm as Node
-          );
-          newStartVnode = newCh[++newStartIdx];
-        } else {
-          elmToMove = oldCh[idxInOld];
-          if (elmToMove.sel !== newStartVnode.sel) {
-            api.insertBefore(
-              parentElm,
-              createElm(newStartVnode, insertedVnodeQueue),
-              oldStartVnode.elm as Node
-            );
-          } else {
-            patchVnode(elmToMove, newStartVnode, insertedVnodeQueue);
-            oldCh[idxInOld] = undefined as any;
-            api.insertBefore(
-              parentElm,
-              elmToMove.elm as Node,
-              oldStartVnode.elm as Node
-            );
-          }
-          newStartVnode = newCh[++newStartIdx];
-        }
-      }
-    }
-    if (oldStartIdx <= oldEndIdx || newStartIdx <= newEndIdx) {
-      if (oldStartIdx > oldEndIdx) {
-        before = newCh[newEndIdx + 1] == null ? null : newCh[newEndIdx + 1].elm;
-        addVnodes(
-          parentElm,
-          before,
-          newCh,
-          newStartIdx,
-          newEndIdx,
-          insertedVnodeQueue
-        );
-      } else {
-        removeVnodes(parentElm, oldCh, oldStartIdx, oldEndIdx);
-      }
-    }
-  }
-
-  function patchVnode(
-    oldVnode: VNode,
-    vnode: VNode,
-    insertedVnodeQueue: VNodeQueue
-  ) {
-    let i: any, iLen: number, hook: any;
-    if (
-      isDef((i = vnode.data)) &&
-      isDef((hook = i.hook)) &&
-      isDef((i = hook.prepatch))
-    ) {
-      i(oldVnode, vnode);
-    }
-    const elm = (vnode.elm = oldVnode.elm as Node);
-    let oldCh = oldVnode.children;
-    let ch = vnode.children;
-    if (oldVnode === vnode) return;
-    if (vnode.data !== undefined) {
-      for (i = 0, iLen = cbs.update.length; i < iLen; ++i)
-        cbs.update[i](oldVnode, vnode);
-      i = vnode.data.hook;
-      if (isDef(i) && isDef((i = i.update))) i(oldVnode, vnode);
-    }
-    if (isUndef(vnode.text)) {
-      if (isDef(oldCh) && isDef(ch)) {
-        if (oldCh !== ch)
-          updateChildren(
-            elm,
-            oldCh as Array<VNode>,
-            ch as Array<VNode>,
-            insertedVnodeQueue
-          );
-      } else if (isDef(ch)) {
-        if (isDef(oldVnode.text)) api.setTextContent(elm, "");
-        addVnodes(
-          elm,
-          null,
-          ch as Array<VNode>,
-          0,
-          (ch as Array<VNode>).length - 1,
-          insertedVnodeQueue
-        );
-      } else if (isDef(oldCh)) {
-        removeVnodes(
-          elm,
-          oldCh as Array<VNode>,
-          0,
-          (oldCh as Array<VNode>).length - 1
-        );
-      } else if (isDef(oldVnode.text)) {
-        api.setTextContent(elm, "");
-      }
-    } else if (oldVnode.text !== vnode.text) {
-      if (isDef(oldCh)) {
-        removeVnodes(
-          elm,
-          oldCh as Array<VNode>,
-          0,
-          (oldCh as Array<VNode>).length - 1
-        );
-      }
-      api.setTextContent(elm, vnode.text as string);
-    }
-    if (isDef(hook) && isDef((i = hook.postpatch))) {
-      i(oldVnode, vnode);
-    }
-  }
-
-  return function patch(oldVnode: VNode | Element, vnode: VNode): VNode {
-    let i: number, iLen: number, elm: Node, parent: Node;
-    const insertedVnodeQueue: VNodeQueue = [];
-    for (i = 0, iLen = cbs.pre.length; i < iLen; ++i) cbs.pre[i]();
-
-    if (!isVnode(oldVnode)) {
-      oldVnode = emptyNodeAt(oldVnode);
-    }
-
-    if (sameVnode(oldVnode, vnode)) {
-      patchVnode(oldVnode, vnode, insertedVnodeQueue);
-    } else {
-      elm = oldVnode.elm as Node;
-      parent = api.parentNode(elm);
-
-      createElm(vnode, insertedVnodeQueue);
-
-      if (parent !== null) {
-        api.insertBefore(parent, vnode.elm as Node, api.nextSibling(elm));
-        removeVnodes(parent, [oldVnode], 0, 0);
-      }
-    }
-
-    for (i = 0, iLen = insertedVnodeQueue.length; i < iLen; ++i) {
-      (((insertedVnodeQueue[i].data as VNodeData).hook as Hooks).insert as any)(
-        insertedVnodeQueue[i]
-      );
-    }
-    for (i = 0, iLen = cbs.post.length; i < iLen; ++i) cbs.post[i]();
-    return vnode;
-  };
-}
-
-//------------------------------------------------------------------------------
-// is.ts
-//------------------------------------------------------------------------------
-const array = Array.isArray;
-function primitive(s: any): s is string | number {
-  return typeof s === "string" || typeof s === "number";
-}
-
-//------------------------------------------------------------------------------
-// htmldomapi.ts
-//------------------------------------------------------------------------------
-interface DOMAPI {
-  createElement: (tagName: any) => HTMLElement;
-  createElementNS: (namespaceURI: string, qualifiedName: string) => Element;
-  createTextNode: (text: string) => Text;
-  createComment: (text: string) => Comment;
-  insertBefore: (
-    parentNode: Node,
-    newNode: Node,
-    referenceNode: Node | null
-  ) => void;
-  removeChild: (node: Node, child: Node) => void;
-  appendChild: (node: Node, child: Node) => void;
-  parentNode: (node: Node) => Node;
-  nextSibling: (node: Node) => Node;
-  tagName: (elm: Element) => string;
-  setTextContent: (node: Node, text: string | null) => void;
-  getTextContent: (node: Node) => string | null;
-  isElement: (node: Node) => node is Element;
-  isText: (node: Node) => node is Text;
-  isComment: (node: Node) => node is Comment;
-}
-
-function createElement(tagName: any): HTMLElement {
-  return document.createElement(tagName);
-}
-
-function createElementNS(namespaceURI: string, qualifiedName: string): Element {
-  return document.createElementNS(namespaceURI, qualifiedName);
-}
-
-function createTextNode(text: string): Text {
-  return document.createTextNode(text);
-}
-
-function createComment(text: string): Comment {
-  return document.createComment(text);
-}
-
-function insertBefore(
-  parentNode: Node,
-  newNode: Node,
-  referenceNode: Node | null
-): void {
-  parentNode.insertBefore(newNode, referenceNode);
-}
-
-function removeChild(node: Node, child: Node): void {
-  node.removeChild(child);
-}
-
-function appendChild(node: Node, child: Node): void {
-  node.appendChild(child);
-}
-
-function parentNode(node: Node): Node | null {
-  return node.parentNode;
-}
-
-function nextSibling(node: Node): Node | null {
-  return node.nextSibling;
-}
-
-function tagName(elm: Element): string {
-  return elm.tagName;
-}
-
-function setTextContent(node: Node, text: string | null): void {
-  node.textContent = text;
-}
-
-function getTextContent(node: Node): string | null {
-  return node.textContent;
-}
-
-function isElement(node: Node): node is Element {
-  return node.nodeType === 1;
-}
-
-function isText(node: Node): node is Text {
-  return node.nodeType === 3;
-}
-
-function isComment(node: Node): node is Comment {
-  return node.nodeType === 8;
-}
-
-const htmlDomApi = {
-  createElement,
-  createElementNS,
-  createTextNode,
-  createComment,
-  insertBefore,
-  removeChild,
-  appendChild,
-  parentNode,
-  nextSibling,
-  tagName,
-  setTextContent,
-  getTextContent,
-  isElement,
-  isText,
-  isComment
-} as DOMAPI;
-
-//------------------------------------------------------------------------------
-// hooks.ts
-//------------------------------------------------------------------------------
-type PreHook = () => any;
-type InitHook = (vNode: VNode) => any;
-type CreateHook = (emptyVNode: VNode, vNode: VNode) => any;
-type InsertHook = (vNode: VNode) => any;
-type PrePatchHook = (oldVNode: VNode, vNode: VNode) => any;
-type UpdateHook = (oldVNode: VNode, vNode: VNode) => any;
-type PostPatchHook = (oldVNode: VNode, vNode: VNode) => any;
-type DestroyHook = (vNode: VNode) => any;
-type RemoveHook = (vNode: VNode, removeCallback: () => void) => any;
-type PostHook = () => any;
-
-interface Hooks {
-  pre?: PreHook;
-  init?: InitHook;
-  create?: CreateHook;
-  insert?: InsertHook;
-  prepatch?: PrePatchHook;
-  update?: UpdateHook;
-  postpatch?: PostPatchHook;
-  destroy?: DestroyHook;
-  remove?: RemoveHook;
-  post?: PostHook;
-}
-
-//------------------------------------------------------------------------------
-// h.ts
-//------------------------------------------------------------------------------
-type VNodes = Array<VNode>;
-type VNodeChildElement = VNode | string | number | undefined | null;
-type ArrayOrElement<T> = T | T[];
-type VNodeChildren = ArrayOrElement<VNodeChildElement>;
-
-function addNS(
-  data: any,
-  children: VNodes | undefined,
-  sel: string | undefined
-): void {
-  data.ns = "http://www.w3.org/2000/svg";
-  if (sel !== "foreignObject" && children !== undefined) {
-    for (let i = 0, iLen = children.length; i < iLen; ++i) {
-      let childData = children[i].data;
-      if (childData !== undefined) {
-        addNS(
-          childData,
-          (children[i] as VNode).children as VNodes,
-          children[i].sel
-        );
-      }
-    }
-  }
-}
-
-export function h(sel: string): VNode;
-export function h(sel: string, data: VNodeData): VNode;
-export function h(sel: string, children: VNodeChildren): VNode;
-export function h(sel: string, data: VNodeData, children: VNodeChildren): VNode;
-export function h(sel: any, b?: any, c?: any): VNode {
-  var data: VNodeData = {},
-    children: any,
-    text: any,
-    i: number,
-    iLen: number;
-  if (c !== undefined) {
-    data = b;
-    if (array(c)) {
-      children = c;
-    } else if (primitive(c)) {
-      text = c;
-    } else if (c && c.sel) {
-      children = [c];
-    }
-  } else if (b !== undefined) {
-    if (array(b)) {
-      children = b;
-    } else if (primitive(b)) {
-      text = b;
-    } else if (b && b.sel) {
-      children = [b];
-    } else {
-      data = b;
-    }
-  }
-  if (children !== undefined) {
-    for (i = 0, iLen = children.length; i < iLen; ++i) {
-      if (primitive(children[i]))
-        children[i] = vnode(
-          undefined,
-          undefined,
-          undefined,
-          children[i],
-          undefined
-        );
-    }
-  }
-  if (
-    sel[0] === "s" &&
-    sel[1] === "v" &&
-    sel[2] === "g" &&
-    (sel.length === 3 || sel[3] === "." || sel[3] === "#")
-  ) {
-    addNS(data, children, sel);
-  }
-  return vnode(sel, data, children, text, undefined);
-}
-
-//------------------------------------------------------------------------------
-// module/props.ts
-//------------------------------------------------------------------------------
-type Props = Record<string, any>;
-
-function updateProps(oldVnode: VNode, vnode: VNode): void {
-  var key: string,
-    cur: any,
-    old: any,
-    elm = vnode.elm,
-    oldProps = (oldVnode.data as VNodeData).props,
-    props = (vnode.data as VNodeData).props;
-
-  if (!oldProps && !props) return;
-  if (oldProps === props) return;
-  oldProps = oldProps || {};
-  props = props || {};
-
-  for (key in oldProps) {
-    if (!props[key]) {
-      delete (elm as any)[key];
-    }
-  }
-  for (key in props) {
-    cur = props[key];
-    old = oldProps[key];
-    if (old !== cur && (key !== "value" || (elm as any)[key] !== cur)) {
-      (elm as any)[key] = cur;
-    }
-  }
-}
-
-export const propsModule = {
-  create: updateProps,
-  update: updateProps
-} as Module;
-
-//------------------------------------------------------------------------------
-// module/module.ts
-//------------------------------------------------------------------------------
-interface Module {
-  pre: PreHook;
-  create: CreateHook;
-  update: UpdateHook;
-  destroy: DestroyHook;
-  remove: RemoveHook;
-  post: PostHook;
-}
-
-//------------------------------------------------------------------------------
-// module/eventlisteners.ts
-//------------------------------------------------------------------------------
-type On = {
-  [N in keyof HTMLElementEventMap]?: (ev: HTMLElementEventMap[N]) => void
-} & {
-  [event: string]: EventListener;
-};
-
-function invokeHandler(handler: any, vnode?: VNode, event?: Event): void {
-  if (typeof handler === "function") {
-    // call function handler
-    handler.call(vnode, event, vnode);
-  } else if (typeof handler === "object") {
-    // call handler with arguments
-    if (typeof handler[0] === "function") {
-      // special case for single argument for performance
-      if (handler.length === 2) {
-        handler[0].call(vnode, handler[1], event, vnode);
-      } else {
-        var args = handler.slice(1);
-        args.push(event);
-        args.push(vnode);
-        handler[0].apply(vnode, args);
-      }
-    } else {
-      // call multiple handlers
-      for (let i = 0, iLen = handler.length; i < iLen; i++) {
-        invokeHandler(handler[i], vnode, event);
-      }
-    }
-  }
-}
-
-function handleEvent(event: Event, vnode: VNode) {
-  var name = event.type,
-    on = (vnode.data as VNodeData).on;
-
-  // call event handler(s) if exists
-  if (on && on[name]) {
-    invokeHandler(on[name], vnode, event);
-  }
-}
-
-function createListener() {
-  return function handler(event: Event) {
-    handleEvent(event, (handler as any).vnode);
-  };
-}
-
-function updateEventListeners(oldVnode: VNode, vnode?: VNode): void {
-  var oldOn = (oldVnode.data as VNodeData).on,
-    oldListener = (oldVnode as any).listener,
-    oldElm: Element = oldVnode.elm as Element,
-    on = vnode && (vnode.data as VNodeData).on,
-    elm: Element = (vnode && vnode.elm) as Element,
-    name: string;
-
-  // optimization for reused immutable handlers
-  if (oldOn === on) {
-    return;
-  }
-
-  // remove existing listeners which no longer used
-  if (oldOn && oldListener) {
-    // if element changed or deleted we remove all existing listeners unconditionally
-    if (!on) {
-      for (name in oldOn) {
-        // remove listener if element was changed or existing listeners removed
-        oldElm.removeEventListener(name, oldListener, false);
-      }
-    } else {
-      for (name in oldOn) {
-        // remove listener if existing listener removed
-        if (!on[name]) {
-          oldElm.removeEventListener(name, oldListener, false);
-        }
-      }
-    }
-  }
-
-  // add new listeners which has not already attached
-  if (on) {
-    // reuse existing listener or create new
-    var listener = ((vnode as any).listener =
-      (oldVnode as any).listener || createListener());
-    // update vnode for listener
-    listener.vnode = vnode;
-
-    // if element changed or added we add all needed listeners unconditionally
-    if (!oldOn) {
-      for (name in on) {
-        // add listener if element was changed or new listeners added
-        elm.addEventListener(name, listener, false);
-      }
-    } else {
-      for (name in on) {
-        // add listener if new listener added
-        if (!oldOn[name]) {
-          elm.addEventListener(name, listener, false);
-        }
-      }
-    }
-  }
-}
-
-export const eventListenersModule = {
-  create: updateEventListeners,
-  update: updateEventListeners,
-  destroy: updateEventListeners
-} as Module;
-
-//------------------------------------------------------------------------------
-// attributes.ts
-//------------------------------------------------------------------------------
-type Attrs = Record<string, string | number | boolean>;
-
-const xlinkNS = "http://www.w3.org/1999/xlink";
-const xmlNS = "http://www.w3.org/XML/1998/namespace";
-const colonChar = 58;
-const xChar = 120;
-
-function updateAttrs(oldVnode: VNode, vnode: VNode): void {
-  var key: string,
-    elm: Element = vnode.elm as Element,
-    oldAttrs = (oldVnode.data as VNodeData).attrs,
-    attrs = (vnode.data as VNodeData).attrs;
-
-  if (!oldAttrs && !attrs) return;
-  if (oldAttrs === attrs) return;
-  oldAttrs = oldAttrs || {};
-  attrs = attrs || {};
-
-  // update modified attributes, add new attributes
-  for (key in attrs) {
-    const cur = attrs[key];
-    const old = oldAttrs[key];
-    if (old !== cur) {
-      if (cur === true) {
-        elm.setAttribute(key, "");
-      } else if (cur === false) {
-        elm.removeAttribute(key);
-      } else {
-        if (key.charCodeAt(0) !== xChar) {
-          elm.setAttribute(key, cur);
-        } else if (key.charCodeAt(3) === colonChar) {
-          // Assume xml namespace
-          elm.setAttributeNS(xmlNS, key, cur);
-        } else if (key.charCodeAt(5) === colonChar) {
-          // Assume xlink namespace
-          elm.setAttributeNS(xlinkNS, key, cur);
-        } else {
-          elm.setAttribute(key, cur);
-        }
-      }
-    }
-  }
-  // remove removed attributes
-  // use `in` operator since the previous `for` iteration uses it (.i.e. add even attributes with undefined value)
-  // the other option is to remove all attributes with value == undefined
-  for (key in oldAttrs) {
-    if (!(key in attrs)) {
-      elm.removeAttribute(key);
-    }
-  }
-}
-
-export const attrsModule = {
-  create: updateAttrs,
-  update: updateAttrs
-} as Module;
-
-export const patch = init([eventListenersModule, attrsModule, propsModule]);

tests/__snapshots__/animations.test.ts.snap

@@ -1,119 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`animations t-transition combined with t-widget 1`] = `
-"function anonymous(context,extra
-) {
-    let utils = this.utils;
-    let QWeb = this.constructor;
-    let owner = context;
-    var h = this.utils.h;
-    let c1 = [], p1 = {key:1};
-    var vn1 = h('div', p1, c1);
-    //WIDGET
-    let _2_index = c1.length;
-    c1.push(null);
-    let def3;
-    let w4 = 4 in context.__owl__.cmap ? context.__owl__.children[context.__owl__.cmap[4]] : false;
-    let props4 = {};
-    if (w4 && w4.__owl__.renderPromise && !w4.__owl__.vnode && props4 !== w4.__owl__.renderProps) {
-        w4.destroy();
-        w4 = false
-    }
-    if (!w4) {
-        let widgetKey4 = \`Child\`;
-        let W4 = context.widgets && context.widgets[widgetKey4] || QWeb.widgets[widgetKey4];
-        if (!W4) {throw new Error('Cannot find the definition of widget \\"' + widgetKey4 + '\\"')}
-        w4 = new W4(owner, props4);
-        context.__owl__.cmap[4] = w4.__owl__.id;
-        def3 = w4._prepare();
-        def3 = def3.then(vnode=>{let pvnode=h(vnode.sel, {key: 4, hook: {insert(vn) {let nvn=w4._mount(vnode, pvnode.elm);pvnode.elm=nvn.elm;utils.transitionInsert(vn.elm, 'chimay');},remove() {},destroy(vn) {let finalize = () => {
-          w4.destroy();
-        };
-        utils.transitionRemove(vn.elm, 'chimay', finalize);}}});c1[_2_index]=pvnode;w4.__owl__.pvnode = pvnode;});
-    } else {
-        def3 = w4._updateProps(props4, extra.forceUpdate, extra.patchQueue);
-        def3 = def3.then(()=>{if (w4.__owl__.isDestroyed) {return};let pvnode=w4.__owl__.pvnode;c1[_2_index]=pvnode;});
-    }
-    extra.promises.push(def3);
-    return vn1;
-}"
-`;
-
-exports[`animations t-transition combined with t-widget and t-if 1`] = `
-"function anonymous(context,extra
-) {
-    let utils = this.utils;
-    let QWeb = this.constructor;
-    let owner = context;
-    var h = this.utils.h;
-    let c1 = [], p1 = {key:1};
-    var vn1 = h('div', p1, c1);
-    if (context['state'].display) {
-        //WIDGET
-        let _2_index = c1.length;
-        c1.push(null);
-        let def3;
-        let w4 = 4 in context.__owl__.cmap ? context.__owl__.children[context.__owl__.cmap[4]] : false;
-        let props4 = {};
-        if (w4 && w4.__owl__.renderPromise && !w4.__owl__.vnode && props4 !== w4.__owl__.renderProps) {
-            w4.destroy();
-            w4 = false
-        }
-        if (!w4) {
-            let widgetKey4 = \`Child\`;
-            let W4 = context.widgets && context.widgets[widgetKey4] || QWeb.widgets[widgetKey4];
-            if (!W4) {throw new Error('Cannot find the definition of widget \\"' + widgetKey4 + '\\"')}
-            w4 = new W4(owner, props4);
-            context.__owl__.cmap[4] = w4.__owl__.id;
-            def3 = w4._prepare();
-            def3 = def3.then(vnode=>{let pvnode=h(vnode.sel, {key: 4, hook: {insert(vn) {let nvn=w4._mount(vnode, pvnode.elm);pvnode.elm=nvn.elm;utils.transitionInsert(vn.elm, 'chimay');},remove() {},destroy(vn) {let finalize = () => {
-          w4.destroy();
-        };
-        utils.transitionRemove(vn.elm, 'chimay', finalize);}}});c1[_2_index]=pvnode;w4.__owl__.pvnode = pvnode;});
-        } else {
-            def3 = w4._updateProps(props4, extra.forceUpdate, extra.patchQueue);
-            def3 = def3.then(()=>{if (w4.__owl__.isDestroyed) {return};let pvnode=w4.__owl__.pvnode;c1[_2_index]=pvnode;});
-        }
-        extra.promises.push(def3);
-    }
-    return vn1;
-}"
-`;
-
-exports[`animations t-transition with no delay/duration 1`] = `
-"function anonymous(context,extra
-) {
-    var h = this.utils.h;
-    let c1 = [], p1 = {key:1};
-    var vn1 = h('span', p1, c1);
-    p1.hook = {
-      insert: vn => {
-        this.utils.transitionInsert(vn.elm, 'jupiler');
-      },
-      remove: (vn, rm) => {
-        this.utils.transitionRemove(vn.elm, 'jupiler', rm);
-      },
-    };
-    c1.push({text: \`blue\`});
-    return vn1;
-}"
-`;
-
-exports[`animations t-transition, on a simple node (insert) 1`] = `
-"function anonymous(context,extra
-) {
-    var h = this.utils.h;
-    let c1 = [], p1 = {key:1};
-    var vn1 = h('span', p1, c1);
-    p1.hook = {
-      insert: vn => {
-        this.utils.transitionInsert(vn.elm, 'chimay');
-      },
-      remove: (vn, rm) => {
-        this.utils.transitionRemove(vn.elm, 'chimay', rm);
-      },
-    };
-    c1.push({text: \`blue\`});
-    return vn1;
-}"
-`;

tests/__snapshots__/component.test.ts.snap

@@ -1,276 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`class and style attributes with t-widget dynamic t-att-style is properly added and updated on widget root el 1`] = `
-"function anonymous(context,extra
-) {
-    let utils = this.utils;
-    let QWeb = this.constructor;
-    let owner = context;
-    var h = this.utils.h;
-    let c1 = [], p1 = {key:1};
-    var vn1 = h('div', p1, c1);
-    //WIDGET
-    let _2_index = c1.length;
-    c1.push(null);
-    let def3;
-    const _5 = context['state'].style;
-    let w4 = 4 in context.__owl__.cmap ? context.__owl__.children[context.__owl__.cmap[4]] : false;
-    let props4 = {};
-    if (w4 && w4.__owl__.renderPromise && !w4.__owl__.vnode && props4 !== w4.__owl__.renderProps) {
-        w4.destroy();
-        w4 = false
-    }
-    if (!w4) {
-        let widgetKey4 = \`child\`;
-        let W4 = context.widgets && context.widgets[widgetKey4] || QWeb.widgets[widgetKey4];
-        if (!W4) {throw new Error('Cannot find the definition of widget \\"' + widgetKey4 + '\\"')}
-        w4 = new W4(owner, props4);
-        context.__owl__.cmap[4] = w4.__owl__.id;
-        def3 = w4._prepare();
-        def3 = def3.then(vnode=>{vnode.data.hook = {create(_, vn){vn.elm.style = _5}};let pvnode=h(vnode.sel, {key: 4, hook: {insert(vn) {let nvn=w4._mount(vnode, pvnode.elm);pvnode.elm=nvn.elm;},remove() {},destroy(vn) {w4.destroy();}}});c1[_2_index]=pvnode;w4.__owl__.pvnode = pvnode;});
-    } else {
-        def3 = w4._updateProps(props4, extra.forceUpdate, extra.patchQueue);
-        def3 = def3.then(()=>{if (w4.__owl__.isDestroyed) {return};w4.el.style=_5;let pvnode=w4.__owl__.pvnode;c1[_2_index]=pvnode;});
-    }
-    extra.promises.push(def3);
-    return vn1;
-}"
-`;
-
-exports[`class and style attributes with t-widget t-att-class is properly added/removed on widget root el 1`] = `
-"function anonymous(context,extra
-) {
-    let utils = this.utils;
-    let QWeb = this.constructor;
-    let owner = context;
-    var h = this.utils.h;
-    let c1 = [], p1 = {key:1};
-    var vn1 = h('div', p1, c1);
-    //WIDGET
-    let _2_index = c1.length;
-    c1.push(null);
-    let def3;
-    const _5 = {a: context['state'].a,b: context['state'].b};
-    let w4 = 4 in context.__owl__.cmap ? context.__owl__.children[context.__owl__.cmap[4]] : false;
-    let props4 = {};
-    if (w4 && w4.__owl__.renderPromise && !w4.__owl__.vnode && props4 !== w4.__owl__.renderProps) {
-        w4.destroy();
-        w4 = false
-    }
-    if (!w4) {
-        let widgetKey4 = \`child\`;
-        let W4 = context.widgets && context.widgets[widgetKey4] || QWeb.widgets[widgetKey4];
-        if (!W4) {throw new Error('Cannot find the definition of widget \\"' + widgetKey4 + '\\"')}
-        w4 = new W4(owner, props4);
-        context.__owl__.cmap[4] = w4.__owl__.id;
-        def3 = w4._prepare();
-        def3 = def3.then(vnode=>{vnode.data.hook = {create(_, vn){for (let k in _5) {
-              if (_5[k]) {
-                  vn.elm.classList.add(k);
-              }
-          }}};let pvnode=h(vnode.sel, {key: 4, hook: {insert(vn) {let nvn=w4._mount(vnode, pvnode.elm);pvnode.elm=nvn.elm;},remove() {},destroy(vn) {w4.destroy();}}});c1[_2_index]=pvnode;w4.__owl__.pvnode = pvnode;});
-    } else {
-        def3 = w4._updateProps(props4, extra.forceUpdate, extra.patchQueue);
-        def3 = def3.then(()=>{if (w4.__owl__.isDestroyed) {return};let cl=w4.el.classList;for (let k in _5) {if (_5[k]) {cl.add(k)} else {cl.remove(k)}}let pvnode=w4.__owl__.pvnode;c1[_2_index]=pvnode;});
-    }
-    extra.promises.push(def3);
-    return vn1;
-}"
-`;
-
-exports[`composition sub widgets with some state rendered in a loop 1`] = `
-"function anonymous(context,extra
-) {
-    let utils = this.utils;
-    let QWeb = this.constructor;
-    let owner = context;
-    context = Object.create(context);
-    var h = this.utils.h;
-    let c1 = [], p1 = {key:1};
-    var vn1 = h('div', p1, c1);
-    var _2 = context['state'].numbers;
-    if (!_2) { throw new Error('QWeb error: Invalid loop expression')}
-    if (typeof _2 === 'number') { _2 = Array.from(Array(_2).keys())}
-    var _3 = _2 instanceof Array ? _2 : Object.keys(_2);
-    var _length3 = _3.length;
-    var _4 = _2 instanceof Array ? _2 : Object.values(_2);
-    for (let i = 0; i < _length3; i++) {
-        context.number_first = i === 0;
-        context.number_last = i === _length3 - 1;
-        context.number_parity = i % 2 === 0 ? 'even' : 'odd';
-        context.number_index = i;
-        context.number = _3[i];
-        context.number_value = _4[i];
-        //WIDGET
-        let key8 = context['number'];
-        let _5_index = c1.length;
-        c1.push(null);
-        let def6;
-        let w7 = key8 in context.__owl__.cmap ? context.__owl__.children[context.__owl__.cmap[key8]] : false;
-        let props7 = {};
-        if (w7 && w7.__owl__.renderPromise && !w7.__owl__.vnode && props7 !== w7.__owl__.renderProps) {
-            w7.destroy();
-            w7 = false
-        }
-        if (!w7) {
-            let widgetKey7 = \`ChildWidget\`;
-            let W7 = context.widgets && context.widgets[widgetKey7] || QWeb.widgets[widgetKey7];
-            if (!W7) {throw new Error('Cannot find the definition of widget \\"' + widgetKey7 + '\\"')}
-            w7 = new W7(owner, props7);
-            context.__owl__.cmap[key8] = w7.__owl__.id;
-            def6 = w7._prepare();
-            def6 = def6.then(vnode=>{let pvnode=h(vnode.sel, {key: key8, hook: {insert(vn) {let nvn=w7._mount(vnode, pvnode.elm);pvnode.elm=nvn.elm;},remove() {},destroy(vn) {w7.destroy();}}});c1[_5_index]=pvnode;w7.__owl__.pvnode = pvnode;});
-        } else {
-            def6 = w7._updateProps(props7, extra.forceUpdate, extra.patchQueue);
-            def6 = def6.then(()=>{if (w7.__owl__.isDestroyed) {return};let pvnode=w7.__owl__.pvnode;c1[_5_index]=pvnode;});
-        }
-        extra.promises.push(def6);
-    }
-    return vn1;
-}"
-`;
-
-exports[`composition t-widget with dynamic value 1`] = `
-"function anonymous(context,extra
-) {
-    let utils = this.utils;
-    let QWeb = this.constructor;
-    let owner = context;
-    var h = this.utils.h;
-    let c1 = [], p1 = {key:1};
-    var vn1 = h('div', p1, c1);
-    //WIDGET
-    let _2_index = c1.length;
-    c1.push(null);
-    let def3;
-    let w4 = 4 in context.__owl__.cmap ? context.__owl__.children[context.__owl__.cmap[4]] : false;
-    let props4 = {};
-    if (w4 && w4.__owl__.renderPromise && !w4.__owl__.vnode && props4 !== w4.__owl__.renderProps) {
-        w4.destroy();
-        w4 = false
-    }
-    if (!w4) {
-        let widgetKey4 = context['state'].widget;
-        let W4 = context.widgets && context.widgets[widgetKey4] || QWeb.widgets[widgetKey4];
-        if (!W4) {throw new Error('Cannot find the definition of widget \\"' + widgetKey4 + '\\"')}
-        w4 = new W4(owner, props4);
-        context.__owl__.cmap[4] = w4.__owl__.id;
-        def3 = w4._prepare();
-        def3 = def3.then(vnode=>{let pvnode=h(vnode.sel, {key: 4, hook: {insert(vn) {let nvn=w4._mount(vnode, pvnode.elm);pvnode.elm=nvn.elm;},remove() {},destroy(vn) {w4.destroy();}}});c1[_2_index]=pvnode;w4.__owl__.pvnode = pvnode;});
-    } else {
-        def3 = w4._updateProps(props4, extra.forceUpdate, extra.patchQueue);
-        def3 = def3.then(()=>{if (w4.__owl__.isDestroyed) {return};let pvnode=w4.__owl__.pvnode;c1[_2_index]=pvnode;});
-    }
-    extra.promises.push(def3);
-    return vn1;
-}"
-`;
-
-exports[`composition t-widget with dynamic value 2 1`] = `
-"function anonymous(context,extra
-) {
-    let utils = this.utils;
-    let QWeb = this.constructor;
-    let owner = context;
-    var h = this.utils.h;
-    let c1 = [], p1 = {key:1};
-    var vn1 = h('div', p1, c1);
-    //WIDGET
-    let _2_index = c1.length;
-    c1.push(null);
-    let def3;
-    let w4 = 4 in context.__owl__.cmap ? context.__owl__.children[context.__owl__.cmap[4]] : false;
-    let props4 = {};
-    if (w4 && w4.__owl__.renderPromise && !w4.__owl__.vnode && props4 !== w4.__owl__.renderProps) {
-        w4.destroy();
-        w4 = false
-    }
-    if (!w4) {
-        let widgetKey4 = \`Widget\${context['state'].widget}\`;
-        let W4 = context.widgets && context.widgets[widgetKey4] || QWeb.widgets[widgetKey4];
-        if (!W4) {throw new Error('Cannot find the definition of widget \\"' + widgetKey4 + '\\"')}
-        w4 = new W4(owner, props4);
-        context.__owl__.cmap[4] = w4.__owl__.id;
-        def3 = w4._prepare();
-        def3 = def3.then(vnode=>{let pvnode=h(vnode.sel, {key: 4, hook: {insert(vn) {let nvn=w4._mount(vnode, pvnode.elm);pvnode.elm=nvn.elm;},remove() {},destroy(vn) {w4.destroy();}}});c1[_2_index]=pvnode;w4.__owl__.pvnode = pvnode;});
-    } else {
-        def3 = w4._updateProps(props4, extra.forceUpdate, extra.patchQueue);
-        def3 = def3.then(()=>{if (w4.__owl__.isDestroyed) {return};let pvnode=w4.__owl__.pvnode;c1[_2_index]=pvnode;});
-    }
-    extra.promises.push(def3);
-    return vn1;
-}"
-`;
-
-exports[`random stuff/miscellaneous snapshotting compiled code 1`] = `
-"function anonymous(context,extra
-) {
-    let utils = this.utils;
-    let QWeb = this.constructor;
-    let owner = context;
-    var h = this.utils.h;
-    let c1 = [], p1 = {key:1};
-    var vn1 = h('div', p1, c1);
-    //WIDGET
-    let key5 = 'somestring';
-    let _2_index = c1.length;
-    c1.push(null);
-    let def3;
-    let w4 = key5 in context.__owl__.cmap ? context.__owl__.children[context.__owl__.cmap[key5]] : false;
-    let props4 = {flag: context['state'].flag};
-    if (w4 && w4.__owl__.renderPromise && !w4.__owl__.vnode && props4 !== w4.__owl__.renderProps) {
-        w4.destroy();
-        w4 = false
-    }
-    if (!w4) {
-        let widgetKey4 = \`child\`;
-        let W4 = context.widgets && context.widgets[widgetKey4] || QWeb.widgets[widgetKey4];
-        if (!W4) {throw new Error('Cannot find the definition of widget \\"' + widgetKey4 + '\\"')}
-        w4 = new W4(owner, props4);
-        context.__owl__.cmap[key5] = w4.__owl__.id;
-        def3 = w4._prepare();
-        def3 = def3.then(vnode=>{let pvnode=h(vnode.sel, {key: key5, hook: {insert(vn) {let nvn=w4._mount(vnode, pvnode.elm);pvnode.elm=nvn.elm;},remove() {},destroy(vn) {w4.destroy();}}});c1[_2_index]=pvnode;w4.__owl__.pvnode = pvnode;});
-    } else {
-        def3 = w4._updateProps(props4, extra.forceUpdate, extra.patchQueue);
-        def3 = def3.then(()=>{if (w4.__owl__.isDestroyed) {return};let pvnode=w4.__owl__.pvnode;c1[_2_index]=pvnode;});
-    }
-    extra.promises.push(def3);
-    return vn1;
-}"
-`;
-
-exports[`random stuff/miscellaneous t-props should not be undefined (snapshotting) 1`] = `
-"function anonymous(context,extra
-) {
-    let utils = this.utils;
-    let QWeb = this.constructor;
-    let owner = context;
-    var h = this.utils.h;
-    let c1 = [], p1 = {key:1};
-    var vn1 = h('div', p1, c1);
-    //WIDGET
-    let _2_index = c1.length;
-    c1.push(null);
-    let def3;
-    let w4 = 4 in context.__owl__.cmap ? context.__owl__.children[context.__owl__.cmap[4]] : false;
-    let props4 = {};
-    if (w4 && w4.__owl__.renderPromise && !w4.__owl__.vnode && props4 !== w4.__owl__.renderProps) {
-        w4.destroy();
-        w4 = false
-    }
-    if (!w4) {
-        let widgetKey4 = \`child\`;
-        let W4 = context.widgets && context.widgets[widgetKey4] || QWeb.widgets[widgetKey4];
-        if (!W4) {throw new Error('Cannot find the definition of widget \\"' + widgetKey4 + '\\"')}
-        w4 = new W4(owner, props4);
-        context.__owl__.cmap[4] = w4.__owl__.id;
-        def3 = w4._prepare();
-        def3 = def3.then(vnode=>{let pvnode=h(vnode.sel, {key: 4, hook: {insert(vn) {let nvn=w4._mount(vnode, pvnode.elm);pvnode.elm=nvn.elm;},remove() {},destroy(vn) {w4.destroy();}}});c1[_2_index]=pvnode;w4.__owl__.pvnode = pvnode;});
-    } else {
-        def3 = w4._updateProps(props4, extra.forceUpdate, extra.patchQueue);
-        def3 = def3.then(()=>{if (w4.__owl__.isDestroyed) {return};let pvnode=w4.__owl__.pvnode;c1[_2_index]=pvnode;});
-    }
-    extra.promises.push(def3);
-    return vn1;
-}"
-`;