kopia lustrzana https://github.com/Tldraw/Tldraw
Refactor to Stitches Core (#89)
* Refactor www/styles to Stitches Core * Update package.json * Begin refactor of `tldraw` * More refactoring * A bit more * little bit more * Update yarn.lock * Drops React dependencies to 16.8 Co-authored-by: Steve Ruiz <steveruizok@gmail.com>pull/99/head
Pedro Duarte
GitHub
rodzic
e7c6a9b6de
commit
f8b2fe1c85
|
|
@ -39,8 +39,8 @@
|
|||
"@testing-library/react": "^12.0.0",
|
||||
"@types/jest": "^27.0.1",
|
||||
"@types/node": "^15.0.1",
|
||||
"@types/react": "^17.0.19",
|
||||
"@types/react-dom": "^17.0.9",
|
||||
"@types/react": "^16.9.55",
|
||||
"@types/react-dom": "^16.9.9",
|
||||
"@typescript-eslint/eslint-plugin": "^4.19.0",
|
||||
"@typescript-eslint/parser": "^4.19.0",
|
||||
"babel-jest": "^27.1.0",
|
||||
|
|
@ -49,8 +49,6 @@
|
|||
"init-package-json": "^2.0.4",
|
||||
"jest": "^27.1.0",
|
||||
"lerna": "^3.22.1",
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"resize-observer-polyfill": "^1.5.1",
|
||||
"ts-jest": "^27.0.5",
|
||||
"tslib": "^2.3.0",
|
||||
|
|
|
|||
|
|
@ -37,8 +37,8 @@
|
|||
"@herbcaudill/tscpaths": "^0.0.17",
|
||||
"@types/jest": "^27.0.1",
|
||||
"@types/node": "^16.7.10",
|
||||
"@types/react": "^17.0.16",
|
||||
"@types/react-dom": "^17.0.9",
|
||||
"@types/react": "^16.9.55",
|
||||
"@types/react-dom": "^16.9.9",
|
||||
"@typescript-eslint/eslint-plugin": "^4.30.0",
|
||||
"@typescript-eslint/parser": "^4.30.0",
|
||||
"esbuild": "^0.12.24",
|
||||
|
|
@ -53,8 +53,8 @@
|
|||
"typescript": "^4.4.2"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2"
|
||||
"react": ">=16.8",
|
||||
"react-dom": "^16.8 || ^17.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"@tldraw/intersect": "^0.0.95",
|
||||
|
|
@ -62,4 +62,4 @@
|
|||
"@use-gesture/react": "^10.0.0-beta.24"
|
||||
},
|
||||
"gitHead": "5cb031ddc264846ec6732d7179511cddea8ef034"
|
||||
}
|
||||
}
|
||||
|
|
@ -3,10 +3,11 @@
|
|||
/* --------------------- Primary -------------------- */
|
||||
|
||||
import type React from 'react'
|
||||
import type { ForwardedRef } from 'react'
|
||||
|
||||
export type Patch<T> = Partial<{ [P in keyof T]: T | Partial<T> | Patch<T[P]> }>
|
||||
|
||||
type ForwardedRef<T> = ((instance: T | null) => void) | React.MutableRefObject<T | null> | null
|
||||
|
||||
export interface TLPage<T extends TLShape, B extends TLBinding> {
|
||||
id: string
|
||||
name?: string
|
||||
|
|
@ -296,7 +297,7 @@ export type TLShapeUtil<
|
|||
Component(
|
||||
this: TLShapeUtil<T, E, M>,
|
||||
props: TLRenderInfo<T, E, M>,
|
||||
ref: React.ForwardedRef<E>
|
||||
ref: ForwardedRef<E>
|
||||
): React.ReactElement<TLRenderInfo<T, E, M>, E['tagName']>
|
||||
|
||||
Indicator(
|
||||
|
|
|
|||
|
|
@ -21,15 +21,15 @@
|
|||
"dependencies": {
|
||||
"@tldraw/tldraw": "^0.0.95",
|
||||
"idb": "^6.1.2",
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"react-router": "^5.2.1",
|
||||
"react-router-dom": "^5.3.0"
|
||||
"react-router-dom": "^5.3.0",
|
||||
"react": ">=16.8",
|
||||
"react-dom": "^16.8 || ^17.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^14.14.35",
|
||||
"@types/react": "^17.0.3",
|
||||
"@types/react-dom": "^17.0.2",
|
||||
"@types/react": "^16.9.55",
|
||||
"@types/react-dom": "^16.9.9",
|
||||
"@types/react-router-dom": "^5.1.8",
|
||||
"concurrently": "6.0.1",
|
||||
"create-serve": "1.0.1",
|
||||
|
|
@ -38,4 +38,4 @@
|
|||
"typescript": "4.2.3"
|
||||
},
|
||||
"gitHead": "a7dac0f83ad998e205c2aab58182cb4ba4e099a6"
|
||||
}
|
||||
}
|
||||
|
|
@ -42,8 +42,6 @@
|
|||
"esbuild": "^0.12.24",
|
||||
"eslint": "^7.32.0",
|
||||
"lerna": "^4.0.0",
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"ts-node": "^10.2.1",
|
||||
"tslib": "^2.3.1",
|
||||
"typedoc": "^0.22.3",
|
||||
|
|
@ -53,4 +51,4 @@
|
|||
"@tldraw/vec": "^0.0.95"
|
||||
},
|
||||
"gitHead": "5cb031ddc264846ec6732d7179511cddea8ef034"
|
||||
}
|
||||
}
|
||||
|
|
@ -36,15 +36,13 @@
|
|||
"@babel/preset-env": "^7.15.4",
|
||||
"@types/jest": "^27.0.1",
|
||||
"@types/node": "^16.7.10",
|
||||
"@types/react": "^17.0.16",
|
||||
"@types/react-dom": "^17.0.9",
|
||||
"@types/react": "^16.9.55",
|
||||
"@types/react-dom": "^16.9.9",
|
||||
"@typescript-eslint/eslint-plugin": "^4.30.0",
|
||||
"@typescript-eslint/parser": "^4.30.0",
|
||||
"esbuild": "^0.12.24",
|
||||
"eslint": "^7.32.0",
|
||||
"lerna": "^4.0.0",
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"ts-node": "^10.2.1",
|
||||
"tsconfig-replace-paths": "^0.0.5",
|
||||
"tslib": "^2.3.1",
|
||||
|
|
@ -52,8 +50,8 @@
|
|||
"typescript": "^4.4.2"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2"
|
||||
"react": ">=16.8",
|
||||
"react-dom": "^16.8 || ^17.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"@radix-ui/react-alert-dialog": "^0.0.20",
|
||||
|
|
@ -64,6 +62,7 @@
|
|||
"@radix-ui/react-id": "^0.0.6",
|
||||
"@radix-ui/react-radio-group": "^0.0.18",
|
||||
"@radix-ui/react-tooltip": "^0.0.20",
|
||||
"@stitches/core": "^1.2.0",
|
||||
"@stitches/react": "^1.0.0",
|
||||
"@tldraw/core": "^0.0.95",
|
||||
"@tldraw/intersect": "^0.0.95",
|
||||
|
|
@ -73,4 +72,4 @@
|
|||
"rko": "^0.5.25"
|
||||
},
|
||||
"gitHead": "5cb031ddc264846ec6732d7179511cddea8ef034"
|
||||
}
|
||||
}
|
||||
|
|
@ -1,21 +1,21 @@
|
|||
import * as React from 'react'
|
||||
import styled from '~styles'
|
||||
import css from '~styles'
|
||||
import { Utils } from '@tldraw/core'
|
||||
import * as RadixContextMenu from '@radix-ui/react-context-menu'
|
||||
import { useTLDrawContext } from '~hooks'
|
||||
import { Data, AlignType, DistributeType, StretchType } from '~types'
|
||||
import {
|
||||
Kbd,
|
||||
IconWrapper,
|
||||
kbd,
|
||||
iconWrapper,
|
||||
breakpoints,
|
||||
RowButton,
|
||||
rowButton,
|
||||
ContextMenuArrow,
|
||||
ContextMenuDivider,
|
||||
ContextMenuButton,
|
||||
ContextMenuSubMenu,
|
||||
ContextMenuIconButton,
|
||||
ContextMenuRoot,
|
||||
MenuContent,
|
||||
menuContent,
|
||||
} from '../shared'
|
||||
import {
|
||||
ChevronRightIcon,
|
||||
|
|
@ -128,20 +128,20 @@ export const ContextMenu = React.memo(({ children }: ContextMenuProps): JSX.Elem
|
|||
return (
|
||||
<ContextMenuRoot>
|
||||
<RadixContextMenu.Trigger>{children}</RadixContextMenu.Trigger>
|
||||
<MenuContent as={RadixContextMenu.Content} ref={rContent}>
|
||||
<RadixContextMenu.Content className={menuContent()} ref={rContent}>
|
||||
{hasSelection ? (
|
||||
<>
|
||||
<ContextMenuButton onSelect={handleFlipHorizontal}>
|
||||
<span>Flip Horizontal</span>
|
||||
<Kbd variant="menu">⇧H</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>⇧H</kbd>
|
||||
</ContextMenuButton>
|
||||
<ContextMenuButton onSelect={handleFlipVertical}>
|
||||
<span>Flip Vertical</span>
|
||||
<Kbd variant="menu">⇧V</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>⇧V</kbd>
|
||||
</ContextMenuButton>
|
||||
<ContextMenuButton onSelect={handleDuplicate}>
|
||||
<span>Duplicate</span>
|
||||
<Kbd variant="menu">#D</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>#D</kbd>
|
||||
</ContextMenuButton>
|
||||
<ContextMenuDivider />
|
||||
{hasGroupSelected ||
|
||||
|
|
@ -150,13 +150,13 @@ export const ContextMenu = React.memo(({ children }: ContextMenuProps): JSX.Elem
|
|||
{hasGroupSelected && (
|
||||
<ContextMenuButton onSelect={handleGroup}>
|
||||
<span>Ungroup</span>
|
||||
<Kbd variant="menu">#⇧G</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>#⇧G</kbd>
|
||||
</ContextMenuButton>
|
||||
)}
|
||||
{hasTwoOrMore && (
|
||||
<ContextMenuButton onSelect={handleGroup}>
|
||||
<span>Group</span>
|
||||
<Kbd variant="menu">#G</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>#G</kbd>
|
||||
</ContextMenuButton>
|
||||
)}
|
||||
</>
|
||||
|
|
@ -164,19 +164,19 @@ export const ContextMenu = React.memo(({ children }: ContextMenuProps): JSX.Elem
|
|||
<ContextMenuSubMenu label="Move">
|
||||
<ContextMenuButton onSelect={handleMoveToFront}>
|
||||
<span>To Front</span>
|
||||
<Kbd variant="menu">#⇧]</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>#⇧]</kbd>
|
||||
</ContextMenuButton>
|
||||
<ContextMenuButton onSelect={handleMoveForward}>
|
||||
<span>Forward</span>
|
||||
<Kbd variant="menu">#]</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>#]</kbd>
|
||||
</ContextMenuButton>
|
||||
<ContextMenuButton onSelect={handleMoveBackward}>
|
||||
<span>Backward</span>
|
||||
<Kbd variant="menu">#[</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>#[</kbd>
|
||||
</ContextMenuButton>
|
||||
<ContextMenuButton onSelect={handleMoveToBack}>
|
||||
<span>To Back</span>
|
||||
<Kbd variant="menu">#⇧[</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>#⇧[</kbd>
|
||||
</ContextMenuButton>
|
||||
</ContextMenuSubMenu>
|
||||
<MoveToPageMenu />
|
||||
|
|
@ -186,11 +186,11 @@ export const ContextMenu = React.memo(({ children }: ContextMenuProps): JSX.Elem
|
|||
<ContextMenuDivider />
|
||||
<ContextMenuButton onSelect={handleCopy}>
|
||||
<span>Copy</span>
|
||||
<Kbd variant="menu">#C</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>#C</kbd>
|
||||
</ContextMenuButton>
|
||||
<ContextMenuButton onSelect={handleCopySvg}>
|
||||
<span>Copy to SVG</span>
|
||||
<Kbd variant="menu">⇧#C</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>⇧#C</kbd>
|
||||
</ContextMenuButton>
|
||||
{isDebugMode && (
|
||||
<ContextMenuButton onSelect={handleCopyJson}>
|
||||
|
|
@ -199,31 +199,31 @@ export const ContextMenu = React.memo(({ children }: ContextMenuProps): JSX.Elem
|
|||
)}
|
||||
<ContextMenuButton onSelect={handlePaste}>
|
||||
<span>Paste</span>
|
||||
<Kbd variant="menu">#V</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>#V</kbd>
|
||||
</ContextMenuButton>
|
||||
<ContextMenuDivider />
|
||||
<ContextMenuButton onSelect={handleDelete}>
|
||||
<span>Delete</span>
|
||||
<Kbd variant="menu">⌫</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>⌫</kbd>
|
||||
</ContextMenuButton>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<ContextMenuButton onSelect={handlePaste}>
|
||||
<span>Paste</span>
|
||||
<Kbd variant="menu">#V</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>#V</kbd>
|
||||
</ContextMenuButton>
|
||||
<ContextMenuButton onSelect={handleUndo}>
|
||||
<span>Undo</span>
|
||||
<Kbd variant="menu">#Z</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>#Z</kbd>
|
||||
</ContextMenuButton>
|
||||
<ContextMenuButton onSelect={handleRedo}>
|
||||
<span>Redo</span>
|
||||
<Kbd variant="menu">#⇧Z</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>#⇧Z</kbd>
|
||||
</ContextMenuButton>
|
||||
</>
|
||||
)}
|
||||
</MenuContent>
|
||||
</RadixContextMenu.Content>
|
||||
</ContextMenuRoot>
|
||||
)
|
||||
})
|
||||
|
|
@ -278,17 +278,16 @@ function AlignDistributeSubMenu({
|
|||
|
||||
return (
|
||||
<ContextMenuRoot>
|
||||
<RadixContextMenu.TriggerItem as={RowButton} bp={breakpoints}>
|
||||
<RadixContextMenu.TriggerItem className={rowButton({ bp: breakpoints })}>
|
||||
<span>Align / Distribute</span>
|
||||
<IconWrapper size="small">
|
||||
<div className={iconWrapper({ size: 'small' })}>
|
||||
<ChevronRightIcon />
|
||||
</IconWrapper>
|
||||
</div>
|
||||
</RadixContextMenu.TriggerItem>
|
||||
<StyledGrid
|
||||
as={RadixContextMenu.Content}
|
||||
<RadixContextMenu.Content
|
||||
className={grid({ selectedStyle: hasThreeOrMore ? 'threeOrMore' : 'twoOrMore' })}
|
||||
sideOffset={2}
|
||||
alignOffset={-2}
|
||||
selectedStyle={hasThreeOrMore ? 'threeOrMore' : 'twoOrMore'}
|
||||
>
|
||||
<ContextMenuIconButton onSelect={alignLeft}>
|
||||
<AlignLeftIcon />
|
||||
|
|
@ -326,12 +325,12 @@ function AlignDistributeSubMenu({
|
|||
</ContextMenuIconButton>
|
||||
)}
|
||||
<ContextMenuArrow offset={13} />
|
||||
</StyledGrid>
|
||||
</RadixContextMenu.Content>
|
||||
</ContextMenuRoot>
|
||||
)
|
||||
}
|
||||
|
||||
const StyledGrid = styled(MenuContent, {
|
||||
const grid = css(menuContent, {
|
||||
display: 'grid',
|
||||
variants: {
|
||||
selectedStyle: {
|
||||
|
|
@ -361,13 +360,13 @@ function MoveToPageMenu(): JSX.Element | null {
|
|||
|
||||
return (
|
||||
<ContextMenuRoot>
|
||||
<RadixContextMenu.TriggerItem as={RowButton} bp={breakpoints}>
|
||||
<RadixContextMenu.TriggerItem className={rowButton({ bp: breakpoints })}>
|
||||
<span>Move To Page</span>
|
||||
<IconWrapper size="small">
|
||||
<div className={iconWrapper({ size: 'small' })}>
|
||||
<ChevronRightIcon />
|
||||
</IconWrapper>
|
||||
</div>
|
||||
</RadixContextMenu.TriggerItem>
|
||||
<MenuContent as={RadixContextMenu.Content} sideOffset={2} alignOffset={-2}>
|
||||
<RadixContextMenu.Content className={menuContent()} sideOffset={2} alignOffset={-2}>
|
||||
{sorted.map(({ id, name }, i) => (
|
||||
<ContextMenuButton
|
||||
key={id}
|
||||
|
|
@ -378,7 +377,7 @@ function MoveToPageMenu(): JSX.Element | null {
|
|||
</ContextMenuButton>
|
||||
))}
|
||||
<ContextMenuArrow offset={13} />
|
||||
</MenuContent>
|
||||
</RadixContextMenu.Content>
|
||||
</ContextMenuRoot>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,16 +2,16 @@ import * as React from 'react'
|
|||
import { ExitIcon, HamburgerMenuIcon } from '@radix-ui/react-icons'
|
||||
import * as DropdownMenu from '@radix-ui/react-dropdown-menu'
|
||||
import {
|
||||
FloatingContainer,
|
||||
floatingContainer,
|
||||
DropdownMenuRoot,
|
||||
MenuContent,
|
||||
IconButton,
|
||||
menuContent,
|
||||
iconButton,
|
||||
breakpoints,
|
||||
DropdownMenuButton,
|
||||
DropdownMenuSubMenu,
|
||||
DropdownMenuDivider,
|
||||
IconWrapper,
|
||||
Kbd,
|
||||
iconWrapper,
|
||||
kbd,
|
||||
} from '~components/shared'
|
||||
import { useTLDrawContext } from '~hooks'
|
||||
import { Preferences } from './preferences'
|
||||
|
|
@ -38,43 +38,43 @@ export const Menu = React.memo(() => {
|
|||
}, [tlstate])
|
||||
|
||||
return (
|
||||
<FloatingContainer>
|
||||
<div className={floatingContainer()}>
|
||||
<DropdownMenuRoot>
|
||||
<DropdownMenu.Trigger as={IconButton} bp={breakpoints}>
|
||||
<DropdownMenu.Trigger className={iconButton({ bp: breakpoints })}>
|
||||
<HamburgerMenuIcon />
|
||||
</DropdownMenu.Trigger>
|
||||
<DropdownMenu.Content as={MenuContent} sideOffset={8} align="end">
|
||||
<DropdownMenu.Content className={menuContent()} sideOffset={8} align="end">
|
||||
<DropdownMenuButton onSelect={handleNew}>
|
||||
<span>New Project</span>
|
||||
<Kbd variant="menu">#N</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>#N</kbd>
|
||||
</DropdownMenuButton>
|
||||
<DropdownMenuDivider />
|
||||
<DropdownMenuButton disabled onSelect={handleLoad}>
|
||||
<span>Open...</span>
|
||||
<Kbd variant="menu">#L</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>#L</kbd>
|
||||
</DropdownMenuButton>
|
||||
<RecentFiles />
|
||||
<DropdownMenuDivider />
|
||||
<DropdownMenuButton disabled onSelect={handleSave}>
|
||||
<span>Save</span>
|
||||
<Kbd variant="menu">#S</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>#S</kbd>
|
||||
</DropdownMenuButton>
|
||||
<DropdownMenuButton disabled onSelect={handleSave}>
|
||||
<span>Save As...</span>
|
||||
<Kbd variant="menu">⇧#S</Kbd>
|
||||
<kbd className={kbd({ variant: 'menu' })}>⇧#S</kbd>
|
||||
</DropdownMenuButton>
|
||||
<DropdownMenuDivider />
|
||||
<Preferences />
|
||||
<DropdownMenuDivider />
|
||||
<DropdownMenuButton disabled onSelect={handleSignOut}>
|
||||
<span>Sign Out</span>
|
||||
<IconWrapper size="small">
|
||||
<div className={iconWrapper({ size: 'small' })}>
|
||||
<ExitIcon />
|
||||
</IconWrapper>
|
||||
</div>
|
||||
</DropdownMenuButton>
|
||||
</DropdownMenu.Content>
|
||||
</DropdownMenuRoot>
|
||||
</FloatingContainer>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
|
||||
|
|
|
|||
|
|
@ -3,11 +3,11 @@ import * as Dialog from '@radix-ui/react-alert-dialog'
|
|||
import { MixerVerticalIcon } from '@radix-ui/react-icons'
|
||||
import {
|
||||
breakpoints,
|
||||
IconButton,
|
||||
DialogOverlay,
|
||||
DialogContent,
|
||||
RowButton,
|
||||
Divider,
|
||||
iconButton,
|
||||
dialogOverlay,
|
||||
dialogContent,
|
||||
rowButton,
|
||||
divider,
|
||||
} from '~components/shared'
|
||||
import type { Data, TLDrawPage } from '~types'
|
||||
import { useTLDrawContext } from '~hooks'
|
||||
|
|
@ -76,30 +76,30 @@ export function PageOptionsDialog({ page, onOpen, onClose }: PageOptionsDialogPr
|
|||
|
||||
return (
|
||||
<Dialog.Root open={isOpen} onOpenChange={handleOpenChange}>
|
||||
<Dialog.Trigger as={IconButton} bp={breakpoints} size="small" data-shy="true">
|
||||
<Dialog.Trigger className={iconButton({ bp: breakpoints, size: 'small' })} data-shy="true">
|
||||
<MixerVerticalIcon />
|
||||
</Dialog.Trigger>
|
||||
<Dialog.Overlay as={DialogOverlay} />
|
||||
<Dialog.Content as={DialogContent} onKeyDown={stopPropagation} onKeyUp={stopPropagation}>
|
||||
<Dialog.Action as={RowButton} bp={breakpoints} onClick={handleRename}>
|
||||
<Dialog.Overlay className={dialogOverlay()} />
|
||||
<Dialog.Content
|
||||
className={dialogContent()}
|
||||
onKeyDown={stopPropagation}
|
||||
onKeyUp={stopPropagation}
|
||||
>
|
||||
<Dialog.Action className={rowButton({ bp: breakpoints })} onClick={handleRename}>
|
||||
Rename
|
||||
</Dialog.Action>
|
||||
<Dialog.Action as={RowButton} bp={breakpoints} onClick={handleDuplicate}>
|
||||
<Dialog.Action className={rowButton({ bp: breakpoints })} onClick={handleDuplicate}>
|
||||
Duplicate
|
||||
</Dialog.Action>
|
||||
<Dialog.Action
|
||||
as={RowButton}
|
||||
bp={breakpoints}
|
||||
className={rowButton({ bp: breakpoints, warn: true })}
|
||||
disabled={!canDelete}
|
||||
onClick={handleDelete}
|
||||
warn={true}
|
||||
>
|
||||
Delete
|
||||
</Dialog.Action>
|
||||
<Divider />
|
||||
<Dialog.Cancel as={RowButton} bp={breakpoints}>
|
||||
Cancel
|
||||
</Dialog.Cancel>
|
||||
<div className={divider()} />
|
||||
<Dialog.Cancel className={rowButton({ bp: breakpoints })}>Cancel</Dialog.Cancel>
|
||||
</Dialog.Content>
|
||||
</Dialog.Root>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -5,13 +5,13 @@ import {
|
|||
breakpoints,
|
||||
DropdownMenuButton,
|
||||
DropdownMenuDivider,
|
||||
RowButton,
|
||||
MenuContent,
|
||||
FloatingContainer,
|
||||
IconWrapper,
|
||||
rowButton,
|
||||
menuContent,
|
||||
floatingContainer,
|
||||
iconWrapper,
|
||||
} from '~components/shared'
|
||||
import { PageOptionsDialog } from '~components/page-options-dialog'
|
||||
import styled from '~styles'
|
||||
import css from '~styles'
|
||||
import { useTLDrawContext } from '~hooks'
|
||||
import type { Data } from '~types'
|
||||
|
||||
|
|
@ -51,14 +51,14 @@ export function PagePanel(): JSX.Element {
|
|||
|
||||
return (
|
||||
<DropdownMenu.Root dir="ltr" open={isOpen} onOpenChange={handleOpenChange}>
|
||||
<FloatingContainer>
|
||||
<RowButton as={DropdownMenu.Trigger} bp={breakpoints} variant="noIcon">
|
||||
<div className={floatingContainer()}>
|
||||
<DropdownMenu.Trigger className={rowButton({ bp: breakpoints, variant: 'noIcon' })}>
|
||||
<span>{currentPageName || 'Page'}</span>
|
||||
</RowButton>
|
||||
</FloatingContainer>
|
||||
<MenuContent as={DropdownMenu.Content} sideOffset={8} align="start">
|
||||
</DropdownMenu.Trigger>
|
||||
</div>
|
||||
<DropdownMenu.Content className={menuContent()} sideOffset={8} align="start">
|
||||
{isOpen && <PageMenuContent onClose={handleClose} />}
|
||||
</MenuContent>
|
||||
</DropdownMenu.Content>
|
||||
</DropdownMenu.Root>
|
||||
)
|
||||
}
|
||||
|
|
@ -86,36 +86,34 @@ function PageMenuContent({ onClose }: { onClose: () => void }) {
|
|||
<>
|
||||
<DropdownMenu.RadioGroup value={currentPageId} onValueChange={handleChangePage}>
|
||||
{sortedPages.map((page) => (
|
||||
<ButtonWithOptions key={page.id}>
|
||||
<div className={buttonWithOptions()} key={page.id}>
|
||||
<DropdownMenu.RadioItem
|
||||
as={RowButton}
|
||||
bp={breakpoints}
|
||||
className={rowButton({ bp: breakpoints, variant: 'pageButton' })}
|
||||
value={page.id}
|
||||
variant="pageButton"
|
||||
>
|
||||
<span>{page.name || 'Page'}</span>
|
||||
<DropdownMenu.ItemIndicator>
|
||||
<IconWrapper size="small">
|
||||
<div className={iconWrapper({ size: 'small' })}>
|
||||
<CheckIcon />
|
||||
</IconWrapper>
|
||||
</div>
|
||||
</DropdownMenu.ItemIndicator>
|
||||
</DropdownMenu.RadioItem>
|
||||
<PageOptionsDialog page={page} onClose={onClose} />
|
||||
</ButtonWithOptions>
|
||||
</div>
|
||||
))}
|
||||
</DropdownMenu.RadioGroup>
|
||||
<DropdownMenuDivider />
|
||||
<DropdownMenuButton onSelect={handleCreatePage}>
|
||||
<span>Create Page</span>
|
||||
<IconWrapper size="small">
|
||||
<div className={iconWrapper({ size: 'small' })}>
|
||||
<PlusIcon />
|
||||
</IconWrapper>
|
||||
</div>
|
||||
</DropdownMenuButton>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
const ButtonWithOptions = styled('div', {
|
||||
const buttonWithOptions = css({
|
||||
display: 'grid',
|
||||
gridTemplateColumns: '1fr auto',
|
||||
gridAutoFlow: 'column',
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
import styled from '~styles'
|
||||
import css from '~styles'
|
||||
|
||||
/* -------------------------------------------------- */
|
||||
/* Buttons Row */
|
||||
/* -------------------------------------------------- */
|
||||
|
||||
export const ButtonsRow = styled('div', {
|
||||
export const buttonsRow = css({
|
||||
position: 'relative',
|
||||
display: 'flex',
|
||||
width: '100%',
|
||||
|
|
|
|||
|
|
@ -11,11 +11,11 @@ import {
|
|||
CheckboxItem as CMCheckboxItem,
|
||||
} from '@radix-ui/react-context-menu'
|
||||
import { breakpoints } from './breakpoints'
|
||||
import { RowButton } from './row-button'
|
||||
import { IconButton } from './icon-button'
|
||||
import { IconWrapper } from './icon-wrapper'
|
||||
import { MenuContent } from './menu'
|
||||
import styled from '~styles'
|
||||
import { rowButton } from './row-button'
|
||||
import { iconButton } from './icon-button'
|
||||
import { iconWrapper } from './icon-wrapper'
|
||||
import { menuContent } from './menu'
|
||||
import css from '~styles'
|
||||
|
||||
/* -------------------------------------------------- */
|
||||
/* Context Menu */
|
||||
|
|
@ -42,13 +42,13 @@ export interface ContextMenuSubMenuProps {
|
|||
export function ContextMenuSubMenu({ children, label }: ContextMenuSubMenuProps): JSX.Element {
|
||||
return (
|
||||
<CMRoot dir="ltr">
|
||||
<CMTriggerItem as={RowButton} bp={breakpoints}>
|
||||
<CMTriggerItem className={rowButton({ bp: breakpoints })}>
|
||||
<span>{label}</span>
|
||||
<IconWrapper size="small">
|
||||
<div className={iconWrapper({ size: 'small' })}>
|
||||
<ChevronRightIcon />
|
||||
</IconWrapper>
|
||||
</div>
|
||||
</CMTriggerItem>
|
||||
<CMContent as={MenuContent} sideOffset={2} alignOffset={-2}>
|
||||
<CMContent className={menuContent()} sideOffset={2} alignOffset={-2}>
|
||||
{children}
|
||||
<ContextMenuArrow offset={13} />
|
||||
</CMContent>
|
||||
|
|
@ -56,16 +56,38 @@ export function ContextMenuSubMenu({ children, label }: ContextMenuSubMenuProps)
|
|||
)
|
||||
}
|
||||
|
||||
export const ContextMenuDivider = styled(CMSeparator, {
|
||||
const contextMenuDivider = css({
|
||||
backgroundColor: '$hover',
|
||||
height: 1,
|
||||
margin: '$2 -$2',
|
||||
})
|
||||
|
||||
export const ContextMenuArrow = styled(CMArrow, {
|
||||
export const ContextMenuDivider = React.forwardRef<
|
||||
React.ElementRef<typeof CMSeparator>,
|
||||
React.ComponentProps<typeof CMSeparator>
|
||||
>((props, forwardedRef) => (
|
||||
<CMSeparator
|
||||
{...props}
|
||||
ref={forwardedRef}
|
||||
className={contextMenuDivider({ className: props.className })}
|
||||
/>
|
||||
))
|
||||
|
||||
const contextMenuArrow = css({
|
||||
fill: '$panel',
|
||||
})
|
||||
|
||||
export const ContextMenuArrow = React.forwardRef<
|
||||
React.ElementRef<typeof CMArrow>,
|
||||
React.ComponentProps<typeof CMArrow>
|
||||
>((props, forwardedRef) => (
|
||||
<CMArrow
|
||||
{...props}
|
||||
ref={forwardedRef}
|
||||
className={contextMenuArrow({ className: props.className })}
|
||||
/>
|
||||
))
|
||||
|
||||
export interface ContextMenuButtonProps {
|
||||
onSelect?: () => void
|
||||
disabled?: boolean
|
||||
|
|
@ -78,9 +100,9 @@ export function ContextMenuButton({
|
|||
disabled = false,
|
||||
}: ContextMenuButtonProps): JSX.Element {
|
||||
return (
|
||||
<RowButton as={CMItem} bp={breakpoints} disabled={disabled} onSelect={onSelect}>
|
||||
<CMItem className={rowButton({ bp: breakpoints })} disabled={disabled} onSelect={onSelect}>
|
||||
{children}
|
||||
</RowButton>
|
||||
</CMItem>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
@ -96,7 +118,7 @@ export function ContextMenuIconButton({
|
|||
disabled = false,
|
||||
}: ContextMenuIconButtonProps): JSX.Element {
|
||||
return (
|
||||
<CMItem as={IconButton} bp={breakpoints} disabled={disabled} onSelect={onSelect}>
|
||||
<CMItem className={iconButton({ bp: breakpoints })} disabled={disabled} onSelect={onSelect}>
|
||||
{children}
|
||||
</CMItem>
|
||||
)
|
||||
|
|
@ -117,17 +139,16 @@ export function ContextMenuCheckboxItem({
|
|||
}: ContextMenuCheckboxItemProps): JSX.Element {
|
||||
return (
|
||||
<CMCheckboxItem
|
||||
as={RowButton}
|
||||
bp={breakpoints}
|
||||
className={rowButton({ bp: breakpoints })}
|
||||
onCheckedChange={onCheckedChange}
|
||||
checked={checked}
|
||||
disabled={disabled}
|
||||
>
|
||||
{children}
|
||||
<CMItemIndicator>
|
||||
<IconWrapper size="small">
|
||||
<div className={iconWrapper({ size: 'small' })}>
|
||||
<CheckIcon />
|
||||
</IconWrapper>
|
||||
</div>
|
||||
</CMItemIndicator>
|
||||
</CMCheckboxItem>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
import styled from '~styles'
|
||||
import css from '~styles'
|
||||
|
||||
/* -------------------------------------------------- */
|
||||
/* Dialog */
|
||||
/* -------------------------------------------------- */
|
||||
|
||||
export const DialogContent = styled('div', {
|
||||
export const dialogContent = css({
|
||||
position: 'absolute',
|
||||
top: '50%',
|
||||
left: '50%',
|
||||
|
|
@ -26,7 +26,7 @@ export const DialogContent = styled('div', {
|
|||
},
|
||||
})
|
||||
|
||||
export const DialogOverlay = styled('div', {
|
||||
export const dialogOverlay = css({
|
||||
backgroundColor: 'rgba(0, 0, 0, .15)',
|
||||
position: 'fixed',
|
||||
top: 0,
|
||||
|
|
@ -35,11 +35,11 @@ export const DialogOverlay = styled('div', {
|
|||
left: 0,
|
||||
})
|
||||
|
||||
export const DialogInputWrapper = styled('div', {
|
||||
export const dialogInputWrapper = css({
|
||||
padding: '$4 $2',
|
||||
})
|
||||
|
||||
export const DialogTitleRow = styled('div', {
|
||||
export const dialogTitleRow = css({
|
||||
display: 'flex',
|
||||
padding: '0 0 0 $4',
|
||||
alignItems: 'center',
|
||||
|
|
|
|||
|
|
@ -14,12 +14,12 @@ import {
|
|||
|
||||
import { Tooltip } from './tooltip'
|
||||
import { breakpoints } from './breakpoints'
|
||||
import { RowButton } from './row-button'
|
||||
import { IconButton } from './icon-button'
|
||||
import { IconWrapper } from './icon-wrapper'
|
||||
import { MenuContent } from './menu'
|
||||
import { rowButton } from './row-button'
|
||||
import { iconButton } from './icon-button'
|
||||
import { iconWrapper } from './icon-wrapper'
|
||||
import { menuContent } from './menu'
|
||||
|
||||
import styled from '~styles'
|
||||
import css from '~styles'
|
||||
|
||||
/* -------------------------------------------------- */
|
||||
/* Dropdown Menu */
|
||||
|
|
@ -56,13 +56,13 @@ export function DropdownMenuSubMenu({
|
|||
}: DropdownMenuSubMenuProps): JSX.Element {
|
||||
return (
|
||||
<DMRoot dir="ltr">
|
||||
<DMTriggerItem as={RowButton} bp={breakpoints} disabled={disabled}>
|
||||
<DMTriggerItem className={rowButton({ bp: breakpoints })} disabled={disabled}>
|
||||
<span>{label}</span>
|
||||
<IconWrapper size="small">
|
||||
<div className={iconWrapper({ size: 'small' })}>
|
||||
<ChevronRightIcon />
|
||||
</IconWrapper>
|
||||
</div>
|
||||
</DMTriggerItem>
|
||||
<DMContent as={MenuContent} sideOffset={2} alignOffset={-2}>
|
||||
<DMContent className={menuContent()} sideOffset={2} alignOffset={-2}>
|
||||
{children}
|
||||
<DropdownMenuArrow offset={13} />
|
||||
</DMContent>
|
||||
|
|
@ -70,7 +70,7 @@ export function DropdownMenuSubMenu({
|
|||
)
|
||||
}
|
||||
|
||||
export const DropdownMenuDivider = styled(DMSeparator, {
|
||||
export const dropdownMenuDivider = css({
|
||||
backgroundColor: '$hover',
|
||||
height: 1,
|
||||
marginTop: '$2',
|
||||
|
|
@ -79,10 +79,32 @@ export const DropdownMenuDivider = styled(DMSeparator, {
|
|||
marginLeft: '-$2',
|
||||
})
|
||||
|
||||
export const DropdownMenuArrow = styled(DMArrow, {
|
||||
export const DropdownMenuDivider = React.forwardRef<
|
||||
React.ElementRef<typeof DMSeparator>,
|
||||
React.ComponentProps<typeof DMSeparator>
|
||||
>((props, forwardedRef) => (
|
||||
<DMSeparator
|
||||
{...props}
|
||||
ref={forwardedRef}
|
||||
className={dropdownMenuDivider({ className: props.className })}
|
||||
/>
|
||||
))
|
||||
|
||||
export const dropdownMenuArrow = css({
|
||||
fill: '$panel',
|
||||
})
|
||||
|
||||
export const DropdownMenuArrow = React.forwardRef<
|
||||
React.ElementRef<typeof DMArrow>,
|
||||
React.ComponentProps<typeof DMArrow>
|
||||
>((props, forwardedRef) => (
|
||||
<DMArrow
|
||||
{...props}
|
||||
ref={forwardedRef}
|
||||
className={dropdownMenuArrow({ className: props.className })}
|
||||
/>
|
||||
))
|
||||
|
||||
export interface DropdownMenuButtonProps {
|
||||
onSelect?: () => void
|
||||
disabled?: boolean
|
||||
|
|
@ -95,7 +117,7 @@ export function DropdownMenuButton({
|
|||
disabled = false,
|
||||
}: DropdownMenuButtonProps): JSX.Element {
|
||||
return (
|
||||
<DMItem as={RowButton} bp={breakpoints} disabled={disabled} onSelect={onSelect}>
|
||||
<DMItem className={rowButton({ bp: breakpoints })} disabled={disabled} onSelect={onSelect}>
|
||||
{children}
|
||||
</DMItem>
|
||||
)
|
||||
|
|
@ -113,7 +135,7 @@ export function DropdownMenuIconButton({
|
|||
disabled = false,
|
||||
}: DropdownMenuIconButtonProps): JSX.Element {
|
||||
return (
|
||||
<DMItem as={IconButton} bp={breakpoints} disabled={disabled} onSelect={onSelect}>
|
||||
<DMItem className={iconButton({ bp: breakpoints })} disabled={disabled} onSelect={onSelect}>
|
||||
{children}
|
||||
</DMItem>
|
||||
)
|
||||
|
|
@ -133,7 +155,7 @@ export function DropdownMenuIconTriggerButton({
|
|||
disabled = false,
|
||||
}: DropdownMenuIconTriggerButtonProps): JSX.Element {
|
||||
return (
|
||||
<DMTrigger as={IconButton} bp={breakpoints} disabled={disabled}>
|
||||
<DMTrigger className={iconButton({ bp: breakpoints })} disabled={disabled}>
|
||||
<Tooltip label={label} kbd={kbd}>
|
||||
{children}
|
||||
</Tooltip>
|
||||
|
|
@ -156,17 +178,16 @@ export function DropdownMenuCheckboxItem({
|
|||
}: MenuCheckboxItemProps): JSX.Element {
|
||||
return (
|
||||
<DMCheckboxItem
|
||||
as={RowButton}
|
||||
bp={breakpoints}
|
||||
className={rowButton({ bp: breakpoints })}
|
||||
onCheckedChange={onCheckedChange}
|
||||
checked={checked}
|
||||
disabled={disabled}
|
||||
>
|
||||
{children}
|
||||
<DMItemIndicator>
|
||||
<IconWrapper size="small">
|
||||
<div className={iconWrapper({ size: 'small' })}>
|
||||
<CheckIcon />
|
||||
</IconWrapper>
|
||||
</div>
|
||||
</DMItemIndicator>
|
||||
</DMCheckboxItem>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
import styled from '~styles'
|
||||
import css from '~styles'
|
||||
|
||||
/* -------------------------------------------------- */
|
||||
/* Floating Container */
|
||||
/* -------------------------------------------------- */
|
||||
|
||||
export const FloatingContainer = styled('div', {
|
||||
export const floatingContainer = css({
|
||||
backgroundColor: '$panel',
|
||||
border: '1px solid $panel',
|
||||
borderRadius: '4px',
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
import styled from '~styles'
|
||||
import css from '~styles'
|
||||
|
||||
/* -------------------------------------------------- */
|
||||
/* Icon Button */
|
||||
/* -------------------------------------------------- */
|
||||
|
||||
export const IconButton = styled('button', {
|
||||
export const iconButton = css({
|
||||
position: 'relative',
|
||||
height: '32px',
|
||||
width: '32px',
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
import styled from '~styles'
|
||||
import css from '~styles'
|
||||
|
||||
/* -------------------------------------------------- */
|
||||
/* Icon Wrapper */
|
||||
/* -------------------------------------------------- */
|
||||
|
||||
export const IconWrapper = styled('div', {
|
||||
export const iconWrapper = css({
|
||||
height: '100%',
|
||||
borderRadius: '4px',
|
||||
marginRight: '1px',
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import * as React from 'react'
|
||||
import styled from '~styles'
|
||||
import css from '~styles'
|
||||
import { Utils } from '@tldraw/core'
|
||||
|
||||
/* -------------------------------------------------- */
|
||||
|
|
@ -18,18 +18,18 @@ export function Kbd({
|
|||
children: string
|
||||
}): JSX.Element | null {
|
||||
return (
|
||||
<StyledKbd variant={variant}>
|
||||
<kbd className={kbd({ variant })}>
|
||||
{children
|
||||
.replaceAll('#', commandKey())
|
||||
.split('')
|
||||
.map((k, i) => (
|
||||
<span key={i}>{k}</span>
|
||||
))}
|
||||
</StyledKbd>
|
||||
</kbd>
|
||||
)
|
||||
}
|
||||
|
||||
export const StyledKbd = styled('kbd', {
|
||||
export const kbd = css({
|
||||
marginLeft: '$3',
|
||||
textShadow: '$2',
|
||||
textAlign: 'center',
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
import { breakpoints } from './breakpoints'
|
||||
import styled from '~styles'
|
||||
import { RowButton } from './row-button'
|
||||
import css from '~styles'
|
||||
import { rowButton } from './row-button'
|
||||
|
||||
/* -------------------------------------------------- */
|
||||
/* Menu */
|
||||
/* -------------------------------------------------- */
|
||||
|
||||
export const MenuContent = styled('div', {
|
||||
export const menuContent = css({
|
||||
position: 'relative',
|
||||
overflow: 'hidden',
|
||||
userSelect: 'none',
|
||||
|
|
@ -21,7 +21,7 @@ export const MenuContent = styled('div', {
|
|||
font: '$ui',
|
||||
})
|
||||
|
||||
export const Divider = styled('div', {
|
||||
export const divider = css({
|
||||
backgroundColor: '$hover',
|
||||
height: 1,
|
||||
marginTop: '$2',
|
||||
|
|
@ -42,13 +42,17 @@ export function MenuButton({
|
|||
children: React.ReactNode
|
||||
}): JSX.Element {
|
||||
return (
|
||||
<RowButton bp={breakpoints} disabled={disabled} warn={warn} onSelect={onSelect}>
|
||||
<button
|
||||
className={rowButton({ bp: breakpoints, warn })}
|
||||
disabled={disabled}
|
||||
onSelect={onSelect}
|
||||
>
|
||||
{children}
|
||||
</RowButton>
|
||||
</button>
|
||||
)
|
||||
}
|
||||
|
||||
export const MenuTextInput = styled('input', {
|
||||
export const menuTextInput = css({
|
||||
backgroundColor: '$panel',
|
||||
border: 'none',
|
||||
padding: '$4 $3',
|
||||
|
|
|
|||
|
|
@ -1,10 +1,18 @@
|
|||
import styled from '~styles'
|
||||
import React from 'react'
|
||||
import css from '~styles'
|
||||
import { Root as RGRoot } from '@radix-ui/react-radio-group'
|
||||
|
||||
/* -------------------------------------------------- */
|
||||
/* Radio Group */
|
||||
/* -------------------------------------------------- */
|
||||
|
||||
export const Group = styled(RGRoot, {
|
||||
export const group = css({
|
||||
display: 'flex',
|
||||
})
|
||||
|
||||
export const Group = React.forwardRef<
|
||||
React.ElementRef<typeof RGRoot>,
|
||||
React.ComponentProps<typeof RGRoot>
|
||||
>((props, forwardedRef) => (
|
||||
<RGRoot {...props} ref={forwardedRef} className={group({ className: props.className })} />
|
||||
))
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
import styled from '~styles'
|
||||
import css from '~styles'
|
||||
|
||||
/* -------------------------------------------------- */
|
||||
/* Row Button */
|
||||
/* -------------------------------------------------- */
|
||||
|
||||
export const RowButton = styled('button', {
|
||||
export const rowButton = css({
|
||||
position: 'relative',
|
||||
display: 'flex',
|
||||
width: '100%',
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import * as RadixTooltip from '@radix-ui/react-tooltip'
|
||||
import * as React from 'react'
|
||||
import styled from '~styles'
|
||||
import { Kbd } from './kbd'
|
||||
import css from '~styles'
|
||||
import { kbd } from './kbd'
|
||||
|
||||
/* -------------------------------------------------- */
|
||||
/* Tooltip */
|
||||
|
|
@ -14,20 +14,25 @@ interface TooltipProps {
|
|||
side?: 'bottom' | 'left' | 'right' | 'top'
|
||||
}
|
||||
|
||||
export function Tooltip({ children, label, kbd, side = 'top' }: TooltipProps): JSX.Element {
|
||||
export function Tooltip({
|
||||
children,
|
||||
label,
|
||||
kbd: kbdProp,
|
||||
side = 'top',
|
||||
}: TooltipProps): JSX.Element {
|
||||
return (
|
||||
<RadixTooltip.Root>
|
||||
<RadixTooltip.Trigger as="span">{children}</RadixTooltip.Trigger>
|
||||
<StyledContent side={side} sideOffset={8}>
|
||||
<RadixTooltip.Content className={content()} side={side} sideOffset={8}>
|
||||
{label}
|
||||
{kbd ? <Kbd variant="tooltip">{kbd}</Kbd> : null}
|
||||
<StyledArrow />
|
||||
</StyledContent>
|
||||
{kbdProp ? <kbd className={kbd({ variant: 'tooltip' })}>{kbdProp}</kbd> : null}
|
||||
<RadixTooltip.Arrow className={arrow()} />
|
||||
</RadixTooltip.Content>
|
||||
</RadixTooltip.Root>
|
||||
)
|
||||
}
|
||||
|
||||
const StyledContent = styled(RadixTooltip.Content, {
|
||||
const content = css({
|
||||
borderRadius: 3,
|
||||
padding: '$3 $3 $3 $3',
|
||||
fontSize: '$1',
|
||||
|
|
@ -40,7 +45,7 @@ const StyledContent = styled(RadixTooltip.Content, {
|
|||
userSelect: 'none',
|
||||
})
|
||||
|
||||
const StyledArrow = styled(RadixTooltip.Arrow, {
|
||||
const arrow = css({
|
||||
fill: '$tooltipBg',
|
||||
margin: '0 8px',
|
||||
})
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ import {
|
|||
} from '@radix-ui/react-icons'
|
||||
import { AlignType, DistributeType, StretchType } from '~types'
|
||||
import { useTLDrawContext } from '~hooks'
|
||||
import { breakpoints, ButtonsRow, IconButton } from '../shared'
|
||||
import { breakpoints, buttonsRow, iconButton } from '../shared'
|
||||
|
||||
export interface AlignDistributeProps {
|
||||
hasTwoOrMore: boolean
|
||||
|
|
@ -66,70 +66,80 @@ export const AlignDistribute = React.memo(
|
|||
|
||||
return (
|
||||
<>
|
||||
<ButtonsRow>
|
||||
<IconButton bp={breakpoints} size="small" disabled={!hasTwoOrMore} onClick={alignLeft}>
|
||||
<div className={buttonsRow()}>
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasTwoOrMore}
|
||||
onClick={alignLeft}
|
||||
>
|
||||
<AlignLeftIcon />
|
||||
</IconButton>
|
||||
<IconButton
|
||||
bp={breakpoints}
|
||||
size="small"
|
||||
</button>
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasTwoOrMore}
|
||||
onClick={alignCenterHorizontal}
|
||||
>
|
||||
<AlignCenterHorizontallyIcon />
|
||||
</IconButton>
|
||||
<IconButton bp={breakpoints} size="small" disabled={!hasTwoOrMore} onClick={alignRight}>
|
||||
</button>
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasTwoOrMore}
|
||||
onClick={alignRight}
|
||||
>
|
||||
<AlignRightIcon />
|
||||
</IconButton>
|
||||
<IconButton
|
||||
bp={breakpoints}
|
||||
size="small"
|
||||
</button>
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasTwoOrMore}
|
||||
onClick={stretchHorizontally}
|
||||
>
|
||||
<StretchHorizontallyIcon />
|
||||
</IconButton>
|
||||
<IconButton
|
||||
bp={breakpoints}
|
||||
size="small"
|
||||
</button>
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasThreeOrMore}
|
||||
onClick={distributeHorizontally}
|
||||
>
|
||||
<SpaceEvenlyHorizontallyIcon />
|
||||
</IconButton>
|
||||
</ButtonsRow>
|
||||
<ButtonsRow>
|
||||
<IconButton bp={breakpoints} size="small" disabled={!hasTwoOrMore} onClick={alignTop}>
|
||||
</button>
|
||||
</div>
|
||||
<div className={buttonsRow()}>
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasTwoOrMore}
|
||||
onClick={alignTop}
|
||||
>
|
||||
<AlignTopIcon />
|
||||
</IconButton>
|
||||
<IconButton
|
||||
bp={breakpoints}
|
||||
size="small"
|
||||
</button>
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasTwoOrMore}
|
||||
onClick={alignCenterVertical}
|
||||
>
|
||||
<AlignCenterVerticallyIcon />
|
||||
</IconButton>
|
||||
<IconButton bp={breakpoints} size="small" disabled={!hasTwoOrMore} onClick={alignBottom}>
|
||||
</button>
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasTwoOrMore}
|
||||
onClick={alignBottom}
|
||||
>
|
||||
<AlignBottomIcon />
|
||||
</IconButton>
|
||||
<IconButton
|
||||
bp={breakpoints}
|
||||
size="small"
|
||||
</button>
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasTwoOrMore}
|
||||
onClick={stretchVertically}
|
||||
>
|
||||
<StretchVerticallyIcon />
|
||||
</IconButton>
|
||||
<IconButton
|
||||
bp={breakpoints}
|
||||
size="small"
|
||||
</button>
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasThreeOrMore}
|
||||
onClick={distributeVertically}
|
||||
>
|
||||
<SpaceEvenlyVerticallyIcon />
|
||||
</IconButton>
|
||||
</ButtonsRow>
|
||||
</button>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import * as React from 'react'
|
||||
import * as DropdownMenu from '@radix-ui/react-dropdown-menu'
|
||||
import { BoxIcon, StyleDropdownItem, StyleDropdownContent } from './styled'
|
||||
import { BoxIcon, dropdownItem, dropdownContent } from './styled'
|
||||
import { DropdownMenuIconTriggerButton } from '../shared'
|
||||
import { strokes } from '~shape'
|
||||
import { useTheme, useTLDrawContext } from '~hooks'
|
||||
|
|
@ -28,11 +28,11 @@ export const QuickColorSelect = React.memo((): JSX.Element => {
|
|||
<DropdownMenu.DropdownMenuRadioGroup
|
||||
value={color as string}
|
||||
onValueChange={handleColorChange}
|
||||
as={StyleDropdownContent}
|
||||
className={dropdownContent()}
|
||||
>
|
||||
{Object.keys(strokes[theme]).map((colorStyle: string) => (
|
||||
<DropdownMenu.DropdownMenuRadioItem
|
||||
as={StyleDropdownItem}
|
||||
className={dropdownItem()}
|
||||
key={colorStyle}
|
||||
title={colorStyle}
|
||||
value={colorStyle}
|
||||
|
|
|
|||
|
|
@ -6,8 +6,8 @@ import {
|
|||
DashDottedIcon,
|
||||
DashSolidIcon,
|
||||
DashDashedIcon,
|
||||
StyleDropdownContent,
|
||||
StyleDropdownItem,
|
||||
dropdownContent,
|
||||
dropdownItem,
|
||||
} from './styled'
|
||||
import { useTLDrawContext } from '~hooks'
|
||||
import { DashStyle, Data } from '~types'
|
||||
|
|
@ -36,16 +36,14 @@ export const QuickDashSelect = React.memo((): JSX.Element => {
|
|||
<DropdownMenuIconTriggerButton label="Dash">{dashes[dash]}</DropdownMenuIconTriggerButton>
|
||||
<DropdownMenu.Content sideOffset={8}>
|
||||
<DropdownMenu.DropdownMenuRadioGroup
|
||||
as={StyleDropdownContent}
|
||||
direction="vertical"
|
||||
className={dropdownContent({ direction: 'vertical' })}
|
||||
value={dash}
|
||||
onValueChange={changeDashStyle}
|
||||
>
|
||||
{Object.keys(DashStyle).map((dashStyle: string) => (
|
||||
<DropdownMenu.DropdownMenuRadioItem
|
||||
as={StyleDropdownItem}
|
||||
className={dropdownItem({ isActive: dash === dashStyle })}
|
||||
key={dashStyle}
|
||||
isActive={dash === dashStyle}
|
||||
value={dashStyle}
|
||||
>
|
||||
{dashes[dashStyle as DashStyle]}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import * as React from 'react'
|
||||
import * as Checkbox from '@radix-ui/react-checkbox'
|
||||
import { BoxIcon, IsFilledFillIcon } from './styled'
|
||||
import { breakpoints, Tooltip, IconButton, IconWrapper } from '../shared'
|
||||
import { breakpoints, Tooltip, iconButton, iconWrapper } from '../shared'
|
||||
import { useTLDrawContext } from '~hooks'
|
||||
import type { Data } from '~types'
|
||||
|
||||
|
|
@ -20,18 +20,17 @@ export const QuickFillSelect = React.memo((): JSX.Element => {
|
|||
return (
|
||||
<Checkbox.Root
|
||||
dir="ltr"
|
||||
as={IconButton}
|
||||
bp={breakpoints}
|
||||
className={iconButton({ bp: breakpoints })}
|
||||
checked={isFilled}
|
||||
onCheckedChange={handleIsFilledChange}
|
||||
>
|
||||
<Tooltip label="Fill">
|
||||
<IconWrapper>
|
||||
<div className={iconWrapper()}>
|
||||
<BoxIcon />
|
||||
<Checkbox.Indicator>
|
||||
<IsFilledFillIcon />
|
||||
</Checkbox.Indicator>
|
||||
</IconWrapper>
|
||||
</div>
|
||||
</Tooltip>
|
||||
</Checkbox.Root>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ import * as React from 'react'
|
|||
import * as DropdownMenu from '@radix-ui/react-dropdown-menu'
|
||||
import { DropdownMenuIconTriggerButton } from '../shared/dropdown-menu'
|
||||
import { CircleIcon } from '../icons'
|
||||
import { StyleDropdownContent, StyleDropdownItem } from './styled'
|
||||
import { dropdownContent, dropdownItem } from './styled'
|
||||
import { Data, SizeStyle } from '~types'
|
||||
import { useTLDrawContext } from '~hooks'
|
||||
|
||||
|
|
@ -31,16 +31,14 @@ export const QuickSizeSelect = React.memo((): JSX.Element => {
|
|||
</DropdownMenuIconTriggerButton>
|
||||
<DropdownMenu.Content sideOffset={8}>
|
||||
<DropdownMenu.DropdownMenuRadioGroup
|
||||
as={StyleDropdownContent}
|
||||
direction="vertical"
|
||||
className={dropdownContent({ direction: 'vertical' })}
|
||||
value={size}
|
||||
onValueChange={changeSizeStyle}
|
||||
>
|
||||
{Object.keys(SizeStyle).map((sizeStyle: string) => (
|
||||
<DropdownMenu.DropdownMenuRadioItem
|
||||
key={sizeStyle}
|
||||
as={StyleDropdownItem}
|
||||
isActive={size === sizeStyle}
|
||||
className={dropdownItem({ isActive: size === sizeStyle })}
|
||||
value={sizeStyle}
|
||||
>
|
||||
<CircleIcon size={sizes[sizeStyle as SizeStyle]} />
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import * as React from 'react'
|
||||
import { IconButton, ButtonsRow, breakpoints } from '../shared'
|
||||
import { iconButton, buttonsRow, breakpoints } from '../shared'
|
||||
import { Trash } from '../icons'
|
||||
import { Tooltip } from '../shared/tooltip'
|
||||
import {
|
||||
|
|
@ -108,108 +108,108 @@ export const ShapesFunctions = React.memo(() => {
|
|||
|
||||
return (
|
||||
<>
|
||||
<ButtonsRow>
|
||||
<IconButton
|
||||
bp={breakpoints}
|
||||
<div className={buttonsRow()}>
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasSelection}
|
||||
size="small"
|
||||
onClick={handleDuplicate}
|
||||
>
|
||||
<Tooltip label="Duplicate" kbd={`#D`}>
|
||||
<CopyIcon />
|
||||
</Tooltip>
|
||||
</IconButton>
|
||||
</button>
|
||||
|
||||
<IconButton disabled={!hasSelection} size="small" onClick={handleRotate}>
|
||||
<button
|
||||
className={iconButton({ size: 'small' })}
|
||||
disabled={!hasSelection}
|
||||
onClick={handleRotate}
|
||||
>
|
||||
<Tooltip label="Rotate">
|
||||
<RotateCounterClockwiseIcon />
|
||||
</Tooltip>
|
||||
</IconButton>
|
||||
</button>
|
||||
|
||||
<IconButton
|
||||
bp={breakpoints}
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasSelection}
|
||||
size="small"
|
||||
onClick={handleToggleLocked}
|
||||
>
|
||||
<Tooltip label="Toogle Locked" kbd={`#L`}>
|
||||
{isAllLocked ? <LockClosedIcon /> : <LockOpen1Icon opacity={0.4} />}
|
||||
</Tooltip>
|
||||
</IconButton>
|
||||
</button>
|
||||
|
||||
<IconButton
|
||||
bp={breakpoints}
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasSelection}
|
||||
size="small"
|
||||
onClick={handleToggleAspectRatio}
|
||||
>
|
||||
<Tooltip label="Toogle Aspect Ratio Lock">
|
||||
<AspectRatioIcon opacity={isAllAspectLocked ? 1 : 0.4} />
|
||||
</Tooltip>
|
||||
</IconButton>
|
||||
</button>
|
||||
|
||||
<IconButton
|
||||
bp={breakpoints}
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!isAllGrouped && !hasMultipleSelection}
|
||||
size="small"
|
||||
onClick={handleGroup}
|
||||
>
|
||||
<Tooltip label="Group" kbd={`#G`}>
|
||||
<GroupIcon opacity={isAllGrouped ? 1 : 0.4} />
|
||||
</Tooltip>
|
||||
</IconButton>
|
||||
</ButtonsRow>
|
||||
<ButtonsRow>
|
||||
<IconButton
|
||||
bp={breakpoints}
|
||||
</button>
|
||||
</div>
|
||||
<div className={buttonsRow()}>
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasSelection}
|
||||
size="small"
|
||||
onClick={handleMoveToBack}
|
||||
>
|
||||
<Tooltip label="Move to Back" kbd={`#⇧[`}>
|
||||
<PinBottomIcon />
|
||||
</Tooltip>
|
||||
</IconButton>
|
||||
</button>
|
||||
|
||||
<IconButton
|
||||
bp={breakpoints}
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasSelection}
|
||||
size="small"
|
||||
onClick={handleMoveBackward}
|
||||
>
|
||||
<Tooltip label="Move Backward" kbd={`#[`}>
|
||||
<ArrowDownIcon />
|
||||
</Tooltip>
|
||||
</IconButton>
|
||||
</button>
|
||||
|
||||
<IconButton
|
||||
bp={breakpoints}
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasSelection}
|
||||
size="small"
|
||||
onClick={handleMoveForward}
|
||||
>
|
||||
<Tooltip label="Move Forward" kbd={`#]`}>
|
||||
<ArrowUpIcon />
|
||||
</Tooltip>
|
||||
</IconButton>
|
||||
</button>
|
||||
|
||||
<IconButton
|
||||
bp={breakpoints}
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasSelection}
|
||||
size="small"
|
||||
onClick={handleMoveToFront}
|
||||
>
|
||||
<Tooltip label="More to Front" kbd={`#⇧]`}>
|
||||
<PinTopIcon />
|
||||
</Tooltip>
|
||||
</IconButton>
|
||||
</button>
|
||||
|
||||
<IconButton bp={breakpoints} disabled={!hasSelection} size="small" onClick={handleDelete}>
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
disabled={!hasSelection}
|
||||
onClick={handleDelete}
|
||||
>
|
||||
<Tooltip label="Delete" kbd="⌫">
|
||||
<Trash />
|
||||
</Tooltip>
|
||||
</IconButton>
|
||||
</ButtonsRow>
|
||||
</button>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
|
|||
|
|
@ -10,14 +10,14 @@ import { QuickSizeSelect } from './quick-size-select'
|
|||
import { QuickDashSelect } from './quick-dash-select'
|
||||
import { QuickFillSelect } from './quick-fill-select'
|
||||
import { Tooltip } from '../shared/tooltip'
|
||||
import { Kbd } from '../shared/kbd'
|
||||
import { kbd } from '../shared/kbd'
|
||||
import {
|
||||
IconButton,
|
||||
ButtonsRow,
|
||||
iconButton,
|
||||
buttonsRow,
|
||||
breakpoints,
|
||||
RowButton,
|
||||
FloatingContainer,
|
||||
Divider,
|
||||
rowButton,
|
||||
floatingContainer,
|
||||
divider,
|
||||
} from '../shared'
|
||||
|
||||
const isStyleOpenSelector = (s: Data) => s.appState.isStyleOpen
|
||||
|
|
@ -27,25 +27,24 @@ export function StylePanel(): JSX.Element {
|
|||
const isOpen = useSelector(isStyleOpenSelector)
|
||||
|
||||
return (
|
||||
<FloatingContainer direction="column">
|
||||
<ButtonsRow>
|
||||
<div className={floatingContainer({ direction: 'column' })}>
|
||||
<div className={buttonsRow()}>
|
||||
<QuickColorSelect />
|
||||
<QuickSizeSelect />
|
||||
<QuickDashSelect />
|
||||
<QuickFillSelect />
|
||||
<IconButton
|
||||
bp={breakpoints}
|
||||
<button
|
||||
className={iconButton({ bp: breakpoints, size: 'small' })}
|
||||
title="Style"
|
||||
size="small"
|
||||
onPointerDown={tlstate.toggleStylePanel}
|
||||
>
|
||||
<Tooltip label={isOpen ? 'Close' : 'More'}>
|
||||
{isOpen ? <Cross2Icon /> : <DotsHorizontalIcon />}
|
||||
</Tooltip>
|
||||
</IconButton>
|
||||
</ButtonsRow>
|
||||
</button>
|
||||
</div>
|
||||
{isOpen && <SelectedShapeContent />}
|
||||
</FloatingContainer>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
@ -72,26 +71,30 @@ function SelectedShapeContent(): JSX.Element {
|
|||
|
||||
return (
|
||||
<>
|
||||
<Divider />
|
||||
<div className={divider()} />
|
||||
<ShapesFunctions />
|
||||
<Divider />
|
||||
<div className={divider()} />
|
||||
<AlignDistribute
|
||||
hasTwoOrMore={selectedShapesCount > 1}
|
||||
hasThreeOrMore={selectedShapesCount > 2}
|
||||
/>
|
||||
<Divider />
|
||||
<RowButton bp={breakpoints} disabled={selectedShapesCount === 0} onClick={handleCopy}>
|
||||
<div className={divider()} />
|
||||
<button
|
||||
className={rowButton({ bp: breakpoints })}
|
||||
disabled={selectedShapesCount === 0}
|
||||
onClick={handleCopy}
|
||||
>
|
||||
<span>Copy</span>
|
||||
{showKbds && <Kbd variant="menu">#C</Kbd>}
|
||||
</RowButton>
|
||||
<RowButton bp={breakpoints} onClick={handlePaste}>
|
||||
{showKbds && <kbd className={kbd({ variant: 'menu' })}>#C</kbd>}
|
||||
</button>
|
||||
<button className={rowButton({ bp: breakpoints })} onClick={handlePaste}>
|
||||
<span>Paste</span>
|
||||
{showKbds && <Kbd variant="menu">#V</Kbd>}
|
||||
</RowButton>
|
||||
<RowButton bp={breakpoints} onClick={handleCopySvg}>
|
||||
{showKbds && <kbd className={kbd({ variant: 'menu' })}>#V</kbd>}
|
||||
</button>
|
||||
<button className={rowButton({ bp: breakpoints })} onClick={handleCopySvg}>
|
||||
<span>Copy to SVG</span>
|
||||
{showKbds && <Kbd variant="menu">⇧#C</Kbd>}
|
||||
</RowButton>
|
||||
{showKbds && <kbd className={kbd({ variant: 'menu' })}>⇧#C</kbd>}
|
||||
</button>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import * as React from 'react'
|
||||
import styled from '~styles'
|
||||
import css from '~styles'
|
||||
|
||||
export const StyleDropdownContent = styled('div', {
|
||||
export const dropdownContent = css({
|
||||
display: 'grid',
|
||||
padding: 4,
|
||||
gridTemplateColumns: 'repeat(4, 1fr)',
|
||||
|
|
@ -19,7 +19,7 @@ export const StyleDropdownContent = styled('div', {
|
|||
},
|
||||
})
|
||||
|
||||
export const StyleDropdownItem = styled('button', {
|
||||
export const dropdownItem = css({
|
||||
height: '32px',
|
||||
width: '32px',
|
||||
backgroundColor: '$panel',
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import * as React from 'react'
|
||||
import { IdProvider } from '@radix-ui/react-id'
|
||||
import { Renderer } from '@tldraw/core'
|
||||
import styled from '~styles'
|
||||
import css from '~styles'
|
||||
import { Data, TLDrawDocument, TLDrawStatus } from '~types'
|
||||
import { TLDrawState } from '~state'
|
||||
import { TLDrawContext, useCustomFonts, useKeyboardShortcuts, useTLDrawContext } from '~hooks'
|
||||
|
|
@ -146,7 +146,7 @@ function InnerTldraw({
|
|||
}, [currentPageId, tlstate])
|
||||
|
||||
return (
|
||||
<Layout>
|
||||
<div className={layout()}>
|
||||
<ContextMenu>
|
||||
<Renderer
|
||||
page={page}
|
||||
|
|
@ -205,18 +205,18 @@ function InnerTldraw({
|
|||
onMount={tlstate.handleMount}
|
||||
/>
|
||||
</ContextMenu>
|
||||
<MenuButtons>
|
||||
<div className={menuButtons()}>
|
||||
<Menu />
|
||||
<PagePanel />
|
||||
</MenuButtons>
|
||||
<Spacer />
|
||||
</div>
|
||||
<div className={spacer()} />
|
||||
<StylePanel />
|
||||
<ToolsPanel />
|
||||
</Layout>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const Layout = styled('div', {
|
||||
const layout = css({
|
||||
position: 'absolute',
|
||||
height: '100%',
|
||||
width: '100%',
|
||||
|
|
@ -245,11 +245,11 @@ const Layout = styled('div', {
|
|||
},
|
||||
})
|
||||
|
||||
const Spacer = styled('div', {
|
||||
const spacer = css({
|
||||
flexGrow: 2,
|
||||
})
|
||||
|
||||
const MenuButtons = styled('div', {
|
||||
const menuButtons = css({
|
||||
display: 'flex',
|
||||
gap: 8,
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import * as React from 'react'
|
||||
import { FloatingContainer, RowButton } from '../shared'
|
||||
import styled from '~styles'
|
||||
import { floatingContainer, rowButton } from '../shared'
|
||||
import css from '~styles'
|
||||
import type { Data } from '~types'
|
||||
import { useTLDrawContext } from '~hooks'
|
||||
|
||||
|
|
@ -16,13 +16,15 @@ export const BackToContent = React.memo(() => {
|
|||
if (!isEmptyCanvas) return null
|
||||
|
||||
return (
|
||||
<BackToContentButton>
|
||||
<RowButton onClick={tlstate.zoomToContent}>Back to content</RowButton>
|
||||
</BackToContentButton>
|
||||
<div className={backToContentButton()}>
|
||||
<button className={rowButton()} onClick={tlstate.zoomToContent}>
|
||||
Back to content
|
||||
</button>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
|
||||
const BackToContentButton = styled(FloatingContainer, {
|
||||
const backToContentButton = css(floatingContainer, {
|
||||
pointerEvents: 'all',
|
||||
width: 'fit-content',
|
||||
gridRow: 1,
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import * as React from 'react'
|
||||
import { useTLDrawContext } from '~hooks'
|
||||
import type { Data } from '~types'
|
||||
import styled from '~styles'
|
||||
import css from '~styles'
|
||||
|
||||
const statusSelector = (s: Data) => s.appState.status.current
|
||||
const activeToolSelector = (s: Data) => s.appState.activeTool
|
||||
|
|
@ -12,15 +12,15 @@ export function StatusBar(): JSX.Element | null {
|
|||
const activeTool = useSelector(activeToolSelector)
|
||||
|
||||
return (
|
||||
<StatusBarContainer size={{ '@sm': 'small' }}>
|
||||
<Section>
|
||||
<div className={statusBarContainer({ size: { '@sm': 'small' } })}>
|
||||
<div className={section()}>
|
||||
{activeTool} | {status}
|
||||
</Section>
|
||||
</StatusBarContainer>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const StatusBarContainer = styled('div', {
|
||||
const statusBarContainer = css({
|
||||
height: 40,
|
||||
userSelect: 'none',
|
||||
borderTop: '1px solid $border',
|
||||
|
|
@ -44,7 +44,7 @@ const StatusBarContainer = styled('div', {
|
|||
},
|
||||
})
|
||||
|
||||
const Section = styled('div', {
|
||||
const section = css({
|
||||
whiteSpace: 'nowrap',
|
||||
overflow: 'hidden',
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
import * as React from 'react'
|
||||
import { FloatingContainer } from '../shared'
|
||||
import { floatingContainer } from '../shared'
|
||||
import { Tooltip } from '../shared/tooltip'
|
||||
import styled from '~styles'
|
||||
import css from '~styles'
|
||||
|
||||
export const ToolButton = styled('button', {
|
||||
export const toolButton = css({
|
||||
position: 'relative',
|
||||
height: '32px',
|
||||
width: '32px',
|
||||
|
|
@ -38,7 +38,7 @@ export const ToolButton = styled('button', {
|
|||
},
|
||||
})
|
||||
|
||||
export const PrimaryToolButton = styled(ToolButton, {
|
||||
export const primaryToolButton = css(toolButton, {
|
||||
variants: {
|
||||
bp: {
|
||||
mobile: {
|
||||
|
|
@ -65,7 +65,7 @@ export const PrimaryToolButton = styled(ToolButton, {
|
|||
},
|
||||
})
|
||||
|
||||
export const SecondaryToolButton = styled(ToolButton, {
|
||||
export const secondaryToolButton = css(toolButton, {
|
||||
variants: {
|
||||
bp: {
|
||||
mobile: {
|
||||
|
|
@ -92,7 +92,7 @@ export const SecondaryToolButton = styled(ToolButton, {
|
|||
},
|
||||
})
|
||||
|
||||
export const TertiaryToolButton = styled(ToolButton, {
|
||||
export const tertiaryToolButton = css(toolButton, {
|
||||
variants: {
|
||||
bp: {
|
||||
mobile: {
|
||||
|
|
@ -139,20 +139,22 @@ export function PrimaryButton({
|
|||
}: PrimaryToolButtonProps): JSX.Element {
|
||||
return (
|
||||
<Tooltip label={label[0].toUpperCase() + label.slice(1)} kbd={kbd}>
|
||||
<PrimaryToolButton
|
||||
name={label}
|
||||
bp={{
|
||||
'@initial': 'mobile',
|
||||
'@sm': 'small',
|
||||
'@md': 'medium',
|
||||
'@lg': 'large',
|
||||
}}
|
||||
<button
|
||||
className={primaryToolButton({
|
||||
bp: {
|
||||
'@initial': 'mobile',
|
||||
'@sm': 'small',
|
||||
'@md': 'medium',
|
||||
'@lg': 'large',
|
||||
},
|
||||
name: label,
|
||||
isActive,
|
||||
})}
|
||||
onClick={onClick}
|
||||
onDoubleClick={onDoubleClick}
|
||||
isActive={isActive}
|
||||
>
|
||||
{children}
|
||||
</PrimaryToolButton>
|
||||
</button>
|
||||
</Tooltip>
|
||||
)
|
||||
}
|
||||
|
|
@ -176,20 +178,22 @@ export function SecondaryButton({
|
|||
}: SecondaryToolButtonProps): JSX.Element {
|
||||
return (
|
||||
<Tooltip label={label[0].toUpperCase() + label.slice(1)} kbd={kbd}>
|
||||
<SecondaryToolButton
|
||||
name={label}
|
||||
bp={{
|
||||
'@initial': 'mobile',
|
||||
'@sm': 'small',
|
||||
'@md': 'medium',
|
||||
'@lg': 'large',
|
||||
}}
|
||||
<button
|
||||
className={secondaryToolButton({
|
||||
bp: {
|
||||
'@initial': 'mobile',
|
||||
'@sm': 'small',
|
||||
'@md': 'medium',
|
||||
'@lg': 'large',
|
||||
},
|
||||
name: label,
|
||||
isActive,
|
||||
})}
|
||||
onClick={onClick}
|
||||
onDoubleClick={onDoubleClick}
|
||||
isActive={isActive}
|
||||
>
|
||||
{children}
|
||||
</SecondaryToolButton>
|
||||
</button>
|
||||
</Tooltip>
|
||||
)
|
||||
}
|
||||
|
|
@ -211,24 +215,26 @@ export function TertiaryButton({
|
|||
}: TertiaryToolProps): JSX.Element {
|
||||
return (
|
||||
<Tooltip label={label[0].toUpperCase() + label.slice(1)} kbd={kbd}>
|
||||
<TertiaryToolButton
|
||||
<button
|
||||
className={tertiaryToolButton({
|
||||
bp: {
|
||||
'@initial': 'mobile',
|
||||
'@sm': 'small',
|
||||
'@md': 'medium',
|
||||
'@lg': 'large',
|
||||
},
|
||||
})}
|
||||
name={label}
|
||||
bp={{
|
||||
'@initial': 'mobile',
|
||||
'@sm': 'small',
|
||||
'@md': 'medium',
|
||||
'@lg': 'large',
|
||||
}}
|
||||
onClick={onClick}
|
||||
onDoubleClick={onDoubleClick}
|
||||
>
|
||||
{children}
|
||||
</TertiaryToolButton>
|
||||
</button>
|
||||
</Tooltip>
|
||||
)
|
||||
}
|
||||
|
||||
export const TertiaryButtonsContainer = styled(FloatingContainer, {
|
||||
export const tertiaryButtonsContainer = css(floatingContainer, {
|
||||
boxShadow: '$3',
|
||||
variants: {
|
||||
bp: {
|
||||
|
|
|
|||
|
|
@ -9,11 +9,11 @@ import {
|
|||
SquareIcon,
|
||||
TextIcon,
|
||||
} from '@radix-ui/react-icons'
|
||||
import styled from '~styles'
|
||||
import css from '~styles'
|
||||
import { Data, TLDrawShapeType } from '~types'
|
||||
import { useTLDrawContext } from '~hooks'
|
||||
import { StatusBar } from './status-bar'
|
||||
import { FloatingContainer } from '../shared'
|
||||
import { floatingContainer } from '../shared'
|
||||
import { PrimaryButton, SecondaryButton } from './styled'
|
||||
import { UndoRedo } from './undo-redo'
|
||||
import { Zoom } from './zoom'
|
||||
|
|
@ -57,10 +57,10 @@ export const ToolsPanel = React.memo((): JSX.Element => {
|
|||
}, [tlstate])
|
||||
|
||||
return (
|
||||
<ToolsPanelContainer>
|
||||
<LeftWrap size={{ '@initial': 'mobile', '@sm': 'small' }}>
|
||||
<div className={toolsPanelContainer()}>
|
||||
<div className={leftWrap({ size: { '@initial': 'mobile', '@sm': 'small' } })}>
|
||||
<Zoom />
|
||||
<FloatingContainer>
|
||||
<div className={floatingContainer()}>
|
||||
<SecondaryButton
|
||||
label={'Select'}
|
||||
kbd={'1'}
|
||||
|
|
@ -69,11 +69,11 @@ export const ToolsPanel = React.memo((): JSX.Element => {
|
|||
>
|
||||
<CursorArrowIcon />
|
||||
</SecondaryButton>
|
||||
</FloatingContainer>
|
||||
</LeftWrap>
|
||||
<CenterWrap>
|
||||
</div>
|
||||
</div>
|
||||
<div className={centerWrap()}>
|
||||
<BackToContent />
|
||||
<FloatingContainer>
|
||||
<div className={floatingContainer()}>
|
||||
<PrimaryButton
|
||||
kbd={'2'}
|
||||
label={TLDrawShapeType.Draw}
|
||||
|
|
@ -114,10 +114,10 @@ export const ToolsPanel = React.memo((): JSX.Element => {
|
|||
>
|
||||
<TextIcon />
|
||||
</PrimaryButton>
|
||||
</FloatingContainer>
|
||||
</CenterWrap>
|
||||
<RightWrap size={{ '@initial': 'mobile', '@sm': 'small' }}>
|
||||
<FloatingContainer>
|
||||
</div>
|
||||
</div>
|
||||
<div className={rightWrap({ size: { '@initial': 'mobile', '@sm': 'small' } })}>
|
||||
<div className={floatingContainer()}>
|
||||
<SecondaryButton
|
||||
kbd={'7'}
|
||||
label={'Lock Tool'}
|
||||
|
|
@ -126,19 +126,19 @@ export const ToolsPanel = React.memo((): JSX.Element => {
|
|||
>
|
||||
{isToolLocked ? <LockClosedIcon /> : <LockOpen1Icon />}
|
||||
</SecondaryButton>
|
||||
</FloatingContainer>
|
||||
</div>
|
||||
<UndoRedo />
|
||||
</RightWrap>
|
||||
</div>
|
||||
{isDebugMode && (
|
||||
<StatusWrap>
|
||||
<div className={statusWrap()}>
|
||||
<StatusBar />
|
||||
</StatusWrap>
|
||||
</div>
|
||||
)}
|
||||
</ToolsPanelContainer>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
|
||||
const ToolsPanelContainer = styled('div', {
|
||||
const toolsPanelContainer = css({
|
||||
position: 'absolute',
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
|
|
@ -160,7 +160,7 @@ const ToolsPanelContainer = styled('div', {
|
|||
},
|
||||
})
|
||||
|
||||
const CenterWrap = styled('div', {
|
||||
const centerWrap = css({
|
||||
gridRow: 1,
|
||||
gridColumn: 2,
|
||||
display: 'flex',
|
||||
|
|
@ -171,7 +171,7 @@ const CenterWrap = styled('div', {
|
|||
gap: 12,
|
||||
})
|
||||
|
||||
const LeftWrap = styled('div', {
|
||||
const leftWrap = css({
|
||||
gridRow: 1,
|
||||
gridColumn: 1,
|
||||
display: 'flex',
|
||||
|
|
@ -198,7 +198,7 @@ const LeftWrap = styled('div', {
|
|||
},
|
||||
})
|
||||
|
||||
const RightWrap = styled('div', {
|
||||
const rightWrap = css({
|
||||
gridRow: 1,
|
||||
gridColumn: 3,
|
||||
display: 'flex',
|
||||
|
|
@ -225,7 +225,7 @@ const RightWrap = styled('div', {
|
|||
},
|
||||
})
|
||||
|
||||
const StatusWrap = styled('div', {
|
||||
const statusWrap = css({
|
||||
gridRow: 2,
|
||||
gridColumn: '1 / span 3',
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import * as React from 'react'
|
||||
import { useTLDrawContext } from '~hooks'
|
||||
import { TertiaryButton, TertiaryButtonsContainer } from './styled'
|
||||
import { TertiaryButton, tertiaryButtonsContainer } from './styled'
|
||||
import { Undo, Redo, Trash } from '../icons'
|
||||
|
||||
export const UndoRedo = React.memo((): JSX.Element => {
|
||||
|
|
@ -15,7 +15,7 @@ export const UndoRedo = React.memo((): JSX.Element => {
|
|||
}, [tlstate])
|
||||
|
||||
return (
|
||||
<TertiaryButtonsContainer bp={{ '@initial': 'mobile', '@sm': 'small' }}>
|
||||
<div className={tertiaryButtonsContainer({ bp: { '@initial': 'mobile', '@sm': 'small' } })}>
|
||||
<TertiaryButton label="Undo" kbd="#Z" onClick={tlstate.undo}>
|
||||
<Undo />
|
||||
</TertiaryButton>
|
||||
|
|
@ -25,6 +25,6 @@ export const UndoRedo = React.memo((): JSX.Element => {
|
|||
<TertiaryButton label="Delete" kbd="⌫" onClick={handleDelete} onDoubleClick={handleClear}>
|
||||
<Trash />
|
||||
</TertiaryButton>
|
||||
</TertiaryButtonsContainer>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import * as React from 'react'
|
||||
import { ZoomInIcon, ZoomOutIcon } from '@radix-ui/react-icons'
|
||||
import { TertiaryButton, TertiaryButtonsContainer } from './styled'
|
||||
import { TertiaryButton, tertiaryButtonsContainer } from './styled'
|
||||
import { useTLDrawContext } from '~hooks'
|
||||
import type { Data } from '~types'
|
||||
|
||||
|
|
@ -8,7 +8,7 @@ export const Zoom = React.memo((): JSX.Element => {
|
|||
const { tlstate } = useTLDrawContext()
|
||||
|
||||
return (
|
||||
<TertiaryButtonsContainer bp={{ '@initial': 'mobile', '@sm': 'small' }}>
|
||||
<div className={tertiaryButtonsContainer({ bp: { '@initial': 'mobile', '@sm': 'small' } })}>
|
||||
<TertiaryButton label="Zoom Out" kbd={`#−`} onClick={tlstate.zoomOut}>
|
||||
<ZoomOutIcon />
|
||||
</TertiaryButton>
|
||||
|
|
@ -16,7 +16,7 @@ export const Zoom = React.memo((): JSX.Element => {
|
|||
<ZoomInIcon />
|
||||
</TertiaryButton>
|
||||
<ZoomCounter />
|
||||
</TertiaryButtonsContainer>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { HTMLContainer, TLBounds, Utils, ShapeUtil } from '@tldraw/core'
|
|||
import { Vec } from '@tldraw/vec'
|
||||
import { getShapeStyle, getFontStyle, defaultStyle } from '~shape/shape-styles'
|
||||
import { TextShape, TLDrawShapeType, TLDrawToolType, TLDrawMeta } from '~types'
|
||||
import styled from '~styles'
|
||||
import css from '~styles'
|
||||
import TextAreaUtils from './text-utils'
|
||||
|
||||
const LETTER_SPACING = -1.5
|
||||
|
|
@ -162,9 +162,9 @@ export const Text = new ShapeUtil<TextShape, HTMLDivElement, TLDrawMeta>(() => (
|
|||
|
||||
return (
|
||||
<HTMLContainer ref={ref} {...events}>
|
||||
<StyledWrapper isEditing={isEditing} onPointerDown={handlePointerDown}>
|
||||
<StyledTextArea
|
||||
id={shape.id + '_svg'}
|
||||
<div className={wrapper({ isEditing })} onPointerDown={handlePointerDown}>
|
||||
<textarea
|
||||
className={textArea({ isEditing, isBinding })}
|
||||
ref={rInput}
|
||||
style={{
|
||||
font,
|
||||
|
|
@ -185,14 +185,12 @@ export const Text = new ShapeUtil<TextShape, HTMLDivElement, TLDrawMeta>(() => (
|
|||
onKeyDown={handleKeyDown}
|
||||
onPointerDown={handlePointerDown}
|
||||
autoFocus={isEditing}
|
||||
isEditing={isEditing}
|
||||
isBinding={isBinding}
|
||||
readOnly={!isEditing}
|
||||
wrap="off"
|
||||
dir="auto"
|
||||
datatype="wysiwyg"
|
||||
/>
|
||||
</StyledWrapper>
|
||||
</div>
|
||||
</HTMLContainer>
|
||||
)
|
||||
},
|
||||
|
|
@ -298,7 +296,7 @@ export const Text = new ShapeUtil<TextShape, HTMLDivElement, TLDrawMeta>(() => (
|
|||
/* Helpers */
|
||||
/* -------------------------------------------------- */
|
||||
|
||||
const StyledWrapper = styled('div', {
|
||||
const wrapper = css({
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
variants: {
|
||||
|
|
@ -313,7 +311,7 @@ const StyledWrapper = styled('div', {
|
|||
},
|
||||
})
|
||||
|
||||
const StyledTextArea = styled('textarea', {
|
||||
const textArea = css({
|
||||
position: 'absolute',
|
||||
top: 'var(--tl-padding)',
|
||||
left: 'var(--tl-padding)',
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import styled from './stitches.config'
|
||||
import css from './stitches.config'
|
||||
|
||||
export * from './stitches.config'
|
||||
|
||||
export default styled
|
||||
export default css
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { createStitches, defaultThemeMap } from '@stitches/react'
|
||||
import { createStitches, defaultThemeMap } from '@stitches/core'
|
||||
|
||||
const { styled, css, createTheme, getCssText } = createStitches({
|
||||
const { css, createTheme, getCssText } = createStitches({
|
||||
themeMap: {
|
||||
...defaultThemeMap,
|
||||
},
|
||||
|
|
@ -134,6 +134,6 @@ const dark = createTheme({
|
|||
},
|
||||
})
|
||||
|
||||
export default styled
|
||||
export default css
|
||||
|
||||
export { css, getCssText, dark }
|
||||
export { getCssText, dark }
|
||||
|
|
|
|||
|
|
@ -42,12 +42,10 @@
|
|||
"esbuild": "^0.12.24",
|
||||
"eslint": "^7.32.0",
|
||||
"lerna": "^4.0.0",
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"ts-node": "^10.2.1",
|
||||
"tslib": "^2.3.1",
|
||||
"typedoc": "^0.22.3",
|
||||
"typescript": "^4.4.2"
|
||||
},
|
||||
"gitHead": "5cb031ddc264846ec6732d7179511cddea8ef034"
|
||||
}
|
||||
}
|
||||
|
|
@ -34,4 +34,4 @@
|
|||
"typescript": "^4.4.2"
|
||||
},
|
||||
"gitHead": "838fabdbff1a66d4d7ee8aa5c5d117bc55acbff2"
|
||||
}
|
||||
}
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
import styled from 'styles'
|
||||
import css from 'styles'
|
||||
import { getSession, signin, signout, useSession } from 'next-auth/client'
|
||||
import { GetServerSideProps } from 'next'
|
||||
import Link from 'next/link'
|
||||
|
|
@ -13,11 +13,13 @@ export default function Sponsorware(): JSX.Element {
|
|||
<Head>
|
||||
<title>tldraw</title>
|
||||
</Head>
|
||||
<OuterContent>
|
||||
<Content
|
||||
size={{
|
||||
'@sm': 'small',
|
||||
}}
|
||||
<div className={outerContent()}>
|
||||
<div
|
||||
className={content({
|
||||
size: {
|
||||
'@sm': 'small',
|
||||
},
|
||||
})}
|
||||
>
|
||||
<h1>tldraw (is sponsorware)</h1>
|
||||
<p>
|
||||
|
|
@ -50,13 +52,13 @@ export default function Sponsorware(): JSX.Element {
|
|||
</a>{' '}
|
||||
(at any level) and sign in below.
|
||||
</p>
|
||||
<ButtonGroup>
|
||||
<div className={buttonGroup()}>
|
||||
{session ? (
|
||||
<>
|
||||
<Button onClick={() => signout()} variant={'secondary'}>
|
||||
<button className={button({ variant: 'secondary' })} onClick={() => signout()}>
|
||||
Sign Out
|
||||
</Button>
|
||||
<Detail>
|
||||
</button>
|
||||
<p className={detail()}>
|
||||
Signed in as {session?.user?.name} ({session?.user?.email}), but it looks like
|
||||
you're not yet a sponsor.
|
||||
<br />
|
||||
|
|
@ -69,19 +71,19 @@ export default function Sponsorware(): JSX.Element {
|
|||
Twitter
|
||||
</a>
|
||||
.
|
||||
</Detail>
|
||||
</p>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Button onClick={() => signin('github')} variant={'primary'}>
|
||||
<button className={button({ variant: 'primary' })} onClick={() => signin('github')}>
|
||||
{loading ? 'Loading...' : 'Sign in With Github'}
|
||||
</Button>
|
||||
<Detail>Already a sponsor? Just sign in to visit the app.</Detail>
|
||||
</button>
|
||||
<p className={detail()}>Already a sponsor? Just sign in to visit the app.</p>
|
||||
</>
|
||||
)}
|
||||
</ButtonGroup>
|
||||
</Content>
|
||||
</OuterContent>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -96,7 +98,7 @@ export const getServerSideProps: GetServerSideProps = async (context) => {
|
|||
}
|
||||
}
|
||||
|
||||
const OuterContent = styled('div', {
|
||||
const outerContent = css({
|
||||
backgroundColor: '$canvas',
|
||||
padding: '8px 8px 64px 8px',
|
||||
margin: '0 auto',
|
||||
|
|
@ -113,7 +115,7 @@ const OuterContent = styled('div', {
|
|||
height: '100%',
|
||||
})
|
||||
|
||||
const Content = styled('div', {
|
||||
const content = css({
|
||||
width: '720px',
|
||||
padding: '8px 16px',
|
||||
maxWidth: '100%',
|
||||
|
|
@ -161,18 +163,18 @@ const Content = styled('div', {
|
|||
},
|
||||
})
|
||||
|
||||
const ButtonGroup = styled('div', {
|
||||
const buttonGroup = css({
|
||||
display: 'grid',
|
||||
gap: '16px',
|
||||
margin: '40px 0 32px 0',
|
||||
})
|
||||
|
||||
const Detail = styled('p', {
|
||||
const detail = css({
|
||||
fontSize: '$2',
|
||||
textAlign: 'center',
|
||||
})
|
||||
|
||||
const Button = styled('button', {
|
||||
const button = css({
|
||||
cursor: 'pointer',
|
||||
width: '100%',
|
||||
padding: '12px 0',
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import styled, { css, getCssText, globalStyles, light, dark } from './stitches.config'
|
||||
import css, { getCssText, globalStyles, light, dark } from './stitches.config'
|
||||
|
||||
export default styled
|
||||
export { css, getCssText, globalStyles, light, dark }
|
||||
export default css
|
||||
export { getCssText, globalStyles, light, dark }
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { createStitches, defaultThemeMap } from '@stitches/react'
|
||||
import { createStitches, defaultThemeMap } from '@stitches/core'
|
||||
|
||||
const { styled, css, globalCss, createTheme, getCssText } = createStitches({
|
||||
const { css, globalCss, createTheme, getCssText } = createStitches({
|
||||
themeMap: {
|
||||
...defaultThemeMap,
|
||||
},
|
||||
|
|
@ -140,6 +140,6 @@ const globalStyles = globalCss({
|
|||
'*': { boxSizing: 'border-box' },
|
||||
})
|
||||
|
||||
export default styled
|
||||
export default css
|
||||
|
||||
export { css, getCssText, globalStyles, light, dark }
|
||||
export { getCssText, globalStyles, light, dark }
|
||||
|
|
|
|||
21325
tsconfig.tsbuildinfo
21325
tsconfig.tsbuildinfo
Plik diff jest za duży
Load Diff
317
yarn.lock
317
yarn.lock
|
|
@ -164,18 +164,18 @@
|
|||
"@babel/types" "^7.15.4"
|
||||
|
||||
"@babel/helper-module-transforms@^7.14.5", "@babel/helper-module-transforms@^7.15.4":
|
||||
version "7.15.4"
|
||||
resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.15.4.tgz#962cc629a7f7f9a082dd62d0307fa75fe8788d7c"
|
||||
integrity sha512-9fHHSGE9zTC++KuXLZcB5FKgvlV83Ox+NLUmQTawovwlJ85+QMhk1CnVk406CQVj97LaWod6KVjl2Sfgw9Aktw==
|
||||
version "7.15.7"
|
||||
resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.15.7.tgz#7da80c8cbc1f02655d83f8b79d25866afe50d226"
|
||||
integrity sha512-ZNqjjQG/AuFfekFTY+7nY4RgBSklgTu970c7Rj3m/JOhIu5KPBUuTA9AY6zaKcUvk4g6EbDXdBnhi35FAssdSw==
|
||||
dependencies:
|
||||
"@babel/helper-module-imports" "^7.15.4"
|
||||
"@babel/helper-replace-supers" "^7.15.4"
|
||||
"@babel/helper-simple-access" "^7.15.4"
|
||||
"@babel/helper-split-export-declaration" "^7.15.4"
|
||||
"@babel/helper-validator-identifier" "^7.14.9"
|
||||
"@babel/helper-validator-identifier" "^7.15.7"
|
||||
"@babel/template" "^7.15.4"
|
||||
"@babel/traverse" "^7.15.4"
|
||||
"@babel/types" "^7.15.4"
|
||||
"@babel/types" "^7.15.6"
|
||||
|
||||
"@babel/helper-optimise-call-expression@^7.15.4":
|
||||
version "7.15.4"
|
||||
|
|
@ -229,10 +229,10 @@
|
|||
dependencies:
|
||||
"@babel/types" "^7.15.4"
|
||||
|
||||
"@babel/helper-validator-identifier@^7.14.5", "@babel/helper-validator-identifier@^7.14.9":
|
||||
version "7.14.9"
|
||||
resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.14.9.tgz#6654d171b2024f6d8ee151bf2509699919131d48"
|
||||
integrity sha512-pQYxPY0UP6IHISRitNe8bsijHex4TWZXi2HwKVsjPiltzlhse2znVcm9Ace510VT1kxIHjGJCZZQBX2gJDbo0g==
|
||||
"@babel/helper-validator-identifier@^7.14.5", "@babel/helper-validator-identifier@^7.14.9", "@babel/helper-validator-identifier@^7.15.7":
|
||||
version "7.15.7"
|
||||
resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.15.7.tgz#220df993bfe904a4a6b02ab4f3385a5ebf6e2389"
|
||||
integrity sha512-K4JvCtQqad9OY2+yTU8w+E82ywk/fe+ELNlt1G8z3bVGlZfn/hOcQQsUhGhW/N+tb3fxK800wLtKOE/aM0m72w==
|
||||
|
||||
"@babel/helper-validator-option@^7.14.5":
|
||||
version "7.14.5"
|
||||
|
|
@ -268,9 +268,9 @@
|
|||
js-tokens "^4.0.0"
|
||||
|
||||
"@babel/parser@^7.1.0", "@babel/parser@^7.15.4", "@babel/parser@^7.15.5", "@babel/parser@^7.7.2":
|
||||
version "7.15.6"
|
||||
resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.15.6.tgz#043b9aa3c303c0722e5377fef9197f4cf1796549"
|
||||
integrity sha512-S/TSCcsRuCkmpUuoWijua0Snt+f3ewU/8spLo+4AXJCZfT0bVCzLD5MuOKdrx0mlAptbKzn5AdgEIIKXxXkz9Q==
|
||||
version "7.15.7"
|
||||
resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.15.7.tgz#0c3ed4a2eb07b165dfa85b3cc45c727334c4edae"
|
||||
integrity sha512-rycZXvQ+xS9QyIcJ9HXeDWf1uxqlbVFAUq0Rq0dbc50Zb/+wUe/ehyfzGfm9KZZF0kBejYgxltBXocP+gKdL2g==
|
||||
|
||||
"@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining@^7.15.4":
|
||||
version "7.15.4"
|
||||
|
|
@ -2884,9 +2884,9 @@
|
|||
read-package-json-fast "^2.0.1"
|
||||
|
||||
"@octokit/auth-token@^2.4.0", "@octokit/auth-token@^2.4.4":
|
||||
version "2.4.5"
|
||||
resolved "https://registry.yarnpkg.com/@octokit/auth-token/-/auth-token-2.4.5.tgz#568ccfb8cb46f36441fac094ce34f7a875b197f3"
|
||||
integrity sha512-BpGYsPgJt05M7/L/5FoE1PiAbdxXFZkX/3kDYcsvd1v6UhlnE5e96dTDr0ezX/EFwciQxf3cNV0loipsURU+WA==
|
||||
version "2.5.0"
|
||||
resolved "https://registry.yarnpkg.com/@octokit/auth-token/-/auth-token-2.5.0.tgz#27c37ea26c205f28443402477ffd261311f21e36"
|
||||
integrity sha512-r5FVUJCOLl19AxiuZD2VRZ/ORjp/4IN98Of6YJoJOkY75CIBuYfmiNHGrDwXr+aLGG55igl9QrxX3hbiXlLb+g==
|
||||
dependencies:
|
||||
"@octokit/types" "^6.0.3"
|
||||
|
||||
|
|
@ -2921,10 +2921,10 @@
|
|||
"@octokit/types" "^6.0.3"
|
||||
universal-user-agent "^6.0.0"
|
||||
|
||||
"@octokit/openapi-types@^10.1.5":
|
||||
version "10.1.5"
|
||||
resolved "https://registry.yarnpkg.com/@octokit/openapi-types/-/openapi-types-10.1.5.tgz#deafbec805896ae963d7d3846e70b18003cafda1"
|
||||
integrity sha512-OoShNYzhAU8p8JbGHe1rRs1GIErRtmN2230AQCJAjL5lc0AUU5OhppVe6693HIZ2eCBLUhoLPhnnnmQ5ASH7Wg==
|
||||
"@octokit/openapi-types@^10.2.2":
|
||||
version "10.2.2"
|
||||
resolved "https://registry.yarnpkg.com/@octokit/openapi-types/-/openapi-types-10.2.2.tgz#6c1c839d7d169feabaf1d2a69c79439c75d979cd"
|
||||
integrity sha512-EVcXQ+ZrC04cg17AMg1ofocWMxHDn17cB66ZHgYc0eUwjFtxS0oBzkyw2VqIrHBwVgtfoYrq1WMQfQmMjUwthw==
|
||||
|
||||
"@octokit/plugin-enterprise-rest@^6.0.1":
|
||||
version "6.0.1"
|
||||
|
|
@ -2939,11 +2939,11 @@
|
|||
"@octokit/types" "^2.0.1"
|
||||
|
||||
"@octokit/plugin-paginate-rest@^2.16.0":
|
||||
version "2.16.2"
|
||||
resolved "https://registry.yarnpkg.com/@octokit/plugin-paginate-rest/-/plugin-paginate-rest-2.16.2.tgz#9ca5bebbaf3e6672b345502f89ae4ef3be6c2ddd"
|
||||
integrity sha512-WF5/MTPnFgYH6rMGuxBvbxX2S/3ygNWylakgD7njKES0Qwk5e+d/L6r/BYXSw7B6xJJ3hlwIAmUmOxxYrR+Q8A==
|
||||
version "2.16.3"
|
||||
resolved "https://registry.yarnpkg.com/@octokit/plugin-paginate-rest/-/plugin-paginate-rest-2.16.3.tgz#6dbf74a12a53e04da6ca731d4c93f20c0b5c6fe9"
|
||||
integrity sha512-kdc65UEsqze/9fCISq6BxLzeB9qf0vKvKojIfzgwf4tEF+Wy6c9dXnPFE6vgpoDFB1Z5Jek5WFVU6vL1w22+Iw==
|
||||
dependencies:
|
||||
"@octokit/types" "^6.27.2"
|
||||
"@octokit/types" "^6.28.1"
|
||||
|
||||
"@octokit/plugin-request-log@^1.0.0", "@octokit/plugin-request-log@^1.0.4":
|
||||
version "1.0.4"
|
||||
|
|
@ -2959,11 +2959,11 @@
|
|||
deprecation "^2.3.1"
|
||||
|
||||
"@octokit/plugin-rest-endpoint-methods@^5.9.0":
|
||||
version "5.10.3"
|
||||
resolved "https://registry.yarnpkg.com/@octokit/plugin-rest-endpoint-methods/-/plugin-rest-endpoint-methods-5.10.3.tgz#9207e8e893d980d7828d85950bbb460b187146f2"
|
||||
integrity sha512-eAT4gje+VR9xdSlhuHWNXsNLpiODqdqz8jqShMgaxRH82Le2nS6EV6LAo3QPZ05Fso5oGmDfJF6eq9vs1cEhdA==
|
||||
version "5.10.4"
|
||||
resolved "https://registry.yarnpkg.com/@octokit/plugin-rest-endpoint-methods/-/plugin-rest-endpoint-methods-5.10.4.tgz#97e85eb7375e30b9bf193894670f9da205e79408"
|
||||
integrity sha512-Dh+EAMCYR9RUHwQChH94Skl0lM8Fh99auT8ggck/xTzjJrwVzvsd0YH68oRPqp/HxICzmUjLfaQ9sy1o1sfIiA==
|
||||
dependencies:
|
||||
"@octokit/types" "^6.27.2"
|
||||
"@octokit/types" "^6.28.1"
|
||||
deprecation "^2.3.1"
|
||||
|
||||
"@octokit/request-error@^1.0.2":
|
||||
|
|
@ -3035,12 +3035,12 @@
|
|||
dependencies:
|
||||
"@types/node" ">= 8"
|
||||
|
||||
"@octokit/types@^6.0.3", "@octokit/types@^6.16.1", "@octokit/types@^6.27.2":
|
||||
version "6.27.2"
|
||||
resolved "https://registry.yarnpkg.com/@octokit/types/-/types-6.27.2.tgz#b6f88d002aa06104f46ccaec0aaa8a5de1bf262c"
|
||||
integrity sha512-AgajmAJh7LhStgaEaNoY1N7znst2q07CKZVdnVB/V4tmitMbk+qijmD0IkkSKulXE5RVLbJjQikJF9+XLqhsVA==
|
||||
"@octokit/types@^6.0.3", "@octokit/types@^6.16.1", "@octokit/types@^6.28.1":
|
||||
version "6.28.1"
|
||||
resolved "https://registry.yarnpkg.com/@octokit/types/-/types-6.28.1.tgz#ab990d1fe952226055e81c7650480e6bacfb877c"
|
||||
integrity sha512-XlxDoQLFO5JnFZgKVQTYTvXRsQFfr/GwDUU108NJ9R5yFPkA2qXhTJjYuul3vE4eLXP40FA2nysOu2zd6boE+w==
|
||||
dependencies:
|
||||
"@octokit/openapi-types" "^10.1.5"
|
||||
"@octokit/openapi-types" "^10.2.2"
|
||||
|
||||
"@panva/asn1.js@^1.0.0":
|
||||
version "1.0.0"
|
||||
|
|
@ -3576,10 +3576,15 @@
|
|||
resolved "https://registry.yarnpkg.com/@sqltools/formatter/-/formatter-1.2.3.tgz#1185726610acc37317ddab11c3c7f9066966bd20"
|
||||
integrity sha512-O3uyB/JbkAEMZaP3YqyHH7TMnex7tWyCbCI4EfJdOCoN6HIhqdJBWTM6aCCiWQ/5f5wxjgU735QAIpJbjDvmzg==
|
||||
|
||||
"@stitches/core@^1.2.0":
|
||||
version "1.2.0"
|
||||
resolved "https://registry.yarnpkg.com/@stitches/core/-/core-1.2.0.tgz#5d507e1d27af1363265dbfdfd419d8e11262efce"
|
||||
integrity sha512-UjZHg9aWpqnRGtyewmNFEwtceRAiK7O1CjAGTBtN9bbw2N02SRZFYCTLUMxpFZi4J7juBQJKxbc7yvi+Y4Qg2g==
|
||||
|
||||
"@stitches/react@^1.0.0":
|
||||
version "1.1.0"
|
||||
resolved "https://registry.yarnpkg.com/@stitches/react/-/react-1.1.0.tgz#49342e085528d689b983682e112b79c5a0b0efb4"
|
||||
integrity sha512-g1XZsmB3tFL5i9aaBx0+P4C83j3vf/PEmLc5e9PlumE5c6q3zsdbbOVr4ZC52eGm4MCvM+2bbAJ++rtTUa6ahw==
|
||||
version "1.2.0"
|
||||
resolved "https://registry.yarnpkg.com/@stitches/react/-/react-1.2.0.tgz#cdb69256d76bcb4753417d59bc42da21fd603ba1"
|
||||
integrity sha512-GuMh610X3oJB2pdywARg1jccjAEvrDbq4iwy1SernR/4o1FX5SOTJZIjC4CquagZQjL00KFV8Cwfq/12FS6aBg==
|
||||
|
||||
"@surma/rollup-plugin-off-main-thread@^1.4.1":
|
||||
version "1.4.2"
|
||||
|
|
@ -3762,14 +3767,14 @@
|
|||
integrity sha512-jhuKLIRrhvCPLqwPcx6INqmKeiA5EWrsCOPhrlFSrbrmU4ZMPjj5Ul/oLCMDO98XRUIwVm78xICz4EPCektzeQ==
|
||||
|
||||
"@types/node@*", "@types/node@>= 8", "@types/node@^16.7.10":
|
||||
version "16.9.1"
|
||||
resolved "https://registry.yarnpkg.com/@types/node/-/node-16.9.1.tgz#0611b37db4246c937feef529ddcc018cf8e35708"
|
||||
integrity sha512-QpLcX9ZSsq3YYUUnD3nFDY8H7wctAhQj/TFKL8Ya8v5fMm3CFXxo8zStsLAl780ltoYoo1WvKUVGBQK+1ifr7g==
|
||||
version "16.9.4"
|
||||
resolved "https://registry.yarnpkg.com/@types/node/-/node-16.9.4.tgz#a12f0ee7847cf17a97f6fdf1093cb7a9af23cca4"
|
||||
integrity sha512-KDazLNYAGIuJugdbULwFZULF9qQ13yNWEBFnfVpqlpgAAo6H/qnM9RjBgh0A0kmHf3XxAKLdN5mTIng9iUvVLA==
|
||||
|
||||
"@types/node@^14.14.35":
|
||||
version "14.17.15"
|
||||
resolved "https://registry.yarnpkg.com/@types/node/-/node-14.17.15.tgz#d5ebfb62a69074ebb85cbe0529ad917bb8f2bae8"
|
||||
integrity sha512-D1sdW0EcSCmNdLKBGMYb38YsHUS6JcM7yQ6sLQ9KuZ35ck7LYCKE7kYFHOO59ayFOY3zobWVZxf4KXhYHcHYFA==
|
||||
version "14.17.17"
|
||||
resolved "https://registry.yarnpkg.com/@types/node/-/node-14.17.17.tgz#4ec7b71bbcb01a4e55455b60b18b1b6a783fe31d"
|
||||
integrity sha512-niAjcewgEYvSPCZm3OaM9y6YQrL2SEPH9PymtE6fuZAvFiP6ereCcvApGl2jKTq7copTIguX3PBvfP08LN4LvQ==
|
||||
|
||||
"@types/node@^15.0.1":
|
||||
version "15.14.9"
|
||||
|
|
@ -3796,7 +3801,14 @@
|
|||
resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.4.tgz#fcf7205c25dff795ee79af1e30da2c9790808f11"
|
||||
integrity sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ==
|
||||
|
||||
"@types/react-dom@^17.0.2", "@types/react-dom@^17.0.9":
|
||||
"@types/react-dom@^16.9.9":
|
||||
version "16.9.14"
|
||||
resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-16.9.14.tgz#674b8f116645fe5266b40b525777fc6bb8eb3bcd"
|
||||
integrity sha512-FIX2AVmPTGP30OUJ+0vadeIFJJ07Mh1m+U0rxfgyW34p3rTlXI+nlenvAxNn4BP36YyI9IJ/+UJ7Wu22N1pI7A==
|
||||
dependencies:
|
||||
"@types/react" "^16"
|
||||
|
||||
"@types/react-dom@^17.0.9":
|
||||
version "17.0.9"
|
||||
resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-17.0.9.tgz#441a981da9d7be117042e1a6fd3dac4b30f55add"
|
||||
integrity sha512-wIvGxLfgpVDSAMH5utdL9Ngm5Owu0VsGmldro3ORLXV8CShrL8awVj06NuEXFQ5xyaYfdca7Sgbk/50Ri1GdPg==
|
||||
|
|
@ -3804,9 +3816,9 @@
|
|||
"@types/react" "*"
|
||||
|
||||
"@types/react-router-dom@^5.1.8":
|
||||
version "5.1.8"
|
||||
resolved "https://registry.yarnpkg.com/@types/react-router-dom/-/react-router-dom-5.1.8.tgz#bf3e1c8149b3d62eaa206d58599de82df0241192"
|
||||
integrity sha512-03xHyncBzG0PmDmf8pf3rehtjY0NpUj7TIN46FrT5n1ZWHPZvXz32gUyNboJ+xsL8cpg8bQVLcllptcQHvocrw==
|
||||
version "5.1.9"
|
||||
resolved "https://registry.yarnpkg.com/@types/react-router-dom/-/react-router-dom-5.1.9.tgz#e8a8f687351ecc8c68bb4161d7e4b9df4994416e"
|
||||
integrity sha512-Go0vxZSigXTyXx8xPkGiBrrc3YbBs82KE14WENMLS6TSUKcRFSmYVbL19zFOnNFqJhqrPqEs2h5eUpJhSRrwZw==
|
||||
dependencies:
|
||||
"@types/history" "*"
|
||||
"@types/react" "*"
|
||||
|
|
@ -3820,10 +3832,19 @@
|
|||
"@types/history" "*"
|
||||
"@types/react" "*"
|
||||
|
||||
"@types/react@*", "@types/react@^17.0.16", "@types/react@^17.0.19", "@types/react@^17.0.3":
|
||||
version "17.0.20"
|
||||
resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.20.tgz#a4284b184d47975c71658cd69e759b6bd37c3b8c"
|
||||
integrity sha512-wWZrPlihslrPpcKyCSlmIlruakxr57/buQN1RjlIeaaTWDLtJkTtRW429MoQJergvVKc4IWBpRhWw7YNh/7GVA==
|
||||
"@types/react@*", "@types/react@^17.0.19":
|
||||
version "17.0.21"
|
||||
resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.21.tgz#069c43177cd419afaab5ce26bb4e9056549f7ea6"
|
||||
integrity sha512-GzzXCpOthOjXvrAUFQwU/svyxu658cwu00Q9ugujS4qc1zXgLFaO0kS2SLOaMWLt2Jik781yuHCWB7UcYdGAeQ==
|
||||
dependencies:
|
||||
"@types/prop-types" "*"
|
||||
"@types/scheduler" "*"
|
||||
csstype "^3.0.2"
|
||||
|
||||
"@types/react@^16", "@types/react@^16.9.55":
|
||||
version "16.14.15"
|
||||
resolved "https://registry.yarnpkg.com/@types/react/-/react-16.14.15.tgz#95d8fa3148050e94bcdc5751447921adbe19f9e6"
|
||||
integrity sha512-jOxlBV9RGZhphdeqJTCv35VZOkjY+XIEY2owwSk84BNDdDv2xS6Csj6fhi+B/q30SR9Tz8lDNt/F2Z5RF3TrRg==
|
||||
dependencies:
|
||||
"@types/prop-types" "*"
|
||||
"@types/scheduler" "*"
|
||||
|
|
@ -3982,17 +4003,17 @@
|
|||
"@typescript-eslint/types" "4.31.1"
|
||||
eslint-visitor-keys "^2.0.0"
|
||||
|
||||
"@use-gesture/core@^10.0.0-beta.25":
|
||||
version "10.0.0-beta.25"
|
||||
resolved "https://registry.yarnpkg.com/@use-gesture/core/-/core-10.0.0-beta.25.tgz#4e652cb5ef679bd04a213ef0952d9e95a48960ef"
|
||||
integrity sha512-of0lh9pMjsps6Xxn9CqLd8dJynpWvqvHMmhcY8HelLopEDAKusCSM2ACrx+gR83hBKjYrmJBXuwfMLUebZFCrA==
|
||||
"@use-gesture/core@^10.0.0-beta.26":
|
||||
version "10.0.0-beta.26"
|
||||
resolved "https://registry.yarnpkg.com/@use-gesture/core/-/core-10.0.0-beta.26.tgz#275a69ed65c6463cb59872a6f0b24b66212e8bf5"
|
||||
integrity sha512-Y+fwWlYHzGlc/c4aE3fUkQy7cE4+Tbd1CWQqAlO4czN2nGpgZksW7V98FMgCHrmMGXi+VdNSTS8WBHmw8kq3Zg==
|
||||
|
||||
"@use-gesture/react@^10.0.0-beta.24":
|
||||
version "10.0.0-beta.25"
|
||||
resolved "https://registry.yarnpkg.com/@use-gesture/react/-/react-10.0.0-beta.25.tgz#f3034aa4fb539fefec7b44468265238b92a89594"
|
||||
integrity sha512-bXwlYRP503Tl6iK+WxVH9Tm/S5C7lBSdKWgahEKcV6N0NKqCVkkMqz1Nrbmd51Hrexa4JGpoxNvZ7tzrVDfedw==
|
||||
version "10.0.0-beta.26"
|
||||
resolved "https://registry.yarnpkg.com/@use-gesture/react/-/react-10.0.0-beta.26.tgz#9b5c3a9111d6cda62de125612fb830efcc1df571"
|
||||
integrity sha512-TENwg1CgB+okRTBWvcMtEaKYgQvktU0ezG4sQdo/mqZXNvTzuk9g/qK4v++8UzIhj/srqRp49NPBbY0qzsgg1w==
|
||||
dependencies:
|
||||
"@use-gesture/core" "^10.0.0-beta.25"
|
||||
"@use-gesture/core" "^10.0.0-beta.26"
|
||||
|
||||
"@zkochan/cmd-shim@^3.1.0":
|
||||
version "3.1.0"
|
||||
|
|
@ -4167,9 +4188,9 @@ ansi-regex@^4.1.0:
|
|||
integrity sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg==
|
||||
|
||||
ansi-regex@^5.0.0:
|
||||
version "5.0.0"
|
||||
resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-5.0.0.tgz#388539f55179bf39339c81af30a654d69f87cb75"
|
||||
integrity sha512-bY6fj56OUQ0hU1KjFNDQuJFezqKdrAyFdIevADiqrWHwSlbmBNMHp5ak2f40Pm8JTFyM2mqxkG6ngkHO11f/lg==
|
||||
version "5.0.1"
|
||||
resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-5.0.1.tgz#082cb2c89c9fe8659a311a53bd6a4dc5301db304"
|
||||
integrity sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==
|
||||
|
||||
ansi-styles@^2.2.1:
|
||||
version "2.2.1"
|
||||
|
|
@ -4298,7 +4319,7 @@ array-ify@^1.0.0:
|
|||
resolved "https://registry.yarnpkg.com/array-ify/-/array-ify-1.0.0.tgz#9e528762b4a9066ad163a6962a364418e9626ece"
|
||||
integrity sha1-nlKHYrSpBmrRY6aWKjZEGOlibs4=
|
||||
|
||||
array-includes@^3.1.1, array-includes@^3.1.2, array-includes@^3.1.3:
|
||||
array-includes@^3.1.1, array-includes@^3.1.3:
|
||||
version "3.1.3"
|
||||
resolved "https://registry.yarnpkg.com/array-includes/-/array-includes-3.1.3.tgz#c7f619b382ad2afaf5326cddfdc0afc61af7690a"
|
||||
integrity sha512-gcem1KlBU7c9rB+Rq8/3PPKsK2kjqeEBa3bD5kkQo4nYlOHQCJqIJFqBXDEfwaRuYTT4E+FxA9xez7Gf/e3Q7A==
|
||||
|
|
@ -4999,9 +5020,9 @@ camelcase@^6.2.0:
|
|||
integrity sha512-c7wVvbw3f37nuobQNtgsgG9POC9qMbNuMQmTCqZv23b6MIz0fcYpBiOlv9gEN/hdLdnZTDQhg6e9Dq5M1vKvfg==
|
||||
|
||||
caniuse-lite@^1.0.30001202, caniuse-lite@^1.0.30001219, caniuse-lite@^1.0.30001228, caniuse-lite@^1.0.30001254:
|
||||
version "1.0.30001257"
|
||||
resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001257.tgz#150aaf649a48bee531104cfeda57f92ce587f6e5"
|
||||
integrity sha512-JN49KplOgHSXpIsVSF+LUyhD8PUp6xPpAXeRrrcBh4KBeP7W864jHn6RvzJgDlrReyeVjMFJL3PLpPvKIxlIHA==
|
||||
version "1.0.30001258"
|
||||
resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001258.tgz#b604eed80cc54a578e4bf5a02ae3ed49f869d252"
|
||||
integrity sha512-RBByOG6xWXUp0CR2/WU2amXz3stjKpSl5J1xU49F1n2OxD//uBZO4wCKUiG+QMGf7CHGfDDcqoKriomoGVxTeA==
|
||||
|
||||
caseless@~0.12.0:
|
||||
version "0.12.0"
|
||||
|
|
@ -5539,17 +5560,17 @@ copy-descriptor@^0.1.0:
|
|||
integrity sha1-Z29us8OZl8LuGsOpJP1hJHSPV40=
|
||||
|
||||
core-js-compat@^3.14.0, core-js-compat@^3.16.0:
|
||||
version "3.17.3"
|
||||
resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.17.3.tgz#b39c8e4dec71ecdc735c653ce5233466e561324e"
|
||||
integrity sha512-+in61CKYs4hQERiADCJsdgewpdl/X0GhEX77pjKgbeibXviIt2oxEjTc8O2fqHX8mDdBrDvX8MYD/RYsBv4OiA==
|
||||
version "3.18.0"
|
||||
resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.18.0.tgz#fb360652201e8ac8da812718c008cd0482ed9b42"
|
||||
integrity sha512-tRVjOJu4PxdXjRMEgbP7lqWy1TWJu9a01oBkn8d+dNrhgmBwdTkzhHZpVJnEmhISLdoJI1lX08rcBcHi3TZIWg==
|
||||
dependencies:
|
||||
browserslist "^4.17.0"
|
||||
semver "7.0.0"
|
||||
|
||||
core-js-pure@^3.16.0:
|
||||
version "3.17.3"
|
||||
resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.17.3.tgz#98ea3587188ab7ef4695db6518eeb71aec42604a"
|
||||
integrity sha512-YusrqwiOTTn8058JDa0cv9unbXdIiIgcgI9gXso0ey4WgkFLd3lYlV9rp9n7nDCsYxXsMDTjA4m1h3T348mdlQ==
|
||||
version "3.18.0"
|
||||
resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.18.0.tgz#e5187347bae66448c9e2d67c01c34c4df3261dc5"
|
||||
integrity sha512-ZnK+9vyuMhKulIGqT/7RHGRok8RtkHMEX/BGPHkHx+ouDkq+MUvf9mfIgdqhpmPDu8+V5UtRn/CbCRc9I4lX4w==
|
||||
|
||||
core-js@^2.5.3:
|
||||
version "2.6.12"
|
||||
|
|
@ -5771,9 +5792,9 @@ data-urls@^2.0.0:
|
|||
whatwg-url "^8.0.0"
|
||||
|
||||
date-fns@^2.16.1:
|
||||
version "2.23.0"
|
||||
resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.23.0.tgz#4e886c941659af0cf7b30fafdd1eaa37e88788a9"
|
||||
integrity sha512-5ycpauovVyAk0kXNZz6ZoB9AYMZB4DObse7P3BPWmyEjXNORTI8EJ6X0uaSAq4sCHzM1uajzrkr6HnsLQpxGXA==
|
||||
version "2.24.0"
|
||||
resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.24.0.tgz#7d86dc0d93c87b76b63d213b4413337cfd1c105d"
|
||||
integrity sha512-6ujwvwgPID6zbI0o7UbURi2vlLDR9uP26+tW6Lg+Ji3w7dd0i3DOcjcClLjLPranT60SSEFBwdSyYwn/ZkPIuw==
|
||||
|
||||
dateformat@^3.0.0:
|
||||
version "3.0.3"
|
||||
|
|
@ -6094,9 +6115,9 @@ ejs@^2.6.1:
|
|||
integrity sha512-7vmuyh5+kuUyJKePhQfRQBhXV5Ce+RnaeeQArKu1EAMpL3WbgMt5WG6uQZpEVvYSSsxMXRKOewtDk9RaTKXRlA==
|
||||
|
||||
electron-to-chromium@^1.3.723, electron-to-chromium@^1.3.830:
|
||||
version "1.3.838"
|
||||
resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.838.tgz#d178b34a268c750c0444ba69e4c94d4c4fb3aa0d"
|
||||
integrity sha512-65O6UJiyohFAdX/nc6KJ0xG/4zOn7XCO03kQNNbCeMRGxlWTLzc6Uyi0tFNQuuGWqySZJi8CD2KXPXySVYmzMA==
|
||||
version "1.3.843"
|
||||
resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.843.tgz#671489bd2f59fd49b76adddc1aa02c88cd38a5c0"
|
||||
integrity sha512-OWEwAbzaVd1Lk9MohVw8LxMXFlnYd9oYTYxfX8KS++kLLjDfbovLOcEEXwRhG612dqGQ6+44SZvim0GXuBRiKg==
|
||||
|
||||
elliptic@^6.5.3:
|
||||
version "6.5.4"
|
||||
|
|
@ -6370,9 +6391,9 @@ eslint-plugin-react-hooks@^4.2.0:
|
|||
integrity sha512-623WEiZJqxR7VdxFCKLI6d6LLpwJkGPYKODnkH3D7WpOG5KM8yWueBd8TLsNAetEJNF5iJmolaAKO3F8yzyVBQ==
|
||||
|
||||
eslint-plugin-react@^7.23.1:
|
||||
version "7.25.1"
|
||||
resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.25.1.tgz#9286b7cd9bf917d40309760f403e53016eda8331"
|
||||
integrity sha512-P4j9K1dHoFXxDNP05AtixcJEvIT6ht8FhYKsrkY0MPCPaUMYijhpWwNiRDZVtA8KFuZOkGSeft6QwH8KuVpJug==
|
||||
version "7.25.2"
|
||||
resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.25.2.tgz#d567a217d306b76dd110561f28074e2328ae38f8"
|
||||
integrity sha512-elx4585wgmryanJK4C5IoSKQyVZ+e7H0t2JOOtJNBql0cuercvSShvRReuLBbfx8687yW5yv+UL7pXwMsd6adQ==
|
||||
dependencies:
|
||||
array-includes "^3.1.3"
|
||||
array.prototype.flatmap "^1.2.4"
|
||||
|
|
@ -8809,11 +8830,11 @@ jsprim@^1.2.2:
|
|||
verror "1.10.0"
|
||||
|
||||
"jsx-ast-utils@^2.4.1 || ^3.0.0", jsx-ast-utils@^3.1.0:
|
||||
version "3.2.0"
|
||||
resolved "https://registry.yarnpkg.com/jsx-ast-utils/-/jsx-ast-utils-3.2.0.tgz#41108d2cec408c3453c1bbe8a4aae9e1e2bd8f82"
|
||||
integrity sha512-EIsmt3O3ljsU6sot/J4E1zDRxfBNrhjyf/OKjlydwgEimQuznlM4Wv7U+ueONJMyEn1WRE0K8dhi3dVAXYT24Q==
|
||||
version "3.2.1"
|
||||
resolved "https://registry.yarnpkg.com/jsx-ast-utils/-/jsx-ast-utils-3.2.1.tgz#720b97bfe7d901b927d87c3773637ae8ea48781b"
|
||||
integrity sha512-uP5vu8xfy2F9A6LGC22KO7e2/vGTS1MhP+18f++ZNlf0Ohaxbc9nIEwHAsejlJKyzfZzU5UIhe5ItYkitcZnZA==
|
||||
dependencies:
|
||||
array-includes "^3.1.2"
|
||||
array-includes "^3.1.3"
|
||||
object.assign "^4.1.2"
|
||||
|
||||
jwa@^1.4.1:
|
||||
|
|
@ -9318,9 +9339,9 @@ map-obj@^2.0.0:
|
|||
integrity sha1-plzSkIepJZi4eRJXpSPgISIqwfk=
|
||||
|
||||
map-obj@^4.0.0:
|
||||
version "4.2.1"
|
||||
resolved "https://registry.yarnpkg.com/map-obj/-/map-obj-4.2.1.tgz#e4ea399dbc979ae735c83c863dd31bdf364277b7"
|
||||
integrity sha512-+WA2/1sPmDj1dlvvJmB5G6JKfY9dpn7EVBUL06+y6PoljPkh+6V1QihwxNkbcGxCRjt2b0F9K0taiCuo7MbdFQ==
|
||||
version "4.3.0"
|
||||
resolved "https://registry.yarnpkg.com/map-obj/-/map-obj-4.3.0.tgz#9304f906e93faae70880da102a9f1df0ea8bb05a"
|
||||
integrity sha512-hdN1wVrZbb29eBGiGjJbeP8JbKjq1urkHJ/LIP/NY48MZ1QVXUsQBV1G1zvYFHn1XE06cwjBsOI2K3Ulnj1YXQ==
|
||||
|
||||
map-visit@^1.0.0:
|
||||
version "1.0.0"
|
||||
|
|
@ -9329,10 +9350,10 @@ map-visit@^1.0.0:
|
|||
dependencies:
|
||||
object-visit "^1.0.0"
|
||||
|
||||
marked@^3.0.3:
|
||||
version "3.0.3"
|
||||
resolved "https://registry.yarnpkg.com/marked/-/marked-3.0.3.tgz#d81ff0f9e29cef0a177327fe009b460f31aa5862"
|
||||
integrity sha512-4oIDhVSQ2s+xNCfek9OnZgCQR/WykGCom02JzIIvi4Pme+MIwPYqvGVW8CQWOXeoZu0TtVB6pTxIuoLm+dKqDA==
|
||||
marked@^3.0.4:
|
||||
version "3.0.4"
|
||||
resolved "https://registry.yarnpkg.com/marked/-/marked-3.0.4.tgz#b8a1539e5e05c6ea9e93f15c0bad1d54ce890406"
|
||||
integrity sha512-jBo8AOayNaEcvBhNobg6/BLhdsK3NvnKWJg33MAAPbvTWiG4QBn9gpW1+7RssrKu4K1dKlN+0goVQwV41xEfOA==
|
||||
|
||||
md5.js@^1.3.4:
|
||||
version "1.3.5"
|
||||
|
|
@ -9566,9 +9587,9 @@ minipass@^2.3.5, minipass@^2.6.0, minipass@^2.9.0:
|
|||
yallist "^3.0.0"
|
||||
|
||||
minipass@^3.0.0, minipass@^3.1.0, minipass@^3.1.1, minipass@^3.1.3:
|
||||
version "3.1.3"
|
||||
resolved "https://registry.yarnpkg.com/minipass/-/minipass-3.1.3.tgz#7d42ff1f39635482e15f9cdb53184deebd5815fd"
|
||||
integrity sha512-Mgd2GdMVzY+x3IJ+oHnVM+KG3lA5c8tnabyJKmHSaG2kAGpudxuOf8ToDkhumF7UzME7DecbQE9uOZhNm7PuJg==
|
||||
version "3.1.5"
|
||||
resolved "https://registry.yarnpkg.com/minipass/-/minipass-3.1.5.tgz#71f6251b0a33a49c01b3cf97ff77eda030dff732"
|
||||
integrity sha512-+8NzxD82XQoNKNrl1d/FSi+X8wAEWR+sbYAfIvub4Nz0d22plFG72CEVVaufV8PNf4qSslFTD8VMOxNVhHCjTw==
|
||||
dependencies:
|
||||
yallist "^4.0.0"
|
||||
|
||||
|
|
@ -11108,7 +11129,7 @@ raw-body@2.4.1:
|
|||
iconv-lite "0.4.24"
|
||||
unpipe "1.0.0"
|
||||
|
||||
react-dom@17.0.2, react-dom@^17.0.2:
|
||||
react-dom@17.0.2, "react-dom@^16.8 || ^17.0", react-dom@^17.0.2:
|
||||
version "17.0.2"
|
||||
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-17.0.2.tgz#ecffb6845e3ad8dbfcdc498f0d0a939736502c23"
|
||||
integrity sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==
|
||||
|
|
@ -11196,7 +11217,7 @@ react-style-singleton@^2.1.0:
|
|||
invariant "^2.2.4"
|
||||
tslib "^1.0.0"
|
||||
|
||||
react@17.0.2, react@^17.0.2:
|
||||
react@17.0.2, react@>=16.8, react@^17.0.2:
|
||||
version "17.0.2"
|
||||
resolved "https://registry.yarnpkg.com/react/-/react-17.0.2.tgz#d0b5cc516d29eb3eee383f75b62864cfb6800037"
|
||||
integrity sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==
|
||||
|
|
@ -11401,14 +11422,14 @@ reflect-metadata@^0.1.13:
|
|||
resolved "https://registry.yarnpkg.com/reflect-metadata/-/reflect-metadata-0.1.13.tgz#67ae3ca57c972a2aa1642b10fe363fe32d49dc08"
|
||||
integrity sha512-Ts1Y/anZELhSsjMcU605fU9RE4Oi3p5ORujwbIKXfWa+0Zxs510Qrmrce5/Jowq3cHSZSJqBjypxmHarc+vEWg==
|
||||
|
||||
regenerate-unicode-properties@^8.2.0:
|
||||
version "8.2.0"
|
||||
resolved "https://registry.yarnpkg.com/regenerate-unicode-properties/-/regenerate-unicode-properties-8.2.0.tgz#e5de7111d655e7ba60c057dbe9ff37c87e65cdec"
|
||||
integrity sha512-F9DjY1vKLo/tPePDycuH3dn9H1OTPIkVD9Kz4LODu+F2C75mgjAJ7x/gwy6ZcSNRAAkhNlJSOHRe8k3p+K9WhA==
|
||||
regenerate-unicode-properties@^9.0.0:
|
||||
version "9.0.0"
|
||||
resolved "https://registry.yarnpkg.com/regenerate-unicode-properties/-/regenerate-unicode-properties-9.0.0.tgz#54d09c7115e1f53dc2314a974b32c1c344efe326"
|
||||
integrity sha512-3E12UeNSPfjrgwjkR81m5J7Aw/T55Tu7nUyZVQYCKEOs+2dkxEY+DpPtZzO4YruuiPb7NkYLVcyJC4+zCbk5pA==
|
||||
dependencies:
|
||||
regenerate "^1.4.0"
|
||||
regenerate "^1.4.2"
|
||||
|
||||
regenerate@^1.4.0:
|
||||
regenerate@^1.4.2:
|
||||
version "1.4.2"
|
||||
resolved "https://registry.yarnpkg.com/regenerate/-/regenerate-1.4.2.tgz#b9346d8827e8f5a32f7ba29637d398b69014848a"
|
||||
integrity sha512-zrceR/XhGYU/d/opr2EKO7aRHUeiBI8qjtfHqADTwZd6Szfy16la6kqD0MIUs5z5hx6AaKa+PixpPrR289+I0A==
|
||||
|
|
@ -11447,26 +11468,26 @@ regexpp@^3.1.0:
|
|||
integrity sha512-pq2bWo9mVD43nbts2wGv17XLiNLya+GklZ8kaDLV2Z08gDCsGpnKn9BFMepvWuHCbyVvY7J5o5+BVvoQbmlJLg==
|
||||
|
||||
regexpu-core@^4.7.1:
|
||||
version "4.7.1"
|
||||
resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-4.7.1.tgz#2dea5a9a07233298fbf0db91fa9abc4c6e0f8ad6"
|
||||
integrity sha512-ywH2VUraA44DZQuRKzARmw6S66mr48pQVva4LBeRhcOltJ6hExvWly5ZjFLYo67xbIxb6W1q4bAGtgfEl20zfQ==
|
||||
version "4.8.0"
|
||||
resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-4.8.0.tgz#e5605ba361b67b1718478501327502f4479a98f0"
|
||||
integrity sha512-1F6bYsoYiz6is+oz70NWur2Vlh9KWtswuRuzJOfeYUrfPX2o8n74AnUVaOGDbUqVGO9fNHu48/pjJO4sNVwsOg==
|
||||
dependencies:
|
||||
regenerate "^1.4.0"
|
||||
regenerate-unicode-properties "^8.2.0"
|
||||
regjsgen "^0.5.1"
|
||||
regjsparser "^0.6.4"
|
||||
unicode-match-property-ecmascript "^1.0.4"
|
||||
unicode-match-property-value-ecmascript "^1.2.0"
|
||||
regenerate "^1.4.2"
|
||||
regenerate-unicode-properties "^9.0.0"
|
||||
regjsgen "^0.5.2"
|
||||
regjsparser "^0.7.0"
|
||||
unicode-match-property-ecmascript "^2.0.0"
|
||||
unicode-match-property-value-ecmascript "^2.0.0"
|
||||
|
||||
regjsgen@^0.5.1:
|
||||
regjsgen@^0.5.2:
|
||||
version "0.5.2"
|
||||
resolved "https://registry.yarnpkg.com/regjsgen/-/regjsgen-0.5.2.tgz#92ff295fb1deecbf6ecdab2543d207e91aa33733"
|
||||
integrity sha512-OFFT3MfrH90xIW8OOSyUrk6QHD5E9JOTeGodiJeBS3J6IwlgzJMNE/1bZklWz5oTg+9dCMyEetclvCVXOPoN3A==
|
||||
|
||||
regjsparser@^0.6.4:
|
||||
version "0.6.9"
|
||||
resolved "https://registry.yarnpkg.com/regjsparser/-/regjsparser-0.6.9.tgz#b489eef7c9a2ce43727627011429cf833a7183e6"
|
||||
integrity sha512-ZqbNRz1SNjLAiYuwY0zoXW8Ne675IX5q+YHioAGbCw4X96Mjl2+dcX9B2ciaeyYjViDAfvIjFpQjJgLttTEERQ==
|
||||
regjsparser@^0.7.0:
|
||||
version "0.7.0"
|
||||
resolved "https://registry.yarnpkg.com/regjsparser/-/regjsparser-0.7.0.tgz#a6b667b54c885e18b52554cb4960ef71187e9968"
|
||||
integrity sha512-A4pcaORqmNMDVwUjWoTzuhwMGpP+NykpfqAsEgI1FSH/EzC7lrN5TMd+kN8YCovX+jMpu8eaqXgXPCa0g8FQNQ==
|
||||
dependencies:
|
||||
jsesc "~0.5.0"
|
||||
|
||||
|
|
@ -11880,7 +11901,7 @@ shell-quote@1.7.2:
|
|||
resolved "https://registry.yarnpkg.com/shell-quote/-/shell-quote-1.7.2.tgz#67a7d02c76c9da24f99d20808fcaded0e0e04be2"
|
||||
integrity sha512-mRz/m/JVscCrkMyPqHc/bczi3OQHkLTqXHEFu0zDhK/qfv3UcOA4SVmRCLmos4bhjr9ekVQubj/R7waKapmiQg==
|
||||
|
||||
shiki@^0.9.10:
|
||||
shiki@^0.9.11:
|
||||
version "0.9.11"
|
||||
resolved "https://registry.yarnpkg.com/shiki/-/shiki-0.9.11.tgz#07d75dab2abb6dc12a01f79a397cb1c391fa22d8"
|
||||
integrity sha512-tjruNTLFhU0hruCPoJP0y+B9LKOmcqUhTpxn7pcJB3fa+04gFChuEmxmrUfOJ7ZO6Jd+HwMnDHgY3lv3Tqonuw==
|
||||
|
|
@ -11899,9 +11920,9 @@ side-channel@^1.0.4:
|
|||
object-inspect "^1.9.0"
|
||||
|
||||
signal-exit@^3.0.0, signal-exit@^3.0.2, signal-exit@^3.0.3:
|
||||
version "3.0.3"
|
||||
resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.3.tgz#a1410c2edd8f077b08b4e253c8eacfcaf057461c"
|
||||
integrity sha512-VUJ49FC8U1OxwZLxIbTTrDvLnf/6TDgxZcK8wxR8zs13xpx7xbG60ndBlhNrFi2EMuFRoeDoJO7wthSLq42EjA==
|
||||
version "3.0.4"
|
||||
resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.4.tgz#366a4684d175b9cab2081e3681fda3747b6c51d7"
|
||||
integrity sha512-rqYhcAnZ6d/vTPGghdrw7iumdcbXpsk1b8IG/rz+VWV51DM0p7XCtMoJ3qhPLIbp3tvyt3pKRbaaEMZYpHto8Q==
|
||||
|
||||
sisteransi@^1.0.5:
|
||||
version "1.0.5"
|
||||
|
|
@ -11985,9 +12006,9 @@ socks-proxy-agent@^5.0.0:
|
|||
socks "^2.3.3"
|
||||
|
||||
socks-proxy-agent@^6.0.0:
|
||||
version "6.0.0"
|
||||
resolved "https://registry.yarnpkg.com/socks-proxy-agent/-/socks-proxy-agent-6.0.0.tgz#9f8749cdc05976505fa9f9a958b1818d0e60573b"
|
||||
integrity sha512-FIgZbQWlnjVEQvMkylz64/rUggGtrKstPnx8OZyYFG0tAFR8CSBtpXxSwbFLHyeXFn/cunFL7MpuSOvDSOPo9g==
|
||||
version "6.1.0"
|
||||
resolved "https://registry.yarnpkg.com/socks-proxy-agent/-/socks-proxy-agent-6.1.0.tgz#869cf2d7bd10fea96c7ad3111e81726855e285c3"
|
||||
integrity sha512-57e7lwCN4Tzt3mXz25VxOErJKXlPfXmkMLnk310v/jwW20jWRVcgsOit+xNkN3eIEdB47GwnfAEBLacZ/wVIKg==
|
||||
dependencies:
|
||||
agent-base "^6.0.2"
|
||||
debug "^4.3.1"
|
||||
|
|
@ -12186,9 +12207,9 @@ ssri@^8.0.0, ssri@^8.0.1:
|
|||
minipass "^3.1.1"
|
||||
|
||||
stack-utils@^2.0.3:
|
||||
version "2.0.3"
|
||||
resolved "https://registry.yarnpkg.com/stack-utils/-/stack-utils-2.0.3.tgz#cd5f030126ff116b78ccb3c027fe302713b61277"
|
||||
integrity sha512-gL//fkxfWUsIlFL2Tl42Cl6+HFALEaB1FU76I/Fy+oZjRreP7OPMXFlGbxM7NQsI0ZpUfw76sHnv0WNYuTb7Iw==
|
||||
version "2.0.5"
|
||||
resolved "https://registry.yarnpkg.com/stack-utils/-/stack-utils-2.0.5.tgz#d25265fca995154659dbbfba3b49254778d2fdd5"
|
||||
integrity sha512-xrQcmYhOsn/1kX+Vraq+7j4oE2j/6BFscZ0etmYg81xuM8Gq0022Pxb8+IqgOFUIaxHs0KaSb7T1+OegiNrNFA==
|
||||
dependencies:
|
||||
escape-string-regexp "^2.0.0"
|
||||
|
||||
|
|
@ -13009,15 +13030,15 @@ typedarray@^0.0.6:
|
|||
integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
|
||||
|
||||
typedoc@^0.22.3:
|
||||
version "0.22.3"
|
||||
resolved "https://registry.yarnpkg.com/typedoc/-/typedoc-0.22.3.tgz#c67aaeef22702d84267bda12dc13f192dbf9d89e"
|
||||
integrity sha512-EOWf9Vf3Vfb/jzBzr87uoLybQw9fx3iyXLUcpQn9F2Ks1/ZJN9iGeBbYRU+VNqrWvV4T+aS7Ife7GFEJUf0ohQ==
|
||||
version "0.22.4"
|
||||
resolved "https://registry.yarnpkg.com/typedoc/-/typedoc-0.22.4.tgz#039ac59fcdb9a8674471dc20e1623efb12be4114"
|
||||
integrity sha512-M/a8NnPxq3/iZNNVjzFCK5gu4m//HTJIPbSS0JQVbkHJPP9wyepR12agylWTSqeVZe0xsbidVtO26+PP7iD/jw==
|
||||
dependencies:
|
||||
glob "^7.1.7"
|
||||
lunr "^2.3.9"
|
||||
marked "^3.0.3"
|
||||
marked "^3.0.4"
|
||||
minimatch "^3.0.4"
|
||||
shiki "^0.9.10"
|
||||
shiki "^0.9.11"
|
||||
|
||||
typeorm@^0.2.30:
|
||||
version "0.2.37"
|
||||
|
|
@ -13091,28 +13112,28 @@ unbox-primitive@^1.0.1:
|
|||
has-symbols "^1.0.2"
|
||||
which-boxed-primitive "^1.0.2"
|
||||
|
||||
unicode-canonical-property-names-ecmascript@^1.0.4:
|
||||
version "1.0.4"
|
||||
resolved "https://registry.yarnpkg.com/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-1.0.4.tgz#2619800c4c825800efdd8343af7dd9933cbe2818"
|
||||
integrity sha512-jDrNnXWHd4oHiTZnx/ZG7gtUTVp+gCcTTKr8L0HjlwphROEW3+Him+IpvC+xcJEFegapiMZyZe02CyuOnRmbnQ==
|
||||
unicode-canonical-property-names-ecmascript@^2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz#301acdc525631670d39f6146e0e77ff6bbdebddc"
|
||||
integrity sha512-yY5PpDlfVIU5+y/BSCxAJRBIS1Zc2dDG3Ujq+sR0U+JjUevW2JhocOF+soROYDSaAezOzOKuyyixhD6mBknSmQ==
|
||||
|
||||
unicode-match-property-ecmascript@^1.0.4:
|
||||
version "1.0.4"
|
||||
resolved "https://registry.yarnpkg.com/unicode-match-property-ecmascript/-/unicode-match-property-ecmascript-1.0.4.tgz#8ed2a32569961bce9227d09cd3ffbb8fed5f020c"
|
||||
integrity sha512-L4Qoh15vTfntsn4P1zqnHulG0LdXgjSO035fEpdtp6YxXhMT51Q6vgM5lYdG/5X3MjS+k/Y9Xw4SFCY9IkR0rg==
|
||||
unicode-match-property-ecmascript@^2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/unicode-match-property-ecmascript/-/unicode-match-property-ecmascript-2.0.0.tgz#54fd16e0ecb167cf04cf1f756bdcc92eba7976c3"
|
||||
integrity sha512-5kaZCrbp5mmbz5ulBkDkbY0SsPOjKqVS35VpL9ulMPfSl0J0Xsm+9Evphv9CoIZFwre7aJoa94AY6seMKGVN5Q==
|
||||
dependencies:
|
||||
unicode-canonical-property-names-ecmascript "^1.0.4"
|
||||
unicode-property-aliases-ecmascript "^1.0.4"
|
||||
unicode-canonical-property-names-ecmascript "^2.0.0"
|
||||
unicode-property-aliases-ecmascript "^2.0.0"
|
||||
|
||||
unicode-match-property-value-ecmascript@^1.2.0:
|
||||
version "1.2.0"
|
||||
resolved "https://registry.yarnpkg.com/unicode-match-property-value-ecmascript/-/unicode-match-property-value-ecmascript-1.2.0.tgz#0d91f600eeeb3096aa962b1d6fc88876e64ea531"
|
||||
integrity sha512-wjuQHGQVofmSJv1uVISKLE5zO2rNGzM/KCYZch/QQvez7C1hUhBIuZ701fYXExuufJFMPhv2SyL8CyoIfMLbIQ==
|
||||
unicode-match-property-value-ecmascript@^2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/unicode-match-property-value-ecmascript/-/unicode-match-property-value-ecmascript-2.0.0.tgz#1a01aa57247c14c568b89775a54938788189a714"
|
||||
integrity sha512-7Yhkc0Ye+t4PNYzOGKedDhXbYIBe1XEQYQxOPyhcXNMJ0WCABqqj6ckydd6pWRZTHV4GuCPKdBAUiMc60tsKVw==
|
||||
|
||||
unicode-property-aliases-ecmascript@^1.0.4:
|
||||
version "1.1.0"
|
||||
resolved "https://registry.yarnpkg.com/unicode-property-aliases-ecmascript/-/unicode-property-aliases-ecmascript-1.1.0.tgz#dd57a99f6207bedff4628abefb94c50db941c8f4"
|
||||
integrity sha512-PqSoPh/pWetQ2phoj5RLiaqIk4kCNwoV3CI+LfGmWLKI3rE3kl1h59XpX2BjgDrmbxD9ARtQobPGU1SguCYuQg==
|
||||
unicode-property-aliases-ecmascript@^2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/unicode-property-aliases-ecmascript/-/unicode-property-aliases-ecmascript-2.0.0.tgz#0a36cb9a585c4f6abd51ad1deddb285c165297c8"
|
||||
integrity sha512-5Zfuy9q/DFr4tfO7ZPeVXb1aPoeQSdeFMLpYuFebehDAhbuevLs5yxSZmIFN1tP5F9Wl4IpJrYojg85/zgyZHQ==
|
||||
|
||||
union-value@^1.0.0:
|
||||
version "1.0.1"
|
||||
|
|
|
|||
Ładowanie…
Reference in New Issue