From c56cb94c718c18ad1d67739beb978aa6f26aaaad Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Mon, 15 Aug 2022 17:26:55 -0400 Subject: [PATCH 01/32] test: type interface for rightsidebarresizecontrol --- .../components/Layout/RightSidebarResizeControl.tsx | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/src/js/components/Layout/RightSidebarResizeControl.tsx b/src/js/components/Layout/RightSidebarResizeControl.tsx index c13ddd40a8..7fa82bc93f 100644 --- a/src/js/components/Layout/RightSidebarResizeControl.tsx +++ b/src/js/components/Layout/RightSidebarResizeControl.tsx @@ -1,12 +1,18 @@ import React from 'react'; -import { Box } from '@chakra-ui/react'; +import { Box, BoxProps } from '@chakra-ui/react'; const MIN_SIZE = 200; const MAX_SIZE = 800; const clamp = (value: number, min: number, max: number) => Math.max(Math.min(value, max), min); -export const RightSidebarResizeControl = (props) => { +interface RightSidebarResizeControlProps extends BoxProps { + onResizeSidebar: (size: number) => void; + isSidebarOpen: boolean; + sidebarWidth: number; +} + +export const RightSidebarResizeControl = (props: RightSidebarResizeControlProps) => { const { onResizeSidebar, isSidebarOpen, sidebarWidth, ...rest } = props; const [isDragging, setIsDragging] = React.useState(false); @@ -52,7 +58,7 @@ export const RightSidebarResizeControl = (props) => { transition="opacity 0.2s ease-in-out" _hover={{ opacity: 1 }} {...isDragging && { opacity: 1 }} - {...props} + {...rest} > ); From 68e9b9f77ab68121bbb255e99d5f98b1fce73068 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Mon, 15 Aug 2022 17:36:40 -0400 Subject: [PATCH 02/32] fix: correct prop name for sidebar width --- src/cljs/athens/views.cljs | 2 +- src/cljs/athens/views/right_sidebar/core.cljs | 3 +-- src/js/components/Layout/RightSidebar.tsx | 18 ++++++++++++++---- .../Layout/RightSidebarResizeControl.tsx | 9 +++++---- 4 files changed, 21 insertions(+), 11 deletions(-) diff --git a/src/cljs/athens/views.cljs b/src/cljs/athens/views.cljs index 8048ed5488..86e74e7ac4 100644 --- a/src/cljs/athens/views.cljs +++ b/src/cljs/athens/views.cljs @@ -81,7 +81,7 @@ [:> MainContent {:rightSidebarWidth @right-sidebar-width :isRightSidebarOpen @right-sidebar-open?} [pages/view]] - [:> RightSidebarResizeControl {:sidebarWidth @right-sidebar-width + [:> RightSidebarResizeControl {:rightSidebarWidth @right-sidebar-width :isSidebarOpen @right-sidebar-open? :onResizeSidebar #(rf/dispatch [:right-sidebar/set-width %])}] [right-sidebar/right-sidebar]]]])]]]))) diff --git a/src/cljs/athens/views/right_sidebar/core.cljs b/src/cljs/athens/views/right_sidebar/core.cljs index 9db5cc1a4a..f527af0b85 100644 --- a/src/cljs/athens/views/right_sidebar/core.cljs +++ b/src/cljs/athens/views/right_sidebar/core.cljs @@ -37,8 +37,7 @@ [open? items rf-width] [:> RightSidebar {:isOpen open? - :rightSidebarWidth rf-width - :onResizeSidebar #(dispatch [:right-sidebar/set-width %])} + :rightSidebarWidth rf-width} (if (empty? items) [empty-message] [:> List {:items (shared/create-sidebar-list items) diff --git a/src/js/components/Layout/RightSidebar.tsx b/src/js/components/Layout/RightSidebar.tsx index 5b7e8db297..274a7bd37f 100644 --- a/src/js/components/Layout/RightSidebar.tsx +++ b/src/js/components/Layout/RightSidebar.tsx @@ -1,12 +1,22 @@ import * as React from "react"; import { LayoutContext, layoutAnimationProps } from "./useLayoutState"; import { AnimatePresence, motion } from 'framer-motion'; -import { DragIcon, XmarkIcon, ChevronRightIcon, PageIcon, PageFillIcon, BlockIcon, BlockFillIcon, GraphIcon, ArrowLeftOnBoxIcon } from '@/Icons/Icons'; -import { Button, IconButton, Box, Collapse, VStack } from '@chakra-ui/react'; +import { XmarkIcon, ChevronRightIcon, PageIcon, PageFillIcon, BlockIcon, BlockFillIcon, GraphIcon, ArrowLeftOnBoxIcon } from '@/Icons/Icons'; +import { Button, IconButton, Box, Collapse, VStack, BoxProps } from '@chakra-ui/react'; /** Right Sidebar */ -export const RightSidebar = (props) => { + + +interface RightSidebarProps extends BoxProps { + isOpen: boolean; + rightSidebarWidth: number; +} + +export const RightSidebar = (props: RightSidebarProps) => { const { children, rightSidebarWidth, isOpen } = props; + + console.log(rightSidebarWidth) + const { toolbarHeight } = React.useContext(LayoutContext); @@ -148,5 +158,5 @@ export const SidebarItem = ({ title, type, isOpen, onToggle, onRemove, onNavigat {children} - ); + ); }; diff --git a/src/js/components/Layout/RightSidebarResizeControl.tsx b/src/js/components/Layout/RightSidebarResizeControl.tsx index 7fa82bc93f..c12825d6b7 100644 --- a/src/js/components/Layout/RightSidebarResizeControl.tsx +++ b/src/js/components/Layout/RightSidebarResizeControl.tsx @@ -9,11 +9,11 @@ const clamp = (value: number, min: number, max: number) => Math.max(Math.min(val interface RightSidebarResizeControlProps extends BoxProps { onResizeSidebar: (size: number) => void; isSidebarOpen: boolean; - sidebarWidth: number; + rightSidebarWidth: number; } export const RightSidebarResizeControl = (props: RightSidebarResizeControlProps) => { - const { onResizeSidebar, isSidebarOpen, sidebarWidth, ...rest } = props; + const { onResizeSidebar, isSidebarOpen, rightSidebarWidth, ...rest } = props; const [isDragging, setIsDragging] = React.useState(false); const moveHandler = (e) => { @@ -23,7 +23,7 @@ export const RightSidebarResizeControl = (props: RightSidebarResizeControlProps) } } - const mouseUpHandler = (e) => { + const mouseUpHandler = () => { setIsDragging(false); } @@ -48,7 +48,8 @@ export const RightSidebarResizeControl = (props: RightSidebarResizeControlProps) position="fixed" zIndex={100} opacity={0} - right={sidebarWidth + "px"} + outline="none" + right={rightSidebarWidth + "px"} height="100%" cursor="col-resize" onMouseDown={() => setIsDragging(true)} From 81af9a328407d877c52e73efe146e254bf6f7a75 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Mon, 15 Aug 2022 17:43:16 -0400 Subject: [PATCH 03/32] rfct: minor prop cleanup --- src/cljs/athens/views.cljs | 2 +- src/js/components/Layout/RightSidebarResizeControl.tsx | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/cljs/athens/views.cljs b/src/cljs/athens/views.cljs index 86e74e7ac4..b1bde62fca 100644 --- a/src/cljs/athens/views.cljs +++ b/src/cljs/athens/views.cljs @@ -82,6 +82,6 @@ :isRightSidebarOpen @right-sidebar-open?} [pages/view]] [:> RightSidebarResizeControl {:rightSidebarWidth @right-sidebar-width - :isSidebarOpen @right-sidebar-open? + :isRightSidebarOpen @right-sidebar-open? :onResizeSidebar #(rf/dispatch [:right-sidebar/set-width %])}] [right-sidebar/right-sidebar]]]])]]]))) diff --git a/src/js/components/Layout/RightSidebarResizeControl.tsx b/src/js/components/Layout/RightSidebarResizeControl.tsx index c12825d6b7..16b54eb839 100644 --- a/src/js/components/Layout/RightSidebarResizeControl.tsx +++ b/src/js/components/Layout/RightSidebarResizeControl.tsx @@ -8,12 +8,12 @@ const clamp = (value: number, min: number, max: number) => Math.max(Math.min(val interface RightSidebarResizeControlProps extends BoxProps { onResizeSidebar: (size: number) => void; - isSidebarOpen: boolean; + isRightSidebarOpen: boolean; rightSidebarWidth: number; } export const RightSidebarResizeControl = (props: RightSidebarResizeControlProps) => { - const { onResizeSidebar, isSidebarOpen, rightSidebarWidth, ...rest } = props; + const { onResizeSidebar, isRightSidebarOpen, rightSidebarWidth, ...rest } = props; const [isDragging, setIsDragging] = React.useState(false); const moveHandler = (e) => { @@ -36,7 +36,7 @@ export const RightSidebarResizeControl = (props: RightSidebarResizeControlProps) } }); - if (!isSidebarOpen) { + if (!isRightSidebarOpen) { return null; } From 54310a4aa121bd5d9731b27ccc22a8c2674018c2 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Mon, 15 Aug 2022 18:32:25 -0400 Subject: [PATCH 04/32] fix: misc toolbar cleanup --- src/cljs/athens/electron/db_menu/db_icon.cljs | 4 +- .../athens/views/notifications/popover.cljs | 7 +- src/js/components/AppToolbar/AppToolbar.tsx | 117 +++++++++--------- src/js/theme/theme.js | 14 ++- 4 files changed, 75 insertions(+), 67 deletions(-) diff --git a/src/cljs/athens/electron/db_menu/db_icon.cljs b/src/cljs/athens/electron/db_menu/db_icon.cljs index a53d7a0a1e..a96b3fabad 100644 --- a/src/cljs/athens/electron/db_menu/db_icon.cljs +++ b/src/cljs/athens/electron/db_menu/db_icon.cljs @@ -9,8 +9,8 @@ [:> Box {:class "icon" :position "relative" :flex "0 0 auto" - :width "1.75em" - :height "1.75em" + :width "1.25em" + :height "1.25em" :sx {"text" {:fontSize "16px"}}} [:> Box {:as "svg" :viewBox "0 0 24 24" diff --git a/src/cljs/athens/views/notifications/popover.cljs b/src/cljs/athens/views/notifications/popover.cljs index 4fd3261069..ea023c057a 100644 --- a/src/cljs/athens/views/notifications/popover.cljs +++ b/src/cljs/athens/views/notifications/popover.cljs @@ -120,13 +120,11 @@ notification-list (get-inbox-items-for-popover @db/dsdb user-page-title) navigate-user-page #(router/navigate-page user-page-title) num-notifications (count notification-list)] - [:> Popover {:closeOnBlur true} + [:> Popover {:closeOnBlur true :size "md"} [:> PopoverTrigger [:> Box {:position "relative"} [:> IconButton {"aria-label" "Notifications" - :variant "ghost" - :fontSize "1.3em" :onDoubleClick navigate-user-page :onClick (fn [e] (when (.. e -shiftKey) @@ -139,8 +137,7 @@ :right "-3px" :bottom "-1px" :variant "ghost" :zIndex 1} num-notifications])]] - [:> PopoverContent {:maxWidth "max-content" - :maxHeight "calc(100vh - 4rem)"} + [:> PopoverContent {:maxHeight "calc(100vh - 4rem)"} [:> PopoverCloseButton] [:> PopoverHeader [:> Button {:onClick navigate-user-page :rightIcon (r/as-element [:> ArrowRightIcon])} "Notifications"]] [:> Flex {:p 0 diff --git a/src/js/components/AppToolbar/AppToolbar.tsx b/src/js/components/AppToolbar/AppToolbar.tsx index a518122d90..aa692a74f7 100644 --- a/src/js/components/AppToolbar/AppToolbar.tsx +++ b/src/js/components/AppToolbar/AppToolbar.tsx @@ -14,9 +14,7 @@ import { } from '@/Icons/Icons'; import { - HTMLChakraProps, Portal, - ThemingProps, Menu, MenuButton, MenuItem, @@ -25,11 +23,12 @@ import { Box, Flex, Spacer, - ButtonOptions, IconButton, ButtonGroup, useColorMode, - useMediaQuery + useMediaQuery, + ButtonGroupProps, + useToast } from '@chakra-ui/react'; import { AnimatePresence, motion } from 'framer-motion'; @@ -37,28 +36,15 @@ import { LayoutContext, layoutAnimationProps, layoutAnimationTransition } from " import { FakeTrafficLights } from './components/FakeTrafficLights'; import { WindowButtons } from './components/WindowButtons'; import { LocationIndicator } from './components/LocationIndicator'; -interface ToolbarIconButtonProps extends ButtonOptions, HTMLChakraProps<'button'>, ThemingProps<"Button"> { - children: React.ReactChild; -} const PAGE_TITLE_SHOW_HEIGHT = 24; -const toolbarIconButtonStyle = { - variant: "ghost", - colorScheme: "subtle", - sx: { - "svg": { - fontSize: "1.5em" - } - } +interface ToolbarButtonGroupProps extends ButtonGroupProps { + key: string } -const ToolbarIconButton = React.forwardRef((props: ToolbarIconButtonProps, ref) => { - const { children } = props; - return {children} -}); - +const ToolbarButtonGroup = (props: ToolbarButtonGroupProps) => export interface AppToolbarProps extends React.HTMLAttributes { /** @@ -141,19 +127,17 @@ export interface AppToolbarProps extends React.HTMLAttributes { } const secondaryToolbarItems = (items) => { - return + return {items.filter(x => !!x).map((item) => - - {item.icon} - + )} - + } const secondaryToolbarOverflowMenu = (items) => { return {({ isOpen }) => <> - + } /> {items.filter(x => !!x).map((item) => ( { isWinFullscreen, isWinFocused, isWinMaximized, - isHelpOpen, isThemeDark, isLeftSidebarOpen, isShowComments, @@ -203,6 +186,8 @@ export const AppToolbar = (props: AppToolbarProps): React.ReactElement => { const [canShowFullSecondaryMenu] = useMediaQuery('(min-width: 900px)'); const [isScrolledPastTitle, setIsScrolledPastTitle] = React.useState(null); + const toast = useToast(); + // add event listener to detect when the user scrolls past the title React.useLayoutEffect(() => { const scrollContainer = document.getElementById("main-layout") as HTMLElement; @@ -238,7 +223,27 @@ export const AppToolbar = (props: AppToolbarProps): React.ReactElement => { const secondaryTools = [ handleClickComments && { label: isShowComments ? "Hide comments" : "Show comments", - onClick: handleClickComments, + onClick: () => { + if (isShowComments) { + handleClickComments(); + toast({ + title: "Comments hidden", + status: "info", + duration: 5000, + position: "top-right" + }); + + } else { + handleClickComments(); + toast({ + title: "Comments shown", + status: "info", + duration: 5000, + position: "top-right" + }); + + } + }, icon: isShowComments ? : }, { @@ -276,8 +281,8 @@ export const AppToolbar = (props: AppToolbarProps): React.ReactElement => { > {/* Left side */} - { )} - - + {databaseMenu} - + {/* Right side */} {isElectron && ( - - - + + - - + icon={} + /> - - - + onClick={handlePressHistoryForward} + icon={ + } + /> - ) + ) } ); const rightToolbarControls = ( - { {canShowFullSecondaryMenu ? secondaryToolbarItems(secondaryTools) : secondaryToolbarOverflowMenu(secondaryTools)} - + ); const currentLocationTools = ( - { title={currentPageTitle} /> )} - + ) const contentControls = ( - svg": { + fontSize: "1.5em", + } } }, variants: { @@ -511,6 +516,13 @@ const components = { content: { bg: "background.upper", shadow: "popover", + _focus: { + outline: 'none', + shadow: "popover", + }, + _focusVisible: { + shadow: "popover", + }, [$arrowBg.variable]: "colors.background.upper", } } From ff96b34decd9ba322fe5c777ff369f2aa5204349 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Mon, 15 Aug 2022 18:45:09 -0400 Subject: [PATCH 05/32] rfct: unify css transitions for smoother theme switch --- src/cljs/athens/views.cljs | 4 ++++ .../AllPagesTable/AllPagesTable.tsx | 21 ++++++++++++++----- src/js/components/AppToolbar/AppToolbar.tsx | 3 +++ src/js/components/Layout/MainSidebar.tsx | 3 +++ src/js/components/Layout/RightSidebar.tsx | 3 +++ src/js/components/Page/Page.tsx | 5 +++-- 6 files changed, 32 insertions(+), 7 deletions(-) diff --git a/src/cljs/athens/views.cljs b/src/cljs/athens/views.cljs index b1bde62fca..2b90a327cc 100644 --- a/src/cljs/athens/views.cljs +++ b/src/cljs/athens/views.cljs @@ -70,6 +70,10 @@ :spacing 0 :overflowY "auto" :height "100vh" + :bg "background.floor" + :transitionDuration "fast" + :transitionProperty "background" + :transitionTimingFunction "ease-in-out" :align "stretch" :position "relative"} [app-toolbar/app-toolbar] diff --git a/src/js/components/AllPagesTable/AllPagesTable.tsx b/src/js/components/AllPagesTable/AllPagesTable.tsx index 93244b79b8..1f4ef0d195 100644 --- a/src/js/components/AllPagesTable/AllPagesTable.tsx +++ b/src/js/components/AllPagesTable/AllPagesTable.tsx @@ -31,6 +31,17 @@ const renderDate = (date) => { } } +const RowTd = ({ children, ...props }) => { + return ( + + {children} + + ) +} const Row = ({ index, data, style }) => { @@ -46,7 +57,7 @@ const Row = ({ index, data, style }) => { display="flex" className={index % 2 ? 'index-even' : 'index-odd'} > - - - {item[":block/_refs"]?.length || 0} - {renderDate(item[":time/modified"])} - {renderDate(item[":time/created"])} + + {item[":block/_refs"]?.length || 0} + {renderDate(item[":time/modified"])} + {renderDate(item[":time/created"])} ) }; diff --git a/src/js/components/AppToolbar/AppToolbar.tsx b/src/js/components/AppToolbar/AppToolbar.tsx index aa692a74f7..4668b243c2 100644 --- a/src/js/components/AppToolbar/AppToolbar.tsx +++ b/src/js/components/AppToolbar/AppToolbar.tsx @@ -426,6 +426,9 @@ export const AppToolbar = (props: AppToolbarProps): React.ReactElement => { position: "absolute", inset: 0, bg: "background.floor", + transitionProperty: "background", + transitionTimingFunction: "ease-in-out", + transitionDuration: "fast", opacity: 0.7, }} position="absolute" diff --git a/src/js/components/Layout/MainSidebar.tsx b/src/js/components/Layout/MainSidebar.tsx index 30a75c0735..1cad731b9c 100644 --- a/src/js/components/Layout/MainSidebar.tsx +++ b/src/js/components/Layout/MainSidebar.tsx @@ -23,6 +23,9 @@ export const MainSidebar = (props) => { userSelect="none" key="main sidebar" bg="background.upper" + transitionProperty="background" + transitionTimingFunction="ease-in-out" + transitionDuration="fast" pt={toolbarHeight} height="100vh" position="sticky" diff --git a/src/js/components/Layout/RightSidebar.tsx b/src/js/components/Layout/RightSidebar.tsx index 274a7bd37f..5c9702372f 100644 --- a/src/js/components/Layout/RightSidebar.tsx +++ b/src/js/components/Layout/RightSidebar.tsx @@ -29,6 +29,9 @@ export const RightSidebar = (props: RightSidebarProps) => { {...layoutAnimationProps(rightSidebarWidth + "px")} zIndex={1} bg="background.floor" + transitionProperty="background" + transitionTimingFunction="ease-in-out" + transitionDuration="fast" overflowY="auto" borderLeft="1px solid" borderColor="separator.divider" diff --git a/src/js/components/Page/Page.tsx b/src/js/components/Page/Page.tsx index 64b03b0cdd..6ade08ff55 100644 --- a/src/js/components/Page/Page.tsx +++ b/src/js/components/Page/Page.tsx @@ -16,6 +16,9 @@ const PAGE_PROPS = { alignSelf: "stretch", gridTemplateAreas: "'header' 'content' 'footer'", gridTemplateRows: "auto 1fr auto", + transitionProperty: "background", + transitionTimingFunction: "ease-in-out", + transitionDuration: "fast", sx: { "--page-padding": "3rem", } @@ -159,7 +162,6 @@ const DailyNotePageError = () => { borderWidth="1px" borderStyle="solid" borderColor="separator.divider" - transitionDuration="0s" borderRadius="0.5rem" minHeight="calc(100vh - 10rem)" textAlign="center" @@ -208,7 +210,6 @@ export const DailyNotesPage = withErrorBoundary(({ children, onFirstAppear, ...r borderWidth="1px" borderStyle="solid" borderColor="separator.divider" - transitionDuration="0s" borderRadius="0.5rem" minHeight="calc(100vh - 10rem)" > From 07d8da40d371dff7d126b32b95c39820bc1ad7cd Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Mon, 15 Aug 2022 18:47:05 -0400 Subject: [PATCH 06/32] fix: clean up page buttons --- src/js/components/Page/Page.tsx | 24 ++++++++++-------------- 1 file changed, 10 insertions(+), 14 deletions(-) diff --git a/src/js/components/Page/Page.tsx b/src/js/components/Page/Page.tsx index 6ade08ff55..c7161d7721 100644 --- a/src/js/components/Page/Page.tsx +++ b/src/js/components/Page/Page.tsx @@ -94,28 +94,25 @@ export const PageHeader = ({ > {children} - + {headerImageEnabled && } {onClickOpenInMainView && - - } + icon={} + />} {onClickOpenInSidebar && - - } + icon={} + />} {isPropertiesOpen && @@ -126,7 +123,6 @@ export const PageHeader = ({ } - {headerImageUrl && } ) } From 79a07ecca2ff068b91019346613b33b896908cdd Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Mon, 15 Aug 2022 19:04:23 -0400 Subject: [PATCH 07/32] fix: better daily notes fn --- src/cljs/athens/views/pages/daily_notes.cljs | 6 +++++- src/js/components/Page/Page.tsx | 14 ++++++++++---- 2 files changed, 15 insertions(+), 5 deletions(-) diff --git a/src/cljs/athens/views/pages/daily_notes.cljs b/src/cljs/athens/views/pages/daily_notes.cljs index c81c2f0510..ae012baa1f 100644 --- a/src/cljs/athens/views/pages/daily_notes.cljs +++ b/src/cljs/athens/views/pages/daily_notes.cljs @@ -35,6 +35,10 @@ [:> AnimatePresence {:initial false} (doall (for [{:keys [block/uid]} notes] + [:> DailyNotesPage {:key uid - :onFirstAppear get-next-note} + ;; only the last gets onFirstAppear + :onFirstAppear (if (= (last @note-refs) uid) + get-next-note + nil)} [node-page/page [:block/uid uid]]]))]]))))) diff --git a/src/js/components/Page/Page.tsx b/src/js/components/Page/Page.tsx index c7161d7721..070160a9a3 100644 --- a/src/js/components/Page/Page.tsx +++ b/src/js/components/Page/Page.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Button, Divider, Center, Box, Heading, Image, IconButton, ButtonGroup, FormControl, Input, - Tooltip, FormLabel + Tooltip, FormLabel, BoxProps } from '@chakra-ui/react'; import { useInView } from "react-intersection-observer"; import { ArrowRightOnBoxIcon, ArrowLeftOnBoxIcon } from '@/Icons/Icons'; @@ -171,12 +171,18 @@ const DailyNotePageError = () => { } -export const DailyNotesPage = withErrorBoundary(({ children, onFirstAppear, ...rest }) => { +interface DailyNotesPageProps extends BoxProps { + onFirstAppear?: () => void +} + +export const DailyNotesPage = withErrorBoundary((props: DailyNotesPageProps) => { + const { children, onFirstAppear, ...boxProps } = props + const hasAppeared = React.useRef(false); const { ref, inView } = useInView({ threshold: 1, triggerOnce: true, delay: 50 }); if (!hasAppeared.current) { - if (inView) { + if (inView && onFirstAppear) { onFirstAppear(); hasAppeared.current = true; } @@ -185,7 +191,7 @@ export const DailyNotesPage = withErrorBoundary(({ children, onFirstAppear, ...r return ( Date: Mon, 15 Aug 2022 20:15:29 -0400 Subject: [PATCH 08/32] fix: solve theme issue with buttons --- src/js/theme/theme.js | 40 +++++++++------------------------------- 1 file changed, 9 insertions(+), 31 deletions(-) diff --git a/src/js/theme/theme.js b/src/js/theme/theme.js index 9715251b0c..8cf6ab815c 100644 --- a/src/js/theme/theme.js +++ b/src/js/theme/theme.js @@ -324,6 +324,9 @@ const components = { _focusVisible: { outline: 'none', boxShadow: 'focus' + }, + "svg": { + fontSize: "1.5em", } }, variants: { @@ -397,42 +400,13 @@ const components = { error: { color: "error" } - } + }, }, FormLabel: { baseStyle: { color: "foreground.secondary", } }, - IconButton: { - baseStyle: { - fontSize: "1.5em", - _active: { - transitionDuration: "0s", - }, - _focus: { - outline: 'none', - boxShadow: 'none' - }, - _focusVisible: { - outline: 'none', - boxShadow: 'focus' - }, - sx: { - "& > svg": { - fontSize: "1.5em", - } - } - }, - variants: { - solid: { - _active: { - color: 'linkContrast', - bg: 'link', - }, - } - } - }, Menu: { baseStyle: { list: { @@ -631,7 +605,11 @@ const components = { } // Default prop overrides -Tooltip.defaultProps = { ...Tooltip.defaultProps, openDelay: 500 } +Tooltip.defaultProps = { + ...Tooltip.defaultProps, + closeOnMouseDown: true, + openDelay: 500 +} const config = { initialColorMode: 'system', From cbd85343fcbf62cce343823e138df9ad470d231b Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Mon, 15 Aug 2022 20:17:10 -0400 Subject: [PATCH 09/32] fix: solve theme issue with buttons --- src/cljs/athens/electron/db_menu/db_icon.cljs | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/cljs/athens/electron/db_menu/db_icon.cljs b/src/cljs/athens/electron/db_menu/db_icon.cljs index a96b3fabad..a53d7a0a1e 100644 --- a/src/cljs/athens/electron/db_menu/db_icon.cljs +++ b/src/cljs/athens/electron/db_menu/db_icon.cljs @@ -9,8 +9,8 @@ [:> Box {:class "icon" :position "relative" :flex "0 0 auto" - :width "1.25em" - :height "1.25em" + :width "1.75em" + :height "1.75em" :sx {"text" {:fontSize "16px"}}} [:> Box {:as "svg" :viewBox "0 0 24 24" From 66fd75a861009c884e26928ad623e6955ddcdf33 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Mon, 15 Aug 2022 21:28:05 -0400 Subject: [PATCH 10/32] fix: solve theme issue with buttons --- src/js/components/AppToolbar/AppToolbar.tsx | 7 +++---- src/js/theme/theme.js | 14 ++++++++++---- 2 files changed, 13 insertions(+), 8 deletions(-) diff --git a/src/js/components/AppToolbar/AppToolbar.tsx b/src/js/components/AppToolbar/AppToolbar.tsx index 4668b243c2..98fd8a7103 100644 --- a/src/js/components/AppToolbar/AppToolbar.tsx +++ b/src/js/components/AppToolbar/AppToolbar.tsx @@ -320,8 +320,7 @@ export const AppToolbar = (props: AppToolbarProps): React.ReactElement => { } + icon={} /> ) @@ -336,7 +335,7 @@ export const AppToolbar = (props: AppToolbarProps): React.ReactElement => { justifySelf="flex-end" key="extras" pr={3} - flex={`0 0 auto`} + flex="0 0 auto" display="flex" justifyContent="flex-end" > @@ -373,7 +372,7 @@ export const AppToolbar = (props: AppToolbarProps): React.ReactElement => { alignItems="center" key="content tools" px={1} - flex={`1 1 100%`} + flex="1 1 100%" display="flex" justifyContent="center" /> diff --git a/src/js/theme/theme.js b/src/js/theme/theme.js index 8cf6ab815c..40b70c09db 100644 --- a/src/js/theme/theme.js +++ b/src/js/theme/theme.js @@ -4,6 +4,13 @@ import { spacing } from './spacing' const $arrowBg = cssVar("popper-arrow-bg"); +const buttonIconFontSize = { + xs: "1.25em", + sm: "1.5em", + md: "1.75em", + lg: "2em", +} + const shadows = { focusLight: '0 0 0 3px #0071DB', focusDark: '0 0 0 3px #498eda', @@ -311,8 +318,7 @@ const components = { } }, Button: { - baseStyle: { - transitionProperty: 'common', + baseStyle: ({ size }) => ({ transitionTimingFunction: 'ease-in-out', _active: { transitionDuration: "0s", @@ -326,9 +332,9 @@ const components = { boxShadow: 'focus' }, "svg": { - fontSize: "1.5em", + fontSize: buttonIconFontSize[size], } - }, + }), variants: { link: { color: "link", From 07fa1888157a3f341e202ab010f31b392dc66889 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Mon, 15 Aug 2022 21:48:53 -0400 Subject: [PATCH 11/32] fix: solve theme issue with buttons --- src/cljs/athens/main/core.cljs | 2 +- src/js/theme/theme.js | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/cljs/athens/main/core.cljs b/src/cljs/athens/main/core.cljs index e2da33f528..98c74bdff9 100644 --- a/src/cljs/athens/main/core.cljs +++ b/src/cljs/athens/main/core.cljs @@ -94,7 +94,7 @@ :autoHideMenuBar true :frame false :titleBarStyle "hidden" - :trafficLightPosition {:x 19, :y 34} + :trafficLightPosition {:x 19, :y 33} :webPreferences {:contextIsolation false :nodeIntegration true :worldSafeExecuteJavaScript true diff --git a/src/js/theme/theme.js b/src/js/theme/theme.js index 40b70c09db..7b6c4b52fe 100644 --- a/src/js/theme/theme.js +++ b/src/js/theme/theme.js @@ -5,10 +5,10 @@ import { spacing } from './spacing' const $arrowBg = cssVar("popper-arrow-bg"); const buttonIconFontSize = { - xs: "1.25em", - sm: "1.5em", - md: "1.75em", - lg: "2em", + xs: "16px", + sm: "20px", + md: "24px", + lg: "32px", } const shadows = { From 848dd16be316500ecfb50f3dddd611c182618e41 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Mon, 15 Aug 2022 22:58:49 -0400 Subject: [PATCH 12/32] fix: autocomplete menu works again --- src/cljs/athens/views/blocks/editor.cljs | 44 +++++++++++----------- src/js/components/Block/Autocomplete.tsx | 47 ++++++++++-------------- 2 files changed, 41 insertions(+), 50 deletions(-) diff --git a/src/cljs/athens/views/blocks/editor.cljs b/src/cljs/athens/views/blocks/editor.cljs index 6a8d498937..6c5036e29d 100644 --- a/src/cljs/athens/views/blocks/editor.cljs +++ b/src/cljs/athens/views/blocks/editor.cljs @@ -1,26 +1,26 @@ (ns athens.views.blocks.editor (:require - ["/components/Block/Content" :refer [Content]] - [athens.config :as config] - [athens.db :as db] - [athens.events.selection :as select-events] - [athens.parse-renderer :refer [parse-and-render]] - [athens.subs.selection :as select-subs] - [athens.util :as util] - [athens.views.blocks.autocomplete-search :as autocomplete-search] - [athens.views.blocks.autocomplete-slash :as autocomplete-slash] - [athens.views.blocks.internal-representation :as internal-representation] - [athens.views.blocks.textarea-keydown :as textarea-keydown] - [clojure.edn :as edn] - [clojure.set :as set] - [clojure.string :as str] - [goog.events :as goog-events] - [komponentit.autosize :as autosize] - [re-frame.core :as rf] - [reagent.core :as r]) + ["/components/Block/Content" :refer [Content]] + [athens.config :as config] + [athens.db :as db] + [athens.events.selection :as select-events] + [athens.parse-renderer :refer [parse-and-render]] + [athens.subs.selection :as select-subs] + [athens.util :as util] + [athens.views.blocks.autocomplete-search :as autocomplete-search] + [athens.views.blocks.autocomplete-slash :as autocomplete-slash] + [athens.views.blocks.internal-representation :as internal-representation] + [athens.views.blocks.textarea-keydown :as textarea-keydown] + [clojure.edn :as edn] + [clojure.set :as set] + [clojure.string :as str] + [goog.events :as goog-events] + [komponentit.autosize :as autosize] + [re-frame.core :as rf] + [reagent.core :as r]) (:import - (goog.events - EventType))) + (goog.events + EventType))) (defn enter-handler-new-line @@ -272,6 +272,6 @@ :on-mouse-enter (fn [e] (textarea-mouse-enter e uid)) :on-mouse-down (fn [e] (textarea-mouse-down e uid))}]) [parse-and-render @read-value (or original-uid uid)]] - [autocomplete-search/inline-search-el block state-hooks last-event] - [autocomplete-slash/slash-menu-el block last-event]])))) + (when editing? [autocomplete-search/inline-search-el block state-hooks last-event] + [autocomplete-slash/slash-menu-el block last-event])])))) diff --git a/src/js/components/Block/Autocomplete.tsx b/src/js/components/Block/Autocomplete.tsx index 0f1a18deb8..f22e26a549 100644 --- a/src/js/components/Block/Autocomplete.tsx +++ b/src/js/components/Block/Autocomplete.tsx @@ -7,7 +7,8 @@ import { PopoverTrigger, useOutsideClick, PopoverContent, - Portal + Portal, + ButtonProps } from '@chakra-ui/react'; import getCaretCoordinates from '@/../textarea' @@ -34,11 +35,12 @@ const scrollToEl = (el) => { } } -export const AutocompleteButton = ({ children, onClick, isActive, ...props }) => { +export const AutocompleteButton = (props: ButtonProps) => { + const { children, onClick, isActive, ...buttonProps } = props; const buttonRef = React.useRef(null); React.useEffect(() => { - if (isActive) { + if (isActive && buttonRef.current) { scrollToEl(buttonRef.current); } }, [isActive]); @@ -47,6 +49,7 @@ export const AutocompleteButton = ({ children, onClick, isActive, ...props }) => @@ -74,38 +76,28 @@ export const AutocompleteButton = ({ children, onClick, isActive, ...props }) => } export const Autocomplete = ({ isOpen, onClose, event, children }) => { - // Early return with nothing, to avoid rendering all - // the juicy portaling goodness. - if (!isOpen) { - return null; - } - const menuRef = React.useRef(null); - const lastEventTargetValue = React.useRef(null); - const currentEventPosition = React.useRef({ left: null, top: null }); - const newEventTargetValue = event?.target?.value; - const isNewEvent = newEventTargetValue !== lastEventTargetValue.current; + const [menuPosition, setMenuPosition] = React.useState({ left: null, top: null }); useOutsideClick({ ref: menuRef, handler: () => onClose(), }) - if (isOpen && isNewEvent) { - currentEventPosition.current = getCaretPositionFromKeyDownEvent(event) - }; - - lastEventTargetValue.current = newEventTargetValue; + React.useEffect(() => { + if (isOpen) { + setMenuPosition(getCaretPositionFromKeyDownEvent(event)) + } + }, [isOpen]); return ( @@ -116,14 +108,13 @@ export const Autocomplete = ({ isOpen, onClose, event, children }) => { width="1px" height="1.5em" zIndex="100" - left={currentEventPosition.current.left + 'px'} - top={currentEventPosition.current.top + "px"} + left={menuPosition?.left || 0 + 'px'} + top={menuPosition?.top || 0 + "px"} > { ref={menuRef} p={0} overflow="auto" - maxHeight={`calc(100vh - 2rem - 2rem - ${currentEventPosition.current.top}px)`} + maxHeight={`calc(100vh - 2rem - 2rem - ${menuPosition?.top || 0}px)`} > {children} From 7be8d140f765107f6b8417ff81922f501d562b3d Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Mon, 15 Aug 2022 23:03:15 -0400 Subject: [PATCH 13/32] lint --- src/cljs/athens/views/blocks/editor.cljs | 40 +++++++++---------- src/cljs/athens/views/right_sidebar/core.cljs | 2 +- 2 files changed, 21 insertions(+), 21 deletions(-) diff --git a/src/cljs/athens/views/blocks/editor.cljs b/src/cljs/athens/views/blocks/editor.cljs index 6c5036e29d..8f582c3d75 100644 --- a/src/cljs/athens/views/blocks/editor.cljs +++ b/src/cljs/athens/views/blocks/editor.cljs @@ -1,26 +1,26 @@ (ns athens.views.blocks.editor (:require - ["/components/Block/Content" :refer [Content]] - [athens.config :as config] - [athens.db :as db] - [athens.events.selection :as select-events] - [athens.parse-renderer :refer [parse-and-render]] - [athens.subs.selection :as select-subs] - [athens.util :as util] - [athens.views.blocks.autocomplete-search :as autocomplete-search] - [athens.views.blocks.autocomplete-slash :as autocomplete-slash] - [athens.views.blocks.internal-representation :as internal-representation] - [athens.views.blocks.textarea-keydown :as textarea-keydown] - [clojure.edn :as edn] - [clojure.set :as set] - [clojure.string :as str] - [goog.events :as goog-events] - [komponentit.autosize :as autosize] - [re-frame.core :as rf] - [reagent.core :as r]) + ["/components/Block/Content" :refer [Content]] + [athens.config :as config] + [athens.db :as db] + [athens.events.selection :as select-events] + [athens.parse-renderer :refer [parse-and-render]] + [athens.subs.selection :as select-subs] + [athens.util :as util] + [athens.views.blocks.autocomplete-search :as autocomplete-search] + [athens.views.blocks.autocomplete-slash :as autocomplete-slash] + [athens.views.blocks.internal-representation :as internal-representation] + [athens.views.blocks.textarea-keydown :as textarea-keydown] + [clojure.edn :as edn] + [clojure.set :as set] + [clojure.string :as str] + [goog.events :as goog-events] + [komponentit.autosize :as autosize] + [re-frame.core :as rf] + [reagent.core :as r]) (:import - (goog.events - EventType))) + (goog.events + EventType))) (defn enter-handler-new-line diff --git a/src/cljs/athens/views/right_sidebar/core.cljs b/src/cljs/athens/views/right_sidebar/core.cljs index f527af0b85..d78f0376ad 100644 --- a/src/cljs/athens/views/right_sidebar/core.cljs +++ b/src/cljs/athens/views/right_sidebar/core.cljs @@ -7,7 +7,7 @@ [athens.views.right-sidebar.events] [athens.views.right-sidebar.shared :as shared] [athens.views.right-sidebar.subs] - [re-frame.core :as rf :refer [dispatch]])) + [re-frame.core :as rf])) ;; Components From 334525340427e4897e76384b97a554ea38afd2af Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Mon, 15 Aug 2022 23:04:58 -0400 Subject: [PATCH 14/32] improvement: new daily notes scrolling behavior --- src/js/components/Page/Page.tsx | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/src/js/components/Page/Page.tsx b/src/js/components/Page/Page.tsx index 070160a9a3..581fdfc779 100644 --- a/src/js/components/Page/Page.tsx +++ b/src/js/components/Page/Page.tsx @@ -7,13 +7,12 @@ import { useInView } from "react-intersection-observer"; import { ArrowRightOnBoxIcon, ArrowLeftOnBoxIcon } from '@/Icons/Icons'; import { withErrorBoundary } from "react-error-boundary"; import { motion } from 'framer-motion'; +import { layoutAnimationTransition } from '@/Layout/useLayoutState'; const PAGE_PROPS = { as: "article", display: "grid", - flexBasis: "100%", - alignSelf: "stretch", gridTemplateAreas: "'header' 'content' 'footer'", gridTemplateRows: "auto 1fr auto", transitionProperty: "background", @@ -153,13 +152,11 @@ const DailyNotePageError = () => { className="node-page daily-notes" boxShadow="page" bg="background.floor" - alignSelf="stretch" display="flex" borderWidth="1px" borderStyle="solid" borderColor="separator.divider" borderRadius="0.5rem" - minHeight="calc(100vh - 10rem)" textAlign="center" p={12} color="foreground.secondary" @@ -179,7 +176,7 @@ export const DailyNotesPage = withErrorBoundary((props: DailyNotesPageProps) => const { children, onFirstAppear, ...boxProps } = props const hasAppeared = React.useRef(false); - const { ref, inView } = useInView({ threshold: 1, triggerOnce: true, delay: 50 }); + const { ref, inView } = useInView({ threshold: 1, triggerOnce: true, delay: 10 }); if (!hasAppeared.current) { if (inView && onFirstAppear) { @@ -195,17 +192,20 @@ export const DailyNotesPage = withErrorBoundary((props: DailyNotesPageProps) => as={motion.div} initial={{ opacity: 0, + height: 0, + translateY: "10vh", }} animate={{ opacity: 1, - transition: { - duration: 0.5, - } + translateY: 0, + height: "auto", + transition: layoutAnimationTransition }} exit={{ opacity: 0, + height: 0, + translateY: "10vh", }} - ref={ref} className="node-page daily-notes" boxShadow="page" bg="background.floor" @@ -213,9 +213,9 @@ export const DailyNotesPage = withErrorBoundary((props: DailyNotesPageProps) => borderStyle="solid" borderColor="separator.divider" borderRadius="0.5rem" - minHeight="calc(100vh - 10rem)" > {children} + ) }, { fallback: From d379df8b4b7d36e05da63e4979648f91ee7dd770 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Mon, 15 Aug 2022 23:09:12 -0400 Subject: [PATCH 15/32] fix: more predictable daily scrolling behavior --- src/js/components/Page/Page.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/js/components/Page/Page.tsx b/src/js/components/Page/Page.tsx index 581fdfc779..058507a402 100644 --- a/src/js/components/Page/Page.tsx +++ b/src/js/components/Page/Page.tsx @@ -207,6 +207,7 @@ export const DailyNotesPage = withErrorBoundary((props: DailyNotesPageProps) => translateY: "10vh", }} className="node-page daily-notes" + overflow="hidden" boxShadow="page" bg="background.floor" borderWidth="1px" From 3591f348db71ec12f1f49f4978bc4e1c9cfbf1b2 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Mon, 15 Aug 2022 23:12:31 -0400 Subject: [PATCH 16/32] minor tweaks to daily --- src/cljs/athens/views/pages/daily_notes.cljs | 3 +-- src/js/components/Page/Page.tsx | 3 +-- 2 files changed, 2 insertions(+), 4 deletions(-) diff --git a/src/cljs/athens/views/pages/daily_notes.cljs b/src/cljs/athens/views/pages/daily_notes.cljs index ae012baa1f..e6cb77edfb 100644 --- a/src/cljs/athens/views/pages/daily_notes.cljs +++ b/src/cljs/athens/views/pages/daily_notes.cljs @@ -31,11 +31,10 @@ (if (empty? @note-refs) (dispatch [:daily-note/next (dates/get-day)]) (let [notes (reactive-pull-many @note-refs)] - [:> VStack {:alignSelf "stretch" :align "stretch" :py 16 :px [2 4 8] :spacing 8} + [:> VStack {:alignSelf "stretch" :display "block" :py 16 :px [2 4 8] :spacing 8} [:> AnimatePresence {:initial false} (doall (for [{:keys [block/uid]} notes] - [:> DailyNotesPage {:key uid ;; only the last gets onFirstAppear :onFirstAppear (if (= (last @note-refs) uid) diff --git a/src/js/components/Page/Page.tsx b/src/js/components/Page/Page.tsx index 058507a402..5826d78a0b 100644 --- a/src/js/components/Page/Page.tsx +++ b/src/js/components/Page/Page.tsx @@ -198,7 +198,7 @@ export const DailyNotesPage = withErrorBoundary((props: DailyNotesPageProps) => animate={{ opacity: 1, translateY: 0, - height: "auto", + height: "fit-content", transition: layoutAnimationTransition }} exit={{ @@ -207,7 +207,6 @@ export const DailyNotesPage = withErrorBoundary((props: DailyNotesPageProps) => translateY: "10vh", }} className="node-page daily-notes" - overflow="hidden" boxShadow="page" bg="background.floor" borderWidth="1px" From 2b0fb35ff704216079275fe5945b747e3ab89199 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Mon, 15 Aug 2022 23:16:00 -0400 Subject: [PATCH 17/32] fix: pages should stretch-sorry --- src/js/components/Page/Page.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/js/components/Page/Page.tsx b/src/js/components/Page/Page.tsx index 5826d78a0b..377084d4cd 100644 --- a/src/js/components/Page/Page.tsx +++ b/src/js/components/Page/Page.tsx @@ -13,6 +13,7 @@ import { layoutAnimationTransition } from '@/Layout/useLayoutState'; const PAGE_PROPS = { as: "article", display: "grid", + alignSelf: "stretch", gridTemplateAreas: "'header' 'content' 'footer'", gridTemplateRows: "auto 1fr auto", transitionProperty: "background", From c2e701c2c355021a642108f6b05de01b035a37be Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Tue, 16 Aug 2022 07:31:28 -0400 Subject: [PATCH 18/32] fix: remove console log --- src/js/components/Layout/RightSidebar.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/js/components/Layout/RightSidebar.tsx b/src/js/components/Layout/RightSidebar.tsx index 5c9702372f..d8df64b0cb 100644 --- a/src/js/components/Layout/RightSidebar.tsx +++ b/src/js/components/Layout/RightSidebar.tsx @@ -15,8 +15,6 @@ interface RightSidebarProps extends BoxProps { export const RightSidebar = (props: RightSidebarProps) => { const { children, rightSidebarWidth, isOpen } = props; - console.log(rightSidebarWidth) - const { toolbarHeight } = React.useContext(LayoutContext); From 6b62ab485e033e06ba92711af4dd4658c17a48d0 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Tue, 16 Aug 2022 19:17:23 -0400 Subject: [PATCH 19/32] fix: don't mount autocomplete els too often --- src/cljs/athens/views/blocks/editor.cljs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/cljs/athens/views/blocks/editor.cljs b/src/cljs/athens/views/blocks/editor.cljs index 8f582c3d75..59490c50c8 100644 --- a/src/cljs/athens/views/blocks/editor.cljs +++ b/src/cljs/athens/views/blocks/editor.cljs @@ -272,6 +272,6 @@ :on-mouse-enter (fn [e] (textarea-mouse-enter e uid)) :on-mouse-down (fn [e] (textarea-mouse-down e uid))}]) [parse-and-render @read-value (or original-uid uid)]] - (when editing? [autocomplete-search/inline-search-el block state-hooks last-event] + (when @is-editing? [autocomplete-search/inline-search-el block state-hooks last-event] [autocomplete-slash/slash-menu-el block last-event])])))) From 00c5ac29419bdd37be520990672123a4de8cd432 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Tue, 16 Aug 2022 19:17:40 -0400 Subject: [PATCH 20/32] fix: faster daily notes --- src/cljs/athens/views/pages/daily_notes.cljs | 32 +++++---- src/js/components/Page/Page.tsx | 70 +++++++++----------- 2 files changed, 51 insertions(+), 51 deletions(-) diff --git a/src/cljs/athens/views/pages/daily_notes.cljs b/src/cljs/athens/views/pages/daily_notes.cljs index e6cb77edfb..31f8317da5 100644 --- a/src/cljs/athens/views/pages/daily_notes.cljs +++ b/src/cljs/athens/views/pages/daily_notes.cljs @@ -1,8 +1,6 @@ (ns athens.views.pages.daily-notes (:require - ["/components/Page/Page" :refer [DailyNotesPage]] - ["@chakra-ui/react" :refer [VStack]] - ["framer-motion" :refer [AnimatePresence]] + ["/components/Page/Page" :refer [DailyNotesPage DailyNotesList]] [athens.dates :as dates] [athens.reactive :as reactive] [athens.views.pages.node-page :as node-page] @@ -26,18 +24,24 @@ (defn page [] (let [note-refs (subscribe [:daily-notes/items]) - get-next-note #(dispatch [:daily-note/next (dates/get-day (dates/uid-to-date (last @note-refs)) 1)])] + get-another-note #(dispatch [:daily-note/next (dates/get-day (dates/uid-to-date (last @note-refs)) 1)])] (fn [] (if (empty? @note-refs) (dispatch [:daily-note/next (dates/get-day)]) (let [notes (reactive-pull-many @note-refs)] - [:> VStack {:alignSelf "stretch" :display "block" :py 16 :px [2 4 8] :spacing 8} - [:> AnimatePresence {:initial false} - (doall - (for [{:keys [block/uid]} notes] - [:> DailyNotesPage {:key uid - ;; only the last gets onFirstAppear - :onFirstAppear (if (= (last @note-refs) uid) - get-next-note - nil)} - [node-page/page [:block/uid uid]]]))]]))))) + [:> DailyNotesList {:id "daily-notes" + :onGetAnotherNote get-another-note + :minHeight "calc(100vh + 1px)" + :height "calc(100vh + 1px)" + :display "flex" + :overflowY "auto" + :gap "1.5rem" + :px "2rem" + :alignItems "center" + :flex "1 1 100%" + :flexDirection "column"} + (doall + (for [{:keys [block/uid]} notes] + [:> DailyNotesPage {:key uid + :isReal true} + [node-page/page [:block/uid uid]]]))]))))) diff --git a/src/js/components/Page/Page.tsx b/src/js/components/Page/Page.tsx index 377084d4cd..686386707d 100644 --- a/src/js/components/Page/Page.tsx +++ b/src/js/components/Page/Page.tsx @@ -1,13 +1,11 @@ import React from 'react'; import { - Button, Divider, Center, Box, Heading, Image, IconButton, ButtonGroup, FormControl, Input, + Button, VStack, Divider, Center, Box, Heading, Image, IconButton, ButtonGroup, FormControl, Input, Tooltip, FormLabel, BoxProps } from '@chakra-ui/react'; -import { useInView } from "react-intersection-observer"; import { ArrowRightOnBoxIcon, ArrowLeftOnBoxIcon } from '@/Icons/Icons'; +import { useInView } from 'react-intersection-observer'; import { withErrorBoundary } from "react-error-boundary"; -import { motion } from 'framer-motion'; -import { layoutAnimationTransition } from '@/Layout/useLayoutState'; const PAGE_PROPS = { @@ -168,56 +166,54 @@ const DailyNotePageError = () => { ) } +interface DailyNotesListProps extends BoxProps { + onGetAnotherNote: () => void; +} + +export const DailyNotesList = (props: DailyNotesListProps) => { + const { onGetAnotherNote, ...boxProps } = props; + const listRef = React.useRef(null) + const { ref, inView } = useInView({ threshold: 0 }); + + React.useLayoutEffect(() => { + if (inView) { + onGetAnotherNote(); + } + }); + + return + {boxProps.children} + + + + Earlier + + + -interface DailyNotesPageProps extends BoxProps { - onFirstAppear?: () => void } -export const DailyNotesPage = withErrorBoundary((props: DailyNotesPageProps) => { - const { children, onFirstAppear, ...boxProps } = props - const hasAppeared = React.useRef(false); - const { ref, inView } = useInView({ threshold: 1, triggerOnce: true, delay: 10 }); +interface DailyNotesPageProps extends BoxProps { + isReal: boolean; +} - if (!hasAppeared.current) { - if (inView && onFirstAppear) { - onFirstAppear(); - hasAppeared.current = true; - } - } +export const DailyNotesPage = withErrorBoundary((props: DailyNotesPageProps) => { + const { isReal, ...boxProps } = props return ( - {children} - - ) + />) }, { fallback: }); From 585b9f1f91c8ce28ac5f863655b099993c3fc8c0 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Tue, 16 Aug 2022 19:43:49 -0400 Subject: [PATCH 21/32] fix: better icon sizing in comments --- src/cljs/athens/views/comments/inline.cljs | 4 ++-- src/js/components/Comments/Comments.tsx | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/cljs/athens/views/comments/inline.cljs b/src/cljs/athens/views/comments/inline.cljs index 4fe01e5562..d4f7fcd429 100644 --- a/src/cljs/athens/views/comments/inline.cljs +++ b/src/cljs/athens/views/comments/inline.cljs @@ -180,11 +180,11 @@ :onClick #(reset! hide? (not @hide?))}) (if @hide? [:<> - [:> ChevronRightIcon] + [:> ChevronRightIcon {:boxSize 3.5}] [:> CommentCounter {:count num-comments}] [:> Text {:pl 1.5} "Comments"]] [:<> - [:> ChevronDownIcon] + [:> ChevronDownIcon {:boxSize 3.5}] [:> CommentCounter {:count num-comments}] [:> Text {:pl 1.5} "Comments"]])]) diff --git a/src/js/components/Comments/Comments.tsx b/src/js/components/Comments/Comments.tsx index b5af2c0b39..a4269f9bf0 100644 --- a/src/js/components/Comments/Comments.tsx +++ b/src/js/components/Comments/Comments.tsx @@ -53,8 +53,8 @@ const formatCount = (count: number): string => { export const CommentCounter = ({ count }) => { return - - {formatCount(count)} + + {formatCount(count)} } From ab133bf0d174aa6aa9b13a704e62e4fb50194a7b Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Tue, 16 Aug 2022 20:14:28 -0400 Subject: [PATCH 22/32] minor progress on slash menus --- src/js/components/Block/Autocomplete.tsx | 23 ++++++++++++++++------- 1 file changed, 16 insertions(+), 7 deletions(-) diff --git a/src/js/components/Block/Autocomplete.tsx b/src/js/components/Block/Autocomplete.tsx index f22e26a549..b5c4b773e5 100644 --- a/src/js/components/Block/Autocomplete.tsx +++ b/src/js/components/Block/Autocomplete.tsx @@ -36,7 +36,7 @@ const scrollToEl = (el) => { } export const AutocompleteButton = (props: ButtonProps) => { - const { children, onClick, isActive, ...buttonProps } = props; + const { children, isActive, ...buttonProps } = props; const buttonRef = React.useRef(null); React.useEffect(() => { @@ -85,11 +85,21 @@ export const Autocomplete = ({ isOpen, onClose, event, children }) => { }) React.useEffect(() => { - if (isOpen) { - setMenuPosition(getCaretPositionFromKeyDownEvent(event)) + const target = event?.target; + if (isOpen && target) { + const position = getCaretPositionFromKeyDownEvent(event); + if (position.left && position.top) { + setMenuPosition(position); + } else { + onClose(); + } } }, [isOpen]); + if (!isOpen) { + return false; + } + return ( { > From 153bc64fc59dcb811d30a058da6d3597fb9da340 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Tue, 16 Aug 2022 20:27:27 -0400 Subject: [PATCH 23/32] fix: autocomplete menus work again --- package.json | 1 + src/cljs/athens/views/blocks/editor.cljs | 4 +- src/js/components/Block/Autocomplete.tsx | 13 +- src/js/textarea.js | 155 ----------------------- yarn.lock | 5 + 5 files changed, 16 insertions(+), 162 deletions(-) delete mode 100644 src/js/textarea.js diff --git a/package.json b/package.json index 4f2b30bd89..0877696244 100644 --- a/package.json +++ b/package.json @@ -136,6 +136,7 @@ "react-highlight.js": "1.0.7", "react-intersection-observer": "^8.32.1", "react-window": "^1.8.6", + "textarea-caret": "^3.1.0", "tslib": "^2.3.1" }, "devDependencies": { diff --git a/src/cljs/athens/views/blocks/editor.cljs b/src/cljs/athens/views/blocks/editor.cljs index 59490c50c8..6a8d498937 100644 --- a/src/cljs/athens/views/blocks/editor.cljs +++ b/src/cljs/athens/views/blocks/editor.cljs @@ -272,6 +272,6 @@ :on-mouse-enter (fn [e] (textarea-mouse-enter e uid)) :on-mouse-down (fn [e] (textarea-mouse-down e uid))}]) [parse-and-render @read-value (or original-uid uid)]] - (when @is-editing? [autocomplete-search/inline-search-el block state-hooks last-event] - [autocomplete-slash/slash-menu-el block last-event])])))) + [autocomplete-search/inline-search-el block state-hooks last-event] + [autocomplete-slash/slash-menu-el block last-event]])))) diff --git a/src/js/components/Block/Autocomplete.tsx b/src/js/components/Block/Autocomplete.tsx index b5c4b773e5..99fef41b31 100644 --- a/src/js/components/Block/Autocomplete.tsx +++ b/src/js/components/Block/Autocomplete.tsx @@ -10,16 +10,18 @@ import { Portal, ButtonProps } from '@chakra-ui/react'; -import getCaretCoordinates from '@/../textarea' +import getCaretCoordinates from 'textarea-caret'; const getCaretPositionFromKeyDownEvent = (event) => { if (event?.target) { - const localCaretCoordinates = getCaretCoordinates(event?.target); + const target = event.target; + const selectionStart = target.selectionStart; + const { left: caretLeft, top: caretTop, height: caretHeight } = getCaretCoordinates(event.target, selectionStart); const { x: targetLeft, y: targetTop } = event?.target.getBoundingClientRect(); const position = { - left: localCaretCoordinates.left + targetLeft, - top: localCaretCoordinates.top + targetTop, - height: localCaretCoordinates.height + targetLeft, + left: caretLeft + targetLeft, + top: caretTop + targetTop, + height: caretHeight + targetTop, } return position; } @@ -105,6 +107,7 @@ export const Autocomplete = ({ isOpen, onClose, event, children }) => { isOpen={isOpen} placement="bottom-start" isLazy + offset={[0, 0]} size="sm" returnFocusOnClose={false} closeOnBlur={false} diff --git a/src/js/textarea.js b/src/js/textarea.js deleted file mode 100644 index 7ce576864b..0000000000 --- a/src/js/textarea.js +++ /dev/null @@ -1,155 +0,0 @@ -/* jshint browser: true */ - -(function () { - -// We'll copy the properties below into the mirror div. -// Note that some browsers, such as Firefox, do not concatenate properties -// into their shorthand (e.g. padding-top, padding-bottom etc. -> padding), -// so we have to list every single property explicitly. -var properties = [ - 'direction', // RTL support - 'boxSizing', - 'width', // on Chrome and IE, exclude the scrollbar, so the mirror div wraps exactly as the textarea does - 'height', - 'overflowX', - 'overflowY', // copy the scrollbar for IE - - 'borderTopWidth', - 'borderRightWidth', - 'borderBottomWidth', - 'borderLeftWidth', - 'borderStyle', - - 'paddingTop', - 'paddingRight', - 'paddingBottom', - 'paddingLeft', - - // https://developer.mozilla.org/en-US/docs/Web/CSS/font - 'fontStyle', - 'fontVariant', - 'fontWeight', - 'fontStretch', - 'fontSize', - 'fontSizeAdjust', - 'lineHeight', - 'fontFamily', - - 'textAlign', - 'textTransform', - 'textIndent', - 'textDecoration', // might not make a difference, but better be safe - - 'letterSpacing', - 'wordSpacing', - - 'tabSize', - 'MozTabSize' - -]; - -var isBrowser = (typeof window !== 'undefined'); -var isFirefox = (isBrowser && window.mozInnerScreenX != null); - -function getCaretCoordinates(element, position, options) { - if (!isBrowser) { - throw new Error('textarea-caret-position#getCaretCoordinates should only be called in a browser'); - } - - var debug = options && options.debug || false; - if (debug) { - var el = document.querySelector('#input-textarea-caret-position-mirror-div'); - if (el) el.parentNode.removeChild(el); - } - - // The mirror div will replicate the textarea's style - var div = document.createElement('div'); - div.id = 'input-textarea-caret-position-mirror-div'; - document.body.appendChild(div); - - var style = div.style; - var computed = window.getComputedStyle ? window.getComputedStyle(element) : element.currentStyle; // currentStyle for IE < 9 - var isInput = element.nodeName === 'INPUT'; - - // Default textarea styles - style.whiteSpace = 'pre-wrap'; - if (!isInput) - style.wordWrap = 'break-word'; // only for textarea-s - - // Position off-screen - style.position = 'absolute'; // required to return coordinates properly - if (!debug) - style.visibility = 'hidden'; // not 'display: none' because we want rendering - - // Transfer the element's properties to the div - properties.forEach(function (prop) { - if (isInput && prop === 'lineHeight') { - // Special case for s because text is rendered centered and line height may be != height - if (computed.boxSizing === "border-box") { - var height = parseInt(computed.height); - var outerHeight = - parseInt(computed.paddingTop) + - parseInt(computed.paddingBottom) + - parseInt(computed.borderTopWidth) + - parseInt(computed.borderBottomWidth); - var targetHeight = outerHeight + parseInt(computed.lineHeight); - if (height > targetHeight) { - style.lineHeight = height - outerHeight + "px"; - } else if (height === targetHeight) { - style.lineHeight = computed.lineHeight; - } else { - style.lineHeight = 0; - } - } else { - style.lineHeight = computed.height; - } - } else { - style[prop] = computed[prop]; - } - }); - - if (isFirefox) { - // Firefox lies about the overflow property for textareas: https://bugzilla.mozilla.org/show_bug.cgi?id=984275 - if (element.scrollHeight > parseInt(computed.height)) - style.overflowY = 'scroll'; - } else { - style.overflow = 'hidden'; // for Chrome to not render a scrollbar; IE keeps overflowY = 'scroll' - } - - div.textContent = element.value.substring(0, position); - // The second special handling for input type="text" vs textarea: - // spaces need to be replaced with non-breaking spaces - http://stackoverflow.com/a/13402035/1269037 - if (isInput) - div.textContent = div.textContent.replace(/\s/g, '\u00a0'); - - var span = document.createElement('span'); - // Wrapping must be replicated *exactly*, including when a long word gets - // onto the next line, with whitespace at the end of the line before (#7). - // The *only* reliable way to do that is to copy the *entire* rest of the - // textarea's content into the created at the caret position. - // For inputs, just '.' would be enough, but no need to bother. - span.textContent = element.value.substring(position) || '.'; // || because a completely empty faux span doesn't render at all - div.appendChild(span); - - var coordinates = { - top: span.offsetTop + parseInt(computed['borderTopWidth']), - left: span.offsetLeft + parseInt(computed['borderLeftWidth']), - height: parseInt(computed['lineHeight']) - }; - - if (debug) { - span.style.backgroundColor = '#aaa'; - } else { - document.body.removeChild(div); - } - - return coordinates; -} - -if (typeof module != 'undefined' && typeof module.exports != 'undefined') { - module.exports = getCaretCoordinates; -} else if(isBrowser) { - window.getCaretCoordinates = getCaretCoordinates; -} - -}()); diff --git a/yarn.lock b/yarn.lock index 6d468f064d..0fde2b1f93 100644 --- a/yarn.lock +++ b/yarn.lock @@ -14048,6 +14048,11 @@ text-table@0.2.0: resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4" integrity sha1-f17oI66AUgfACvLfSoTsP8+lcLQ= +textarea-caret@^3.1.0: + version "3.1.0" + resolved "https://registry.yarnpkg.com/textarea-caret/-/textarea-caret-3.1.0.tgz#5d5a35bb035fd06b2ff0e25d5359e97f2655087f" + integrity sha512-cXAvzO9pP5CGa6NKx0WYHl+8CHKZs8byMkt3PCJBCmq2a34YA9pO1NrQET5pzeqnBjBdToF5No4rrmkDUgQC2Q== + throttle-debounce@^3.0.1: version "3.0.1" resolved "https://registry.yarnpkg.com/throttle-debounce/-/throttle-debounce-3.0.1.tgz#32f94d84dfa894f786c9a1f290e7a645b6a19abb" From 3a8171a5f7c98ed6a87fbcf9027cae4395d98343 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Tue, 16 Aug 2022 23:01:27 -0400 Subject: [PATCH 24/32] fix: import textarea pos correctly --- src/cljs/athens/util.cljs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/cljs/athens/util.cljs b/src/cljs/athens/util.cljs index 1d0199f1ea..df091b8196 100644 --- a/src/cljs/athens/util.cljs +++ b/src/cljs/athens/util.cljs @@ -1,8 +1,8 @@ (ns athens.util (:require - ["/textarea" :as getCaretCoordinates] ["/theme/theme" :refer [theme]] ["@chakra-ui/react" :refer [createStandaloneToast]] + ["textarea-caret" :as getCaretCoordinates] [athens.config :as config] [athens.electron.utils :as electron.utils] [clojure.string :as string] From 754a1c56090e9785ec446592b4b11532bdd1725f Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Tue, 16 Aug 2022 23:02:21 -0400 Subject: [PATCH 25/32] update icons --- src/cljs/athens/views/blocks/core.cljs | 4 +- src/cljs/athens/views/left_sidebar.cljs | 4 +- src/js/components/AppToolbar/AppToolbar.tsx | 6 +- src/js/components/Comments/Comments.tsx | 4 +- src/js/components/Icons/Icons.tsx | 543 ++++++++++++-------- 5 files changed, 326 insertions(+), 235 deletions(-) diff --git a/src/cljs/athens/views/blocks/core.cljs b/src/cljs/athens/views/blocks/core.cljs index 7f7eb55c59..293d82cb72 100644 --- a/src/cljs/athens/views/blocks/core.cljs +++ b/src/cljs/athens/views/blocks/core.cljs @@ -5,7 +5,7 @@ ["/components/Block/PropertyName" :refer [PropertyName]] ["/components/Block/Reactions" :refer [Reactions]] ["/components/Block/Toggle" :refer [Toggle]] - ["/components/Icons/Icons" :refer [BlockEmbedIcon TextIcon ChatIcon ArchiveIcon]] + ["/components/Icons/Icons" :refer [BlockEmbedIcon TextIcon ChatBubbleIcon ArchiveIcon]] ["/components/References/InlineReferences" :refer [ReferenceGroup ReferenceBlock]] ["@chakra-ui/react" :refer [Box Breadcrumb BreadcrumbItem BreadcrumbLink Button Divider HStack MenuDivider MenuItem MenuList VStack]] [athens.common-db :as common-db] @@ -375,7 +375,7 @@ (when comments-enabled? [:> MenuItem {:children "Add comment" :onClick #(ctx-menu/handle-click-comment % uid) - :icon (r/as-element [:> ChatIcon])}]) + :icon (r/as-element [:> ChatBubbleIcon])}]) (when reactions-enabled? [:<> [:> MenuDivider] diff --git a/src/cljs/athens/views/left_sidebar.cljs b/src/cljs/athens/views/left_sidebar.cljs index 8d3847a3f4..90546606e2 100644 --- a/src/cljs/athens/views/left_sidebar.cljs +++ b/src/cljs/athens/views/left_sidebar.cljs @@ -1,6 +1,6 @@ (ns athens.views.left-sidebar (:require - ["/components/Icons/Icons" :refer [DailyNotesIcon AllPagesIcon SearchIcon GraphIcon]] + ["/components/Icons/Icons" :refer [CalendarEditFillIcon AllPagesIcon SearchIcon GraphIcon]] ["/components/Layout/MainSidebar" :refer [MainSidebar]] ["/components/SidebarShortcuts/List" :refer [List]] ["@chakra-ui/react" :refer [Button VStack Flex Heading ButtonGroup Link Flex]] @@ -45,7 +45,7 @@ :justifyContent "start" :leftIcon (r/as-element [:> SearchIcon])} "Find or Create a Page"] - [route-button (= route-name :home) "Daily Notes" (r/as-element [:> DailyNotesIcon]) (fn [_] + [route-button (= route-name :home) "Daily Notes" (r/as-element [:> CalendarEditFillIcon]) (fn [_] (rf/dispatch [:reporting/navigation {:source :main-sidebar :target :home :pane :main-pane}]) diff --git a/src/js/components/AppToolbar/AppToolbar.tsx b/src/js/components/AppToolbar/AppToolbar.tsx index 98fd8a7103..852630768b 100644 --- a/src/js/components/AppToolbar/AppToolbar.tsx +++ b/src/js/components/AppToolbar/AppToolbar.tsx @@ -4,13 +4,13 @@ import { RightSidebarIcon, MenuIcon, HelpIcon, - ChatFilledIcon, + ChatBubbleFillIcon, ChevronLeftIcon, ChevronRightIcon, SettingsIcon, ContrastIcon, EllipsisHorizontalCircleIcon, - ChatIcon, + ChatBubbleIcon, } from '@/Icons/Icons'; import { @@ -244,7 +244,7 @@ export const AppToolbar = (props: AppToolbarProps): React.ReactElement => { } }, - icon: isShowComments ? : + icon: isShowComments ? : }, { label: "Help", diff --git a/src/js/components/Comments/Comments.tsx b/src/js/components/Comments/Comments.tsx index a4269f9bf0..550d25eb5a 100644 --- a/src/js/components/Comments/Comments.tsx +++ b/src/js/components/Comments/Comments.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { Box, Text, HStack, Textarea, Button, MenuList, MenuItem } from '@chakra-ui/react' -import { ChatFilledIcon } from '@/Icons/Icons' +import { ChatFillIcon } from '@/Icons/Icons' import { useContextMenu } from '@/utils/useContextMenu'; import { withErrorBoundary } from "react-error-boundary"; @@ -53,7 +53,7 @@ const formatCount = (count: number): string => { export const CommentCounter = ({ count }) => { return - + {formatCount(count)} } diff --git a/src/js/components/Icons/Icons.tsx b/src/js/components/Icons/Icons.tsx index 87437b58fd..7cfdbb5691 100644 --- a/src/js/components/Icons/Icons.tsx +++ b/src/js/components/Icons/Icons.tsx @@ -1,592 +1,683 @@ +import React from 'react'; + import { createIcon } from '@chakra-ui/react' export const AllPagesIcon = createIcon({ displayName: 'AllPagesIcon', - viewBox: '0 0 24 24', - path: ( - <> - ), -}); - -export const ArrowAngleUpLeftIcon = createIcon({ - displayName: 'ArrowAngleUpLeftIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const ArchiveIcon = createIcon({ displayName: 'ArchiveIcon', - viewBox: '0 0 24 24', - path: ( - - ), -}); -export const BulletIcon = createIcon({ - displayName: 'BulletIcon', - viewBox: '0 0 24 24', - path: ( - - ), -}); - -export const ColonIcon = createIcon({ - displayName: 'ColonIcon', - viewBox: '0 0 24 24', - path: ( - - ), -}); - - -export const BellFillIcon = createIcon({ - displayName: 'BellFillIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> - - - + <> ), }); - -export const BellIcon = createIcon({ - displayName: 'BellIcon', - viewBox: '0 0 24 24', +export const ArrowAngleUpLeftIcon = createIcon({ + displayName: 'ArrowAngleUpLeftIcon', + viewBox: '0 0 14 14', path: ( - + <> ), }); - - export const ArrowLeftIcon = createIcon({ displayName: 'ArrowLeftIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const ArrowLeftOnBoxIcon = createIcon({ displayName: 'ArrowLeftOnBoxIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const ArrowLeftOnBoxFillIcon = createIcon({ displayName: 'ArrowLeftOnBoxFillIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const ArrowRightIcon = createIcon({ displayName: 'ArrowRightIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const ArrowRightOnBoxIcon = createIcon({ displayName: 'ArrowRightOnBoxIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const ArrowRightOnBoxFillIcon = createIcon({ displayName: 'ArrowRightOnBoxFillIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); -export const BlockIcon = createIcon({ - displayName: 'BlockIcon', - viewBox: '0 0 24 24', +export const BellIcon = createIcon({ + displayName: 'BellIcon', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); -export const TextIcon = createIcon({ - displayName: 'TextIcon', - viewBox: '0 0 24 24', +export const BellFillIcon = createIcon({ + displayName: 'BellFillIcon', + viewBox: '0 0 14 14', path: ( - <> + <> + ), +}); + +export const BlockIcon = createIcon({ + displayName: 'BlockIcon', + viewBox: '0 0 14 14', + path: ( + <> ), }); export const BlockAddIcon = createIcon({ displayName: 'BlockAddIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const BlockEmbedIcon = createIcon({ displayName: 'BlockEmbedIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const BlockFillIcon = createIcon({ displayName: 'BlockFillIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const BlockFillAddIcon = createIcon({ displayName: 'BlockFillAddIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const BookmarkIcon = createIcon({ displayName: 'BookmarkIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); + +export const BookmarkFill-1Icon = createIcon({ + displayName: 'BookmarkFill-1Icon', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const BookmarkFillIcon = createIcon({ displayName: 'BookmarkFillIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); + +export const BulletIcon = createIcon({ + displayName: 'BulletIcon', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); + +export const CalendarIcon = createIcon({ + displayName: 'CalendarIcon', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); + +export const CalendarBookmarkIcon = createIcon({ + displayName: 'CalendarBookmarkIcon', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); + +export const CalendarBookmarkFillIcon = createIcon({ + displayName: 'CalendarBookmarkFillIcon', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); + +export const CalendarCheckmarkIcon = createIcon({ + displayName: 'CalendarCheckmarkIcon', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); + +export const CalendarCheckmarkFillIcon = createIcon({ + displayName: 'CalendarCheckmarkFillIcon', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); + +export const CalendarCircleFillIcon = createIcon({ + displayName: 'CalendarCircleFillIcon', + viewBox: '0 0 14 14', path: ( - <> + <> + ), +}); + +export const CalendarEditIcon = createIcon({ + displayName: 'CalendarEditIcon', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); + +export const CalendarEditFillIcon = createIcon({ + displayName: 'CalendarEditFillIcon', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); + +export const CalendarFillIcon = createIcon({ + displayName: 'CalendarFillIcon', + viewBox: '0 0 14 14', + path: ( + <> ), }); export const CalendarNowIcon = createIcon({ displayName: 'CalendarNowIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); + +export const CalendarTimeNowIcon = createIcon({ + displayName: 'CalendarTimeNowIcon', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); + +export const CalendarTimeNowFillIcon = createIcon({ + displayName: 'CalendarTimeNowFillIcon', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const CalendarTomorrowIcon = createIcon({ displayName: 'CalendarTomorrowIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> + ), +}); + +export const CalendarTomorrowFillIcon = createIcon({ + displayName: 'CalendarTomorrowFillIcon', + viewBox: '0 0 14 14', + path: ( + <> ), }); export const CalendarYesterdayIcon = createIcon({ displayName: 'CalendarYesterdayIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); -export const ChatIcon = createIcon({ - d: "M7.85355 20.1464L8.38388 20.6768H8.38388L7.85355 20.1464ZM11.7071 16.2929L11.1768 15.7626L11.7071 16.2929ZM2.75 6C2.75 4.75736 3.75736 3.75 5 3.75V2.25C2.92893 2.25 1.25 3.92893 1.25 6H2.75ZM2.75 13V6H1.25V13H2.75ZM5 15.25C3.75736 15.25 2.75 14.2426 2.75 13H1.25C1.25 15.0711 2.92893 16.75 5 16.75V15.25ZM6 15.25H5V16.75H6V15.25ZM7.75 19.7929V17H6.25V19.7929H7.75ZM7.32322 19.6161C7.48072 19.4586 7.75 19.5702 7.75 19.7929H6.25C6.25 20.9065 7.59642 21.4642 8.38388 20.6768L7.32322 19.6161ZM11.1768 15.7626L7.32322 19.6161L8.38388 20.6768L12.2374 16.8232L11.1768 15.7626ZM19 15.25H12.4142V16.75H19V15.25ZM21.25 13C21.25 14.2426 20.2426 15.25 19 15.25V16.75C21.0711 16.75 22.75 15.0711 22.75 13H21.25ZM21.25 6V13H22.75V6H21.25ZM19 3.75C20.2426 3.75 21.25 4.75736 21.25 6H22.75C22.75 3.92893 21.0711 2.25 19 2.25V3.75ZM5 3.75H19V2.25H5V3.75ZM12.2374 16.8232C12.2843 16.7763 12.3479 16.75 12.4142 16.75V15.25C11.9501 15.25 11.505 15.4344 11.1768 15.7626L12.2374 16.8232ZM6 16.75C6.13807 16.75 6.25 16.8619 6.25 17H7.75C7.75 16.0335 6.9665 15.25 6 15.25V16.75Z", - displayName: "ChatIcon", - viewBox: "0 0 24 24", -}) +export const CalendarYesterdayFillIcon = createIcon({ + displayName: 'CalendarYesterdayFillIcon', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); -export const ChatFilledIcon = createIcon({ - d: "M5 3.25C2.92893 3.25 1.25 4.92893 1.25 7V14C1.25 16.0711 2.92893 17.75 5 17.75H5.25V20.5858C5.25 22.1449 7.135 22.9257 8.23744 21.8232L12.3107 17.75H19C21.0711 17.75 22.75 16.0711 22.75 14V7C22.75 4.92893 21.0711 3.25 19 3.25H5Z", - displayName: "ChatFilledIcon", - viewBox: "0 0 24 24", -}) +export const ChatBubbleIcon = createIcon({ + displayName: 'ChatBubbleIcon', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); +export const ChatBubbleFillIcon = createIcon({ + displayName: 'ChatBubbleFillIcon', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); export const CheckboxIcon = createIcon({ displayName: 'CheckboxIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const CheckmarkIcon = createIcon({ displayName: 'CheckmarkIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const CheckmarkCircleFillIcon = createIcon({ displayName: 'CheckmarkCircleFillIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const ChevronDownIcon = createIcon({ displayName: 'ChevronDownIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const ChevronLeftIcon = createIcon({ displayName: 'ChevronLeftIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const ChevronRightIcon = createIcon({ displayName: 'ChevronRightIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const ChevronUpIcon = createIcon({ displayName: 'ChevronUpIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); -export const ContrastFillIcon = createIcon({ - displayName: 'ContrastFillIcon', - viewBox: '0 0 24 24', +export const ColonIcon = createIcon({ + displayName: 'ColonIcon', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const ContrastIcon = createIcon({ displayName: 'ContrastIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - + <> + ), +}); +export const ContrastFillIcon = createIcon({ + displayName: 'ContrastFillIcon', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); +export const ControlsIcon = createIcon({ + displayName: 'ControlsIcon', + viewBox: '0 0 14 14', + path: ( + <> ), }); export const DailyNotesIcon = createIcon({ displayName: 'DailyNotesIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const DashIcon = createIcon({ displayName: 'DashIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - + <> ), }); -export const DragIcon = createIcon({ - displayName: 'DragIcon', - viewBox: '0 0 24 24', - path: ( - - ), -}); - - export const EllipsisHorizontalIcon = createIcon({ displayName: 'EllipsisHorizontalIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const EllipsisHorizontalCircleIcon = createIcon({ displayName: 'EllipsisHorizontalCircleIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - + <> ), }); export const ExclamationCircleFillIcon = createIcon({ displayName: 'ExclamationCircleFillIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const GraphIcon = createIcon({ displayName: 'GraphIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const HTMLEmbedIcon = createIcon({ displayName: 'HTMLEmbedIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); -export const HelpFillIcon = createIcon({ - displayName: 'HelpFillIcon', - viewBox: '0 0 24 24', +export const HelpIcon = createIcon({ + displayName: 'HelpIcon', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); -export const HelpIcon = createIcon({ - displayName: 'HelpIcon', - viewBox: '0 0 24 24', +export const HelpFillIcon = createIcon({ + displayName: 'HelpFillIcon', + viewBox: '0 0 14 14', path: ( - - + <> ), }); export const LinkedIcon = createIcon({ displayName: 'LinkedIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const MenuIcon = createIcon({ displayName: 'MenuIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const PageIcon = createIcon({ displayName: 'PageIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const PageAddIcon = createIcon({ displayName: 'PageAddIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const PageFillIcon = createIcon({ displayName: 'PageFillIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const ParenLeftIcon = createIcon({ displayName: 'ParenLeftIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const ParenRightIcon = createIcon({ displayName: 'ParenRightIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const PencilIcon = createIcon({ displayName: 'PencilIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const PencilLineIcon = createIcon({ displayName: 'PencilLineIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const PersonIcon = createIcon({ displayName: 'PersonIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - + <> ), }); export const PersonCircleIcon = createIcon({ displayName: 'PersonCircleIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - + <> ), }); export const PlusIcon = createIcon({ displayName: 'PlusIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); + +export const PlusSquareIcon = createIcon({ + displayName: 'PlusSquareIcon', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const RightSidebarIcon = createIcon({ displayName: 'RightSidebarIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - < > - - - + <> ), }); export const RightSidebarAddIcon = createIcon({ displayName: 'RightSidebarAddIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - + <> ), }); export const SearchIcon = createIcon({ displayName: 'SearchIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const SettingsIcon = createIcon({ displayName: 'SettingsIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - + <> ), }); export const SettingsFillIcon = createIcon({ displayName: 'SettingsFillIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const TemplateIcon = createIcon({ displayName: 'TemplateIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); -export const TimeNowIcon = createIcon({ - displayName: 'TimeNowIcon', - viewBox: '0 0 24 24', +export const TextIcon = createIcon({ + displayName: 'TextIcon', + viewBox: '0 0 14 14', + path: ( + <> + ), +}); + +export const ThumbsUpIcon = createIcon({ + displayName: 'ThumbsUpIcon', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); -export const ThumbUpIcon = createIcon({ - displayName: 'ThumbUpIcon', - viewBox: '0 0 24 24', +export const ThumbsUpFillIcon = createIcon({ + displayName: 'ThumbsUpFillIcon', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); -export const ThumbUpFillIcon = createIcon({ - displayName: 'ThumbUpFillIcon', - viewBox: '0 0 24 24', +export const TimeNowIcon = createIcon({ + displayName: 'TimeNowIcon', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const TrashIcon = createIcon({ displayName: 'TrashIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const UnlinkedIcon = createIcon({ displayName: 'UnlinkedIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); -export const ViewIcon = createIcon({ - displayName: "ViewIcon", - path: ( - - - - - ), -}) - -export const ViewOffIcon = createIcon({ - displayName: "ViewOffIcon", - path: ( - - - - - ), -}) - export const XmarkIcon = createIcon({ displayName: 'XmarkIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); export const YoutubeIcon = createIcon({ displayName: 'YoutubeIcon', - viewBox: '0 0 24 24', + viewBox: '0 0 14 14', path: ( - <> + <> ), }); - From 092c6af1748e855dc83c5bbc14b20b5aa72ce38f Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Tue, 16 Aug 2022 23:05:58 -0400 Subject: [PATCH 26/32] fix: correct icon attr casing --- src/js/components/Icons/Icons.tsx | 170 +++++++++++++++--------------- 1 file changed, 85 insertions(+), 85 deletions(-) diff --git a/src/js/components/Icons/Icons.tsx b/src/js/components/Icons/Icons.tsx index 7cfdbb5691..82dce67ddc 100644 --- a/src/js/components/Icons/Icons.tsx +++ b/src/js/components/Icons/Icons.tsx @@ -6,7 +6,7 @@ export const AllPagesIcon = createIcon({ displayName: 'AllPagesIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -14,7 +14,7 @@ export const ArchiveIcon = createIcon({ displayName: 'ArchiveIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -22,7 +22,7 @@ export const ArrowAngleUpLeftIcon = createIcon({ displayName: 'ArrowAngleUpLeftIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -30,7 +30,7 @@ export const ArrowLeftIcon = createIcon({ displayName: 'ArrowLeftIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -38,7 +38,7 @@ export const ArrowLeftOnBoxIcon = createIcon({ displayName: 'ArrowLeftOnBoxIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -46,7 +46,7 @@ export const ArrowLeftOnBoxFillIcon = createIcon({ displayName: 'ArrowLeftOnBoxFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -54,7 +54,7 @@ export const ArrowRightIcon = createIcon({ displayName: 'ArrowRightIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -62,7 +62,7 @@ export const ArrowRightOnBoxIcon = createIcon({ displayName: 'ArrowRightOnBoxIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -70,7 +70,7 @@ export const ArrowRightOnBoxFillIcon = createIcon({ displayName: 'ArrowRightOnBoxFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -78,7 +78,7 @@ export const BellIcon = createIcon({ displayName: 'BellIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -86,7 +86,7 @@ export const BellFillIcon = createIcon({ displayName: 'BellFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -94,7 +94,7 @@ export const BlockIcon = createIcon({ displayName: 'BlockIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -102,7 +102,7 @@ export const BlockAddIcon = createIcon({ displayName: 'BlockAddIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -110,7 +110,7 @@ export const BlockEmbedIcon = createIcon({ displayName: 'BlockEmbedIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -118,7 +118,7 @@ export const BlockFillIcon = createIcon({ displayName: 'BlockFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -126,7 +126,7 @@ export const BlockFillAddIcon = createIcon({ displayName: 'BlockFillAddIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -134,7 +134,7 @@ export const BookmarkIcon = createIcon({ displayName: 'BookmarkIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -142,7 +142,7 @@ export const BookmarkFill-1Icon = createIcon({ displayName: 'BookmarkFill-1Icon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -150,7 +150,7 @@ export const BookmarkFillIcon = createIcon({ displayName: 'BookmarkFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -158,7 +158,7 @@ export const BulletIcon = createIcon({ displayName: 'BulletIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -166,7 +166,7 @@ export const CalendarIcon = createIcon({ displayName: 'CalendarIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -174,7 +174,7 @@ export const CalendarBookmarkIcon = createIcon({ displayName: 'CalendarBookmarkIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -182,7 +182,7 @@ export const CalendarBookmarkFillIcon = createIcon({ displayName: 'CalendarBookmarkFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -190,7 +190,7 @@ export const CalendarCheckmarkIcon = createIcon({ displayName: 'CalendarCheckmarkIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -198,7 +198,7 @@ export const CalendarCheckmarkFillIcon = createIcon({ displayName: 'CalendarCheckmarkFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -206,7 +206,7 @@ export const CalendarCircleFillIcon = createIcon({ displayName: 'CalendarCircleFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -214,7 +214,7 @@ export const CalendarEditIcon = createIcon({ displayName: 'CalendarEditIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -222,7 +222,7 @@ export const CalendarEditFillIcon = createIcon({ displayName: 'CalendarEditFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -230,7 +230,7 @@ export const CalendarFillIcon = createIcon({ displayName: 'CalendarFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -238,7 +238,7 @@ export const CalendarNowIcon = createIcon({ displayName: 'CalendarNowIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -246,7 +246,7 @@ export const CalendarTimeNowIcon = createIcon({ displayName: 'CalendarTimeNowIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -254,7 +254,7 @@ export const CalendarTimeNowFillIcon = createIcon({ displayName: 'CalendarTimeNowFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -262,7 +262,7 @@ export const CalendarTomorrowIcon = createIcon({ displayName: 'CalendarTomorrowIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -270,7 +270,7 @@ export const CalendarTomorrowFillIcon = createIcon({ displayName: 'CalendarTomorrowFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -278,7 +278,7 @@ export const CalendarYesterdayIcon = createIcon({ displayName: 'CalendarYesterdayIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -286,7 +286,7 @@ export const CalendarYesterdayFillIcon = createIcon({ displayName: 'CalendarYesterdayFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -294,7 +294,7 @@ export const ChatBubbleIcon = createIcon({ displayName: 'ChatBubbleIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -302,7 +302,7 @@ export const ChatBubbleFillIcon = createIcon({ displayName: 'ChatBubbleFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -310,7 +310,7 @@ export const CheckboxIcon = createIcon({ displayName: 'CheckboxIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -318,7 +318,7 @@ export const CheckmarkIcon = createIcon({ displayName: 'CheckmarkIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -326,7 +326,7 @@ export const CheckmarkCircleFillIcon = createIcon({ displayName: 'CheckmarkCircleFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -334,7 +334,7 @@ export const ChevronDownIcon = createIcon({ displayName: 'ChevronDownIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -342,7 +342,7 @@ export const ChevronLeftIcon = createIcon({ displayName: 'ChevronLeftIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -350,7 +350,7 @@ export const ChevronRightIcon = createIcon({ displayName: 'ChevronRightIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -358,7 +358,7 @@ export const ChevronUpIcon = createIcon({ displayName: 'ChevronUpIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -366,7 +366,7 @@ export const ColonIcon = createIcon({ displayName: 'ColonIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -374,7 +374,7 @@ export const ContrastIcon = createIcon({ displayName: 'ContrastIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -382,7 +382,7 @@ export const ContrastFillIcon = createIcon({ displayName: 'ContrastFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -390,7 +390,7 @@ export const ControlsIcon = createIcon({ displayName: 'ControlsIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -398,7 +398,7 @@ export const DailyNotesIcon = createIcon({ displayName: 'DailyNotesIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -406,7 +406,7 @@ export const DashIcon = createIcon({ displayName: 'DashIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -414,7 +414,7 @@ export const EllipsisHorizontalIcon = createIcon({ displayName: 'EllipsisHorizontalIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -422,7 +422,7 @@ export const EllipsisHorizontalCircleIcon = createIcon({ displayName: 'EllipsisHorizontalCircleIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -430,7 +430,7 @@ export const ExclamationCircleFillIcon = createIcon({ displayName: 'ExclamationCircleFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -438,7 +438,7 @@ export const GraphIcon = createIcon({ displayName: 'GraphIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -446,7 +446,7 @@ export const HTMLEmbedIcon = createIcon({ displayName: 'HTMLEmbedIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -454,7 +454,7 @@ export const HelpIcon = createIcon({ displayName: 'HelpIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -462,7 +462,7 @@ export const HelpFillIcon = createIcon({ displayName: 'HelpFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -470,7 +470,7 @@ export const LinkedIcon = createIcon({ displayName: 'LinkedIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -478,7 +478,7 @@ export const MenuIcon = createIcon({ displayName: 'MenuIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -486,7 +486,7 @@ export const PageIcon = createIcon({ displayName: 'PageIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -494,7 +494,7 @@ export const PageAddIcon = createIcon({ displayName: 'PageAddIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -502,7 +502,7 @@ export const PageFillIcon = createIcon({ displayName: 'PageFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -510,7 +510,7 @@ export const ParenLeftIcon = createIcon({ displayName: 'ParenLeftIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -518,7 +518,7 @@ export const ParenRightIcon = createIcon({ displayName: 'ParenRightIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -526,7 +526,7 @@ export const PencilIcon = createIcon({ displayName: 'PencilIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -534,7 +534,7 @@ export const PencilLineIcon = createIcon({ displayName: 'PencilLineIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -542,7 +542,7 @@ export const PersonIcon = createIcon({ displayName: 'PersonIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -550,7 +550,7 @@ export const PersonCircleIcon = createIcon({ displayName: 'PersonCircleIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -558,7 +558,7 @@ export const PlusIcon = createIcon({ displayName: 'PlusIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -566,7 +566,7 @@ export const PlusSquareIcon = createIcon({ displayName: 'PlusSquareIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -574,7 +574,7 @@ export const RightSidebarIcon = createIcon({ displayName: 'RightSidebarIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -582,7 +582,7 @@ export const RightSidebarAddIcon = createIcon({ displayName: 'RightSidebarAddIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -590,7 +590,7 @@ export const SearchIcon = createIcon({ displayName: 'SearchIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -598,7 +598,7 @@ export const SettingsIcon = createIcon({ displayName: 'SettingsIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -606,7 +606,7 @@ export const SettingsFillIcon = createIcon({ displayName: 'SettingsFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -614,7 +614,7 @@ export const TemplateIcon = createIcon({ displayName: 'TemplateIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -622,7 +622,7 @@ export const TextIcon = createIcon({ displayName: 'TextIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -630,7 +630,7 @@ export const ThumbsUpIcon = createIcon({ displayName: 'ThumbsUpIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -638,7 +638,7 @@ export const ThumbsUpFillIcon = createIcon({ displayName: 'ThumbsUpFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -646,7 +646,7 @@ export const TimeNowIcon = createIcon({ displayName: 'TimeNowIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -654,7 +654,7 @@ export const TrashIcon = createIcon({ displayName: 'TrashIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -662,7 +662,7 @@ export const UnlinkedIcon = createIcon({ displayName: 'UnlinkedIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -670,7 +670,7 @@ export const XmarkIcon = createIcon({ displayName: 'XmarkIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -678,6 +678,6 @@ export const YoutubeIcon = createIcon({ displayName: 'YoutubeIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); From 029ecb92396b1e03e774cf6af54f71313244cba3 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Tue, 16 Aug 2022 23:06:43 -0400 Subject: [PATCH 27/32] chore: lint --- src/cljs/athens/views/left_sidebar.cljs | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/cljs/athens/views/left_sidebar.cljs b/src/cljs/athens/views/left_sidebar.cljs index 90546606e2..cf9d370e7e 100644 --- a/src/cljs/athens/views/left_sidebar.cljs +++ b/src/cljs/athens/views/left_sidebar.cljs @@ -46,10 +46,10 @@ :leftIcon (r/as-element [:> SearchIcon])} "Find or Create a Page"] [route-button (= route-name :home) "Daily Notes" (r/as-element [:> CalendarEditFillIcon]) (fn [_] - (rf/dispatch [:reporting/navigation {:source :main-sidebar - :target :home - :pane :main-pane}]) - (router/nav-daily-notes))] + (rf/dispatch [:reporting/navigation {:source :main-sidebar + :target :home + :pane :main-pane}]) + (router/nav-daily-notes))] [route-button (= route-name :pages) "All Pages" (r/as-element [:> AllPagesIcon]) (fn [_] (rf/dispatch [:reporting/navigation {:source :main-sidebar :target :all-pages From 4e2d250f256d527fabe7c75bbff05c29e9f1a301 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Tue, 16 Aug 2022 23:07:11 -0400 Subject: [PATCH 28/32] fix: remove broken icon --- src/js/components/Icons/Icons.tsx | 8 -------- 1 file changed, 8 deletions(-) diff --git a/src/js/components/Icons/Icons.tsx b/src/js/components/Icons/Icons.tsx index 82dce67ddc..ed26ab3485 100644 --- a/src/js/components/Icons/Icons.tsx +++ b/src/js/components/Icons/Icons.tsx @@ -138,14 +138,6 @@ export const BookmarkIcon = createIcon({ ), }); -export const BookmarkFill-1Icon = createIcon({ - displayName: 'BookmarkFill-1Icon', - viewBox: '0 0 14 14', - path: ( - <> - ), -}); - export const BookmarkFillIcon = createIcon({ displayName: 'BookmarkFillIcon', viewBox: '0 0 14 14', From fed68c28ae2f9108042a9fb1cc0c27b255f97220 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Tue, 16 Aug 2022 23:09:20 -0400 Subject: [PATCH 29/32] fix: hide debug cursor --- src/js/components/Block/Autocomplete.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/js/components/Block/Autocomplete.tsx b/src/js/components/Block/Autocomplete.tsx index 99fef41b31..91781da5c2 100644 --- a/src/js/components/Block/Autocomplete.tsx +++ b/src/js/components/Block/Autocomplete.tsx @@ -116,8 +116,9 @@ export const Autocomplete = ({ isOpen, onClose, event, children }) => { Date: Tue, 16 Aug 2022 23:29:41 -0400 Subject: [PATCH 30/32] fix: misc issues --- src/js/components/Block/Autocomplete.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/js/components/Block/Autocomplete.tsx b/src/js/components/Block/Autocomplete.tsx index 91781da5c2..8d70470a03 100644 --- a/src/js/components/Block/Autocomplete.tsx +++ b/src/js/components/Block/Autocomplete.tsx @@ -118,7 +118,7 @@ export const Autocomplete = ({ isOpen, onClose, event, children }) => { bg="red" visibility="hidden" position="fixed" - width="1px" + width="px" height="1.5em" zIndex="100" left={menuPosition.left + 'px'} From 5a75a0ede0c638484cba6234a95d9112f746bcf5 Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Tue, 16 Aug 2022 23:30:02 -0400 Subject: [PATCH 31/32] fix: misc issues --- src/cljs/athens/views/comments/inline.cljs | 4 +- src/js/components/Comments/Comments.tsx | 4 +- src/js/components/Icons/Icons.tsx | 176 +++++++++++---------- src/js/theme/theme.js | 2 +- 4 files changed, 97 insertions(+), 89 deletions(-) diff --git a/src/cljs/athens/views/comments/inline.cljs b/src/cljs/athens/views/comments/inline.cljs index d4f7fcd429..4fe01e5562 100644 --- a/src/cljs/athens/views/comments/inline.cljs +++ b/src/cljs/athens/views/comments/inline.cljs @@ -180,11 +180,11 @@ :onClick #(reset! hide? (not @hide?))}) (if @hide? [:<> - [:> ChevronRightIcon {:boxSize 3.5}] + [:> ChevronRightIcon] [:> CommentCounter {:count num-comments}] [:> Text {:pl 1.5} "Comments"]] [:<> - [:> ChevronDownIcon {:boxSize 3.5}] + [:> ChevronDownIcon] [:> CommentCounter {:count num-comments}] [:> Text {:pl 1.5} "Comments"]])]) diff --git a/src/js/components/Comments/Comments.tsx b/src/js/components/Comments/Comments.tsx index 550d25eb5a..9a3a8ed1ae 100644 --- a/src/js/components/Comments/Comments.tsx +++ b/src/js/components/Comments/Comments.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { Box, Text, HStack, Textarea, Button, MenuList, MenuItem } from '@chakra-ui/react' -import { ChatFillIcon } from '@/Icons/Icons' +import { ChatBubbleFillIcon } from '@/Icons/Icons' import { useContextMenu } from '@/utils/useContextMenu'; import { withErrorBoundary } from "react-error-boundary"; @@ -53,7 +53,7 @@ const formatCount = (count: number): string => { export const CommentCounter = ({ count }) => { return - + {formatCount(count)} } diff --git a/src/js/components/Icons/Icons.tsx b/src/js/components/Icons/Icons.tsx index ed26ab3485..7cfdbb5691 100644 --- a/src/js/components/Icons/Icons.tsx +++ b/src/js/components/Icons/Icons.tsx @@ -6,7 +6,7 @@ export const AllPagesIcon = createIcon({ displayName: 'AllPagesIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -14,7 +14,7 @@ export const ArchiveIcon = createIcon({ displayName: 'ArchiveIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -22,7 +22,7 @@ export const ArrowAngleUpLeftIcon = createIcon({ displayName: 'ArrowAngleUpLeftIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -30,7 +30,7 @@ export const ArrowLeftIcon = createIcon({ displayName: 'ArrowLeftIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -38,7 +38,7 @@ export const ArrowLeftOnBoxIcon = createIcon({ displayName: 'ArrowLeftOnBoxIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -46,7 +46,7 @@ export const ArrowLeftOnBoxFillIcon = createIcon({ displayName: 'ArrowLeftOnBoxFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -54,7 +54,7 @@ export const ArrowRightIcon = createIcon({ displayName: 'ArrowRightIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -62,7 +62,7 @@ export const ArrowRightOnBoxIcon = createIcon({ displayName: 'ArrowRightOnBoxIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -70,7 +70,7 @@ export const ArrowRightOnBoxFillIcon = createIcon({ displayName: 'ArrowRightOnBoxFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -78,7 +78,7 @@ export const BellIcon = createIcon({ displayName: 'BellIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -86,7 +86,7 @@ export const BellFillIcon = createIcon({ displayName: 'BellFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -94,7 +94,7 @@ export const BlockIcon = createIcon({ displayName: 'BlockIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -102,7 +102,7 @@ export const BlockAddIcon = createIcon({ displayName: 'BlockAddIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -110,7 +110,7 @@ export const BlockEmbedIcon = createIcon({ displayName: 'BlockEmbedIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -118,7 +118,7 @@ export const BlockFillIcon = createIcon({ displayName: 'BlockFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -126,7 +126,7 @@ export const BlockFillAddIcon = createIcon({ displayName: 'BlockFillAddIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -134,7 +134,15 @@ export const BookmarkIcon = createIcon({ displayName: 'BookmarkIcon', viewBox: '0 0 14 14', path: ( - <> + <> + ), +}); + +export const BookmarkFill-1Icon = createIcon({ + displayName: 'BookmarkFill-1Icon', + viewBox: '0 0 14 14', + path: ( + <> ), }); @@ -142,7 +150,7 @@ export const BookmarkFillIcon = createIcon({ displayName: 'BookmarkFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -150,7 +158,7 @@ export const BulletIcon = createIcon({ displayName: 'BulletIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -158,7 +166,7 @@ export const CalendarIcon = createIcon({ displayName: 'CalendarIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -166,7 +174,7 @@ export const CalendarBookmarkIcon = createIcon({ displayName: 'CalendarBookmarkIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -174,7 +182,7 @@ export const CalendarBookmarkFillIcon = createIcon({ displayName: 'CalendarBookmarkFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -182,7 +190,7 @@ export const CalendarCheckmarkIcon = createIcon({ displayName: 'CalendarCheckmarkIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -190,7 +198,7 @@ export const CalendarCheckmarkFillIcon = createIcon({ displayName: 'CalendarCheckmarkFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -198,7 +206,7 @@ export const CalendarCircleFillIcon = createIcon({ displayName: 'CalendarCircleFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -206,7 +214,7 @@ export const CalendarEditIcon = createIcon({ displayName: 'CalendarEditIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -214,7 +222,7 @@ export const CalendarEditFillIcon = createIcon({ displayName: 'CalendarEditFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -222,7 +230,7 @@ export const CalendarFillIcon = createIcon({ displayName: 'CalendarFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -230,7 +238,7 @@ export const CalendarNowIcon = createIcon({ displayName: 'CalendarNowIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -238,7 +246,7 @@ export const CalendarTimeNowIcon = createIcon({ displayName: 'CalendarTimeNowIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -246,7 +254,7 @@ export const CalendarTimeNowFillIcon = createIcon({ displayName: 'CalendarTimeNowFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -254,7 +262,7 @@ export const CalendarTomorrowIcon = createIcon({ displayName: 'CalendarTomorrowIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -262,7 +270,7 @@ export const CalendarTomorrowFillIcon = createIcon({ displayName: 'CalendarTomorrowFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -270,7 +278,7 @@ export const CalendarYesterdayIcon = createIcon({ displayName: 'CalendarYesterdayIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -278,7 +286,7 @@ export const CalendarYesterdayFillIcon = createIcon({ displayName: 'CalendarYesterdayFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -286,7 +294,7 @@ export const ChatBubbleIcon = createIcon({ displayName: 'ChatBubbleIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -294,7 +302,7 @@ export const ChatBubbleFillIcon = createIcon({ displayName: 'ChatBubbleFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -302,7 +310,7 @@ export const CheckboxIcon = createIcon({ displayName: 'CheckboxIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -310,7 +318,7 @@ export const CheckmarkIcon = createIcon({ displayName: 'CheckmarkIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -318,7 +326,7 @@ export const CheckmarkCircleFillIcon = createIcon({ displayName: 'CheckmarkCircleFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -326,7 +334,7 @@ export const ChevronDownIcon = createIcon({ displayName: 'ChevronDownIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -334,7 +342,7 @@ export const ChevronLeftIcon = createIcon({ displayName: 'ChevronLeftIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -342,7 +350,7 @@ export const ChevronRightIcon = createIcon({ displayName: 'ChevronRightIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -350,7 +358,7 @@ export const ChevronUpIcon = createIcon({ displayName: 'ChevronUpIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -358,7 +366,7 @@ export const ColonIcon = createIcon({ displayName: 'ColonIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -366,7 +374,7 @@ export const ContrastIcon = createIcon({ displayName: 'ContrastIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -374,7 +382,7 @@ export const ContrastFillIcon = createIcon({ displayName: 'ContrastFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -382,7 +390,7 @@ export const ControlsIcon = createIcon({ displayName: 'ControlsIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -390,7 +398,7 @@ export const DailyNotesIcon = createIcon({ displayName: 'DailyNotesIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -398,7 +406,7 @@ export const DashIcon = createIcon({ displayName: 'DashIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -406,7 +414,7 @@ export const EllipsisHorizontalIcon = createIcon({ displayName: 'EllipsisHorizontalIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -414,7 +422,7 @@ export const EllipsisHorizontalCircleIcon = createIcon({ displayName: 'EllipsisHorizontalCircleIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -422,7 +430,7 @@ export const ExclamationCircleFillIcon = createIcon({ displayName: 'ExclamationCircleFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -430,7 +438,7 @@ export const GraphIcon = createIcon({ displayName: 'GraphIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -438,7 +446,7 @@ export const HTMLEmbedIcon = createIcon({ displayName: 'HTMLEmbedIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -446,7 +454,7 @@ export const HelpIcon = createIcon({ displayName: 'HelpIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -454,7 +462,7 @@ export const HelpFillIcon = createIcon({ displayName: 'HelpFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -462,7 +470,7 @@ export const LinkedIcon = createIcon({ displayName: 'LinkedIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -470,7 +478,7 @@ export const MenuIcon = createIcon({ displayName: 'MenuIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -478,7 +486,7 @@ export const PageIcon = createIcon({ displayName: 'PageIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -486,7 +494,7 @@ export const PageAddIcon = createIcon({ displayName: 'PageAddIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -494,7 +502,7 @@ export const PageFillIcon = createIcon({ displayName: 'PageFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -502,7 +510,7 @@ export const ParenLeftIcon = createIcon({ displayName: 'ParenLeftIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -510,7 +518,7 @@ export const ParenRightIcon = createIcon({ displayName: 'ParenRightIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -518,7 +526,7 @@ export const PencilIcon = createIcon({ displayName: 'PencilIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -526,7 +534,7 @@ export const PencilLineIcon = createIcon({ displayName: 'PencilLineIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -534,7 +542,7 @@ export const PersonIcon = createIcon({ displayName: 'PersonIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -542,7 +550,7 @@ export const PersonCircleIcon = createIcon({ displayName: 'PersonCircleIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -550,7 +558,7 @@ export const PlusIcon = createIcon({ displayName: 'PlusIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -558,7 +566,7 @@ export const PlusSquareIcon = createIcon({ displayName: 'PlusSquareIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -566,7 +574,7 @@ export const RightSidebarIcon = createIcon({ displayName: 'RightSidebarIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -574,7 +582,7 @@ export const RightSidebarAddIcon = createIcon({ displayName: 'RightSidebarAddIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -582,7 +590,7 @@ export const SearchIcon = createIcon({ displayName: 'SearchIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -590,7 +598,7 @@ export const SettingsIcon = createIcon({ displayName: 'SettingsIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -598,7 +606,7 @@ export const SettingsFillIcon = createIcon({ displayName: 'SettingsFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -606,7 +614,7 @@ export const TemplateIcon = createIcon({ displayName: 'TemplateIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -614,7 +622,7 @@ export const TextIcon = createIcon({ displayName: 'TextIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -622,7 +630,7 @@ export const ThumbsUpIcon = createIcon({ displayName: 'ThumbsUpIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -630,7 +638,7 @@ export const ThumbsUpFillIcon = createIcon({ displayName: 'ThumbsUpFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -638,7 +646,7 @@ export const TimeNowIcon = createIcon({ displayName: 'TimeNowIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -646,7 +654,7 @@ export const TrashIcon = createIcon({ displayName: 'TrashIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -654,7 +662,7 @@ export const UnlinkedIcon = createIcon({ displayName: 'UnlinkedIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -662,7 +670,7 @@ export const XmarkIcon = createIcon({ displayName: 'XmarkIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -670,6 +678,6 @@ export const YoutubeIcon = createIcon({ displayName: 'YoutubeIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); diff --git a/src/js/theme/theme.js b/src/js/theme/theme.js index 7b6c4b52fe..1d7bdb063e 100644 --- a/src/js/theme/theme.js +++ b/src/js/theme/theme.js @@ -331,7 +331,7 @@ const components = { outline: 'none', boxShadow: 'focus' }, - "svg": { + "> .chakra-button__icon, > .chakra-icon": { fontSize: buttonIconFontSize[size], } }), From 70b3829ef1218531eff3fda01f3370ceef4e115b Mon Sep 17 00:00:00 2001 From: Stuart Hanberg Date: Wed, 17 Aug 2022 08:12:05 -0400 Subject: [PATCH 32/32] fix: remove broken icon --- src/js/components/Icons/Icons.tsx | 176 ++++++++++++++---------------- 1 file changed, 84 insertions(+), 92 deletions(-) diff --git a/src/js/components/Icons/Icons.tsx b/src/js/components/Icons/Icons.tsx index 7cfdbb5691..340cd13ab8 100644 --- a/src/js/components/Icons/Icons.tsx +++ b/src/js/components/Icons/Icons.tsx @@ -6,7 +6,7 @@ export const AllPagesIcon = createIcon({ displayName: 'AllPagesIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -14,7 +14,7 @@ export const ArchiveIcon = createIcon({ displayName: 'ArchiveIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -22,7 +22,7 @@ export const ArrowAngleUpLeftIcon = createIcon({ displayName: 'ArrowAngleUpLeftIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -30,7 +30,7 @@ export const ArrowLeftIcon = createIcon({ displayName: 'ArrowLeftIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -38,7 +38,7 @@ export const ArrowLeftOnBoxIcon = createIcon({ displayName: 'ArrowLeftOnBoxIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -46,7 +46,7 @@ export const ArrowLeftOnBoxFillIcon = createIcon({ displayName: 'ArrowLeftOnBoxFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -54,7 +54,7 @@ export const ArrowRightIcon = createIcon({ displayName: 'ArrowRightIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -62,7 +62,7 @@ export const ArrowRightOnBoxIcon = createIcon({ displayName: 'ArrowRightOnBoxIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -70,7 +70,7 @@ export const ArrowRightOnBoxFillIcon = createIcon({ displayName: 'ArrowRightOnBoxFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -78,7 +78,7 @@ export const BellIcon = createIcon({ displayName: 'BellIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -86,7 +86,7 @@ export const BellFillIcon = createIcon({ displayName: 'BellFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -94,7 +94,7 @@ export const BlockIcon = createIcon({ displayName: 'BlockIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -102,7 +102,7 @@ export const BlockAddIcon = createIcon({ displayName: 'BlockAddIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -110,7 +110,7 @@ export const BlockEmbedIcon = createIcon({ displayName: 'BlockEmbedIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -118,7 +118,7 @@ export const BlockFillIcon = createIcon({ displayName: 'BlockFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -126,7 +126,7 @@ export const BlockFillAddIcon = createIcon({ displayName: 'BlockFillAddIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -134,15 +134,7 @@ export const BookmarkIcon = createIcon({ displayName: 'BookmarkIcon', viewBox: '0 0 14 14', path: ( - <> - ), -}); - -export const BookmarkFill-1Icon = createIcon({ - displayName: 'BookmarkFill-1Icon', - viewBox: '0 0 14 14', - path: ( - <> + <> ), }); @@ -150,7 +142,7 @@ export const BookmarkFillIcon = createIcon({ displayName: 'BookmarkFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -158,7 +150,7 @@ export const BulletIcon = createIcon({ displayName: 'BulletIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -166,7 +158,7 @@ export const CalendarIcon = createIcon({ displayName: 'CalendarIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -174,7 +166,7 @@ export const CalendarBookmarkIcon = createIcon({ displayName: 'CalendarBookmarkIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -182,7 +174,7 @@ export const CalendarBookmarkFillIcon = createIcon({ displayName: 'CalendarBookmarkFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -190,7 +182,7 @@ export const CalendarCheckmarkIcon = createIcon({ displayName: 'CalendarCheckmarkIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -198,7 +190,7 @@ export const CalendarCheckmarkFillIcon = createIcon({ displayName: 'CalendarCheckmarkFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -206,7 +198,7 @@ export const CalendarCircleFillIcon = createIcon({ displayName: 'CalendarCircleFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -214,7 +206,7 @@ export const CalendarEditIcon = createIcon({ displayName: 'CalendarEditIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -222,7 +214,7 @@ export const CalendarEditFillIcon = createIcon({ displayName: 'CalendarEditFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -230,7 +222,7 @@ export const CalendarFillIcon = createIcon({ displayName: 'CalendarFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -238,7 +230,7 @@ export const CalendarNowIcon = createIcon({ displayName: 'CalendarNowIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -246,7 +238,7 @@ export const CalendarTimeNowIcon = createIcon({ displayName: 'CalendarTimeNowIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -254,7 +246,7 @@ export const CalendarTimeNowFillIcon = createIcon({ displayName: 'CalendarTimeNowFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -262,7 +254,7 @@ export const CalendarTomorrowIcon = createIcon({ displayName: 'CalendarTomorrowIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -270,7 +262,7 @@ export const CalendarTomorrowFillIcon = createIcon({ displayName: 'CalendarTomorrowFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -278,7 +270,7 @@ export const CalendarYesterdayIcon = createIcon({ displayName: 'CalendarYesterdayIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -286,7 +278,7 @@ export const CalendarYesterdayFillIcon = createIcon({ displayName: 'CalendarYesterdayFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -294,7 +286,7 @@ export const ChatBubbleIcon = createIcon({ displayName: 'ChatBubbleIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -302,7 +294,7 @@ export const ChatBubbleFillIcon = createIcon({ displayName: 'ChatBubbleFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -310,7 +302,7 @@ export const CheckboxIcon = createIcon({ displayName: 'CheckboxIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -318,7 +310,7 @@ export const CheckmarkIcon = createIcon({ displayName: 'CheckmarkIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -326,7 +318,7 @@ export const CheckmarkCircleFillIcon = createIcon({ displayName: 'CheckmarkCircleFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -334,7 +326,7 @@ export const ChevronDownIcon = createIcon({ displayName: 'ChevronDownIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -342,7 +334,7 @@ export const ChevronLeftIcon = createIcon({ displayName: 'ChevronLeftIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -350,7 +342,7 @@ export const ChevronRightIcon = createIcon({ displayName: 'ChevronRightIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -358,7 +350,7 @@ export const ChevronUpIcon = createIcon({ displayName: 'ChevronUpIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -366,7 +358,7 @@ export const ColonIcon = createIcon({ displayName: 'ColonIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -374,7 +366,7 @@ export const ContrastIcon = createIcon({ displayName: 'ContrastIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -382,7 +374,7 @@ export const ContrastFillIcon = createIcon({ displayName: 'ContrastFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -390,7 +382,7 @@ export const ControlsIcon = createIcon({ displayName: 'ControlsIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -398,7 +390,7 @@ export const DailyNotesIcon = createIcon({ displayName: 'DailyNotesIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -406,7 +398,7 @@ export const DashIcon = createIcon({ displayName: 'DashIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -414,7 +406,7 @@ export const EllipsisHorizontalIcon = createIcon({ displayName: 'EllipsisHorizontalIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -422,7 +414,7 @@ export const EllipsisHorizontalCircleIcon = createIcon({ displayName: 'EllipsisHorizontalCircleIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -430,7 +422,7 @@ export const ExclamationCircleFillIcon = createIcon({ displayName: 'ExclamationCircleFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -438,7 +430,7 @@ export const GraphIcon = createIcon({ displayName: 'GraphIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -446,7 +438,7 @@ export const HTMLEmbedIcon = createIcon({ displayName: 'HTMLEmbedIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -454,7 +446,7 @@ export const HelpIcon = createIcon({ displayName: 'HelpIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -462,7 +454,7 @@ export const HelpFillIcon = createIcon({ displayName: 'HelpFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -470,7 +462,7 @@ export const LinkedIcon = createIcon({ displayName: 'LinkedIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -478,7 +470,7 @@ export const MenuIcon = createIcon({ displayName: 'MenuIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -486,7 +478,7 @@ export const PageIcon = createIcon({ displayName: 'PageIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -494,7 +486,7 @@ export const PageAddIcon = createIcon({ displayName: 'PageAddIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -502,7 +494,7 @@ export const PageFillIcon = createIcon({ displayName: 'PageFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -510,7 +502,7 @@ export const ParenLeftIcon = createIcon({ displayName: 'ParenLeftIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -518,7 +510,7 @@ export const ParenRightIcon = createIcon({ displayName: 'ParenRightIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -526,7 +518,7 @@ export const PencilIcon = createIcon({ displayName: 'PencilIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -534,7 +526,7 @@ export const PencilLineIcon = createIcon({ displayName: 'PencilLineIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -542,7 +534,7 @@ export const PersonIcon = createIcon({ displayName: 'PersonIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -550,7 +542,7 @@ export const PersonCircleIcon = createIcon({ displayName: 'PersonCircleIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -558,7 +550,7 @@ export const PlusIcon = createIcon({ displayName: 'PlusIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -566,7 +558,7 @@ export const PlusSquareIcon = createIcon({ displayName: 'PlusSquareIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -574,7 +566,7 @@ export const RightSidebarIcon = createIcon({ displayName: 'RightSidebarIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -582,7 +574,7 @@ export const RightSidebarAddIcon = createIcon({ displayName: 'RightSidebarAddIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -590,7 +582,7 @@ export const SearchIcon = createIcon({ displayName: 'SearchIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -598,7 +590,7 @@ export const SettingsIcon = createIcon({ displayName: 'SettingsIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -606,7 +598,7 @@ export const SettingsFillIcon = createIcon({ displayName: 'SettingsFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -614,7 +606,7 @@ export const TemplateIcon = createIcon({ displayName: 'TemplateIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -622,7 +614,7 @@ export const TextIcon = createIcon({ displayName: 'TextIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -630,7 +622,7 @@ export const ThumbsUpIcon = createIcon({ displayName: 'ThumbsUpIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -638,7 +630,7 @@ export const ThumbsUpFillIcon = createIcon({ displayName: 'ThumbsUpFillIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -646,7 +638,7 @@ export const TimeNowIcon = createIcon({ displayName: 'TimeNowIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -654,7 +646,7 @@ export const TrashIcon = createIcon({ displayName: 'TrashIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -662,7 +654,7 @@ export const UnlinkedIcon = createIcon({ displayName: 'UnlinkedIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -670,7 +662,7 @@ export const XmarkIcon = createIcon({ displayName: 'XmarkIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), }); @@ -678,6 +670,6 @@ export const YoutubeIcon = createIcon({ displayName: 'YoutubeIcon', viewBox: '0 0 14 14', path: ( - <> + <> ), });