Skip to content

Commit 3a52bd6

Browse files
1ilit1ilit
committed
Merge branch 'main' of https://github.com/drawdb-io/drawdb into oracledb-dev
2 parents 81b3eea + 00114f4 commit 3a52bd6

File tree

26 files changed

+1418
-1420
lines changed

26 files changed

+1418
-1420
lines changed

‎package-lock.json

Lines changed: 1256 additions & 1290 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
"@uiw/react-codemirror": "^4.21.25",
2121
"@vercel/analytics": "^1.2.2",
2222
"@vercel/speed-insights": "^1.2.0",
23-
"axios": "^1.7.4",
23+
"axios": "^1.8.2",
2424
"classnames": "^2.5.1",
2525
"dexie": "^3.2.4",
2626
"dexie-react-hooks": "^1.1.7",
@@ -30,9 +30,9 @@
3030
"i18next": "^23.11.4",
3131
"i18next-browser-languagedetector": "^8.0.0",
3232
"jsonschema": "^1.4.1",
33-
"jspdf": "^2.5.1",
33+
"jspdf": "^3.0.1",
3434
"lexical": "^0.12.5",
35-
"node-sql-parser": "^5.3.6",
35+
"node-sql-parser": "^5.3.8",
3636
"octokit": "^4.0.2",
3737
"oracle-sql-parser": "^0.1.0",
3838
"react": "^18.2.0",
@@ -45,19 +45,19 @@
4545
"usehooks-ts": "^3.1.0"
4646
},
4747
"devDependencies": {
48+
"@tailwindcss/postcss": "^4.0.14",
4849
"@types/react": "^18.2.43",
4950
"@types/react-dom": "^18.2.17",
50-
"@vitejs/plugin-react": "^4.2.1",
51-
"autoprefixer": "^10.4.16",
51+
"@vitejs/plugin-react": "^4.3.4",
5252
"eslint": "^8.55.0",
5353
"eslint-config-prettier": "^9.1.0",
5454
"eslint-plugin-react": "^7.33.2",
5555
"eslint-plugin-react-hooks": "^4.6.0",
5656
"eslint-plugin-react-refresh": "^0.4.5",
5757
"postcss": "^8.4.32",
5858
"prettier": "3.2.5",
59-
"tailwindcss": "^3.3.6",
60-
"vite": "^5.4.1"
59+
"tailwindcss": "^4.0.14",
60+
"vite": "^6.2.3"
6161
},
6262
"overrides": {
6363
"follow-redirects": "^1.15.4"

‎postcss.config.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
export default {
22
plugins: {
3-
tailwindcss: {},
4-
autoprefixer: {},
3+
'@tailwindcss/postcss': {},
54
},
65
}

‎src/components/EditorCanvas/Area.jsx

Lines changed: 30 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -105,45 +105,41 @@ export default function Area({
105105
onPointerDown={onPointerDown}
106106
>
107107
<div
108-
className={`border-2 ${
108+
className={`w-full h-full p-2 rounded cursor-move border-2 ${
109109
isHovered
110110
? "border-dashed border-blue-500"
111111
: selectedElement.element === ObjectType.AREA &&
112112
selectedElement.id === data.id
113-
? "border-blue-500"
114-
: "border-slate-400"
115-
} w-full h-full cursor-move rounded`}
113+
? "border-blue-500 opacity-100"
114+
: "border-slate-400 opacity-100"
115+
}`}
116+
style={{ backgroundColor: `${data.color}66` }}
116117
>
117-
<div
118-
className="w-fill p-2 h-full"
119-
style={{ backgroundColor: `${data.color}66` }}
120-
>
121-
<div className="flex justify-between gap-1 w-full">
122-
<div className="text-color select-none overflow-hidden text-ellipsis">
123-
{data.name}
124-
</div>
125-
{(isHovered || (areaIsSelected() && !layout.sidebar)) && (
126-
<Popover
127-
visible={areaIsSelected() && !layout.sidebar}
128-
onClickOutSide={onClickOutSide}
129-
stopPropagation
130-
content={<EditPopoverContent data={data} />}
131-
trigger="custom"
132-
position="rightTop"
133-
showArrow
134-
>
135-
<Button
136-
icon={<IconEdit />}
137-
size="small"
138-
theme="solid"
139-
style={{
140-
backgroundColor: "#2F68ADB3",
141-
}}
142-
onClick={edit}
143-
/>
144-
</Popover>
145-
)}
118+
<div className="flex justify-between gap-1 w-full">
119+
<div className="text-color select-none overflow-hidden text-ellipsis">
120+
{data.name}
146121
</div>
122+
{(isHovered || (areaIsSelected() && !layout.sidebar)) && (
123+
<Popover
124+
visible={areaIsSelected() && !layout.sidebar}
125+
onClickOutSide={onClickOutSide}
126+
stopPropagation
127+
content={<EditPopoverContent data={data} />}
128+
trigger="custom"
129+
position="rightTop"
130+
showArrow
131+
>
132+
<Button
133+
icon={<IconEdit />}
134+
size="small"
135+
theme="solid"
136+
style={{
137+
backgroundColor: "#2F68ADB3",
138+
}}
139+
onClick={edit}
140+
/>
141+
</Popover>
142+
)}
147143
</div>
148144
</div>
149145
</foreignObject>
@@ -269,7 +265,7 @@ function EditPopoverContent({ data }) {
269265
showArrow
270266
>
271267
<div
272-
className="h-[32px] w-[32px] rounded"
268+
className="h-[32px] w-[32px] rounded-sm"
273269
style={{ backgroundColor: data.color }}
274270
/>
275271
</Popover>

‎src/components/EditorCanvas/Canvas.jsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -494,7 +494,7 @@ export default function Canvas() {
494494
const theme = localStorage.getItem("theme");
495495

496496
return (
497-
<div className="flex-grow h-full touch-none" id="canvas">
497+
<div className="grow h-full touch-none" id="canvas">
498498
<div
499499
className="w-full h-full"
500500
style={{
@@ -587,7 +587,7 @@ export default function Canvas() {
587587
</svg>
588588
</div>
589589
{settings.showDebugCoordinates && (
590-
<div className="fixed flex flex-col flex-wrap gap-6 bg-[rgba(var(--semi-grey-1),var(--tw-bg-opacity))]/40 border border-color bottom-4 right-4 p-4 rounded-xl backdrop-blur-sm pointer-events-none select-none">
590+
<div className="fixed flex flex-col flex-wrap gap-6 bg-[rgba(var(--semi-grey-1),var(--tw-bg-opacity))]/40 border border-color bottom-4 right-4 p-4 rounded-xl backdrop-blur-xs pointer-events-none select-none">
591591
<table className="table-auto grow">
592592
<thead>
593593
<tr>

‎src/components/EditorCanvas/Note.jsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -257,7 +257,7 @@ export default function Note({ data, onPointerDown }) {
257257
showArrow
258258
>
259259
<div
260-
className="h-[32px] w-[32px] rounded"
260+
className="h-[32px] w-[32px] rounded-sm"
261261
style={{ backgroundColor: data.color }}
262262
/>
263263
</Popover>
@@ -302,7 +302,7 @@ export default function Note({ data, onPointerDown }) {
302302
})
303303
}
304304
onBlur={handleBlur}
305-
className="w-full resize-none outline-none overflow-y-hidden border-none select-none"
305+
className="w-full resize-none outline-hidden overflow-y-hidden border-none select-none"
306306
style={{ backgroundColor: data.color }}
307307
/>
308308
</div>

‎src/components/EditorCanvas/Table.jsx

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { useState } from "react";
1+
import { useMemo, useState } from "react";
22
import {
33
Tab,
44
ObjectType,
@@ -37,8 +37,14 @@ export default function Table(props) {
3737
const { t } = useTranslation();
3838
const { selectedElement, setSelectedElement } = useSelect();
3939

40+
const borderColor = useMemo(
41+
() => (settings.mode === "light" ? "border-zinc-300" : "border-zinc-600"),
42+
[settings.mode],
43+
);
44+
4045
const height =
4146
tableData.fields.length * tableFieldHeight + tableHeaderHeight + 7;
47+
4248
const openEditor = () => {
4349
if (!layout.sidebar) {
4450
setSelectedElement((prev) => ({
@@ -84,7 +90,7 @@ export default function Table(props) {
8490
selectedElement.id === tableData.id &&
8591
selectedElement.element === ObjectType.TABLE
8692
? "border-solid border-blue-500"
87-
: "border-zinc-500"
93+
: borderColor
8894
}`}
8995
style={{ direction: "ltr" }}
9096
>
@@ -313,7 +319,7 @@ export default function Table(props) {
313319
} flex items-center gap-2 overflow-hidden`}
314320
>
315321
<button
316-
className="flex-shrink-0 w-[10px] h-[10px] bg-[#2f68adcc] rounded-full"
322+
className="shrink-0 w-[10px] h-[10px] bg-[#2f68adcc] rounded-full"
317323
onPointerDown={(e) => {
318324
if (!e.isPrimary) return;
319325

@@ -354,7 +360,7 @@ export default function Table(props) {
354360
icon={<IconMinus />}
355361
onClick={() => deleteField(fieldData, tableData.id)}
356362
/>
357-
) : (
363+
) : settings.showDataTypes ? (
358364
<div className="flex gap-1 items-center">
359365
{fieldData.primary && <IconKeyStroked />}
360366
{!fieldData.notNull && <span>?</span>}
@@ -364,11 +370,11 @@ export default function Table(props) {
364370
dbToTypes[database][fieldData.type].hasPrecision) &&
365371
fieldData.size &&
366372
fieldData.size !== ""
367-
? "(" + fieldData.size + ")"
373+
? `(${fieldData.size})`
368374
: "")}
369375
</span>
370376
</div>
371-
)}
377+
) : null}
372378
</div>
373379
</div>
374380
);

‎src/components/EditorHeader/ControlPanel.jsx

Lines changed: 25 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1234,6 +1234,18 @@ export default function ControlPanel({
12341234
function: resetView,
12351235
shortcut: "Ctrl+R",
12361236
},
1237+
show_datatype: {
1238+
state: settings.showDataTypes ? (
1239+
<i className="bi bi-toggle-on" />
1240+
) : (
1241+
<i className="bi bi-toggle-off" />
1242+
),
1243+
function: () =>
1244+
setSettings((prev) => ({
1245+
...prev,
1246+
showDataTypes: !prev.showDataTypes,
1247+
})),
1248+
},
12371249
show_grid: {
12381250
state: settings.showGrid ? (
12391251
<i className="bi bi-toggle-on" />
@@ -1428,7 +1440,7 @@ export default function ControlPanel({
14281440
{window.name.split(" ")[0] !== "t" && (
14291441
<Button
14301442
type="primary"
1431-
className="text-base me-2 pe-6 ps-5 py-[18px] rounded-md"
1443+
className="!text-base me-2 !pe-6 !ps-5 !py-[18px] !rounded-md"
14321444
size="default"
14331445
icon={<IconShareStroked />}
14341446
onClick={() => setModal(MODAL.SHARE)}
@@ -1511,7 +1523,7 @@ export default function ControlPanel({
15111523
}
15121524
trigger="click"
15131525
>
1514-
<div className="py-1 px-2 hover-2 rounded flex items-center justify-center">
1526+
<div className="py-1 px-2 hover-2 rounded-sm flex items-center justify-center">
15151527
<div className="w-[40px]">
15161528
{Math.floor(transform.zoom * 100)}%
15171529
</div>
@@ -1522,7 +1534,7 @@ export default function ControlPanel({
15221534
</Dropdown>
15231535
<Tooltip content={t("zoom_in")} position="bottom">
15241536
<button
1525-
className="py-1 px-2 hover-2 rounded text-lg"
1537+
className="py-1 px-2 hover-2 rounded-sm text-lg"
15261538
onClick={() =>
15271539
setTransform((prev) => ({ ...prev, zoom: prev.zoom * 1.2 }))
15281540
}
@@ -1532,7 +1544,7 @@ export default function ControlPanel({
15321544
</Tooltip>
15331545
<Tooltip content={t("zoom_out")} position="bottom">
15341546
<button
1535-
className="py-1 px-2 hover-2 rounded text-lg"
1547+
className="py-1 px-2 hover-2 rounded-sm text-lg"
15361548
onClick={() =>
15371549
setTransform((prev) => ({ ...prev, zoom: prev.zoom / 1.2 }))
15381550
}
@@ -1543,7 +1555,7 @@ export default function ControlPanel({
15431555
<Divider layout="vertical" margin="8px" />
15441556
<Tooltip content={t("undo")} position="bottom">
15451557
<button
1546-
className="py-1 px-2 hover-2 rounded flex items-center"
1558+
className="py-1 px-2 hover-2 rounded-sm flex items-center"
15471559
onClick={undo}
15481560
>
15491561
<IconUndo
@@ -1554,7 +1566,7 @@ export default function ControlPanel({
15541566
</Tooltip>
15551567
<Tooltip content={t("redo")} position="bottom">
15561568
<button
1557-
className="py-1 px-2 hover-2 rounded flex items-center"
1569+
className="py-1 px-2 hover-2 rounded-sm flex items-center"
15581570
onClick={redo}
15591571
>
15601572
<IconRedo
@@ -1566,23 +1578,23 @@ export default function ControlPanel({
15661578
<Divider layout="vertical" margin="8px" />
15671579
<Tooltip content={t("add_table")} position="bottom">
15681580
<button
1569-
className="flex items-center py-1 px-2 hover-2 rounded"
1581+
className="flex items-center py-1 px-2 hover-2 rounded-sm"
15701582
onClick={() => addTable()}
15711583
>
15721584
<IconAddTable />
15731585
</button>
15741586
</Tooltip>
15751587
<Tooltip content={t("add_area")} position="bottom">
15761588
<button
1577-
className="py-1 px-2 hover-2 rounded flex items-center"
1589+
className="py-1 px-2 hover-2 rounded-sm flex items-center"
15781590
onClick={() => addArea()}
15791591
>
15801592
<IconAddArea />
15811593
</button>
15821594
</Tooltip>
15831595
<Tooltip content={t("add_note")} position="bottom">
15841596
<button
1585-
className="py-1 px-2 hover-2 rounded flex items-center"
1597+
className="py-1 px-2 hover-2 rounded-sm flex items-center"
15861598
onClick={() => addNote()}
15871599
>
15881600
<IconAddNote />
@@ -1591,15 +1603,15 @@ export default function ControlPanel({
15911603
<Divider layout="vertical" margin="8px" />
15921604
<Tooltip content={t("save")} position="bottom">
15931605
<button
1594-
className="py-1 px-2 hover-2 rounded flex items-center"
1606+
className="py-1 px-2 hover-2 rounded-sm flex items-center"
15951607
onClick={save}
15961608
>
15971609
<IconSaveStroked size="extra-large" />
15981610
</button>
15991611
</Tooltip>
16001612
<Tooltip content={t("to_do")} position="bottom">
16011613
<button
1602-
className="py-1 px-2 hover-2 rounded text-xl -mt-0.5"
1614+
className="py-1 px-2 hover-2 rounded-sm text-xl -mt-0.5"
16031615
onClick={() => setSidesheet(SIDESHEET.TODO)}
16041616
>
16051617
<i className="fa-regular fa-calendar-check" />
@@ -1608,7 +1620,7 @@ export default function ControlPanel({
16081620
<Divider layout="vertical" margin="8px" />
16091621
<Tooltip content={t("theme")} position="bottom">
16101622
<button
1611-
className="py-1 px-2 hover-2 rounded text-xl -mt-0.5"
1623+
className="py-1 px-2 hover-2 rounded-sm text-xl -mt-0.5"
16121624
onClick={() => {
16131625
const body = document.body;
16141626
if (body.hasAttribute("theme-mode")) {
@@ -1796,7 +1808,7 @@ export default function ControlPanel({
17961808
</Dropdown.Menu>
17971809
}
17981810
>
1799-
<div className="px-3 py-1 hover-2 rounded">
1811+
<div className="px-3 py-1 hover-2 rounded-sm">
18001812
{t(category)}
18011813
</div>
18021814
</Dropdown>

‎src/components/EditorHeader/LayoutDropdown.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,7 @@ export default function LayoutDropdown() {
6868
}
6969
trigger="click"
7070
>
71-
<div className="py-1 px-2 hover-2 rounded flex items-center justify-center">
71+
<div className="py-1 px-2 hover-2 rounded-sm flex items-center justify-center">
7272
<IconRowsStroked size="extra-large" />
7373
<div>
7474
<IconCaretdown />

‎src/components/EditorHeader/Modal/Code.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ export default function Code({ value, language }) {
4242
/>
4343
<button
4444
onClick={copyCode}
45-
className={`absolute right-4 top-2 px-2 py-1 rounded ${settings.mode === "dark" ? "bg-zinc-700" : "bg-zinc-200"}`}
45+
className={`absolute right-4 top-2 px-2 py-1 rounded-sm ${settings.mode === "dark" ? "bg-zinc-700" : "bg-zinc-200"}`}
4646
>
4747
<i className={`bi bi-clipboard${copied ? "-check" : ""} me-2`} />
4848
{t("copy")}

‎src/components/EditorHeader/Modal/Open.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@ export default function Open({ selectedDiagramId, setSelectedDiagramId }) {
4848
key={d.id}
4949
className={`${
5050
selectedDiagramId === d.id
51-
? "bg-blue-300 bg-opacity-30"
51+
? "bg-blue-300/30"
5252
: "hover-1"
5353
}`}
5454
onClick={() => {

0 commit comments

Comments
 (0)