diff --git a/.env b/.env index 30dbae3055..45ed0fdf71 100644 --- a/.env +++ b/.env @@ -1,4 +1,6 @@ # use for download icon from figma -FIGMA_TOKEN + +FIGMA_TOKEN = figd_pndtwnAmWY1tnOGUuEYzHNe9woGdcAamrGnoXNsP + NODE_ENV AFFINE_FEATURE_FLAG_TOKEN diff --git a/libs/components/board-draw/src/components/align-panel/index.tsx b/libs/components/board-draw/src/components/align-panel/index.tsx index 3a811db22a..0b470692fd 100644 --- a/libs/components/board-draw/src/components/align-panel/index.tsx +++ b/libs/components/board-draw/src/components/align-panel/index.tsx @@ -7,7 +7,7 @@ interface AlignObject { * color: none means no color */ title: string; - icon?: string; + icon?: JSX.Element; } /** * ColorValue : none means no color @@ -35,7 +35,7 @@ export const AlignPanel = ({ onSelect?.(option); }} > - {alignOption.name} + {alignOption.icon} ); diff --git a/libs/components/board-draw/src/components/command-panel/AlignOperation.tsx b/libs/components/board-draw/src/components/command-panel/AlignOperation.tsx index 9a150c3323..5e70a8e510 100644 --- a/libs/components/board-draw/src/components/command-panel/AlignOperation.tsx +++ b/libs/components/board-draw/src/components/command-panel/AlignOperation.tsx @@ -1,6 +1,14 @@ import type { TldrawApp } from '@toeverything/components/board-state'; import type { TDShape } from '@toeverything/components/board-types'; -import { ShapeColorNoneIcon } from '@toeverything/components/icons'; +import { + AlignHorizontalCenterIcon, + AlignIcon, + AlignToBottomIcon, + AlignToLeftIcon, + AlignToRightIcon, + AlignToTopIcon, + AlignVerticalCenterIcon, +} from '@toeverything/components/icons'; import { IconButton, Popover, @@ -8,7 +16,6 @@ import { useTheme, } from '@toeverything/components/ui'; import { AlignPanel } from '../align-panel'; - interface BorderColorConfigProps { app: TldrawApp; shapes: TDShape[]; @@ -27,22 +34,32 @@ let AlignPanelArr = [ { name: 'top', title: 'Align top', + icon: , }, { name: 'centerVertical', title: 'Align Center Vertical', + icon: , }, { name: 'bottom', title: 'Align bottom', + icon: , }, { name: 'left', title: 'Align left', + icon: , + }, + { + name: 'right', + title: 'Align right', + icon: , }, { name: 'centerHorizontal', title: 'Align centerHorizontal', + icon: , }, ]; export const AlignOperation = ({ app, shapes }: BorderColorConfigProps) => { @@ -64,7 +81,7 @@ export const AlignOperation = ({ app, shapes }: BorderColorConfigProps) => { > - + diff --git a/libs/components/icons/src/auto-icons/align-horizontal-center/align-horizontal-center.svg b/libs/components/icons/src/auto-icons/align-horizontal-center/align-horizontal-center.svg new file mode 100644 index 0000000000..946c34d529 --- /dev/null +++ b/libs/components/icons/src/auto-icons/align-horizontal-center/align-horizontal-center.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/libs/components/icons/src/auto-icons/align-horizontal-center/align-horizontal-center.tsx b/libs/components/icons/src/auto-icons/align-horizontal-center/align-horizontal-center.tsx new file mode 100644 index 0000000000..adc4e0fc3a --- /dev/null +++ b/libs/components/icons/src/auto-icons/align-horizontal-center/align-horizontal-center.tsx @@ -0,0 +1,18 @@ + +// eslint-disable-next-line no-restricted-imports +import { SvgIcon, SvgIconProps } from '@mui/material'; + +export interface AlignHorizontalCenterIconProps extends Omit { + color?: string +} + +export const AlignHorizontalCenterIcon = ({ color, style, ...props}: AlignHorizontalCenterIconProps) => { + const propsStyles = {"color": color}; + const customStyles = {}; + const styles = {...propsStyles, ...customStyles, ...style} + return ( + + + + ) +}; diff --git a/libs/components/icons/src/auto-icons/align-to-bottom/align-to-bottom.svg b/libs/components/icons/src/auto-icons/align-to-bottom/align-to-bottom.svg new file mode 100644 index 0000000000..2518cc3925 --- /dev/null +++ b/libs/components/icons/src/auto-icons/align-to-bottom/align-to-bottom.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/libs/components/icons/src/auto-icons/align-to-bottom/align-to-bottom.tsx b/libs/components/icons/src/auto-icons/align-to-bottom/align-to-bottom.tsx new file mode 100644 index 0000000000..25d8363a5c --- /dev/null +++ b/libs/components/icons/src/auto-icons/align-to-bottom/align-to-bottom.tsx @@ -0,0 +1,18 @@ + +// eslint-disable-next-line no-restricted-imports +import { SvgIcon, SvgIconProps } from '@mui/material'; + +export interface AlignToBottomIconProps extends Omit { + color?: string +} + +export const AlignToBottomIcon = ({ color, style, ...props}: AlignToBottomIconProps) => { + const propsStyles = {"color": color}; + const customStyles = {}; + const styles = {...propsStyles, ...customStyles, ...style} + return ( + + + + ) +}; diff --git a/libs/components/icons/src/auto-icons/align-to-left/align-to-left.svg b/libs/components/icons/src/auto-icons/align-to-left/align-to-left.svg new file mode 100644 index 0000000000..81c33baf33 --- /dev/null +++ b/libs/components/icons/src/auto-icons/align-to-left/align-to-left.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/libs/components/icons/src/auto-icons/align-to-left/align-to-left.tsx b/libs/components/icons/src/auto-icons/align-to-left/align-to-left.tsx new file mode 100644 index 0000000000..102015be99 --- /dev/null +++ b/libs/components/icons/src/auto-icons/align-to-left/align-to-left.tsx @@ -0,0 +1,18 @@ + +// eslint-disable-next-line no-restricted-imports +import { SvgIcon, SvgIconProps } from '@mui/material'; + +export interface AlignToLeftIconProps extends Omit { + color?: string +} + +export const AlignToLeftIcon = ({ color, style, ...props}: AlignToLeftIconProps) => { + const propsStyles = {"color": color}; + const customStyles = {}; + const styles = {...propsStyles, ...customStyles, ...style} + return ( + + + + ) +}; diff --git a/libs/components/icons/src/auto-icons/align-to-right/align-to-right.svg b/libs/components/icons/src/auto-icons/align-to-right/align-to-right.svg new file mode 100644 index 0000000000..ed84addfab --- /dev/null +++ b/libs/components/icons/src/auto-icons/align-to-right/align-to-right.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/libs/components/icons/src/auto-icons/align-to-right/align-to-right.tsx b/libs/components/icons/src/auto-icons/align-to-right/align-to-right.tsx new file mode 100644 index 0000000000..b5f586d900 --- /dev/null +++ b/libs/components/icons/src/auto-icons/align-to-right/align-to-right.tsx @@ -0,0 +1,18 @@ + +// eslint-disable-next-line no-restricted-imports +import { SvgIcon, SvgIconProps } from '@mui/material'; + +export interface AlignToRightIconProps extends Omit { + color?: string +} + +export const AlignToRightIcon = ({ color, style, ...props}: AlignToRightIconProps) => { + const propsStyles = {"color": color}; + const customStyles = {}; + const styles = {...propsStyles, ...customStyles, ...style} + return ( + + + + ) +}; diff --git a/libs/components/icons/src/auto-icons/align-to-top/align-to-top.svg b/libs/components/icons/src/auto-icons/align-to-top/align-to-top.svg new file mode 100644 index 0000000000..e688501fbf --- /dev/null +++ b/libs/components/icons/src/auto-icons/align-to-top/align-to-top.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/libs/components/icons/src/auto-icons/align-to-top/align-to-top.tsx b/libs/components/icons/src/auto-icons/align-to-top/align-to-top.tsx new file mode 100644 index 0000000000..5587e0df47 --- /dev/null +++ b/libs/components/icons/src/auto-icons/align-to-top/align-to-top.tsx @@ -0,0 +1,18 @@ + +// eslint-disable-next-line no-restricted-imports +import { SvgIcon, SvgIconProps } from '@mui/material'; + +export interface AlignToTopIconProps extends Omit { + color?: string +} + +export const AlignToTopIcon = ({ color, style, ...props}: AlignToTopIconProps) => { + const propsStyles = {"color": color}; + const customStyles = {}; + const styles = {...propsStyles, ...customStyles, ...style} + return ( + + + + ) +}; diff --git a/libs/components/icons/src/auto-icons/align-vertical-center/align-vertical-center.svg b/libs/components/icons/src/auto-icons/align-vertical-center/align-vertical-center.svg new file mode 100644 index 0000000000..a58d6ed611 --- /dev/null +++ b/libs/components/icons/src/auto-icons/align-vertical-center/align-vertical-center.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/libs/components/icons/src/auto-icons/align-vertical-center/align-vertical-center.tsx b/libs/components/icons/src/auto-icons/align-vertical-center/align-vertical-center.tsx new file mode 100644 index 0000000000..4d9c28d120 --- /dev/null +++ b/libs/components/icons/src/auto-icons/align-vertical-center/align-vertical-center.tsx @@ -0,0 +1,18 @@ + +// eslint-disable-next-line no-restricted-imports +import { SvgIcon, SvgIconProps } from '@mui/material'; + +export interface AlignVerticalCenterIconProps extends Omit { + color?: string +} + +export const AlignVerticalCenterIcon = ({ color, style, ...props}: AlignVerticalCenterIconProps) => { + const propsStyles = {"color": color}; + const customStyles = {}; + const styles = {...propsStyles, ...customStyles, ...style} + return ( + + + + ) +}; diff --git a/libs/components/icons/src/auto-icons/align/align.svg b/libs/components/icons/src/auto-icons/align/align.svg new file mode 100644 index 0000000000..7925bf7844 --- /dev/null +++ b/libs/components/icons/src/auto-icons/align/align.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/libs/components/icons/src/auto-icons/align/align.tsx b/libs/components/icons/src/auto-icons/align/align.tsx new file mode 100644 index 0000000000..61997d17f6 --- /dev/null +++ b/libs/components/icons/src/auto-icons/align/align.tsx @@ -0,0 +1,18 @@ + +// eslint-disable-next-line no-restricted-imports +import { SvgIcon, SvgIconProps } from '@mui/material'; + +export interface AlignIconProps extends Omit { + color?: string +} + +export const AlignIcon = ({ color, style, ...props}: AlignIconProps) => { + const propsStyles = {"color": color}; + const customStyles = {}; + const styles = {...propsStyles, ...customStyles, ...style} + return ( + + + + ) +}; diff --git a/libs/components/icons/src/auto-icons/bring-forward/bring-forward.svg b/libs/components/icons/src/auto-icons/bring-forward/bring-forward.svg new file mode 100644 index 0000000000..638f6aa740 --- /dev/null +++ b/libs/components/icons/src/auto-icons/bring-forward/bring-forward.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/libs/components/icons/src/auto-icons/bring-forward/bring-forward.tsx b/libs/components/icons/src/auto-icons/bring-forward/bring-forward.tsx new file mode 100644 index 0000000000..067253a85e --- /dev/null +++ b/libs/components/icons/src/auto-icons/bring-forward/bring-forward.tsx @@ -0,0 +1,18 @@ + +// eslint-disable-next-line no-restricted-imports +import { SvgIcon, SvgIconProps } from '@mui/material'; + +export interface BringForwardIconProps extends Omit { + color?: string +} + +export const BringForwardIcon = ({ color, style, ...props}: BringForwardIconProps) => { + const propsStyles = {"color": color}; + const customStyles = {}; + const styles = {...propsStyles, ...customStyles, ...style} + return ( + + + + ) +}; diff --git a/libs/components/icons/src/auto-icons/bring-to-front/bring-to-front.svg b/libs/components/icons/src/auto-icons/bring-to-front/bring-to-front.svg new file mode 100644 index 0000000000..7158fe6f56 --- /dev/null +++ b/libs/components/icons/src/auto-icons/bring-to-front/bring-to-front.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/libs/components/icons/src/auto-icons/bring-to-front/bring-to-front.tsx b/libs/components/icons/src/auto-icons/bring-to-front/bring-to-front.tsx new file mode 100644 index 0000000000..9424307345 --- /dev/null +++ b/libs/components/icons/src/auto-icons/bring-to-front/bring-to-front.tsx @@ -0,0 +1,18 @@ + +// eslint-disable-next-line no-restricted-imports +import { SvgIcon, SvgIconProps } from '@mui/material'; + +export interface BringToFrontIconProps extends Omit { + color?: string +} + +export const BringToFrontIcon = ({ color, style, ...props}: BringToFrontIconProps) => { + const propsStyles = {"color": color}; + const customStyles = {}; + const styles = {...propsStyles, ...customStyles, ...style} + return ( + + + + ) +}; diff --git a/libs/components/icons/src/auto-icons/distribute-horizontal/distribute-horizontal.svg b/libs/components/icons/src/auto-icons/distribute-horizontal/distribute-horizontal.svg new file mode 100644 index 0000000000..78934c6d1a --- /dev/null +++ b/libs/components/icons/src/auto-icons/distribute-horizontal/distribute-horizontal.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/libs/components/icons/src/auto-icons/distribute-horizontal/distribute-horizontal.tsx b/libs/components/icons/src/auto-icons/distribute-horizontal/distribute-horizontal.tsx new file mode 100644 index 0000000000..0871851c6e --- /dev/null +++ b/libs/components/icons/src/auto-icons/distribute-horizontal/distribute-horizontal.tsx @@ -0,0 +1,18 @@ + +// eslint-disable-next-line no-restricted-imports +import { SvgIcon, SvgIconProps } from '@mui/material'; + +export interface DistributeHorizontalIconProps extends Omit { + color?: string +} + +export const DistributeHorizontalIcon = ({ color, style, ...props}: DistributeHorizontalIconProps) => { + const propsStyles = {"color": color}; + const customStyles = {}; + const styles = {...propsStyles, ...customStyles, ...style} + return ( + + + + ) +}; diff --git a/libs/components/icons/src/auto-icons/distribute-vertical/distribute-vertical.svg b/libs/components/icons/src/auto-icons/distribute-vertical/distribute-vertical.svg new file mode 100644 index 0000000000..b3189fda48 --- /dev/null +++ b/libs/components/icons/src/auto-icons/distribute-vertical/distribute-vertical.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/libs/components/icons/src/auto-icons/distribute-vertical/distribute-vertical.tsx b/libs/components/icons/src/auto-icons/distribute-vertical/distribute-vertical.tsx new file mode 100644 index 0000000000..bbaaea88f3 --- /dev/null +++ b/libs/components/icons/src/auto-icons/distribute-vertical/distribute-vertical.tsx @@ -0,0 +1,18 @@ + +// eslint-disable-next-line no-restricted-imports +import { SvgIcon, SvgIconProps } from '@mui/material'; + +export interface DistributeVerticalIconProps extends Omit { + color?: string +} + +export const DistributeVerticalIcon = ({ color, style, ...props}: DistributeVerticalIconProps) => { + const propsStyles = {"color": color}; + const customStyles = {}; + const styles = {...propsStyles, ...customStyles, ...style} + return ( + + + + ) +}; diff --git a/libs/components/icons/src/auto-icons/index.ts b/libs/components/icons/src/auto-icons/index.ts index 8ea2f6c0a0..d8a932e463 100644 --- a/libs/components/icons/src/auto-icons/index.ts +++ b/libs/components/icons/src/auto-icons/index.ts @@ -1,4 +1,4 @@ -export const timestamp = 1660270988401; +export const timestamp = 1660740866491; export * from './image/image'; export * from './format-clear/format-clear'; export * from './backward-undo/backward-undo'; @@ -129,4 +129,18 @@ export * from './unlock/unlock'; export * from './more-tags-an-subblocks/more-tags-an-subblocks'; export * from './page-in-page-tree/page-in-page-tree'; export * from './pin/pin'; -export * from './add/add'; \ No newline at end of file +export * from './add/add'; +export * from './align-to-left/align-to-left'; +export * from './align-to-right/align-to-right'; +export * from './distribute-horizontal/distribute-horizontal'; +export * from './distribute-vertical/distribute-vertical'; +export * from './align-to-top/align-to-top'; +export * from './align-to-bottom/align-to-bottom'; +export * from './align-horizontal-center/align-horizontal-center'; +export * from './align-vertical-center/align-vertical-center'; +export * from './bring-forward/bring-forward'; +export * from './send-backward/send-backward'; +export * from './bring-to-front/bring-to-front'; +export * from './send-to-back/send-to-back'; +export * from './align/align'; +export * from './layers/layers'; \ No newline at end of file diff --git a/libs/components/icons/src/auto-icons/layers/layers.svg b/libs/components/icons/src/auto-icons/layers/layers.svg new file mode 100644 index 0000000000..9859478a12 --- /dev/null +++ b/libs/components/icons/src/auto-icons/layers/layers.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/libs/components/icons/src/auto-icons/layers/layers.tsx b/libs/components/icons/src/auto-icons/layers/layers.tsx new file mode 100644 index 0000000000..be23ad2287 --- /dev/null +++ b/libs/components/icons/src/auto-icons/layers/layers.tsx @@ -0,0 +1,18 @@ + +// eslint-disable-next-line no-restricted-imports +import { SvgIcon, SvgIconProps } from '@mui/material'; + +export interface LayersIconProps extends Omit { + color?: string +} + +export const LayersIcon = ({ color, style, ...props}: LayersIconProps) => { + const propsStyles = {"color": color}; + const customStyles = {}; + const styles = {...propsStyles, ...customStyles, ...style} + return ( + + + + ) +}; diff --git a/libs/components/icons/src/auto-icons/send-backward/send-backward.svg b/libs/components/icons/src/auto-icons/send-backward/send-backward.svg new file mode 100644 index 0000000000..75d31da632 --- /dev/null +++ b/libs/components/icons/src/auto-icons/send-backward/send-backward.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/libs/components/icons/src/auto-icons/send-backward/send-backward.tsx b/libs/components/icons/src/auto-icons/send-backward/send-backward.tsx new file mode 100644 index 0000000000..41cd3ac134 --- /dev/null +++ b/libs/components/icons/src/auto-icons/send-backward/send-backward.tsx @@ -0,0 +1,18 @@ + +// eslint-disable-next-line no-restricted-imports +import { SvgIcon, SvgIconProps } from '@mui/material'; + +export interface SendBackwardIconProps extends Omit { + color?: string +} + +export const SendBackwardIcon = ({ color, style, ...props}: SendBackwardIconProps) => { + const propsStyles = {"color": color}; + const customStyles = {}; + const styles = {...propsStyles, ...customStyles, ...style} + return ( + + + + ) +}; diff --git a/libs/components/icons/src/auto-icons/send-to-back/send-to-back.svg b/libs/components/icons/src/auto-icons/send-to-back/send-to-back.svg new file mode 100644 index 0000000000..a114dfdd62 --- /dev/null +++ b/libs/components/icons/src/auto-icons/send-to-back/send-to-back.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/libs/components/icons/src/auto-icons/send-to-back/send-to-back.tsx b/libs/components/icons/src/auto-icons/send-to-back/send-to-back.tsx new file mode 100644 index 0000000000..479a092f28 --- /dev/null +++ b/libs/components/icons/src/auto-icons/send-to-back/send-to-back.tsx @@ -0,0 +1,18 @@ + +// eslint-disable-next-line no-restricted-imports +import { SvgIcon, SvgIconProps } from '@mui/material'; + +export interface SendToBackIconProps extends Omit { + color?: string +} + +export const SendToBackIcon = ({ color, style, ...props}: SendToBackIconProps) => { + const propsStyles = {"color": color}; + const customStyles = {}; + const styles = {...propsStyles, ...customStyles, ...style} + return ( + + + + ) +};