From 96ac6cdfffbf5cbedfca7a2b0440b61a5bf91cec Mon Sep 17 00:00:00 2001
From: pubuzhixing8 <pubuzhixing@gmail.com>
Date: Sun, 19 Jan 2025 19:49:35 +0800
Subject: [PATCH] feat(flowchart): add terminal shape element (#80)

---
 packages/drawnix/src/components/icons.tsx            |  8 ++++++++
 packages/drawnix/src/components/shape-picker.tsx     |  8 +++++++-
 .../src/components/toolbar/creation-toolbar.tsx      | 12 ++++++++++--
 3 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/packages/drawnix/src/components/icons.tsx b/packages/drawnix/src/components/icons.tsx
index 9c732337..5fcc1972 100644
--- a/packages/drawnix/src/components/icons.tsx
+++ b/packages/drawnix/src/components/icons.tsx
@@ -67,6 +67,14 @@ export const RectangleIcon = createIcon(
   </svg>
 );
 
+export const TerminalIcon = createIcon(
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+    <g id="terminal" stroke="none" fill="currentColor">
+      <path d="M11,3 C13.7614237,3 16,5.23857625 16,8 C16,10.7614237 13.7614237,13 11,13 L5,13 C2.23857625,13 0,10.7614237 0,8 C0,5.23857625 2.23857625,3 5,3 L11,3 Z M11,4.2 L5,4.2 C2.90131795,4.2 1.2,5.90131795 1.2,8 C1.2,10.0330982 2.79664702,11.6932796 4.8044525,11.7950555 L5,11.8 L11,11.8 C13.098682,11.8 14.8,10.098682 14.8,8 C14.8,5.96690176 13.203353,4.30672042 11.1955475,4.20494454 L11,4.2 Z" />
+    </g>
+  </svg>
+);
+
 export const EllipseIcon = createIcon(
   <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" version="1.1">
     <g id="ellipse" stroke="none" fill="currentColor">
diff --git a/packages/drawnix/src/components/shape-picker.tsx b/packages/drawnix/src/components/shape-picker.tsx
index 1281212f..73a1ee12 100644
--- a/packages/drawnix/src/components/shape-picker.tsx
+++ b/packages/drawnix/src/components/shape-picker.tsx
@@ -9,11 +9,12 @@ import {
   DiamondIcon,
   ParallelogramIcon,
   RoundRectangleIcon,
+  TerminalIcon,
 } from './icons';
 import { BoardTransforms } from '@plait/core';
 import React from 'react';
 import { BoardCreationMode, setCreationMode } from '@plait/common';
-import { BasicShapes, DrawPointerType } from '@plait/draw';
+import { BasicShapes, DrawPointerType, FlowchartSymbols } from '@plait/draw';
 import { useBoard } from '@plait/react-board';
 import { splitRows } from '../utils/common';
 
@@ -39,6 +40,11 @@ const SHAPES: ShapeProps[] = [
     title: 'Triangle',
     pointer: BasicShapes.triangle,
   },
+  {
+    icon: TerminalIcon,
+    title: 'Terminal',
+    pointer: FlowchartSymbols.terminal,
+  },
   {
     icon: DiamondIcon,
     title: 'Diamond',
diff --git a/packages/drawnix/src/components/toolbar/creation-toolbar.tsx b/packages/drawnix/src/components/toolbar/creation-toolbar.tsx
index 26a5a743..a01af5e0 100644
--- a/packages/drawnix/src/components/toolbar/creation-toolbar.tsx
+++ b/packages/drawnix/src/components/toolbar/creation-toolbar.tsx
@@ -20,7 +20,12 @@ import {
 } from '@plait/core';
 import { MindPointerType } from '@plait/mind';
 import { BoardCreationMode, setCreationMode } from '@plait/common';
-import { ArrowLineShape, BasicShapes, DrawPointerType } from '@plait/draw';
+import {
+  ArrowLineShape,
+  BasicShapes,
+  DrawPointerType,
+  FlowchartSymbols,
+} from '@plait/draw';
 import { ShapePicker } from '../shape-picker';
 import { ArrowPicker } from '../arrow-picker';
 import { useState } from 'react';
@@ -97,7 +102,10 @@ export const isArrowLinePointer = (board: PlaitBoard) => {
 };
 
 export const isShapePointer = (board: PlaitBoard) => {
-  return Object.keys(BasicShapes).includes(board.pointer);
+  return (
+    Object.keys(BasicShapes).includes(board.pointer) ||
+    Object.keys(FlowchartSymbols).includes(board.pointer)
+  );
 };
 
 export const CreationToolbar = () => {