diff --git a/app/components/DocumentTasks.tsx b/app/components/DocumentTasks.tsx index c984e83ff..5cc1e234d 100644 --- a/app/components/DocumentTasks.tsx +++ b/app/components/DocumentTasks.tsx @@ -54,7 +54,7 @@ function DocumentTasks({ document }: Props) { ); } -const Done = styled(DoneIcon)` +const Done = styled(DoneIcon)<{ $animated: boolean }>` margin: -1px; animation: ${(props) => (props.$animated ? bounceIn : "none")} 600ms; transform-origin: center center; diff --git a/app/components/Sidebar/components/Collections.tsx b/app/components/Sidebar/components/Collections.tsx index 2d068de2b..3e25b793d 100644 --- a/app/components/Sidebar/components/Collections.tsx +++ b/app/components/Sidebar/components/Collections.tsx @@ -113,7 +113,7 @@ function Collections() { ); } -const Disclosure = styled(CollapsedIcon)` +const Disclosure = styled(CollapsedIcon)<{ expanded?: boolean }>` transition: transform 100ms ease, fill 50ms !important; ${({ expanded }) => !expanded && "transform: rotate(-90deg);"}; `; diff --git a/app/components/Sidebar/components/Disclosure.ts b/app/components/Sidebar/components/Disclosure.ts index d24c078f9..4c17623a1 100644 --- a/app/components/Sidebar/components/Disclosure.ts +++ b/app/components/Sidebar/components/Disclosure.ts @@ -1,7 +1,7 @@ import { CollapsedIcon } from "outline-icons"; import styled from "styled-components"; -const Disclosure = styled(CollapsedIcon)` +const Disclosure = styled(CollapsedIcon)<{ expanded?: boolean }>` transition: transform 100ms ease, fill 50ms !important; position: absolute; left: -24px; diff --git a/app/components/Sidebar/components/Starred.tsx b/app/components/Sidebar/components/Starred.tsx index 64f768c3a..d9dd3aa2f 100644 --- a/app/components/Sidebar/components/Starred.tsx +++ b/app/components/Sidebar/components/Starred.tsx @@ -160,7 +160,7 @@ function Starred() { ); } -const Disclosure = styled(CollapsedIcon)` +const Disclosure = styled(CollapsedIcon)<{ expanded?: boolean }>` transition: transform 100ms ease, fill 50ms !important; ${({ expanded }) => !expanded && "transform: rotate(-90deg);"}; `; diff --git a/app/components/Sidebar/components/StarredLink.tsx b/app/components/Sidebar/components/StarredLink.tsx index 148fbd465..915670b7c 100644 --- a/app/components/Sidebar/components/StarredLink.tsx +++ b/app/components/Sidebar/components/StarredLink.tsx @@ -44,7 +44,7 @@ function StarredLink({ depth, title, to, documentId, collectionId }: Props) { }, [collection, collectionId, collections, document, documentId, documents]); const handleDisclosureClick = React.useCallback( - (ev: React.MouseEvent) => { + (ev: React.MouseEvent) => { ev.preventDefault(); ev.stopPropagation(); setExpanded((prevExpanded) => !prevExpanded); diff --git a/app/scenes/Search/components/SearchInput.tsx b/app/scenes/Search/components/SearchInput.tsx index 2de41f500..2f27779e7 100644 --- a/app/scenes/Search/components/SearchInput.tsx +++ b/app/scenes/Search/components/SearchInput.tsx @@ -24,12 +24,7 @@ function SearchInput({ defaultValue, ...rest }: Props) { return ( - +