Add 's' method to access theme props (#5163)

app/components/DocumentExplorerNode.tsx

@@ -3,10 +3,10 @@ import * as React from "react";
 import { useTranslation } from "react-i18next";
 import styled from "styled-components";
 import breakpoint from "styled-components-breakpoint";
+import { s, ellipsis } from "@shared/styles";
 import Flex from "~/components/Flex";
 import Disclosure from "~/components/Sidebar/components/Disclosure";
 import Text from "~/components/Text";
-import { ellipsis } from "~/styles";
 
 type Props = {
   selected: boolean;
@@ -98,7 +98,7 @@ export const Node = styled.span<{
   overflow: hidden;
   font-size: 16px;
   width: ${(props) => props.style.width};
-  color: ${(props) => props.theme.text};
+  color: ${s("text")};
   cursor: var(--pointer);
   padding: 12px;
   border-radius: 6px;