feat: enhance quick add ux

resources/css/tabler-extension.css

@@ -20,25 +20,33 @@
 }
 
 .tie-block::before {
-  content: '\ea01';
+  content: "\ea01";
+}
+
+.tie-block-search::before {
+  content: "\ea02";
 }
 
 .tie-page::before {
-  content: '\ea02';
+  content: "\ea03";
+}
+
+.tie-page-search::before {
+  content: "\ea04";
 }
 
 .tie-references-hide::before {
-  content: '\ea03';
+  content: "\ea05";
 }
 
 .tie-references-show::before {
-  content: '\ea04';
+  content: "\ea06";
 }
 
 .tie-whiteboard::before {
-  content: '\ea05';
+  content: "\ea07";
 }
 
 .tie-whiteboard-element::before {
-  content: '\ea06';
+  content: "\ea08";
 }

src/main/frontend/ui.cljs

@@ -868,12 +868,14 @@
              :on-tweet-load-success #(reset! *loading? false)})]]))
 
 ;; Extended tabler icons managed by Webfont app
-(defonce tie-names 
-  #{"block" 
-    "page" 
-    "references-hide" 
-    "references-show" 
-    "whiteboard" 
+(defonce tie-names
+  #{"block"
+    "block-search"
+    "page"
+    "page-search"
+    "references-hide"
+    "references-show"
+    "whiteboard"
     "whiteboard-element"})
 
 (defn icon

tldraw/apps/tldraw-logseq/package.json

@@ -11,7 +11,6 @@
     "dev:vite": "tsup --watch --sourcemap inline"
   },
   "devDependencies": {
-    "@radix-ui/react-icons": "^1.1.1",
     "@tldraw/core": "2.0.0-alpha.1",
     "@tldraw/react": "2.0.0-alpha.1",
     "@tldraw/vec": "2.0.0-alpha.1",
@@ -32,8 +31,8 @@
     "tsup": "^6.1.2",
     "typescript": "^4.7.3",
     "zx": "^6.2.4",
-    "@radix-ui/react-switch": "^0.1.6-rc.40",
-    "@radix-ui/react-dropdown-menu": "^0.1.6"
+    "@radix-ui/react-switch": "^1.0.0",
+    "@radix-ui/react-dropdown-menu": "^1.0.0"
   },
   "peerDependencies": {
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0",

tldraw/apps/tldraw-logseq/src/components/ActionBar/ActionBar.tsx

@@ -1,11 +1,11 @@
 /* eslint-disable @typescript-eslint/no-non-null-assertion */
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import * as React from 'react'
-import { observer } from 'mobx-react-lite'
-import type { Shape } from '~lib'
 import { useApp } from '@tldraw/react'
-import { RedoIcon, UndoIcon } from '~components/icons'
+import { observer } from 'mobx-react-lite'
+import * as React from 'react'
+import { TablerIcon } from '~components/icons'
 import { ZoomMenu } from '~components/ZoomMenu'
+import type { Shape } from '~lib'
 
 export const ActionBar = observer(function ActionBar(): JSX.Element {
   const app = useApp<Shape>()
@@ -20,12 +20,12 @@ export const ActionBar = observer(function ActionBar(): JSX.Element {
   return (
     <div className="tl-action-bar">
       <button onClick={undo}>
-        <UndoIcon></UndoIcon>
+        <TablerIcon name="arrow-back-up" />
       </button>
-      <ZoomMenu></ZoomMenu>
       <button onClick={redo}>
-        <RedoIcon></RedoIcon>
+        <TablerIcon name="arrow-forward-up" />
       </button>
+      <ZoomMenu />
     </div>
   )
 })

tldraw/apps/tldraw-logseq/src/components/Minimap/Minimap.tsx

@@ -3,7 +3,7 @@ import { useApp, useMinimapEvents } from '@tldraw/react'
 import { reaction } from 'mobx'
 import { observer } from 'mobx-react-lite'
 import React from 'react'
-import { Crosshair2Icon } from '@radix-ui/react-icons'
+import { TablerIcon } from '~components/icons'
 import { PreviewManager } from '~lib'
 
 export const Minimap = observer(function Minimap() {
@@ -48,7 +48,7 @@ export const Minimap = observer(function Minimap() {
         data-active={active}
         onClick={() => setActive(a => !a)}
       >
-        <Crosshair2Icon />
+        <TablerIcon name="crosshair2" />
       </button>
     </>
   )

tldraw/apps/tldraw-logseq/src/components/PrimaryTools/PrimaryTools.tsx

@@ -1,9 +1,8 @@
-import { CursorArrowIcon, Pencil1Icon, ShadowIcon, TextIcon } from '@radix-ui/react-icons'
 import { useApp } from '@tldraw/react'
 import { observer } from 'mobx-react-lite'
 import * as React from 'react'
 import { Button } from '~components/Button'
-import { ArrowIcon, EraserIcon, LogseqIcon, TablerIcon } from '~components/icons'
+import { LogseqIcon, TablerIcon } from '~components/icons'
 
 export const PrimaryTools = observer(function PrimaryTools() {
   const app = useApp()

tldraw/apps/tldraw-logseq/src/components/ZoomMenu/ZoomMenu.tsx

@@ -9,55 +9,53 @@ export const ZoomMenu = observer(function ZoomMenu(): JSX.Element {
     e.preventDefault()
   }
   return (
-    <div>
-      <DropdownMenuPrimitive.Root>
-        <DropdownMenuPrimitive.Trigger>
-          {(app.viewport.camera.zoom * 100).toFixed(0) + '%'}
-        </DropdownMenuPrimitive.Trigger>
-        <DropdownMenuPrimitive.Content
-          className="tl-zoom-menu-dropdown-menu-button"
-          id="zoomPopup"
-          sideOffset={12}
+    <DropdownMenuPrimitive.Root>
+      <DropdownMenuPrimitive.Trigger>
+        {(app.viewport.camera.zoom * 100).toFixed(0) + '%'}
+      </DropdownMenuPrimitive.Trigger>
+      <DropdownMenuPrimitive.Content
+        className="tl-zoom-menu-dropdown-menu-button"
+        id="zoomPopup"
+        sideOffset={12}
+      >
+        <DropdownMenuPrimitive.Arrow style={{ fill: 'white' }}></DropdownMenuPrimitive.Arrow>
+        <DropdownMenuPrimitive.Item
+          className="tl-zoom-menu-dropdown-item"
+          onSelect={preventEvent}
+          onClick={app.api.zoomToFit}
         >
-          <DropdownMenuPrimitive.Arrow style={{ fill: 'white' }}></DropdownMenuPrimitive.Arrow>
-          <DropdownMenuPrimitive.Item
-            className="tl-zoom-menu-dropdown-item"
-            onSelect={preventEvent}
-            onClick={app.api.zoomToFit}
-          >
-            Zoom to Fit <div className="tl-zoom-menu-right-slot"></div>
-          </DropdownMenuPrimitive.Item>
-          <DropdownMenuPrimitive.Item
-            className="tl-zoom-menu-dropdown-item"
-            onSelect={preventEvent}
-            onClick={app.api.zoomToSelection}
-          >
-            Zoom to Selection <div className="tl-zoom-menu-right-slot">⌘+Minus</div>
-          </DropdownMenuPrimitive.Item>
-          <DropdownMenuPrimitive.Item
-            className="tl-zoom-menu-dropdown-item"
-            onSelect={preventEvent}
-            onClick={app.api.zoomIn}
-          >
-            Zoom In <div className="tl-zoom-menu-right-slot">⌘+Plus</div>
-          </DropdownMenuPrimitive.Item>
-          <DropdownMenuPrimitive.Item
-            className="tl-zoom-menu-dropdown-item"
-            onSelect={preventEvent}
-            onClick={app.api.zoomOut}
-          >
-            Zoom Out <div className="tl-zoom-menu-right-slot">⌘+Minus</div>
-          </DropdownMenuPrimitive.Item>
-          <DropdownMenuPrimitive.Item
-            className="tl-zoom-menu-dropdown-item"
-            onSelect={preventEvent}
-            onClick={app.api.resetZoom}
-          >
-            Reset Zoom <div className="tl-zoom-menu-right-slot">⇧+0</div>
-          </DropdownMenuPrimitive.Item>
-        </DropdownMenuPrimitive.Content>
-      </DropdownMenuPrimitive.Root>
-    </div>
+          Zoom to Fit <div className="tl-zoom-menu-right-slot"></div>
+        </DropdownMenuPrimitive.Item>
+        <DropdownMenuPrimitive.Item
+          className="tl-zoom-menu-dropdown-item"
+          onSelect={preventEvent}
+          onClick={app.api.zoomToSelection}
+        >
+          Zoom to Selection <div className="tl-zoom-menu-right-slot">⌘+Minus</div>
+        </DropdownMenuPrimitive.Item>
+        <DropdownMenuPrimitive.Item
+          className="tl-zoom-menu-dropdown-item"
+          onSelect={preventEvent}
+          onClick={app.api.zoomIn}
+        >
+          Zoom In <div className="tl-zoom-menu-right-slot">⌘+Plus</div>
+        </DropdownMenuPrimitive.Item>
+        <DropdownMenuPrimitive.Item
+          className="tl-zoom-menu-dropdown-item"
+          onSelect={preventEvent}
+          onClick={app.api.zoomOut}
+        >
+          Zoom Out <div className="tl-zoom-menu-right-slot">⌘+Minus</div>
+        </DropdownMenuPrimitive.Item>
+        <DropdownMenuPrimitive.Item
+          className="tl-zoom-menu-dropdown-item"
+          onSelect={preventEvent}
+          onClick={app.api.resetZoom}
+        >
+          Reset Zoom <div className="tl-zoom-menu-right-slot">⇧+0</div>
+        </DropdownMenuPrimitive.Item>
+      </DropdownMenuPrimitive.Content>
+    </DropdownMenuPrimitive.Root>
   )
 })
 

tldraw/apps/tldraw-logseq/src/components/icons/TablerIcon.tsx

@@ -2,7 +2,9 @@ import React from 'react'
 
 const extendedIcons = [
   'block',
+  'block-search',
   'page',
+  'page-search',
   'references-hide',
   'references-show',
   'whiteboard',

tldraw/apps/tldraw-logseq/src/components/inputs/TextInput.tsx

@@ -7,9 +7,9 @@ interface TextInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
 export const TextInput = React.forwardRef<HTMLInputElement, TextInputProps>(
   ({ label, ...rest }, ref) => {
     return (
-      <div className="input">
+      <div className="tl-input">
         <label htmlFor={`text-${label}`}>{label}</label>
-        <input ref={ref} className="text-input" name={`text-${label}`} type="text" {...rest} />
+        <input ref={ref} className="tl-text-input" name={`text-${label}`} type="text" {...rest} />
       </div>
     )
   }

tldraw/apps/tldraw-logseq/src/lib/shapes/LogseqPortalShape.tsx

@@ -1,5 +1,4 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import { MagnifyingGlassIcon } from '@radix-ui/react-icons'
 import { TLBoxShape, TLBoxShapeProps, TLResizeInfo, validUUID } from '@tldraw/core'
 import { HTMLContainer, TLComponentProps, useApp } from '@tldraw/react'
 import Vec from '@tldraw/vec'
@@ -28,10 +27,16 @@ interface LogseqQuickSearchProps {
   onChange: (id: string) => void
 }
 
-const LogseqTypeTag = ({ type, active }: { type: 'B' | 'P'; active?: boolean }) => {
+const LogseqTypeTag = ({ type, active }: { type: 'B' | 'P' | 'BS' | 'PS'; active?: boolean }) => {
+  const nameMapping = {
+    B: 'block',
+    P: 'page',
+    BS: 'block-search',
+    PS: 'page-search',
+  }
   return (
     <span className="tl-type-tag" data-active={active}>
-      <i className={`tie tie-${type === 'B' ? 'block' : 'page'}`} />
+      <i className={`tie tie-${nameMapping[type]}`} />
     </span>
   )
 }
@@ -297,12 +302,15 @@ export class LogseqPortalShape extends TLBoxShape<LogseqPortalShapeProps> {
     const searchResult = useSearch(q)
     const Breadcrumb = renderers?.Breadcrumb
 
+    const [prefixIcon, setPrefixIcon] = React.useState<string>('circle-plus')
+    const [searchFilter, setSearchFilter] = React.useState<'B' | 'P' | null>(null)
+
     React.useEffect(() => {
       // autofocus seems not to be working
       setTimeout(() => {
         rInput.current?.focus()
       })
-    }, [])
+    }, [searchFilter])
 
     if (!Breadcrumb) {
       return null
@@ -310,64 +318,130 @@ export class LogseqPortalShape extends TLBoxShape<LogseqPortalShapeProps> {
 
     return (
       <div className="tl-quick-search">
+        <div className="tl-quick-search-indicator">
+          <TablerIcon name={prefixIcon} className="tl-quick-search-icon" />
+        </div>
         <div className="tl-quick-search-input-container">
-          <TablerIcon name="search" className="tl-quick-search-icon" />
+          {searchFilter && (
+            <div className="tl-quick-search-input-filter">
+              <LogseqTypeTag type={searchFilter} />
+              {searchFilter === 'B' ? 'Search blocks' : 'Search pages'}
+              <div
+                className="tl-quick-search-input-filter-remove"
+                onClick={() => setSearchFilter(null)}
+              >
+                <TablerIcon name="x" />
+              </div>
+            </div>
+          )}
           <div className="tl-quick-search-input-sizer" data-value={q}>
+            <div className="tl-quick-search-input-hidden">{q}</div>
             <input
               ref={rInput}
               type="text"
               value={q}
-              placeholder="Search or create page"
+              placeholder="Create or search your graph..."
               onChange={q => setQ(q.target.value)}
               onKeyDown={e => {
                 if (e.key === 'Enter') {
                   finishCreating(q)
                 }
               }}
-              className="tl-quick-search-input text-input"
+              className="tl-quick-search-input"
             />
           </div>
         </div>
         <div className="tl-quick-search-options">
-          <div className="tl-quick-search-option" onClick={() => onAddBlock(q)}>
+          <div
+            className="tl-quick-search-option"
+            onMouseEnter={() => setPrefixIcon('circle-plus')}
+            onClick={() => onAddBlock(q)}
+          >
             <div className="tl-quick-search-option-row">
               <LogseqTypeTag active type="B" />
-              New block{q.length > 0 ? `: ${q}` : ''}
+              {q.length > 0 ? (
+                <>
+                  <strong>New whiteboard block:</strong>
+                  {q}
+                </>
+              ) : (
+                <strong>New whiteboard block</strong>
+              )}
             </div>
           </div>
           {searchResult?.pages?.length === 0 && q && (
-            <div className="tl-quick-search-option" onClick={() => finishCreating(q)}>
+            <div
+              className="tl-quick-search-option"
+              onMouseEnter={() => setPrefixIcon('circle-plus')}
+              onClick={() => finishCreating(q)}
+            >
               <div className="tl-quick-search-option-row">
                 <LogseqTypeTag active type="P" />
-                New page: {q}
+                <strong>New page:</strong>
+                {q}
               </div>
             </div>
           )}
-          {searchResult?.pages?.map(name => (
-            <div key={name} className="tl-quick-search-option" onClick={() => finishCreating(name)}>
-              <div className="tl-quick-search-option-row">
-                <LogseqTypeTag type="P" />
-                {highlightedJSX(name, q)}
+          {q.length === 0 && searchFilter === null && (
+            <>
+              <div
+                className="tl-quick-search-option"
+                onMouseEnter={() => setPrefixIcon('search')}
+                onClick={() => setSearchFilter('B')}
+              >
+                <div className="tl-quick-search-option-row">
+                  <LogseqTypeTag type="BS" />
+                  Search only blocks
+                </div>
               </div>
-            </div>
-          ))}
-          {searchResult?.blocks
-            ?.filter(block => block.content && block.uuid)
-            .map(({ content, uuid }) => (
               <div
-                key={uuid}
                 className="tl-quick-search-option"
-                onClick={() => finishCreating(uuid)}
+                onMouseEnter={() => setPrefixIcon('search')}
+                onClick={() => setSearchFilter('P')}
               >
                 <div className="tl-quick-search-option-row">
-                  <LogseqTypeTag type="B" />
-                  <Breadcrumb blockId={uuid} />
+                  <LogseqTypeTag type="PS" />
+                  Search only pages
                 </div>
+              </div>
+            </>
+          )}
+          {(!searchFilter || searchFilter === 'P') &&
+            searchResult?.pages?.map(name => (
+              <div
+                key={name}
+                className="tl-quick-search-option"
+                onMouseEnter={() => setPrefixIcon('circle-plus')}
+                onClick={() => finishCreating(name)}
+              >
                 <div className="tl-quick-search-option-row">
-                  {highlightedJSX(content, q)}
+                  <LogseqTypeTag type="P" />
+                  {highlightedJSX(name, q)}
                 </div>
               </div>
             ))}
+          {(!searchFilter || searchFilter === 'B') &&
+            searchResult?.blocks
+              ?.filter(block => block.content && block.uuid)
+              .map(({ content, uuid }) => (
+                <div
+                  key={uuid}
+                  className="tl-quick-search-option"
+                  onMouseEnter={() => setPrefixIcon('search')}
+                  onClick={() => finishCreating(uuid)}
+                >
+                  <div className="tl-quick-search-option-row">
+                    <LogseqTypeTag type="B" />
+                    <div className="tl-quick-search-option-breadcrumb">
+                      <Breadcrumb blockId={uuid} />
+                    </div>
+                  </div>
+                  <div className="tl-quick-search-option-row">
+                    <div className="tl-quick-search-option-placeholder" />
+                    {highlightedJSX(content, q)}
+                  </div>
+                </div>
+              ))}
         </div>
       </div>
     )

tldraw/apps/tldraw-logseq/src/styles.css

@@ -8,7 +8,7 @@
   --color-text-inverted: var(--ls-tertiary-background-color);
   --color-hover: var(--ls-secondary-background-color);
   --color-selectedStroke: rgb(42, 123, 253);
-  --color-selectedFill: rgba(66, 133, 244);
+  --color-selectedFill: #4285f4;
   --color-selectedContrast: #fff;
   --shadow-small: 0 1px 2px 0 rgb(0 0 0 / 0.05);
   --shadow-medium: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
@@ -28,16 +28,21 @@
   font-size: 10px;
 }
 
-.tl-action-bar button {
+.tl-action-bar > button {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  height: 32px;
+  padding: 0 8px;
   border-radius: 4px;
-  color: var(--ls-secondary-text-color);
-  font-size: 13px;
+  color: var(--ls-primary-text-color);
+  font-size: 14px;
   font-family: var(--ls-font-family);
   background: none;
   border: none;
   cursor: pointer;
-  padding: 4px 8px;
   opacity: 1;
+  white-space: nowrap;
 }
 
 .tl-toolbar {
@@ -59,23 +64,20 @@
 .tl-action-bar {
   position: absolute;
   bottom: 0;
-  border-radius: 0 10px 0 0;
-  float: left;
-  left: 0;
-  grid-row: 1;
+  border-radius: 12px 12px 0 0;
+  left: 53px;
   display: flex;
   align-items: center;
+  gap: 12px;
   padding: 8px;
   color: black;
   border: none;
-  height: fit-content;
   z-index: 100000;
   user-select: none;
   background: var(--color-panel);
-  font-size: inherit;
 }
 
-.tl-action-bar button:hover {
+.tl-action-bar > button:hover {
   background-color: var(--color-hover);
 }
 
@@ -207,24 +209,23 @@
   transform: translateX(17px);
 }
 
-.tl-contextbar .text-input {
+.tl-contextbar .tl-text-input {
   height: 24px;
   padding: 0;
   background: none;
   border-radius: 2px;
 }
 
-.tl-contextbar .text-input:focus {
+.tl-contextbar .tl-text-input:focus {
   outline: none;
 }
 
 .tl-primary-tools {
   display: flex;
   position: absolute;
-  right: 24px;
+  right: 30px;
   top: 0;
   height: 100%;
-  width: 64px;
   align-items: center;
   justify-content: center;
   pointer-events: none;
@@ -250,13 +251,13 @@
 
 .tl-primary-tools .tl-button {
   position: relative;
-  height: 36px;
-  width: 36px;
+  height: 28px;
+  width: 28px;
   border-radius: 4px;
   display: flex;
   align-items: center;
   justify-content: center;
-  font-size: 24px;
+  font-size: 16px;
   font-family: var(--ls-font-family);
   background: none;
   border: none;
@@ -453,7 +454,20 @@
 
 .tl-quick-search-icon {
   flex-shrink: 0;
-  margin-right: 12px;
+}
+
+.tl-quick-search-indicator {
+  background-color: var(--ls-secondary-background-color);
+  font-size: 22px;
+  position: absolute;
+  right: calc(100% + 12px);
+  height: 34px;
+  width: 34px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 50%;
+  top: calc(50% - 17px);
 }
 
 .tl-quick-search-input-container {
@@ -461,41 +475,71 @@
   align-items: center;
   font-size: 16px;
   background-color: var(--ls-secondary-background-color);
-  padding: 4px 12px;
+  padding: 6px 16px;
   border-radius: 8px;
   box-shadow: var(--shadow-small);
 }
 
-.tl-quick-search-input-sizer {
-  display: inline-grid;
-  vertical-align: top;
+.tl-quick-search-input-filter {
+  display: flex;
+  align-items: center;
+  background: rgba(0, 0, 0, 0.1);
+  padding: 2px 8px;
+  white-space: nowrap;
+  gap: 8px;
+  border-radius: 5px;
+  margin-right: 8px;
+  font-size: 14px;
+}
+
+.tl-quick-search-input-filter-remove {
+  width: 16px;
+  height: 16px;
+  display: flex;
   align-items: center;
+  justify-content: center;
+  border-radius: 50%;
+  background-color: var(--ls-block-bullet-border-color);
+}
+
+.tl-quick-search-input-filter-remove:hover {
+  background-color: rgba(0, 0, 0, 0.5) !important;
+}
+
+.tl-quick-search-input-filter-remove > i.ti {
+  transform: translateY(-0.5px);
+}
+
+html[data-theme='light'] .tl-quick-search-input-filter-remove {
+  background-color: #7373734d;
+}
+
+.tl-quick-search-input-sizer {
   position: relative;
-  margin: 5px;
 }
 
 .tl-quick-search-input {
-  grid-area: 1/2;
-  width: auto;
-  line-height: 1;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
   outline: none;
 }
 
-.tl-quick-search-input-sizer::after {
-  content: attr(data-value) ' ';
-  visibility: hidden;
-  white-space: pre-wrap;
-  grid-area: 1/2;
-  width: auto;
+.tl-quick-search-input-hidden {
+  opacity: 0;
+  min-width: 240px;
+  min-height: 24px;
 }
 
 .tl-quick-search-options {
   position: absolute;
-  top: calc(100% + 8px);
+  top: calc(100% + 12px);
   left: 0;
   background-color: var(--ls-primary-background-color);
   max-height: 300px;
-  min-width: 320px;
+  min-width: 460px;
   box-shadow: var(--shadow-large);
   width: 100%;
   overflow-y: auto;
@@ -508,7 +552,7 @@
 .tl-quick-search-option {
   display: flex;
   flex-flow: column;
-  padding: 12px 16px;
+  padding: 8px 16px;
   cursor: pointer;
   font-size: 0.875rem;
   line-height: 1.25rem;
@@ -533,6 +577,10 @@
   flex-shrink: 0;
 }
 
+.tl-quick-search-option-breadcrumb {
+  opacity: 0.5;
+}
+
 .tl-logseq-portal-container {
   width: calc(100% - 2px);
   height: calc(100% - 2px);
@@ -577,8 +625,16 @@
   flex-grow: 0;
 }
 
-.tl-type-tag[data-active='true'] {
-  background: var(--color-selectedFill);
+html[data-theme='light'] .tl-type-tag[data-active='true'] {
+  background: rgba(66, 133, 244, 0.2);
+  border: 1px solid rgba(42, 123, 253, 0.5);
+  color: var(--ls-secondary-text-color);
+}
+
+html[data-theme='dark'] .tl-type-tag[data-active='true'] {
+  background: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), #338fff;
+  border: 1px solid #338fff;
+  color: var(--ls-secondary-text-color);
 }
 
 .tl-logseq-portal-header .page-ref {
@@ -611,3 +667,10 @@ html[data-theme='dark'] .tl-logseq-portal-header {
 .tl-highlighted {
   padding: 0;
 }
+
+.logseq-img-icon {
+  width: 20px;
+  height: 20px;
+  border-radius: 4px;
+  box-shadow: 0 8px 12px 0 #85c8c81a, 0 4px 32px 0 #85c8c880;
+}

tldraw/packages/react/src/hooks/useStylesheet.ts

@@ -73,7 +73,7 @@ const defaultTheme: TLTheme = {
   selectFill: 'rgba(65, 132, 244, 0.05)',
   binding: 'rgba(65, 132, 244, 0.5)',
   background: 'var(--ls-primary-background-color)',
-  foreground: 'var(--ls-secondary-text-color)',
+  foreground: 'var(--ls-primary-text-color)',
   grid: 'var(--ls-quaternary-background-color)',
 }
 

tldraw/yarn.lock

@@ -409,6 +409,26 @@
     minimatch "^3.1.2"
     strip-json-comments "^3.1.1"
 
+"@floating-ui/core@^0.7.3":
+  version "0.7.3"
+  resolved "https://registry.yarnpkg.com/@floating-ui/core/-/core-0.7.3.tgz#d274116678ffae87f6b60e90f88cc4083eefab86"
+  integrity sha512-buc8BXHmG9l82+OQXOFU3Kr2XQx9ys01U/Q9HMIrZ300iLc8HLMgh7dcCqgYzAzf4BkoQvDcXf5Y+CuEZ5JBYg==
+
+"@floating-ui/dom@^0.5.3":
+  version "0.5.4"
+  resolved "https://registry.yarnpkg.com/@floating-ui/dom/-/dom-0.5.4.tgz#4eae73f78bcd4bd553ae2ade30e6f1f9c73fe3f1"
+  integrity sha512-419BMceRLq0RrmTSDxn8hf9R3VCJv2K9PUfugh5JyEFmdjzDo+e8U5EdR8nzKq8Yj1htzLm3b6eQEEam3/rrtg==
+  dependencies:
+    "@floating-ui/core" "^0.7.3"
+
+"@floating-ui/[email protected]":
+  version "0.7.2"
+  resolved "https://registry.yarnpkg.com/@floating-ui/react-dom/-/react-dom-0.7.2.tgz#0bf4ceccb777a140fc535c87eb5d6241c8e89864"
+  integrity sha512-1T0sJcpHgX/u4I1OzIEhlcrvkUN8ln39nz7fMoE/2HDHrPiMFoOGR7++GYyfUmIQHkkrTinaeQsO3XWubjSvGg==
+  dependencies:
+    "@floating-ui/dom" "^0.5.3"
+    use-isomorphic-layout-effect "^1.1.1"
+
 "@gar/promisify@^1.0.1", "@gar/promisify@^1.1.3":
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/@gar/promisify/-/promisify-1.1.3.tgz#555193ab2e3bb3b6adc3d551c9c030d9e860daf6"
@@ -1734,363 +1754,277 @@
   dependencies:
     "@octokit/openapi-types" "^11.2.0"
 
-"@radix-ui/[email protected]":
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/popper/-/popper-0.1.0.tgz#c387a38f31b7799e1ea0d2bb1ca0c91c2931b063"
-  integrity sha512-uzYeElL3w7SeNMuQpXiFlBhTT+JyaNMCwDfjKkrzugEcYrf5n52PHqncNdQPUtR42hJh8V9FsqyEDbDxkeNjJQ==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    csstype "^3.0.4"
-
-"@radix-ui/[email protected]":
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/primitive/-/primitive-0.1.0.tgz#6206b97d379994f0d1929809db035733b337e543"
-  integrity sha512-tqxZKybwN5Fa3VzZry4G6mXAAb9aAqKmPtnVbZpL0vsBwvOHTBwsjHVPXylocYLwEtBY9SCe665bYnNB515uoA==
+"@radix-ui/[email protected]":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/primitive/-/primitive-1.0.0.tgz#e1d8ef30b10ea10e69c76e896f608d9276352253"
+  integrity sha512-3e7rn8FDMin4CgeL7Z/49smCA3rFYY3Ha2rUQ7HRWFadS5iCRw08ZgVT1LaNTCNqgvrUiyczLflrVrF0SRQtNA==
   dependencies:
     "@babel/runtime" "^7.13.10"
 
-"@radix-ui/react-arrow@0.1.4":
-  version "0.1.4"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-arrow/-/react-arrow-0.1.4.tgz#a871448a418cd3507d83840fdd47558cb961672b"
-  integrity sha512-BB6XzAb7Ml7+wwpFdYVtZpK1BlMgqyafSQNGzhIpSZ4uXvXOHPlR5GP8M449JkeQzgQjv9Mp1AsJxFC0KuOtuA==
+"@radix-ui/[email protected]":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-arrow/-/react-arrow-1.0.0.tgz#c461f4c2cab3317e3d42a1ae62910a4cbb0192a1"
+  integrity sha512-1MUuv24HCdepi41+qfv125EwMuxgQ+U+h0A9K3BjCO/J8nVRREKHHpkD9clwfnjEDk9hgGzCnff4aUKCPiRepw==
   dependencies:
     "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-primitive" "0.1.4"
+    "@radix-ui/react-primitive" "1.0.0"
 
-"@radix-ui/react-collection@0.1.4":
-  version "0.1.4"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-collection/-/react-collection-0.1.4.tgz#734061ffd5bb93e88889d49b87391a73a63824c9"
-  integrity sha512-3muGI15IdgaDFjOcO7xX8a35HQRBRF6LH9pS6UCeZeRmbslkVeHyJRQr2rzICBUoX7zgIA0kXyMDbpQnJGyJTA==
+"@radix-ui/react-collection@1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-collection/-/react-collection-1.0.0.tgz#0ec4c72fabd35a03b5787075ac799e3b17ca5710"
+  integrity sha512-8i1pf5dKjnq90Z8udnnXKzdCEV3/FYrfw0n/b6NvB6piXEn3fO1bOh7HBcpG8XrnIXzxlYu2oCcR38QpyLS/mg==
   dependencies:
     "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-compose-refs" "0.1.0"
-    "@radix-ui/react-context" "0.1.1"
-    "@radix-ui/react-primitive" "0.1.4"
-    "@radix-ui/react-slot" "0.1.2"
+    "@radix-ui/react-compose-refs" "1.0.0"
+    "@radix-ui/react-context" "1.0.0"
+    "@radix-ui/react-primitive" "1.0.0"
+    "@radix-ui/react-slot" "1.0.0"
 
-"@radix-ui/react-compose-refs@0.1.0":
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-compose-refs/-/react-compose-refs-0.1.0.tgz#cff6e780a0f73778b976acff2c2a5b6551caab95"
-  integrity sha512-eyclbh+b77k+69Dk72q3694OHrn9B3QsoIRx7ywX341U9RK1ThgQjMFZoPtmZNQTksXHLNEiefR8hGVeFyInGg==
+"@radix-ui/react-compose-refs@1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-compose-refs/-/react-compose-refs-1.0.0.tgz#37595b1f16ec7f228d698590e78eeed18ff218ae"
+  integrity sha512-0KaSv6sx787/hK3eF53iOkiSLwAGlFMx5lotrqD2pTjB18KbybKoEIgkNZTKC60YECDQTKGTRcDBILwZVqVKvA==
   dependencies:
     "@babel/runtime" "^7.13.10"
 
-"@radix-ui/react-co[email protected]0":
-  version "0.1.1-rc.40"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-compose-refs/-/react-compose-refs-0.1.1-rc.40.tgz#3887e806b9bdb71ec5839ce4246e10517101204a"
-  integrity sha512-tN14wn9XxR7r2b1Klh9FQsWch4DojMudesSc7YQexl/54F6fmSXBqJQQyDO3hsNbiWyyco2MK8wxDpmxX5YWmw==
+"@radix-ui/react-co[email protected].0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-context/-/react-context-1.0.0.tgz#f38e30c5859a9fb5e9aa9a9da452ee3ed9e0aee0"
+  integrity sha512-1pVM9RfOQ+n/N5PJK33kRSKsr1glNxomxONs5c49MliinBY6Yw2Q995qfBUUo0/Mbg05B/sGA0gkgPI7kmSHBg==
   dependencies:
     "@babel/runtime" "^7.13.10"
 
-"@radix-ui/react-[email protected]":
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-context/-/react-context-0.1.1.tgz#06996829ea124d9a1bc1dbe3e51f33588fab0875"
-  integrity sha512-PkyVX1JsLBioeu0jB9WvRpDBBLtLZohVDT3BB5CTSJqActma8S8030P57mWZb4baZifMvN7KKWPAA40UmWKkQg==
+"@radix-ui/react-[email protected]":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-direction/-/react-direction-1.0.0.tgz#a2e0b552352459ecf96342c79949dd833c1e6e45"
+  integrity sha512-2HV05lGUgYcA6xgLQ4BKPDmtL+QbIZYH5fCOTAOOcJ5O0QbWS3i9lKaurLzliYUDhORI2Qr3pyjhJh44lKA3rQ==
   dependencies:
     "@babel/runtime" "^7.13.10"
 
-"@radix-ui/react-[email protected]0":
-  version "0.1.2-rc.40"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-context/-/react-context-0.1.2-rc.40.tgz#6c7ade9b3d0177bf555da41a5cf3910c4e5bb154"
-  integrity sha512-Jv6HE3RypVP9S1FlLyswxx42b+MVDhIS+/BUTWAr4941vweQVhVRfNThpBgHKcxC4Sk5dUyBhn3oYJImSQDskw==
+"@radix-ui/react-[email protected].0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-dismissable-layer/-/react-dismissable-layer-1.0.0.tgz#35b7826fa262fd84370faef310e627161dffa76b"
+  integrity sha512-n7kDRfx+LB1zLueRDvZ1Pd0bxdJWDUZNQ/GWoxDn2prnuJKRdxsjulejX/ePkOsLi2tTm6P24mDqlMSgQpsT6g==
   dependencies:
     "@babel/runtime" "^7.13.10"
+    "@radix-ui/primitive" "1.0.0"
+    "@radix-ui/react-compose-refs" "1.0.0"
+    "@radix-ui/react-primitive" "1.0.0"
+    "@radix-ui/react-use-callback-ref" "1.0.0"
+    "@radix-ui/react-use-escape-keydown" "1.0.0"
 
-"@radix-ui/[email protected]":
-  version "0.1.5"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-dismissable-layer/-/react-dismissable-layer-0.1.5.tgz#9379032351e79028d472733a5cc8ba4a0ea43314"
-  integrity sha512-J+fYWijkX4M4QKwf9dtu1oC0U6e6CEl8WhBp3Ad23yz2Hia0XCo6Pk/mp5CAFy4QBtQedTSkhW05AdtSOEoajQ==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/primitive" "0.1.0"
-    "@radix-ui/react-compose-refs" "0.1.0"
-    "@radix-ui/react-primitive" "0.1.4"
-    "@radix-ui/react-use-body-pointer-events" "0.1.1"
-    "@radix-ui/react-use-callback-ref" "0.1.0"
-    "@radix-ui/react-use-escape-keydown" "0.1.0"
-
-"@radix-ui/react-dropdown-menu@^0.1.6":
-  version "0.1.6"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-dropdown-menu/-/react-dropdown-menu-0.1.6.tgz#3203229788cd57e552c9f19dcc7008e2b545919c"
-  integrity sha512-RZhtzjWwJ4ZBN7D8ek4Zn+ilHzYuYta9yIxFnbC0pfqMnSi67IQNONo1tuuNqtFh9SRHacPKc65zo+kBBlxtdg==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/primitive" "0.1.0"
-    "@radix-ui/react-compose-refs" "0.1.0"
-    "@radix-ui/react-context" "0.1.1"
-    "@radix-ui/react-id" "0.1.5"
-    "@radix-ui/react-menu" "0.1.6"
-    "@radix-ui/react-primitive" "0.1.4"
-    "@radix-ui/react-use-controllable-state" "0.1.0"
-
-"@radix-ui/[email protected]":
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-focus-guards/-/react-focus-guards-0.1.0.tgz#ba3b6f902cba7826569f8edc21ff8223dece7def"
-  integrity sha512-kRx/swAjEfBpQ3ns7J3H4uxpXuWCqN7MpALiSDOXiyo2vkWv0L9sxvbpZeTulINuE3CGMzicVMuNc/VWXjFKOg==
+"@radix-ui/react-dropdown-menu@^1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-dropdown-menu/-/react-dropdown-menu-1.0.0.tgz#687959e1bcdd5e8eb0de406484aff28d0974c593"
+  integrity sha512-Ptben3TxPWrZLbInO7zjAK73kmjYuStsxfg6ujgt+EywJyREoibhZYnsSNqC+UiOtl4PdW/MOHhxVDtew5fouQ==
   dependencies:
     "@babel/runtime" "^7.13.10"
-
-"@radix-ui/[email protected]":
-  version "0.1.4"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-focus-scope/-/react-focus-scope-0.1.4.tgz#c830724e212d42ffaaa81aee49533213d09b47df"
-  integrity sha512-fbA4ES3H4Wkxp+OeLhvN6SwL7mXNn/aBtUf7DRYxY9+Akrf7dRxl2ck4lgcpPsSg3zSDsEwLcY+h5cmj5yvlug==
+    "@radix-ui/primitive" "1.0.0"
+    "@radix-ui/react-compose-refs" "1.0.0"
+    "@radix-ui/react-context" "1.0.0"
+    "@radix-ui/react-id" "1.0.0"
+    "@radix-ui/react-menu" "1.0.0"
+    "@radix-ui/react-primitive" "1.0.0"
+    "@radix-ui/react-use-controllable-state" "1.0.0"
+
+"@radix-ui/[email protected]":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-focus-guards/-/react-focus-guards-1.0.0.tgz#339c1c69c41628c1a5e655f15f7020bf11aa01fa"
+  integrity sha512-UagjDk4ijOAnGu4WMUPj9ahi7/zJJqNZ9ZAiGPp7waUWJO0O1aWXi/udPphI0IUjvrhBsZJGSN66dR2dsueLWQ==
   dependencies:
     "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-compose-refs" "0.1.0"
-    "@radix-ui/react-primitive" "0.1.4"
-    "@radix-ui/react-use-callback-ref" "0.1.0"
-
-"@radix-ui/react-icons@^1.1.1":
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-icons/-/react-icons-1.1.1.tgz#38d2aa548035dd3b799c169bd17177b1cec3152b"
-  integrity sha512-xc3wQC59rsFylVbSusQCrrM+6695ppF730Q6yqzhRdqDcRNWIm2R6ngpzBoSOQMcwnq4p805F+Gr7xo4fmtN1A==
 
-"@radix-ui/react-[email protected]":
-  version "0.1.5"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-id/-/react-id-0.1.5.tgz#010d311bedd5a2884c1e9bb6aaaa4e6cc1d1d3b8"
-  integrity sha512-IPc4H/63bes0IZ1GJJozSEkSWcDyhNGtKFWUpJ+XtaLyQ1X3x7Mf6fWwWhDcpqlYEP+5WtAvfqcyEsyjP+ZhBQ==
+"@radix-ui/[email protected]":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-focus-scope/-/react-focus-scope-1.0.0.tgz#95a0c1188276dc8933b1eac5f1cdb6471e01ade5"
+  integrity sha512-C4SWtsULLGf/2L4oGeIHlvWQx7Rf+7cX/vKOAD2dXW0A1b5QXwi3wWeaEgW+wn+SEVrraMUk05vLU9fZZz5HbQ==
   dependencies:
     "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-use-layout-effect" "0.1.0"
+    "@radix-ui/react-compose-refs" "1.0.0"
+    "@radix-ui/react-primitive" "1.0.0"
+    "@radix-ui/react-use-callback-ref" "1.0.0"
 
-"@radix-ui/[email protected]":
-  version "0.1.6-rc.40"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-id/-/react-id-0.1.6-rc.40.tgz#f14acf42d26ef92cd84ead3323e5b97caae6f29a"
-  integrity sha512-ohpMxiZRde3RQ+SYFcqveIZSXPQLhPh+DdhJZf79EVXchN0hxevIPgjNV1QK711FNmKy0NeJePoVB6WYiNSRgQ==
+"@radix-ui/react-id@1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-id/-/react-id-1.0.0.tgz#8d43224910741870a45a8c9d092f25887bb6d11e"
+  integrity sha512-Q6iAB/U7Tq3NTolBBQbHTgclPmGWE3OlktGGqrClPozSw4vkQ1DfQAOtzgRPecKsMdJINE05iaoDUG8tRzCBjw==
   dependencies:
     "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-use-layout-effect" "0.1.1-rc.40"
+    "@radix-ui/react-use-layout-effect" "1.0.0"
 
-"@radix-ui/react-label@0.1.6-rc.40":
-  version "0.1.6-rc.40"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-label/-/react-label-0.1.6-rc.40.tgz#e691007f9f6ec43162c964c0538257bc23c8e61b"
-  integrity sha512-3ADQzhz9mmItDvsrLKqAN+5HVP6DPiExHixO7XO7V1o1+9vliAR2DB0W70NmSrQutQwHQJi2Z6MrKbB75DIsjg==
+"@radix-ui/react-label@1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-label/-/react-label-1.0.0.tgz#c6691b0bec18958512a952c18732279285b61fef"
+  integrity sha512-k+EbxeRaVbSJ4oaR9eUYuC0cDIGRB4TAPhilbFCIMpP9pXFNcyQPQUvRaVOQBrviuArYM80xh0BQR/0y3kjUdQ==
   dependencies:
     "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-compose-refs" "0.1.1-rc.40"
-    "@radix-ui/react-context" "0.1.2-rc.40"
-    "@radix-ui/react-id" "0.1.6-rc.40"
-    "@radix-ui/react-primitive" "0.1.5-rc.40"
+    "@radix-ui/react-compose-refs" "1.0.0"
+    "@radix-ui/react-context" "1.0.0"
+    "@radix-ui/react-id" "1.0.0"
+    "@radix-ui/react-primitive" "1.0.0"
 
-"@radix-ui/react-menu@0.1.6":
-  version "0.1.6"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-menu/-/react-menu-0.1.6.tgz#7f9521a10f6a9cd819b33b33d5ed9538d79b2e75"
-  integrity sha512-ho3+bhpr3oAFkOBJ8VkUb1BcGoiZBB3OmcWPqa6i5RTUKrzNX/d6rauochu2xDlWjiRtpVuiAcsTVOeIC4FbYQ==
+"@radix-ui/react-menu@1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-menu/-/react-menu-1.0.0.tgz#f1e07778c0011aa0c5be260fee88491d3aadf261"
+  integrity sha512-icW4C64T6nHh3Z4Q1fxO1RlSShouFF4UpUmPV8FLaJZfphDljannKErDuALDx4ClRLihAPZ9i+PrLNPoWS2DMA==
   dependencies:
     "@babel/runtime" "^7.13.10"
-    "@radix-ui/primitive" "0.1.0"
-    "@radix-ui/react-collection" "0.1.4"
-    "@radix-ui/react-compose-refs" "0.1.0"
-    "@radix-ui/react-context" "0.1.1"
-    "@radix-ui/react-dismissable-layer" "0.1.5"
-    "@radix-ui/react-focus-guards" "0.1.0"
-    "@radix-ui/react-focus-scope" "0.1.4"
-    "@radix-ui/react-id" "0.1.5"
-    "@radix-ui/react-popper" "0.1.4"
-    "@radix-ui/react-portal" "0.1.4"
-    "@radix-ui/react-presence" "0.1.2"
-    "@radix-ui/react-primitive" "0.1.4"
-    "@radix-ui/react-roving-focus" "0.1.5"
-    "@radix-ui/react-use-callback-ref" "0.1.0"
-    "@radix-ui/react-use-direction" "0.1.0"
+    "@radix-ui/primitive" "1.0.0"
+    "@radix-ui/react-collection" "1.0.0"
+    "@radix-ui/react-compose-refs" "1.0.0"
+    "@radix-ui/react-context" "1.0.0"
+    "@radix-ui/react-direction" "1.0.0"
+    "@radix-ui/react-dismissable-layer" "1.0.0"
+    "@radix-ui/react-focus-guards" "1.0.0"
+    "@radix-ui/react-focus-scope" "1.0.0"
+    "@radix-ui/react-id" "1.0.0"
+    "@radix-ui/react-popper" "1.0.0"
+    "@radix-ui/react-portal" "1.0.0"
+    "@radix-ui/react-presence" "1.0.0"
+    "@radix-ui/react-primitive" "1.0.0"
+    "@radix-ui/react-roving-focus" "1.0.0"
+    "@radix-ui/react-slot" "1.0.0"
+    "@radix-ui/react-use-callback-ref" "1.0.0"
     aria-hidden "^1.1.1"
-    react-remove-scroll "^2.4.0"
+    react-remove-scroll "2.5.4"
 
-"@radix-ui/[email protected]":
-  version "0.1.4"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-popper/-/react-popper-0.1.4.tgz#dfc055dcd7dfae6a2eff7a70d333141d15a5d029"
-  integrity sha512-18gDYof97t8UQa7zwklG1Dr8jIdj3u+rVOQLzPi9f5i1YQak/pVGkaqw8aY+iDUknKKuZniTk/7jbAJUYlKyOw==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/popper" "0.1.0"
-    "@radix-ui/react-arrow" "0.1.4"
-    "@radix-ui/react-compose-refs" "0.1.0"
-    "@radix-ui/react-context" "0.1.1"
-    "@radix-ui/react-primitive" "0.1.4"
-    "@radix-ui/react-use-rect" "0.1.1"
-    "@radix-ui/react-use-size" "0.1.1"
-    "@radix-ui/rect" "0.1.1"
-
-"@radix-ui/[email protected]":
-  version "0.1.4"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-portal/-/react-portal-0.1.4.tgz#17bdce3d7f1a9a0b35cb5e935ab8bc562441a7d2"
-  integrity sha512-MO0wRy2eYRTZ/CyOri9NANCAtAtq89DEtg90gicaTlkCfdqCLEBsLb+/q66BZQTr3xX/Vq01nnVfc/TkCqoqvw==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-primitive" "0.1.4"
-    "@radix-ui/react-use-layout-effect" "0.1.0"
-
-"@radix-ui/[email protected]":
-  version "0.1.2"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-presence/-/react-presence-0.1.2.tgz#9f11cce3df73cf65bc348e8b76d891f0d54c1fe3"
-  integrity sha512-3BRlFZraooIUfRlyN+b/Xs5hq1lanOOo/+3h6Pwu2GMFjkGKKa4Rd51fcqGqnVlbr3jYg+WLuGyAV4KlgqwrQw==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-compose-refs" "0.1.0"
-    "@radix-ui/react-use-layout-effect" "0.1.0"
-
-"@radix-ui/[email protected]":
-  version "0.1.4"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-primitive/-/react-primitive-0.1.4.tgz#6c233cf08b0cb87fecd107e9efecb3f21861edc1"
-  integrity sha512-6gSl2IidySupIMJFjYnDIkIWRyQdbu/AHK7rbICPani+LW4b0XdxBXc46og/iZvuwW8pjCS8I2SadIerv84xYA==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-slot" "0.1.2"
-
-"@radix-ui/[email protected]":
-  version "0.1.5-rc.40"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-primitive/-/react-primitive-0.1.5-rc.40.tgz#aa51bfa2332fa5f1a35f331a0f86d14c0be9f07d"
-  integrity sha512-eUQC5INhR31OSM4eGcsZ/30IW10ESqmNELCCElw5QoPncGdWjvj3KSfC+MIQIYw8LEbOoOWDmM/oMenAgdHh9A==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-slot" "0.1.3-rc.40"
-
-"@radix-ui/[email protected]":
-  version "0.1.5"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-roving-focus/-/react-roving-focus-0.1.5.tgz#cc48d17a36b56f253d54905b0fd60ee134cb97ee"
-  integrity sha512-ClwKPS5JZE+PaHCoW7eu1onvE61pDv4kO8W4t5Ra3qMFQiTJLZMdpBQUhksN//DaVygoLirz4Samdr5Y1x1FSA==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/primitive" "0.1.0"
-    "@radix-ui/react-collection" "0.1.4"
-    "@radix-ui/react-compose-refs" "0.1.0"
-    "@radix-ui/react-context" "0.1.1"
-    "@radix-ui/react-id" "0.1.5"
-    "@radix-ui/react-primitive" "0.1.4"
-    "@radix-ui/react-use-callback-ref" "0.1.0"
-    "@radix-ui/react-use-controllable-state" "0.1.0"
-
-"@radix-ui/[email protected]":
-  version "0.1.2"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-slot/-/react-slot-0.1.2.tgz#e6f7ad9caa8ce81cc8d532c854c56f9b8b6307c8"
-  integrity sha512-ADkqfL+agEzEguU3yS26jfB50hRrwf7U4VTwAOZEmi/g+ITcBWe12yM46ueS/UCIMI9Py+gFUaAdxgxafFvY2Q==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-compose-refs" "0.1.0"
-
-"@radix-ui/[email protected]":
-  version "0.1.3-rc.40"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-slot/-/react-slot-0.1.3-rc.40.tgz#4f3877647132d964ed6b20c3a96e26f0dba6c01d"
-  integrity sha512-cj91yn3VirG81ZDGL9plF7qosAHKsow1Ve8zwokFneYF3poeS7+IbUAHBE2+K8nOEK0c25OD3R2jQ5tvTYLPJQ==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-compose-refs" "0.1.1-rc.40"
-
-"@radix-ui/react-switch@^0.1.6-rc.40":
-  version "0.1.6-rc.40"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-switch/-/react-switch-0.1.6-rc.40.tgz#9975eace45030be84c54349b1f66dd0e80404e68"
-  integrity sha512-NTVH1z7iqqyoQHpH9ez4ErAyPY2OsO6m13G7cpRGFrr7TF8r/1k4kFMTUNp/6Bds2HEa+HBIcDfCFkEb2QIm8g==
+"@radix-ui/[email protected]":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-popper/-/react-popper-1.0.0.tgz#fb4f937864bf39c48f27f55beee61fa9f2bef93c"
+  integrity sha512-k2dDd+1Wl0XWAMs9ZvAxxYsB9sOsEhrFQV4CINd7IUZf0wfdye4OHen9siwxvZImbzhgVeKTJi68OQmPRvVdMg==
   dependencies:
     "@babel/runtime" "^7.13.10"
-    "@radix-ui/primitive" "0.1.0"
-    "@radix-ui/react-compose-refs" "0.1.1-rc.40"
-    "@radix-ui/react-context" "0.1.2-rc.40"
-    "@radix-ui/react-label" "0.1.6-rc.40"
-    "@radix-ui/react-primitive" "0.1.5-rc.40"
-    "@radix-ui/react-use-controllable-state" "0.1.1-rc.40"
-    "@radix-ui/react-use-previous" "0.1.2-rc.40"
-    "@radix-ui/react-use-size" "0.1.2-rc.40"
-
-"@radix-ui/[email protected]":
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-body-pointer-events/-/react-use-body-pointer-events-0.1.1.tgz#63e7fd81ca7ffd30841deb584cd2b7f460df2597"
-  integrity sha512-R8leV2AWmJokTmERM8cMXFHWSiv/fzOLhG/JLmRBhLTAzOj37EQizssq4oW0Z29VcZy2tODMi9Pk/htxwb+xpA==
+    "@floating-ui/react-dom" "0.7.2"
+    "@radix-ui/react-arrow" "1.0.0"
+    "@radix-ui/react-compose-refs" "1.0.0"
+    "@radix-ui/react-context" "1.0.0"
+    "@radix-ui/react-primitive" "1.0.0"
+    "@radix-ui/react-use-layout-effect" "1.0.0"
+    "@radix-ui/react-use-rect" "1.0.0"
+    "@radix-ui/react-use-size" "1.0.0"
+    "@radix-ui/rect" "1.0.0"
+
+"@radix-ui/[email protected]":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-portal/-/react-portal-1.0.0.tgz#7220b66743394fabb50c55cb32381395cc4a276b"
+  integrity sha512-a8qyFO/Xb99d8wQdu4o7qnigNjTPG123uADNecz0eX4usnQEj7o+cG4ZX4zkqq98NYekT7UoEQIjxBNWIFuqTA==
   dependencies:
     "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-use-layout-effect" "0.1.0"
+    "@radix-ui/react-primitive" "1.0.0"
 
-"@radix-ui/react-[email protected].0":
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-0.1.0.tgz#934b6e123330f5b3a6b116460e6662cbc663493f"
-  integrity sha512-Va041McOFFl+aV+sejvl0BS2aeHx86ND9X/rVFmEFQKTXCp6xgUK0NGUAGcgBlIjnJSbMYPGEk1xKSSlVcN2Aw==
+"@radix-ui/[email protected]":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-presence/-/react-presence-1.0.0.tgz#814fe46df11f9a468808a6010e3f3ca7e0b2e84a"
+  integrity sha512-A+6XEvN01NfVWiKu38ybawfHsBjWum42MRPnEuqPsBZ4eV7e/7K321B5VgYMPv3Xx5An6o1/l9ZuDBgmcmWK3w==
   dependencies:
     "@babel/runtime" "^7.13.10"
+    "@radix-ui/react-compose-refs" "1.0.0"
+    "@radix-ui/react-use-layout-effect" "1.0.0"
 
-"@radix-ui/[email protected]":
-  version "0.1.1-rc.40"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-0.1.1-rc.40.tgz#e1d6d950c9dae36218968eb73c60e2b649117ecc"
-  integrity sha512-IzvrTip7gEp56VemxwDzmb7AgOMzgDAy1SDUnwBH0qpP5BKTXUKumgAGY+W8rNcZmUcA7EmE8wW9kbf+NAgSiw==
+"@radix-ui/[email protected]":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-primitive/-/react-primitive-1.0.0.tgz#376cd72b0fcd5e0e04d252ed33eb1b1f025af2b0"
+  integrity sha512-EyXe6mnRlHZ8b6f4ilTDrXmkLShICIuOTTj0GX4w1rp+wSxf3+TD05u1UOITC8VsJ2a9nwHvdXtOXEOl0Cw/zQ==
   dependencies:
     "@babel/runtime" "^7.13.10"
+    "@radix-ui/react-slot" "1.0.0"
 
-"@radix-ui/react-[email protected].0":
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-controllable-state/-/react-use-controllable-state-0.1.0.tgz#4fced164acfc69a4e34fb9d193afdab973a55de1"
-  integrity sha512-zv7CX/PgsRl46a52Tl45TwqwVJdmqnlQEQhaYMz/yBOD2sx2gCkCFSoF/z9mpnYWmS6DTLNTg5lIps3fV6EnXg==
+"@radix-ui/[email protected]":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-roving-focus/-/react-roving-focus-1.0.0.tgz#aadeb65d5dbcdbdd037078156ae1f57c2ff754ee"
+  integrity sha512-lHvO4MhvoWpeNbiJAoyDsEtbKqP2jkkdwsMVJ3kfqbkC71J/aXE6Th6gkZA1xHEqSku+t+UgoDjvE7Z3gsBpcg==
   dependencies:
     "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-use-callback-ref" "0.1.0"
-
-"@radix-ui/[email protected]":
-  version "0.1.1-rc.40"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-controllable-state/-/react-use-controllable-state-0.1.1-rc.40.tgz#2d956f2bae3dd39744779f4521dd11451d0948d7"
-  integrity sha512-03FXpyzi+ql5Bnqi6Ues6fClbrFlzttqqxtm/E2ZK9B9e8qT3ArI5Vg0ZtVBHWWtC+96YJao5zcJXk1cSOBiMg==
+    "@radix-ui/primitive" "1.0.0"
+    "@radix-ui/react-collection" "1.0.0"
+    "@radix-ui/react-compose-refs" "1.0.0"
+    "@radix-ui/react-context" "1.0.0"
+    "@radix-ui/react-direction" "1.0.0"
+    "@radix-ui/react-id" "1.0.0"
+    "@radix-ui/react-primitive" "1.0.0"
+    "@radix-ui/react-use-callback-ref" "1.0.0"
+    "@radix-ui/react-use-controllable-state" "1.0.0"
+
+"@radix-ui/[email protected]":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-slot/-/react-slot-1.0.0.tgz#7fa805b99891dea1e862d8f8fbe07f4d6d0fd698"
+  integrity sha512-3mrKauI/tWXo1Ll+gN5dHcxDPdm/Df1ufcDLCecn+pnCIVcdWE7CujXo8QaXOWRJyZyQWWbpB8eFwHzWXlv5mQ==
   dependencies:
     "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-use-callback-ref" "0.1.1-rc.40"
+    "@radix-ui/react-compose-refs" "1.0.0"
 
-"@radix-ui/[email protected]":
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-direction/-/react-use-direction-0.1.0.tgz#97ac1d52e497c974389e7988f809238ed72e7df7"
-  integrity sha512-NajpY/An9TCPSfOVkgWIdXJV+VuWl67PxB6kOKYmtNAFHvObzIoh8o0n9sAuwSAyFCZVq211FEf9gvVDRhOyiA==
+"@radix-ui/react-switch@^1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-switch/-/react-switch-1.0.0.tgz#f714eb81da7b16dae7f5ab6e774e3194d8f009b6"
+  integrity sha512-SydkCiuirxJfRG8259J0RIpOw1p6y4TgJdNYvDNXgkEjCjFzLCvBbgDNQn9SeYXk3mjO/ezMgMFsacnrp4eihw==
   dependencies:
     "@babel/runtime" "^7.13.10"
-
-"@radix-ui/[email protected]":
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-escape-keydown/-/react-use-escape-keydown-0.1.0.tgz#dc80cb3753e9d1bd992adbad9a149fb6ea941874"
-  integrity sha512-tDLZbTGFmvXaazUXXv8kYbiCcbAE8yKgng9s95d8fCO+Eundv0Jngbn/hKPhDDs4jj9ChwRX5cDDnlaN+ugYYQ==
+    "@radix-ui/primitive" "1.0.0"
+    "@radix-ui/react-compose-refs" "1.0.0"
+    "@radix-ui/react-context" "1.0.0"
+    "@radix-ui/react-label" "1.0.0"
+    "@radix-ui/react-primitive" "1.0.0"
+    "@radix-ui/react-use-controllable-state" "1.0.0"
+    "@radix-ui/react-use-previous" "1.0.0"
+    "@radix-ui/react-use-size" "1.0.0"
+
+"@radix-ui/[email protected]":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.0.0.tgz#9e7b8b6b4946fe3cbe8f748c82a2cce54e7b6a90"
+  integrity sha512-GZtyzoHz95Rhs6S63D2t/eqvdFCm7I+yHMLVQheKM7nBD8mbZIt+ct1jz4536MDnaOGKIxynJ8eHTkVGVVkoTg==
   dependencies:
     "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-use-callback-ref" "0.1.0"
 
-"@radix-ui/[email protected]":
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-0.1.0.tgz#ebf71bd6d2825de8f1fbb984abf2293823f0f223"
-  integrity sha512-+wdeS51Y+E1q1Wmd+1xSSbesZkpVj4jsg0BojCbopWvgq5iBvixw5vgemscdh58ep98BwUbsFYnrywFhV9yrVg==
+"@radix-ui/react-use-[email protected].0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-controllable-state/-/react-use-controllable-state-1.0.0.tgz#a64deaafbbc52d5d407afaa22d493d687c538b7f"
+  integrity sha512-FohDoZvk3mEXh9AWAVyRTYR4Sq7/gavuofglmiXB2g1aKyboUD4YtgWxKj8O5n+Uak52gXQ4wKz5IFST4vtJHg==
   dependencies:
     "@babel/runtime" "^7.13.10"
+    "@radix-ui/react-use-callback-ref" "1.0.0"
 
-"@radix-ui/react-use-[email protected]0":
-  version "0.1.1-rc.40"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-0.1.1-rc.40.tgz#14368315d14fe7ee13b91c9bef81e36ebf06b8f4"
-  integrity sha512-yv/LziHeaiJf9WGRgBcQb9+v3IGChwtEWY8taUN1MMAxVw2M2IqRrW+pZkgClD2qe3Axukl2BXAm2h/+yvCTiQ==
+"@radix-ui/react-use-[email protected].0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-escape-keydown/-/react-use-escape-keydown-1.0.0.tgz#aef375db4736b9de38a5a679f6f49b45a060e5d1"
+  integrity sha512-JwfBCUIfhXRxKExgIqGa4CQsiMemo1Xt0W/B4ei3fpzpvPENKpMKQ8mZSB6Acj3ebrAEgi2xiQvcI1PAAodvyg==
   dependencies:
     "@babel/runtime" "^7.13.10"
+    "@radix-ui/react-use-callback-ref" "1.0.0"
 
-"@radix-ui/react-use-[email protected]0":
-  version "0.1.2-rc.40"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-previous/-/react-use-previous-0.1.2-rc.40.tgz#36647d5b9078485c87ae1212fbcbbfed4edcb971"
-  integrity sha512-gRh3c9Ua20zTa+QXebcFmZQ0Oj5lib41EYuFE7h/qxLA5mkVcp6DKvgMvNOaHkcfa3MfPBGLZ1zdM1rcEl1Jow==
+"@radix-ui/react-use-[email protected].0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-1.0.0.tgz#2fc19e97223a81de64cd3ba1dc42ceffd82374dc"
+  integrity sha512-6Tpkq+R6LOlmQb1R5NNETLG0B4YP0wc+klfXafpUCj6JGyaUc8il7/kUZ7m59rGbXGczE9Bs+iz2qloqsZBduQ==
   dependencies:
     "@babel/runtime" "^7.13.10"
 
-"@radix-ui/react-use-[email protected]":
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-rect/-/react-use-rect-0.1.1.tgz#6c15384beee59c086e75b89a7e66f3d2e583a856"
-  integrity sha512-kHNNXAsP3/PeszEmM/nxBBS9Jbo93sO+xuMTcRfwzXsmxT5gDXQzAiKbZQ0EecCPtJIzqvr7dlaQi/aP1PKYqQ==
+"@radix-ui/react-use-[email protected]":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-previous/-/react-use-previous-1.0.0.tgz#e48a69c3a7d8078a967084038df66d0d181c56ac"
+  integrity sha512-RG2K8z/K7InnOKpq6YLDmT49HGjNmrK+fr82UCVKT2sW0GYfVnYp4wZWBooT/EYfQ5faA9uIjvsuMMhH61rheg==
   dependencies:
     "@babel/runtime" "^7.13.10"
-    "@radix-ui/rect" "0.1.1"
 
-"@radix-ui/react-use-[email protected]":
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-size/-/react-use-size-0.1.1.tgz#f6b75272a5d41c3089ca78c8a2e48e5f204ef90f"
-  integrity sha512-pTgWM5qKBu6C7kfKxrKPoBI2zZYZmp2cSXzpUiGM3qEBQlMLtYhaY2JXdXUCxz+XmD1YEjc8oRwvyfsD4AG4WA==
+"@radix-ui/react-use-[email protected]":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-rect/-/react-use-rect-1.0.0.tgz#b040cc88a4906b78696cd3a32b075ed5b1423b3e"
+  integrity sha512-TB7pID8NRMEHxb/qQJpvSt3hQU4sqNPM1VCTjTRjEOa7cEop/QMuq8S6fb/5Tsz64kqSvB9WnwsDHtjnrM9qew==
   dependencies:
     "@babel/runtime" "^7.13.10"
+    "@radix-ui/rect" "1.0.0"
 
-"@radix-ui/react-use-size@0.1.2-rc.40":
-  version "0.1.2-rc.40"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-size/-/react-use-size-0.1.2-rc.40.tgz#8f8b887d180219e082ae465b7ba4496cdabb5612"
-  integrity sha512-G+0CGeZI+mlGAFHl21SKucj24397a5dvJz2wTjVEz10FhPuoVZGN1etOuFSU/Rvsr5hv6g5UvD1iOkskPG9DeA==
+"@radix-ui/react-use-size@1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-size/-/react-use-size-1.0.0.tgz#a0b455ac826749419f6354dc733e2ca465054771"
+  integrity sha512-imZ3aYcoYCKhhgNpkNDh/aTiU05qw9hX+HHI1QDBTyIlcFjgeFlKKySNGMwTp7nYFLQg/j0VA2FmCY4WPDDHMg==
   dependencies:
     "@babel/runtime" "^7.13.10"
+    "@radix-ui/react-use-layout-effect" "1.0.0"
 
-"@radix-ui/rect@0.1.1":
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/@radix-ui/rect/-/rect-0.1.1.tgz#95b5ba51f469bea6b1b841e2d427e17e37d38419"
-  integrity sha512-g3hnE/UcOg7REdewduRPAK88EPuLZtaq7sA9ouu8S+YEtnyFRI16jgv6GZYe3VMoQLL1T171ebmEPtDjyxWLzw==
+"@radix-ui/rect@1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/rect/-/rect-1.0.0.tgz#0dc8e6a829ea2828d53cbc94b81793ba6383bf3c"
+  integrity sha512-d0O68AYy/9oeEy1DdC07bz1/ZXX+DqCskRd3i4JzLSTXwefzaepQrKjXC7aNM8lTHjFLDO0pDgaEiQ7jEk+HVg==
   dependencies:
     "@babel/runtime" "^7.13.10"
 
@@ -3788,7 +3722,7 @@ cssesc@^3.0.0:
   resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-3.0.0.tgz#37741919903b868565e1c09ea747445cd18983ee"
   integrity sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==
 
-csstype@^3.0.2, csstype@^3.0.4:
+csstype@^3.0.2:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.0.tgz#4ddcac3718d787cf9df0d1b7d15033925c8f29f2"
   integrity sha512-uX1KG+x9h5hIJsaKR9xHUeUraxf8IODOwq9JLNPq6BwB04a/xgpq3rcx47l5BZu5zBPlgD342tdke3Hom/nJRA==
@@ -7768,10 +7702,10 @@ react-remove-scroll-bar@^2.3.3:
     react-style-singleton "^2.2.1"
     tslib "^2.0.0"
 
-react-remove-scroll@^2.4.0:
-  version "2.5.5"
-  resolved "https://registry.yarnpkg.com/react-remove-scroll/-/react-remove-scroll-2.5.5.tgz#1e31a1260df08887a8a0e46d09271b52b3a37e77"
-  integrity sha512-ImKhrzJJsyXJfBZ4bzu8Bwpka14c/fQt0k+cyFp/PBhTfyDnU5hjOtM4AG/0AMyy8oKzOTR0lDgJIM7pYXI0kw==
+react-remove-scroll@2.5.4:
+  version "2.5.4"
+  resolved "https://registry.yarnpkg.com/react-remove-scroll/-/react-remove-scroll-2.5.4.tgz#afe6491acabde26f628f844b67647645488d2ea0"
+  integrity sha512-xGVKJJr0SJGQVirVFAUZ2k1QLyO6m+2fy0l8Qawbp5Jgrv3DeLalrfMNBFSlmz5kriGGzsVBtGVnf4pTKIhhWA==
   dependencies:
     react-remove-scroll-bar "^2.3.3"
     react-style-singleton "^2.2.1"
@@ -9015,6 +8949,11 @@ use-callback-ref@^1.3.0:
   dependencies:
     tslib "^2.0.0"
 
+use-isomorphic-layout-effect@^1.1.1:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/use-isomorphic-layout-effect/-/use-isomorphic-layout-effect-1.1.2.tgz#497cefb13d863d687b08477d9e5a164ad8c1a6fb"
+  integrity sha512-49L8yCO3iGT/ZF9QttjwLF/ZD9Iwto5LnH5LmEdk/6cFmXddqi2ulF0edxTwjj+7mqvpVVGQWvbXZdn32wRSHA==
+
 use-sidecar@^1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/use-sidecar/-/use-sidecar-1.1.2.tgz#2f43126ba2d7d7e117aa5855e5d8f0276dfe73c2"