Page titles and primary cta alignment and styling consistent

Data and automations page titles now use BBUI Heading component and Spacer component. They are not consistent in styling and spacing. Welcome screen app cards buttons changed to text buttons. I made this change as there were too many buttons on the page. We want one primary button - create new app. Early changes mage to binding popover. More to come.
2024-06-02 02:25:17 +12:00 · 2020-09-26 00:45:56 +01:00 · 2020-09-26 00:45:56 +01:00 · eaef5d0419
parent 24e316f03d
commit eaef5d0419
16 changed files with 334 additions and 85 deletions
--- a/packages/builder/package.json
+++ b/packages/builder/package.json
@ -63,7 +63,7 @@
    }
  },
  "dependencies": {
-    "@budibase/bbui": "^1.34.5",
+    "@budibase/bbui": "^1.36.2",
    "@budibase/client": "^0.1.21",
    "@budibase/colorpicker": "^1.0.1",
    "@fortawesome/fontawesome-free": "^5.14.0",
--- a/packages/builder/src/budibase.css
+++ b/packages/builder/src/budibase.css
@ -158,4 +158,8 @@
 .bb__alert--danger {
    background: #fef4f6;
    color: #f0506e;
+}
+
+a {
+    text-decoration: none;
 }
--- a/packages/builder/src/components/automation/AutomationPanel/AutomationList/AutomationList.svelte
+++ b/packages/builder/src/components/automation/AutomationPanel/AutomationList/AutomationList.svelte
@ -26,7 +26,7 @@
 </script>

 <section>
-  <Button purple wide on:click={newAutomation}>Create New Automation</Button>
+  <Button primary wide on:click={newAutomation}>Create New Automation</Button>
  <ul>
    {#each $automationStore.automations as automation}
      <li
--- a/packages/builder/src/components/automation/AutomationPanel/AutomationPanel.svelte
+++ b/packages/builder/src/components/automation/AutomationPanel/AutomationPanel.svelte
@ -2,11 +2,13 @@
  import { automationStore } from "builderStore"
  import AutomationList from "./AutomationList/AutomationList.svelte"
  import BlockList from "./BlockList/BlockList.svelte"
+  import { Heading } from "@budibase/bbui"
+  import { Spacer } from "@budibase/bbui"

  let selectedTab = "AUTOMATIONS"
 </script>

-<header>
+<Heading black small>
  <span
    data-cy="automation-list"
    class="hoverable automation-header"
@ -23,7 +25,8 @@
      Steps
    </span>
  {/if}
-</header>
+</Heading>
+<Spacer medium />
 {#if selectedTab === 'AUTOMATIONS'}
  <AutomationList />
 {:else if selectedTab === 'ADD'}
--- a/packages/builder/src/components/backend/ModelNavigator/ModelNavigator.svelte
+++ b/packages/builder/src/components/backend/ModelNavigator/ModelNavigator.svelte
@ -9,6 +9,8 @@
  import CreateTablePopover from "./CreateTable.svelte"
  import EditTablePopover from "./EditTable.svelte"
  import EditViewPopover from "./EditView.svelte"
+  import { Heading } from "@budibase/bbui"
+  import { Spacer } from "@budibase/bbui"

  const { open, close } = getContext("simple-modal")

@ -30,7 +32,8 @@
  {#if $backendUiStore.selectedDatabase && $backendUiStore.selectedDatabase._id}
    <div class="hierarchy">
      <div class="components-list-container">
-        <h5>Tables</h5>
+        <Heading small>Tables</Heading>
+        <Spacer medium />
        <CreateTablePopover />
        <div class="hierarchy-items-container">
          {#each $backendUiStore.models as model}
--- a/packages/builder/src/components/start/AppCard.svelte
+++ b/packages/builder/src/components/start/AppCard.svelte
@ -1,60 +1,35 @@
 <script>
-  import Button from "components/common/Button.svelte"
+  import { TextButton } from "@budibase/bbui"
+  import { Heading } from "@budibase/bbui"
+  import { Spacer } from "@budibase/bbui"
  export let name, _id
 </script>

 <div class="apps-card">
-  <h3 class="app-title">{name}</h3>
+  <Heading small black>{name}</Heading>
+  <Spacer medium />
  <div class="card-footer">
-    <a href={`/_builder/${_id}`} class="app-button">Open {name}</a>
+    <TextButton text medium blue href="/_builder/{_id}">
+      Open {name} →
+    </TextButton>
  </div>
 </div>

 <style>
  .apps-card {
    background-color: var(--white);
-    padding: var(--spacing-xl);
+    padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-xl)
+      var(--spacing-xl);
    max-width: 300px;
    max-height: 150px;
    border-radius: var(--border-radius-m);
    border: var(--border-dark);
  }

-  .app-button:hover {
-    background-color: var(--white);
-    color: var(--black);
-    text-decoration: none;
-  }
-
-  .app-title {
-    font-size: var(--font-size-l);
-    font-weight: 600;
-    color: var(--ink);
-    text-transform: capitalize;
-  }
-
  .card-footer {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    justify-content: space-between;
  }
-
-  .app-button {
-    align-items: center;
-    display: flex;
-    background-color: var(--ink);
-    color: var(--white);
-    border: 1.5px var(--ink) solid;
-    width: 100%;
-    justify-content: center;
-    padding: 8px 16px;
-    border-radius: var(--border-radius-s);
-    font-size: var(--font-size-xs);
-    font-weight: 500;
-    cursor: pointer;
-    transition: all 0.2s;
-    box-sizing: border-box;
-    font-family: var(--font-sans);
-  }
 </style>
--- a/packages/builder/src/components/userInterface/BindingDropdown.svelte
+++ b/packages/builder/src/components/userInterface/BindingDropdown.svelte
@ -1,6 +1,13 @@
 <script>
  import groupBy from "lodash/fp/groupBy"
-  import { Button, TextArea, Label, Body } from "@budibase/bbui"
+  import {
+    Button,
+    TextArea,
+    Label,
+    Body,
+    Heading,
+    Spacer,
+  } from "@budibase/bbui"
  import { createEventDispatcher } from "svelte"

  const dispatch = createEventDispatcher()
@ -26,9 +33,9 @@

 <div class="container" data-cy="binding-dropdown-modal">
  <div class="list">
-    <Label size="l" color="dark">Objects</Label>
+    <Heading extraSmall>Objects</Heading>
    {#if context}
-      <Label size="s" color="dark">Table</Label>
+      <Heading extraSmall>Tables</Heading>
      <ul>
        {#each context as { readableBinding }}
          <li on:click={() => addToText(readableBinding)}>{readableBinding}</li>
@ -36,7 +43,7 @@
      </ul>
    {/if}
    {#if instance}
-      <Label size="s" color="dark">Components</Label>
+      <Heading extraSmall>Components</Heading>
      <ul>
        {#each instance as { readableBinding }}
          <li on:click={() => addToText(readableBinding)}>{readableBinding}</li>
@ -45,15 +52,17 @@
    {/if}
  </div>
  <div class="text">
-    <Label size="l" color="dark">Data binding</Label>
-    <Body size="s" color="dark">
+    <Heading extraSmall>Data binding</Heading>
+    <Spacer small />
+    <Body extraSmall lh>
      Binding connects one piece of data to another and makes it dynamic. Click
      the objects on the left, to add them to the textbox.
    </Body>
+    <Spacer large />
    <TextArea bind:value placeholder="" />
    <div class="controls">
-      <a href="#">
-        <Body size="s" color="light">Learn more about binding</Body>
+      <a href="https://docs.budibase.com">
+        <Body small grey>Learn more about binding</Body>
      </a>
      <Button on:click={cancel} secondary>Cancel</Button>
      <Button on:click={close} primary>Done</Button>
@ -73,17 +82,19 @@
  .controls {
    margin-top: var(--spacing-m);
    display: grid;
-    align-items: center;
+    align-items: baseline;
    grid-gap: var(--spacing-l);
    grid-template-columns: 1fr auto auto;
  }
  .list {
    width: 150px;
    border-right: 1.5px solid var(--grey-4);
+    padding: var(--spacing-xl);
  }
  .text {
    width: 600px;
-    display: grid;
+    padding: var(--spacing-xl);
+    font-family: var(--font-sans);
  }
  .text :global(p) {
    margin: 0;
--- a/packages/builder/src/components/userInterface/ComponentDropdownMenu.svelte
+++ b/packages/builder/src/components/userInterface/ComponentDropdownMenu.svelte
@ -181,7 +181,7 @@
  ul {
    list-style: none;
    padding: 0;
-    margin: 0;
+    margin: var(--spacing-xs) 0;
  }

  li {
--- a/packages/builder/src/components/userInterface/EventsEditor/EventEditorModal.svelte
+++ b/packages/builder/src/components/userInterface/EventsEditor/EventEditorModal.svelte
@ -1,6 +1,13 @@
 <script>
  import { store } from "builderStore"
-  import { TextButton, Button, Heading, DropdownMenu } from "@budibase/bbui"
+  import {
+    TextButton,
+    Button,
+    Heading,
+    Body,
+    Spacer,
+    DropdownMenu,
+  } from "@budibase/bbui"
  import { AddIcon, ArrowDownIcon } from "components/common/Icons/"
  import { EVENT_TYPE_MEMBER_NAME } from "../../common/eventHandlers"
  import actionTypes from "./actions"
@ -89,11 +96,9 @@
      {#each actions as action, index}
        <div class="action-container">
          <div class="action-header" on:click={selectAction(action)}>
-            <p
-              class="bb-body bb-body--small bb-body--color-dark"
-              style="margin: var(--spacing-s) 0;">
+            <Body extraSmall lh>
              {index + 1}. {action[EVENT_TYPE_MEMBER_NAME]}
-            </p>
+            </Body>
            <div class="row-expander" class:rotate={action !== selectedAction}>
              <ArrowDownIcon />
            </div>
--- a/packages/builder/src/components/userInterface/FrontendNavigatePane.svelte
+++ b/packages/builder/src/components/userInterface/FrontendNavigatePane.svelte
@ -4,6 +4,8 @@
  import PageLayout from "components/userInterface/PageLayout.svelte"
  import PagesList from "components/userInterface/PagesList.svelte"
  import NewScreen from "components/userInterface/NewScreen.svelte"
+  import { Button } from "@budibase/bbui"
+  import { Spacer } from "@budibase/bbui"

  const newScreen = () => {
    newScreenPicker.show()
@ -14,8 +16,9 @@

 <PagesList />

-<button class="newscreen" on:click={newScreen}>Create New Screen</button>
-
+<Spacer medium />
+<Button primary wide on:click={newScreen}>Create New Screen</Button>
+<Spacer medium />
 <PageLayout layout={$store.pages[$store.currentPageName]} />

 <div class="nav-items-container">
--- a/packages/builder/src/components/userInterface/GenericBindingPopover.svelte
+++ b/packages/builder/src/components/userInterface/GenericBindingPopover.svelte
@ -1,6 +1,14 @@
 <script>
  import groupBy from "lodash/fp/groupBy"
-  import { TextArea, Label, Body, Button, Popover } from "@budibase/bbui"
+  import {
+    TextArea,
+    Label,
+    Heading,
+    Body,
+    Spacer,
+    Button,
+    Popover,
+  } from "@budibase/bbui"
  import { createEventDispatcher } from "svelte"
  const dispatch = createEventDispatcher()

@ -24,7 +32,7 @@
      <div class="bindings__wrapper">
        <div class="bindings__list">
          {#each categories as [categoryName, bindings]}
-            <Label small>{categoryName}</Label>
+            <Heading extraSmall>{categoryName}</Heading>
            {#each bindings as binding}
              <div class="binding" on:click={() => onClickBinding(binding)}>
                <span class="binding__label">{binding.label}</span>
@ -38,14 +46,16 @@
      </div>
    </div>
    <div class="editor">
-      <Label large>Data binding</Label>
-      <Body small>
+      <Heading large>Data binding</Heading>
+      <Spacer small />
+      <Body small lh black>
        Binding connects one piece of data to another and makes it dynamic.
        Click the objects on the left to add them to the textbox.
      </Body>
+      <Spacer medium />
      <TextArea thin bind:value placeholder="..." />
      <div class="controls">
-        <a href="#">
+        <a href="https://docs.budibase.com">
          <Body small>Learn more about binding</Body>
        </a>
        <Button on:click={popover.hide} primary>Done</Button>
--- a/packages/builder/src/components/userInterface/PropertyControl.svelte
+++ b/packages/builder/src/components/userInterface/PropertyControl.svelte
@ -118,7 +118,7 @@
    position: relative;
    display: flex;
    flex-flow: row;
-    width: 260px;
+    min-width: 260px;
    margin: 8px 0px;
    align-items: center;
  }
@ -143,13 +143,15 @@
  }
  button {
    position: absolute;
+    cursor: pointer;
    background: none;
    border: none;
-    border-radius: 50%;
-    height: 24px;
-    width: 24px;
-    background: rgb(224, 224, 224);
-    right: 5px;
+    height: 90%;
+    width: 2rem;
+    background: var(--grey-2);
+    right: 10px;
    --spacing-s: 0;
+    border-left: 0.5px solid var(--grey-3);
+    outline-color: var(--blue);
  }
 </style>
--- a/packages/builder/src/components/userInterface/ScreenDropdownMenu.svelte
+++ b/packages/builder/src/components/userInterface/ScreenDropdownMenu.svelte
@ -74,9 +74,8 @@
  .menu {
    z-index: 100000;
    overflow: visible;
-    padding: 12px 0px;
-    border-radius: 5px;
-    margin: 0;
+    padding: var(--spacing-xs) 0;
+    border-radius: var(--border-radius-s);
  }

  .menu li {
@ -92,7 +91,7 @@
  .item {
    display: flex;
    align-items: center;
-    font-size: 14px;
+    font-size: var(--font-size-s);
  }

  .icon {
@ -101,7 +100,7 @@

  .menu li:not(.disabled) {
    cursor: pointer;
-    color: var(--grey-7);
+    color: var(--ink);
  }

  .menu li:not(.disabled):hover {
--- a/packages/builder/src/pages/[application]/automate/_layout.svelte
+++ b/packages/builder/src/pages/[application]/automate/_layout.svelte
@ -34,6 +34,6 @@
  .nav {
    overflow-y: auto;
    background: var(--white);
-    padding: var(--spacing-xl);
+    padding: var(--spacing-xl) var(--spacing-xl);
  }
 </style>
--- a/packages/builder/src/pages/index.svelte
+++ b/packages/builder/src/pages/index.svelte
@ -9,6 +9,7 @@
  import Spinner from "components/common/Spinner.svelte"
  import CreateAppModal from "components/start/CreateAppModal.svelte"
  import { Button } from "@budibase/bbui"
+  import { Heading } from "@budibase/bbui"

  let promise = getApps()

@ -64,8 +65,8 @@
 </script>

 <div class="header">
-  <div class="welcome">Welcome to the Budibase Beta</div>
-  <Button primary purple on:click={showCreateAppModal}>
+  <Heading medium black>Welcome to the Budibase Beta</Heading>
+  <Button primary black on:click={showCreateAppModal}>
    Create New Web App
  </Button>
 </div>
--- a/packages/builder/yarn.lock
+++ b/packages/builder/yarn.lock
@ -709,14 +709,23 @@
    lodash "^4.17.13"
    to-fast-properties "^2.0.0"

-"@budibase/bbui@^1.34.5":
-  version "1.34.5"
-  resolved "https://registry.yarnpkg.com/@budibase/bbui/-/bbui-1.34.5.tgz#357f0b3c3aa139b21d5d38a11fd39f0f79a5d1db"
-  integrity sha512-nMEVPRLuz+BXQbCRiKLBr0uT4mx1PbUZuviJHiROcj8wWvGwKhEmFYilBTZhXGboRE5VSV+M6ImThCDIjYEQlQ==
+"@budibase/bbui@^1.36.2":
+  version "1.36.2"
+  resolved "https://registry.yarnpkg.com/@budibase/bbui/-/bbui-1.36.2.tgz#9bba296cfa5441028d5b28897c341fd1e623d893"
+  integrity sha512-YZiwy1pflsOwvlKXZVD0F+ia5j8dC+k8+VkbRaQS+RdBwSqpXSdAS9P72A1wb4t8vB1vGRwWGYjTYJhRPd9v3w==
  dependencies:
    sirv-cli "^0.4.6"
    svelte-flatpickr "^2.4.0"

+"@budibase/client@^0.1.21":
+  version "0.1.21"
+  resolved "https://registry.yarnpkg.com/@budibase/client/-/client-0.1.21.tgz#db414445c132b373f6c25e39d62628eb60cd8ac3"
+  integrity sha512-/ju0vYbWh9MUjmxkGNlOL4S/VQd4p5mbz5rHu0yt55ak9t/yyzI6PzBBxlucBeRbXYd9OFynFjy1pvYt1v+z9Q==
+  dependencies:
+    deep-equal "^2.0.1"
+    mustache "^4.0.1"
+    regexparam "^1.3.0"
+
 "@budibase/colorpicker@^1.0.1":
  version "1.0.1"
  resolved "https://registry.yarnpkg.com/@budibase/colorpicker/-/colorpicker-1.0.1.tgz#940c180e7ebba0cb0756c4c8ef13f5dfab58e810"
@ -1393,6 +1402,11 @@ array-equal@^1.0.0:
  version "1.0.0"
  resolved "https://registry.yarnpkg.com/array-equal/-/array-equal-1.0.0.tgz#8c2a5ef2472fd9ea742b04c77a75093ba2757c93"

+array-filter@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/array-filter/-/array-filter-1.0.0.tgz#baf79e62e6ef4c2a4c0b831232daffec251f9d83"
+  integrity sha1-uveeYubvTCpMC4MSMtr/7CUfnYM=
+
 array-union@^2.1.0:
  version "2.1.0"
  resolved "https://registry.yarnpkg.com/array-union/-/array-union-2.1.0.tgz#b798420adbeb1de828d84acd8a2e23d3efe85e8d"
@ -1447,6 +1461,13 @@ atob@^2.1.2:
  version "2.1.2"
  resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.2.tgz#6d9517eb9e030d2436666651e86bd9f6f13533c9"

+available-typed-arrays@^1.0.0, available-typed-arrays@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/available-typed-arrays/-/available-typed-arrays-1.0.2.tgz#6b098ca9d8039079ee3f77f7b783c4480ba513f5"
+  integrity sha512-XWX3OX8Onv97LMk/ftVyBibpGwY5a8SmuxZPzeOxqmuEqUCOM9ZE+uIaD1VNJ5QnvU2UQusvmKbuM1FR8QWGfQ==
+  dependencies:
+    array-filter "^1.0.0"
+
 aws-sign2@~0.7.0:
  version "0.7.0"
  resolved "https://registry.yarnpkg.com/aws-sign2/-/aws-sign2-0.7.0.tgz#b46e890934a9591f2d2f6f86d7e6a9f1b3fe76a8"
@ -2396,6 +2417,26 @@ decode-uri-component@^0.2.0:
  version "0.2.0"
  resolved "https://registry.yarnpkg.com/decode-uri-component/-/decode-uri-component-0.2.0.tgz#eb3913333458775cb84cd1a1fae062106bb87545"

+deep-equal@^2.0.1:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/deep-equal/-/deep-equal-2.0.3.tgz#cad1c15277ad78a5c01c49c2dee0f54de8a6a7b0"
+  integrity sha512-Spqdl4H+ky45I9ByyJtXteOm9CaIrPmnIPmOhrkKGNYWeDgCvJ8jNYVCTjChxW4FqGuZnLHADc8EKRMX6+CgvA==
+  dependencies:
+    es-abstract "^1.17.5"
+    es-get-iterator "^1.1.0"
+    is-arguments "^1.0.4"
+    is-date-object "^1.0.2"
+    is-regex "^1.0.5"
+    isarray "^2.0.5"
+    object-is "^1.1.2"
+    object-keys "^1.1.1"
+    object.assign "^4.1.0"
+    regexp.prototype.flags "^1.3.0"
+    side-channel "^1.0.2"
+    which-boxed-primitive "^1.0.1"
+    which-collection "^1.0.1"
+    which-typed-array "^1.1.2"
+
 deep-is@~0.1.3:
  version "0.1.3"
  resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.3.tgz#b369d6fb5dbc13eecf524f91b070feedc357cf34"
@ -2565,6 +2606,54 @@ es-abstract@^1.17.0-next.1, es-abstract@^1.17.2, es-abstract@^1.17.5:
    string.prototype.trimleft "^2.1.1"
    string.prototype.trimright "^2.1.1"

+es-abstract@^1.17.4:
+  version "1.17.6"
+  resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.17.6.tgz#9142071707857b2cacc7b89ecb670316c3e2d52a"
+  integrity sha512-Fr89bON3WFyUi5EvAeI48QTWX0AyekGgLA8H+c+7fbfCkJwRWRMLd8CQedNEyJuoYYhmtEqY92pgte1FAhBlhw==
+  dependencies:
+    es-to-primitive "^1.2.1"
+    function-bind "^1.1.1"
+    has "^1.0.3"
+    has-symbols "^1.0.1"
+    is-callable "^1.2.0"
+    is-regex "^1.1.0"
+    object-inspect "^1.7.0"
+    object-keys "^1.1.1"
+    object.assign "^4.1.0"
+    string.prototype.trimend "^1.0.1"
+    string.prototype.trimstart "^1.0.1"
+
+es-abstract@^1.18.0-next.0:
+  version "1.18.0-next.0"
+  resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.18.0-next.0.tgz#b302834927e624d8e5837ed48224291f2c66e6fc"
+  integrity sha512-elZXTZXKn51hUBdJjSZGYRujuzilgXo8vSPQzjGYXLvSlGiCo8VO8ZGV3kjo9a0WNJJ57hENagwbtlRuHuzkcQ==
+  dependencies:
+    es-to-primitive "^1.2.1"
+    function-bind "^1.1.1"
+    has "^1.0.3"
+    has-symbols "^1.0.1"
+    is-callable "^1.2.0"
+    is-negative-zero "^2.0.0"
+    is-regex "^1.1.1"
+    object-inspect "^1.8.0"
+    object-keys "^1.1.1"
+    object.assign "^4.1.0"
+    string.prototype.trimend "^1.0.1"
+    string.prototype.trimstart "^1.0.1"
+
+es-get-iterator@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/es-get-iterator/-/es-get-iterator-1.1.0.tgz#bb98ad9d6d63b31aacdc8f89d5d0ee57bcb5b4c8"
+  integrity sha512-UfrmHuWQlNMTs35e1ypnvikg6jCz3SK8v8ImvmDsh36fCVUR1MqoFDiyn0/k52C8NqO3YsO8Oe0azeesNuqSsQ==
+  dependencies:
+    es-abstract "^1.17.4"
+    has-symbols "^1.0.1"
+    is-arguments "^1.0.4"
+    is-map "^2.0.1"
+    is-set "^2.0.1"
+    is-string "^1.0.5"
+    isarray "^2.0.5"
+
 es-to-primitive@^1.2.1:
  version "1.2.1"
  resolved "https://registry.yarnpkg.com/es-to-primitive/-/es-to-primitive-1.2.1.tgz#e55cd4c9cdc188bcefb03b366c736323fc5c898a"
@ -2871,7 +2960,7 @@ for-in@^1.0.2:
  version "1.0.2"
  resolved "https://registry.yarnpkg.com/for-in/-/for-in-1.0.2.tgz#81068d295a8142ec0ac726c6e2200c30fb6d5e80"

-foreach@~2.0.1:
+foreach@^2.0.5, foreach@~2.0.1:
  version "2.0.5"
  resolved "https://registry.yarnpkg.com/foreach/-/foreach-2.0.5.tgz#0bee005018aeb260d0a3af3ae658dd0136ec1b99"
  integrity sha1-C+4AUBiusmDQo6865ljdATbsG5k=
@ -3245,16 +3334,31 @@ is-accessor-descriptor@^1.0.0:
  dependencies:
    kind-of "^6.0.0"

+is-arguments@^1.0.4:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/is-arguments/-/is-arguments-1.0.4.tgz#3faf966c7cba0ff437fb31f6250082fcf0448cf3"
+  integrity sha512-xPh0Rmt8NE65sNzvyUmWgI1tz3mKq74lGA0mL8LYZcoIzKOzDh6HmrYm3d18k60nHerC8A9Km8kYu87zfSFnLA==
+
 is-arrayish@^0.2.1:
  version "0.2.1"
  resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.2.1.tgz#77c99840527aa8ecb1a8ba697b80645a7a926a9d"

+is-bigint@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/is-bigint/-/is-bigint-1.0.0.tgz#73da8c33208d00f130e9b5e15d23eac9215601c4"
+  integrity sha512-t5mGUXC/xRheCK431ylNiSkGGpBp8bHENBcENTkDT6ppwPzEVxNGZRvgvmOEfbWkFhA7D2GEuE2mmQTr78sl2g==
+
 is-binary-path@~2.1.0:
  version "2.1.0"
  resolved "https://registry.yarnpkg.com/is-binary-path/-/is-binary-path-2.1.0.tgz#ea1f7f3b80f064236e83470f86c09c254fb45b09"
  dependencies:
    binary-extensions "^2.0.0"

+is-boolean-object@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/is-boolean-object/-/is-boolean-object-1.0.1.tgz#10edc0900dd127697a92f6f9807c7617d68ac48e"
+  integrity sha512-TqZuVwa/sppcrhUCAYkGBk7w0yxfQQnxq28fjkO53tnK9FQXmdwz2JS5+GjsWQ6RByES1K40nI+yDic5c9/aAQ==
+
 is-buffer@^1.1.5:
  version "1.1.6"
  resolved "https://registry.yarnpkg.com/is-buffer/-/is-buffer-1.1.6.tgz#efaa2ea9daa0d7ab2ea13a97b2b8ad51fefbe8be"
@ -3263,6 +3367,11 @@ is-callable@^1.1.4, is-callable@^1.1.5:
  version "1.1.5"
  resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.1.5.tgz#f7e46b596890456db74e7f6e976cb3273d06faab"

+is-callable@^1.2.0:
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.2.2.tgz#c7c6715cd22d4ddb48d3e19970223aceabb080d9"
+  integrity sha512-dnMqspv5nU3LoewK2N/y7KLtxtakvTuaCsU9FU50/QDmdbHNy/4/JuRtMHqRU22o3q+W89YQndQEeCVwK+3qrA==
+
 is-ci@^2.0.0:
  version "2.0.0"
  resolved "https://registry.yarnpkg.com/is-ci/-/is-ci-2.0.0.tgz#6bc6334181810e04b5c22b3d589fdca55026404c"
@ -3281,7 +3390,7 @@ is-data-descriptor@^1.0.0:
  dependencies:
    kind-of "^6.0.0"

-is-date-object@^1.0.1:
+is-date-object@^1.0.1, is-date-object@^1.0.2:
  version "1.0.2"
  resolved "https://registry.yarnpkg.com/is-date-object/-/is-date-object-1.0.2.tgz#bda736f2cd8fd06d32844e7743bfa7494c3bfd7e"

@ -3346,10 +3455,25 @@ is-installed-globally@^0.3.2:
    global-dirs "^2.0.1"
    is-path-inside "^3.0.1"

+is-map@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/is-map/-/is-map-2.0.1.tgz#520dafc4307bb8ebc33b813de5ce7c9400d644a1"
+  integrity sha512-T/S49scO8plUiAOA2DBTBG3JHpn1yiw0kRp6dgiZ0v2/6twi5eiB0rHtHFH9ZIrvlWc6+4O+m4zg5+Z833aXgw==
+
 is-module@^1.0.0:
  version "1.0.0"
  resolved "https://registry.yarnpkg.com/is-module/-/is-module-1.0.0.tgz#3258fb69f78c14d5b815d664336b4cffb6441591"

+is-negative-zero@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/is-negative-zero/-/is-negative-zero-2.0.0.tgz#9553b121b0fac28869da9ed459e20c7543788461"
+  integrity sha1-lVOxIbD6wohp2p7UWeIMdUN4hGE=
+
+is-number-object@^1.0.3:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/is-number-object/-/is-number-object-1.0.4.tgz#36ac95e741cf18b283fc1ddf5e83da798e3ec197"
+  integrity sha512-zohwelOAur+5uXtk8O3GPQ1eAcu4ZX3UwxQhUlfFFMNpUd83gXgjbhJh6HmB6LUNV/ieOLQuDwJO3dWJosUeMw==
+
 is-number@^3.0.0:
  version "3.0.0"
  resolved "https://registry.yarnpkg.com/is-number/-/is-number-3.0.0.tgz#24fd6201a4782cf50561c810276afc7d12d71195"
@ -3406,6 +3530,18 @@ is-regex@^1.0.5:
  dependencies:
    has "^1.0.3"

+is-regex@^1.1.0, is-regex@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.1.1.tgz#c6f98aacc546f6cec5468a07b7b153ab564a57b9"
+  integrity sha512-1+QkEcxiLlB7VEyFtyBg94e08OAsvq7FUBgApTq/w2ymCLyKJgDPsybBENVtA7XCQEgEXxKPonG+mvYRxh/LIg==
+  dependencies:
+    has-symbols "^1.0.1"
+
+is-set@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/is-set/-/is-set-2.0.1.tgz#d1604afdab1724986d30091575f54945da7e5f43"
+  integrity sha512-eJEzOtVyenDs1TMzSQ3kU3K+E0GUS9sno+F0OBT97xsgcJsF9nXMBtkT9/kut5JEpM7oL7X/0qxR17K3mcwIAA==
+
 is-stream@^1.1.0:
  version "1.1.0"
  resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-1.1.0.tgz#12d4a3dd4e68e0b79ceb8dbc84173ae80d91ca44"
@ -3414,16 +3550,41 @@ is-stream@^2.0.0:
  version "2.0.0"
  resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-2.0.0.tgz#bde9c32680d6fae04129d6ac9d921ce7815f78e3"

+is-string@^1.0.4, is-string@^1.0.5:
+  version "1.0.5"
+  resolved "https://registry.yarnpkg.com/is-string/-/is-string-1.0.5.tgz#40493ed198ef3ff477b8c7f92f644ec82a5cd3a6"
+  integrity sha512-buY6VNRjhQMiF1qWDouloZlQbRhDPCebwxSjxMjxgemYT46YMd2NR0/H+fBhEfWX4A/w9TBJ+ol+okqJKFE6vQ==
+
 is-symbol@^1.0.2:
  version "1.0.3"
  resolved "https://registry.yarnpkg.com/is-symbol/-/is-symbol-1.0.3.tgz#38e1014b9e6329be0de9d24a414fd7441ec61937"
  dependencies:
    has-symbols "^1.0.1"

+is-typed-array@^1.1.3:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/is-typed-array/-/is-typed-array-1.1.3.tgz#a4ff5a5e672e1a55f99c7f54e59597af5c1df04d"
+  integrity sha512-BSYUBOK/HJibQ30wWkWold5txYwMUXQct9YHAQJr8fSwvZoiglcqB0pd7vEN23+Tsi9IUEjztdOSzl4qLVYGTQ==
+  dependencies:
+    available-typed-arrays "^1.0.0"
+    es-abstract "^1.17.4"
+    foreach "^2.0.5"
+    has-symbols "^1.0.1"
+
 is-typedarray@~1.0.0:
  version "1.0.0"
  resolved "https://registry.yarnpkg.com/is-typedarray/-/is-typedarray-1.0.0.tgz#e479c80858df0c1b11ddda6940f96011fcda4a9a"

+is-weakmap@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/is-weakmap/-/is-weakmap-2.0.1.tgz#5008b59bdc43b698201d18f62b37b2ca243e8cf2"
+  integrity sha512-NSBR4kH5oVj1Uwvv970ruUkCV7O1mzgVFO4/rev2cLRda9Tm9HrL70ZPut4rOHgY0FNrUu9BCbXA2sdQ+x0chA==
+
+is-weakset@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/is-weakset/-/is-weakset-2.0.1.tgz#e9a0af88dbd751589f5e50d80f4c98b780884f83"
+  integrity sha512-pi4vhbhVHGLxohUw7PhGsueT4vRGFoXhP7+RGN0jKIv9+8PWYCQTqtADngrxOm2g46hoH0+g8uZZBzMrvVGDmw==
+
 is-windows@^1.0.2:
  version "1.0.2"
  resolved "https://registry.yarnpkg.com/is-windows/-/is-windows-1.0.2.tgz#d1850eb9791ecd18e6182ce12a30f396634bb19d"
@ -3444,6 +3605,11 @@ isarray@1.0.0, isarray@~1.0.0:
  version "1.0.0"
  resolved "https://registry.yarnpkg.com/isarray/-/isarray-1.0.0.tgz#bb935d48582cba168c06834957a54a3e07124f11"

+isarray@^2.0.5:
+  version "2.0.5"
+  resolved "https://registry.yarnpkg.com/isarray/-/isarray-2.0.5.tgz#8af1e4c1221244cc62459faf38940d4e644a5723"
+  integrity sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==
+
 isbuffer@~0.0.0:
  version "0.0.0"
  resolved "https://registry.yarnpkg.com/isbuffer/-/isbuffer-0.0.0.tgz#38c146d9df528b8bf9b0701c3d43cf12df3fc39b"
@ -4563,6 +4729,19 @@ object-inspect@^1.7.0:
  version "1.7.0"
  resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.7.0.tgz#f4f6bd181ad77f006b5ece60bd0b6f398ff74a67"

+object-inspect@^1.8.0:
+  version "1.8.0"
+  resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.8.0.tgz#df807e5ecf53a609cc6bfe93eac3cc7be5b3a9d0"
+  integrity sha512-jLdtEOB112fORuypAyl/50VRVIBIdVQOSUUGQHzJ4xBSbit81zRarz7GThkEFZy1RceYrWYcPcBFPQwHyAc1gA==
+
+object-is@^1.1.2:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/object-is/-/object-is-1.1.2.tgz#c5d2e87ff9e119f78b7a088441519e2eec1573b6"
+  integrity sha512-5lHCz+0uufF6wZ7CRFWJN3hp8Jqblpgve06U5CMQ3f//6iDjPr2PEo9MWCjEssDsa+UZEL4PkFpr+BMop6aKzQ==
+  dependencies:
+    define-properties "^1.1.3"
+    es-abstract "^1.17.5"
+
 object-keys@^1.0.11, object-keys@^1.0.12, object-keys@^1.1.1:
  version "1.1.1"
  resolved "https://registry.yarnpkg.com/object-keys/-/object-keys-1.1.1.tgz#1c47f272df277f3b1daf061677d9c82e2322c60e"
@ -5073,6 +5252,19 @@ regex-not@^1.0.0, regex-not@^1.0.2:
    extend-shallow "^3.0.2"
    safe-regex "^1.1.0"

+regexp.prototype.flags@^1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/regexp.prototype.flags/-/regexp.prototype.flags-1.3.0.tgz#7aba89b3c13a64509dabcf3ca8d9fbb9bdf5cb75"
+  integrity sha512-2+Q0C5g951OlYlJz6yu5/M33IcsESLlLfsyIaLJaG4FA2r4yP8MvVMJUUP/fVBkSpbbbZlS5gynbEWLipiiXiQ==
+  dependencies:
+    define-properties "^1.1.3"
+    es-abstract "^1.17.0-next.1"
+
+regexparam@^1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/regexparam/-/regexparam-1.3.0.tgz#2fe42c93e32a40eff6235d635e0ffa344b92965f"
+  integrity sha512-6IQpFBv6e5vz1QAqI+V4k8P2e/3gRrqfCJ9FI+O1FLQTO+Uz6RXZEZOPmTJ6hlGj7gkERzY5BRCv09whKP96/g==
+
 regexpu-core@^4.7.0:
  version "4.7.0"
  resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-4.7.0.tgz#fcbf458c50431b0bb7b45d6967b8192d91f3d938"
@ -5480,6 +5672,14 @@ shortid@^2.2.15:
  dependencies:
    nanoid "^2.1.0"

+side-channel@^1.0.2:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/side-channel/-/side-channel-1.0.3.tgz#cdc46b057550bbab63706210838df5d4c19519c3"
+  integrity sha512-A6+ByhlLkksFoUepsGxfj5x1gTSrs+OydsRptUxeNCabQpCFUvcwIczgOigI8vhY/OJCnPnyE9rGiwgvr9cS1g==
+  dependencies:
+    es-abstract "^1.18.0-next.0"
+    object-inspect "^1.8.0"
+
 signal-exit@^3.0.0, signal-exit@^3.0.2:
  version "3.0.3"
  resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.3.tgz#a1410c2edd8f077b08b4e253c8eacfcaf057461c"
@ -5706,7 +5906,7 @@ string-width@^4.2.0:
    is-fullwidth-code-point "^3.0.0"
    strip-ansi "^6.0.0"

-string.prototype.trimend@^1.0.0:
+string.prototype.trimend@^1.0.0, string.prototype.trimend@^1.0.1:
  version "1.0.1"
  resolved "https://registry.yarnpkg.com/string.prototype.trimend/-/string.prototype.trimend-1.0.1.tgz#85812a6b847ac002270f5808146064c995fb6913"
  dependencies:
@ -5729,7 +5929,7 @@ string.prototype.trimright@^2.1.1:
    es-abstract "^1.17.5"
    string.prototype.trimend "^1.0.0"

-string.prototype.trimstart@^1.0.0:
+string.prototype.trimstart@^1.0.0, string.prototype.trimstart@^1.0.1:
  version "1.0.1"
  resolved "https://registry.yarnpkg.com/string.prototype.trimstart/-/string.prototype.trimstart-1.0.1.tgz#14af6d9f34b053f7cfc89b72f8f2ee14b9039a54"
  dependencies:
@ -6184,10 +6384,43 @@ whatwg-url@^8.0.0:
    tr46 "^2.0.2"
    webidl-conversions "^5.0.0"

+which-boxed-primitive@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/which-boxed-primitive/-/which-boxed-primitive-1.0.1.tgz#cbe8f838ebe91ba2471bb69e9edbda67ab5a5ec1"
+  integrity sha512-7BT4TwISdDGBgaemWU0N0OU7FeAEJ9Oo2P1PHRm/FCWoEi2VLWC9b6xvxAA3C/NMpxg3HXVgi0sMmGbNUbNepQ==
+  dependencies:
+    is-bigint "^1.0.0"
+    is-boolean-object "^1.0.0"
+    is-number-object "^1.0.3"
+    is-string "^1.0.4"
+    is-symbol "^1.0.2"
+
+which-collection@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/which-collection/-/which-collection-1.0.1.tgz#70eab71ebbbd2aefaf32f917082fc62cdcb70906"
+  integrity sha512-W8xeTUwaln8i3K/cY1nGXzdnVZlidBcagyNFtBdD5kxnb4TvGKR7FfSIS3mYpwWS1QUCutfKz8IY8RjftB0+1A==
+  dependencies:
+    is-map "^2.0.1"
+    is-set "^2.0.1"
+    is-weakmap "^2.0.1"
+    is-weakset "^2.0.1"
+
 which-module@^2.0.0:
  version "2.0.0"
  resolved "https://registry.yarnpkg.com/which-module/-/which-module-2.0.0.tgz#d9ef07dce77b9902b8a3a8fa4b31c3e3f7e6e87a"

+which-typed-array@^1.1.2:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/which-typed-array/-/which-typed-array-1.1.2.tgz#e5f98e56bda93e3dac196b01d47c1156679c00b2"
+  integrity sha512-KT6okrd1tE6JdZAy3o2VhMoYPh3+J6EMZLyrxBQsZflI1QCZIxMrIYLkosd8Twf+YfknVIHmYQPgJt238p8dnQ==
+  dependencies:
+    available-typed-arrays "^1.0.2"
+    es-abstract "^1.17.5"
+    foreach "^2.0.5"
+    function-bind "^1.1.1"
+    has-symbols "^1.0.1"
+    is-typed-array "^1.1.3"
+
 which@^1.2.9, which@^1.3.0:
  version "1.3.1"
  resolved "https://registry.yarnpkg.com/which/-/which-1.3.1.tgz#a45043d54f5805316da8d62f9f50918d3da70b0a"