lines-overlay 0.1.23 → 0.1.25
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -3
- package/dist/index.d.mts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +107 -52
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +119 -64
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/src/components/config-button.tsx +37 -21
- package/src/components/config-options.tsx +41 -39
- package/src/components/move-lines-button.tsx +40 -15
- package/src/index.ts +1 -1
- package/src/lines-overlay.tsx +13 -9
package/README.md
CHANGED
|
@@ -26,19 +26,19 @@ Este pacote assume que o seu projeto já usa:
|
|
|
26
26
|
## Uso básico
|
|
27
27
|
|
|
28
28
|
```tsx
|
|
29
|
-
import {
|
|
29
|
+
import { LinesOverlay } from 'lines-overlay';
|
|
30
30
|
|
|
31
31
|
export function App() {
|
|
32
32
|
return (
|
|
33
33
|
<div>
|
|
34
34
|
{/* Sua interface normal aqui */}
|
|
35
|
-
<
|
|
35
|
+
<LinesOverlay />
|
|
36
36
|
</div>
|
|
37
37
|
);
|
|
38
38
|
}
|
|
39
39
|
```
|
|
40
40
|
|
|
41
|
-
Ao incluir o componente `
|
|
41
|
+
Ao incluir o componente `LinesOverlay` em qualquer lugar do seu aplicativo React, um botão “Mostrar linhas” aparece fixo no canto inferior direito.
|
|
42
42
|
|
|
43
43
|
- **Atalho de teclado**
|
|
44
44
|
- `Ctrl + ;` também alterna entre mostrar/ocultar as linhas.
|
package/dist/index.d.mts
CHANGED
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -30,7 +30,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
30
30
|
// src/index.ts
|
|
31
31
|
var index_exports = {};
|
|
32
32
|
__export(index_exports, {
|
|
33
|
-
|
|
33
|
+
LinesOverlay: () => LinesOverlay
|
|
34
34
|
});
|
|
35
35
|
module.exports = __toCommonJS(index_exports);
|
|
36
36
|
|
|
@@ -255,18 +255,27 @@ Separator.displayName = "Separator";
|
|
|
255
255
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
256
256
|
var css3 = {
|
|
257
257
|
wrapper: {
|
|
258
|
+
width: "100%",
|
|
259
|
+
height: "100%",
|
|
258
260
|
position: "absolute",
|
|
259
|
-
left:
|
|
260
|
-
top:
|
|
261
|
-
|
|
261
|
+
left: 0,
|
|
262
|
+
top: 0,
|
|
263
|
+
display: "flex",
|
|
264
|
+
alignItems: "center",
|
|
265
|
+
justifyContent: "center",
|
|
262
266
|
pointerEvents: "auto"
|
|
263
267
|
},
|
|
264
268
|
button: {
|
|
265
269
|
backgroundColor: "rgba(255,255,255,0.75)",
|
|
266
|
-
backdropFilter: "blur(2px)"
|
|
270
|
+
backdropFilter: "blur(2px)",
|
|
271
|
+
borderRadius: 9999
|
|
267
272
|
}
|
|
268
273
|
};
|
|
269
|
-
function MoveLinesButton({
|
|
274
|
+
function MoveLinesButton({
|
|
275
|
+
targetRef,
|
|
276
|
+
color,
|
|
277
|
+
opacity
|
|
278
|
+
}) {
|
|
270
279
|
const dragging = (0, import_react.useRef)(false);
|
|
271
280
|
const last = (0, import_react.useRef)({ x: 0, y: 0 });
|
|
272
281
|
function onMouseDown(e) {
|
|
@@ -289,17 +298,33 @@ function MoveLinesButton({ targetRef }) {
|
|
|
289
298
|
document.removeEventListener("mousemove", onMove);
|
|
290
299
|
document.removeEventListener("mouseup", onUp);
|
|
291
300
|
}
|
|
292
|
-
return /* @__PURE__ */ (0, import_jsx_runtime4.
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
301
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { style: css3.wrapper, children: [
|
|
302
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
303
|
+
Button,
|
|
304
|
+
{
|
|
305
|
+
size: "icon-sm",
|
|
306
|
+
"data-black": true,
|
|
307
|
+
variant: "ghost",
|
|
308
|
+
onMouseDown,
|
|
309
|
+
style: css3.button,
|
|
310
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Icon, { Icon: import_lucide_react.Move, size: "3xl", strokeWidth: "2" })
|
|
311
|
+
}
|
|
312
|
+
),
|
|
313
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
314
|
+
"div",
|
|
315
|
+
{
|
|
316
|
+
style: {
|
|
317
|
+
width: "100%",
|
|
318
|
+
height: 1.25,
|
|
319
|
+
position: "absolute",
|
|
320
|
+
left: 0,
|
|
321
|
+
bottom: 0,
|
|
322
|
+
backgroundColor: color,
|
|
323
|
+
opacity
|
|
324
|
+
}
|
|
325
|
+
}
|
|
326
|
+
)
|
|
327
|
+
] });
|
|
303
328
|
}
|
|
304
329
|
|
|
305
330
|
// src/components/config-button.tsx
|
|
@@ -313,19 +338,21 @@ var css4 = {
|
|
|
313
338
|
zIndex: 9999,
|
|
314
339
|
pointerEvents: "auto",
|
|
315
340
|
height: 40,
|
|
316
|
-
border: "1px solid rgba(148,163,184,0.
|
|
341
|
+
border: "1px solid rgba(148,163,184,0.5)",
|
|
317
342
|
backgroundColor: "rgba(255,255,255,0.70)",
|
|
318
343
|
boxShadow: "0 1px 3px rgba(15,23,42,0.2)",
|
|
319
344
|
display: "flex",
|
|
320
345
|
alignItems: "center",
|
|
321
346
|
paddingLeft: 14,
|
|
322
|
-
paddingRight: 4
|
|
347
|
+
paddingRight: 4,
|
|
348
|
+
borderRadius: 4
|
|
323
349
|
},
|
|
324
350
|
label: {
|
|
325
|
-
fontWeight:
|
|
326
|
-
fontSize: "1.21875rem",
|
|
351
|
+
fontWeight: 600,
|
|
327
352
|
letterSpacing: "0.03em",
|
|
328
|
-
paddingRight: 8
|
|
353
|
+
paddingRight: 8,
|
|
354
|
+
fontSize: 14,
|
|
355
|
+
userSelect: "none"
|
|
329
356
|
},
|
|
330
357
|
buttonsRow: {
|
|
331
358
|
height: "100%",
|
|
@@ -351,18 +378,38 @@ function ConfigButton({
|
|
|
351
378
|
}
|
|
352
379
|
};
|
|
353
380
|
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { style: css4.container, children: [
|
|
354
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
381
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
382
|
+
"span",
|
|
383
|
+
{
|
|
384
|
+
style: css4.label,
|
|
385
|
+
onClick: (e) => {
|
|
386
|
+
e.stopPropagation();
|
|
387
|
+
onToggleConfig();
|
|
388
|
+
},
|
|
389
|
+
children: "Configurar"
|
|
390
|
+
}
|
|
391
|
+
),
|
|
355
392
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { style: css4.buttonsRow, children: [1, 2, 3].map(
|
|
356
393
|
(item) => item !== 2 ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
357
394
|
Button,
|
|
358
395
|
{
|
|
396
|
+
style: {
|
|
397
|
+
outlineWidth: 1
|
|
398
|
+
},
|
|
359
399
|
variant: "transparent",
|
|
360
400
|
size: "icon-sm",
|
|
361
401
|
"data-black": true,
|
|
362
402
|
onClick: (e) => {
|
|
363
403
|
handleClick(e, item);
|
|
364
404
|
},
|
|
365
|
-
children: item === 1 ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
405
|
+
children: item === 1 ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
406
|
+
Icon,
|
|
407
|
+
{
|
|
408
|
+
Icon: open ? import_lucide_react2.ChevronDown : import_lucide_react2.ChevronUp,
|
|
409
|
+
size: "xl",
|
|
410
|
+
strokeWidth: "light"
|
|
411
|
+
}
|
|
412
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Icon, { Icon: import_lucide_react2.X, size: "sm", strokeWidth: "light" })
|
|
366
413
|
},
|
|
367
414
|
item
|
|
368
415
|
) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Separator, { orientation: "vertical" })
|
|
@@ -409,26 +456,24 @@ var css5 = {
|
|
|
409
456
|
right: 8,
|
|
410
457
|
zIndex: 1e3,
|
|
411
458
|
pointerEvents: "auto",
|
|
412
|
-
fontSize: "1.3125rem",
|
|
413
459
|
backgroundColor: "rgba(255,255,255,0.94)",
|
|
414
460
|
backdropFilter: "blur(4px)",
|
|
415
461
|
boxShadow: "0 4px 6px rgba(15,23,42,0.12)",
|
|
416
|
-
border: "1px solid rgba(148,163,184,0.
|
|
417
|
-
borderRadius:
|
|
462
|
+
border: "1px solid rgba(148,163,184,0.3)",
|
|
463
|
+
borderRadius: 8,
|
|
418
464
|
paddingInline: 12,
|
|
419
|
-
paddingBlock:
|
|
465
|
+
paddingBlock: 10,
|
|
420
466
|
width: "auto",
|
|
421
467
|
display: "flex",
|
|
422
468
|
flexDirection: "column",
|
|
423
|
-
gap:
|
|
469
|
+
gap: 4
|
|
424
470
|
},
|
|
425
471
|
fieldRow: {
|
|
426
472
|
width: "100%",
|
|
427
|
-
|
|
428
|
-
paddingBottom: 12,
|
|
473
|
+
marginBottom: 12,
|
|
429
474
|
display: "flex",
|
|
430
475
|
flexDirection: "column",
|
|
431
|
-
gap:
|
|
476
|
+
gap: 8
|
|
432
477
|
},
|
|
433
478
|
wrapper: {
|
|
434
479
|
display: "flex",
|
|
@@ -441,9 +486,9 @@ var css5 = {
|
|
|
441
486
|
},
|
|
442
487
|
label: {
|
|
443
488
|
display: "block",
|
|
444
|
-
fontSize: "1.125rem",
|
|
445
489
|
fontWeight: 500,
|
|
446
|
-
marginBottom: 4
|
|
490
|
+
marginBottom: 4,
|
|
491
|
+
fontSize: 14
|
|
447
492
|
},
|
|
448
493
|
numberInput: {
|
|
449
494
|
width: "100%",
|
|
@@ -451,25 +496,25 @@ var css5 = {
|
|
|
451
496
|
borderRadius: 4,
|
|
452
497
|
border: "1px solid #e5e7eb",
|
|
453
498
|
paddingInline: 8,
|
|
454
|
-
|
|
499
|
+
boxSizing: "border-box"
|
|
455
500
|
},
|
|
456
501
|
quickRow: {
|
|
457
502
|
display: "flex",
|
|
458
|
-
gap:
|
|
503
|
+
gap: 6,
|
|
459
504
|
marginTop: 4
|
|
460
505
|
},
|
|
461
506
|
quickButton: {
|
|
462
507
|
fontWeight: 500,
|
|
463
|
-
|
|
508
|
+
borderRadius: 999
|
|
464
509
|
},
|
|
465
510
|
colorSection: {
|
|
466
|
-
marginTop:
|
|
511
|
+
marginTop: 0
|
|
467
512
|
},
|
|
468
513
|
colorLabel: {
|
|
469
514
|
display: "block",
|
|
470
|
-
fontSize: "1.125rem",
|
|
471
515
|
fontWeight: 500,
|
|
472
|
-
marginBottom: 4
|
|
516
|
+
marginBottom: 4,
|
|
517
|
+
fontSize: 14
|
|
473
518
|
},
|
|
474
519
|
colorRow: {
|
|
475
520
|
display: "flex",
|
|
@@ -478,7 +523,8 @@ var css5 = {
|
|
|
478
523
|
colorDot: {
|
|
479
524
|
display: "block",
|
|
480
525
|
width: "80%",
|
|
481
|
-
height: "80%"
|
|
526
|
+
height: "80%",
|
|
527
|
+
borderRadius: 999
|
|
482
528
|
}
|
|
483
529
|
};
|
|
484
530
|
function ConfigOptions(props) {
|
|
@@ -526,6 +572,7 @@ function ConfigOptions(props) {
|
|
|
526
572
|
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { style: css5.colorRow, children: colorOptions.map((c) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
527
573
|
Button,
|
|
528
574
|
{
|
|
575
|
+
style: { borderRadius: 999 },
|
|
529
576
|
variant: "ghost",
|
|
530
577
|
size: "icon-sm",
|
|
531
578
|
title: c.name,
|
|
@@ -543,7 +590,7 @@ var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
|
543
590
|
var css6 = {
|
|
544
591
|
overlay: {
|
|
545
592
|
position: "absolute",
|
|
546
|
-
top:
|
|
593
|
+
top: 175,
|
|
547
594
|
left: 0,
|
|
548
595
|
width: "100%",
|
|
549
596
|
pointerEvents: "none",
|
|
@@ -559,11 +606,10 @@ var css6 = {
|
|
|
559
606
|
bottom: 8,
|
|
560
607
|
right: 8,
|
|
561
608
|
zIndex: 20,
|
|
562
|
-
fontSize: "1rem",
|
|
563
609
|
backgroundColor: "rgba(255,255,255,0.70)"
|
|
564
610
|
}
|
|
565
611
|
};
|
|
566
|
-
function
|
|
612
|
+
function Core({ show, setShow }) {
|
|
567
613
|
const containerRef = (0, import_react2.useRef)(null);
|
|
568
614
|
const [lines, setLines] = (0, import_react2.useState)(12);
|
|
569
615
|
const [gap, setGap] = (0, import_react2.useState)(24);
|
|
@@ -592,7 +638,7 @@ function RowGridCore({ show, setShow }) {
|
|
|
592
638
|
backgroundImage: `repeating-linear-gradient(
|
|
593
639
|
to bottom,
|
|
594
640
|
${color},
|
|
595
|
-
${color}
|
|
641
|
+
${color} 1.25px,
|
|
596
642
|
transparent 1px,
|
|
597
643
|
transparent ${gap}px
|
|
598
644
|
)`,
|
|
@@ -600,7 +646,14 @@ function RowGridCore({ show, setShow }) {
|
|
|
600
646
|
}
|
|
601
647
|
}
|
|
602
648
|
),
|
|
603
|
-
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
649
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
650
|
+
MoveLinesButton,
|
|
651
|
+
{
|
|
652
|
+
targetRef: containerRef,
|
|
653
|
+
color,
|
|
654
|
+
opacity
|
|
655
|
+
}
|
|
656
|
+
)
|
|
604
657
|
] }),
|
|
605
658
|
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
606
659
|
ConfigButton,
|
|
@@ -625,7 +678,7 @@ function RowGridCore({ show, setShow }) {
|
|
|
625
678
|
)
|
|
626
679
|
] });
|
|
627
680
|
}
|
|
628
|
-
function
|
|
681
|
+
function LinesOverlay() {
|
|
629
682
|
const [show, setShow] = (0, import_react2.useState)(false);
|
|
630
683
|
return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
|
|
631
684
|
"div",
|
|
@@ -636,10 +689,11 @@ function RowGrid() {
|
|
|
636
689
|
bottom: 0,
|
|
637
690
|
left: 0,
|
|
638
691
|
width: "100%",
|
|
639
|
-
height: "100dvh"
|
|
692
|
+
height: "100dvh",
|
|
693
|
+
fontFamily: "Inter, sans-serif"
|
|
640
694
|
},
|
|
641
695
|
children: [
|
|
642
|
-
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
696
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Core, { setShow, show }),
|
|
643
697
|
/* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
|
|
644
698
|
Button,
|
|
645
699
|
{
|
|
@@ -651,8 +705,9 @@ function RowGrid() {
|
|
|
651
705
|
},
|
|
652
706
|
onClick: () => setShow((v) => !v),
|
|
653
707
|
children: [
|
|
654
|
-
"
|
|
655
|
-
|
|
708
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Icon, { Icon: import_lucide_react3.Eye, size: "xl" }),
|
|
709
|
+
"Mostrar linhas - ",
|
|
710
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { style: { color: "#787878ff" }, children: "Ctrl + ;" })
|
|
656
711
|
]
|
|
657
712
|
}
|
|
658
713
|
)
|
|
@@ -662,6 +717,6 @@ function RowGrid() {
|
|
|
662
717
|
}
|
|
663
718
|
// Annotate the CommonJS export names for ESM import in node:
|
|
664
719
|
0 && (module.exports = {
|
|
665
|
-
|
|
720
|
+
LinesOverlay
|
|
666
721
|
});
|
|
667
722
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/lines-overlay.tsx","../src/components/move-lines-button.tsx","../src/ui/button.tsx","../src/ui/lucide-icon.tsx","../src/ui/separator.tsx","../src/components/config-button.tsx","../src/components/data.ts","../src/components/config-options.tsx"],"sourcesContent":["export { RowGrid } from \"./lines-overlay\";\n","import { Eye } from \"lucide-react\";\r\nimport { useEffect, useRef, useState } from \"react\";\r\nimport {\r\n ConfigButton,\r\n ConfigOptions,\r\n MoveLinesButton,\r\n} from \"./components/index\";\r\nimport { StateSetter } from \"../types\";\r\nimport { Button, Icon } from \"./ui\";\r\n\r\ntype Props = {\r\n setShow: StateSetter<boolean>;\r\n show: boolean;\r\n};\r\n\r\nconst css = {\r\n overlay: {\r\n position: \"absolute\" as const,\r\n top: 100,\r\n left: 0,\r\n width: \"100%\",\r\n pointerEvents: \"none\" as const,\r\n display: \"flex\",\r\n justifyContent: \"center\",\r\n zIndex: 10,\r\n },\r\n grid: {\r\n width: \"100%\",\r\n },\r\n triggerButton: {\r\n position: \"absolute\" as const,\r\n bottom: 8,\r\n right: 8,\r\n zIndex: 20,\r\n fontSize: \"1rem\",\r\n backgroundColor: \"rgba(255,255,255,0.70)\",\r\n },\r\n} as const;\r\n\r\nfunction RowGridCore({ show, setShow }: Props) {\r\n const containerRef = useRef<HTMLDivElement>(null);\r\n const [lines, setLines] = useState(12);\r\n const [gap, setGap] = useState(24);\r\n const [opacity, setOpacity] = useState(0.3);\r\n const [color, setColor] = useState(\"#d71212\");\r\n const [showConfig, setShowConfig] = useState(false);\r\n\r\n // Toggle por tecla\r\n useEffect(() => {\r\n const handler = (e: KeyboardEvent) => {\r\n if (e.ctrlKey && e.key === \";\") {\r\n setShow((v) => !v);\r\n }\r\n };\r\n window.addEventListener(\"keydown\", handler);\r\n return () => window.removeEventListener(\"keydown\", handler);\r\n }, []);\r\n\r\n if (!show) return null;\r\n\r\n const height = lines * gap;\r\n\r\n return (\r\n <>\r\n <div ref={containerRef} style={{ ...css.overlay, height }}>\r\n {/* linhas */}\r\n <div\r\n style={{\r\n ...css.grid,\r\n height,\r\n backgroundImage: `repeating-linear-gradient(\r\n to bottom,\r\n ${color},\r\n ${color} 1px,\r\n transparent 1px,\r\n transparent ${gap}px\r\n )`,\r\n opacity,\r\n }}\r\n />\r\n {/* Move */}\r\n <MoveLinesButton targetRef={containerRef} />\r\n </div>\r\n {/* Config */}\r\n <ConfigButton\r\n setShow={setShow}\r\n onToggleConfig={() => setShowConfig((v) => !v)}\r\n open={showConfig}\r\n />\r\n {showConfig && (\r\n <ConfigOptions\r\n lines={lines}\r\n gap={gap}\r\n opacity={opacity}\r\n color={color}\r\n setLines={setLines}\r\n setGap={setGap}\r\n setOpacity={setOpacity}\r\n setColor={setColor}\r\n />\r\n )}\r\n </>\r\n );\r\n}\r\n\r\nexport function RowGrid() {\r\n const [show, setShow] = useState(false);\r\n\r\n return (\r\n <div\r\n style={{\r\n position: \"fixed\",\r\n zIndex: 9000,\r\n bottom: 0,\r\n left: 0,\r\n width: \"100%\",\r\n height: \"100dvh\",\r\n }}\r\n >\r\n <RowGridCore setShow={setShow} show={show} />\r\n\r\n <Button\r\n size=\"sm\"\r\n variant=\"ghost\"\r\n style={{\r\n ...css.triggerButton,\r\n visibility: show ? \"hidden\" : \"visible\",\r\n }}\r\n onClick={() => setShow((v) => !v)}\r\n >\r\n Mostrar linhas\r\n <Icon Icon={Eye} />\r\n </Button>\r\n </div>\r\n );\r\n}\r\n","import { Move } from 'lucide-react';\r\nimport { useRef, type MouseEvent as ReactMouseEvent, type RefObject } from 'react';\r\nimport { Button, Icon } from '../ui';\r\n\r\nconst css = {\r\n wrapper: {\r\n position: 'absolute' as const,\r\n left: '50%',\r\n top: '44%',\r\n transform: 'translate(-50%, -50%)',\r\n pointerEvents: 'auto',\r\n },\r\n button: {\r\n backgroundColor: 'rgba(255,255,255,0.75)',\r\n backdropFilter: 'blur(2px)',\r\n },\r\n} as const;\r\n\r\nexport function MoveLinesButton({ targetRef }: { targetRef: RefObject<HTMLDivElement | null> }) {\r\n const dragging = useRef(false);\r\n const last = useRef({ x: 0, y: 0 });\r\n\r\n function onMouseDown(e: ReactMouseEvent<HTMLButtonElement>) {\r\n dragging.current = true;\r\n last.current = { x: e.clientX, y: e.clientY };\r\n document.addEventListener('mousemove', onMove);\r\n document.addEventListener('mouseup', onUp);\r\n }\r\n\r\n function onMove(e: MouseEvent) {\r\n if (!dragging.current || !targetRef.current) return;\r\n\r\n const dx = e.clientX - last.current.x;\r\n const dy = e.clientY - last.current.y;\r\n\r\n const el = targetRef.current;\r\n\r\n el.style.left = `${el.offsetLeft + dx}px`;\r\n el.style.top = `${el.offsetTop + dy}px`;\r\n\r\n last.current = { x: e.clientX, y: e.clientY };\r\n }\r\n\r\n function onUp() {\r\n dragging.current = false;\r\n document.removeEventListener('mousemove', onMove);\r\n document.removeEventListener('mouseup', onUp);\r\n }\r\n\r\n return (\r\n <div style={css.wrapper}>\r\n <Button\r\n size=\"icon-sm\"\r\n data-black\r\n variant=\"ghost\"\r\n onMouseDown={onMouseDown}\r\n style={css.button}>\r\n <Icon Icon={Move} size=\"lg\" strokeWidth=\"thin\" />\r\n </Button>\r\n </div>\r\n );\r\n}\r\n","import * as React from 'react';\r\n\r\ntype ButtonVariant = 'default' | 'ghost' | 'transparent';\r\ntype ButtonSize = 'default' | 'sm' | 'icon-sm';\r\n\r\nconst styles = {\r\n base: {\r\n width: 'auto',\r\n display: 'inline-flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n gap: 8,\n borderRadius: 4,\n position: 'relative',\r\n outline: 'none',\r\n userSelect: 'none',\r\n } satisfies React.CSSProperties,\r\n\r\n variants: {\r\n default: {\r\n backgroundColor: '#0ea5e9',\r\n color: '#ffffff',\r\n },\r\n ghost: {\r\n backgroundColor: 'transparent',\r\n color: '#111827',\r\n border: '1px solid #e5e7eb',\r\n },\r\n transparent: {\r\n backgroundColor: 'transparent',\r\n color: '#0ea5e9',\r\n },\r\n } satisfies Record<ButtonVariant, React.CSSProperties>,\r\n\r\n sizes: {\r\n default: {\r\n minHeight: 40,\r\n paddingInline: 12,\r\n paddingBlock: 12 * 0.73438 / 0.93,\r\n },\r\n sm: {\r\n minHeight: 36,\r\n paddingInline: 12,\r\n paddingBlock: 10,\r\n },\r\n 'icon-sm': {\r\n width: 32,\r\n height: 32,\r\n padding: 0,\r\n },\r\n } satisfies Record<ButtonSize, React.CSSProperties>,\r\n\r\n selected: {\r\n border: '2px solid #60a5fa',\r\n color: '#0ea5e9',\r\n backgroundColor: 'rgba(59,130,246,0.08)',\r\n } satisfies React.CSSProperties,\r\n\r\n closeButton: {\r\n color: '#0f172a',\r\n } satisfies React.CSSProperties,\r\n};\r\n\r\n\r\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n asChild?: boolean;\r\n selected?: boolean;\r\n disabled?: boolean;\r\n closeButton?: boolean;\r\n variant?: ButtonVariant;\r\n size?: ButtonSize;\r\n}\r\n\r\ntype ResolveButtonStyleParams = {\r\n variant: ButtonVariant;\r\n size: ButtonSize;\r\n selected?: boolean;\r\n disabled?: boolean;\r\n closeButton?: boolean;\r\n style?: React.CSSProperties;\r\n};\r\n\r\nexport function resolveButtonStyles({\r\n variant,\r\n size,\r\n selected,\r\n disabled,\r\n closeButton,\r\n style,\r\n}: ResolveButtonStyleParams): React.CSSProperties {\r\n return {\r\n ...styles.base,\r\n ...styles.variants[variant],\r\n ...styles.sizes[size],\r\n ...(disabled && { opacity: 0.6, cursor: 'not-allowed' }),\r\n ...(selected && styles.selected),\r\n ...(closeButton && styles.closeButton),\r\n ...style,\r\n };\r\n}\r\n\r\ntype SlotProps = React.HTMLAttributes<HTMLElement> & {\r\n children?: React.ReactNode;\r\n};\r\n\r\nconst Slot = React.forwardRef<HTMLElement, SlotProps>(\r\n ({ children, className, style, ...slotProps }, ref) => {\r\n if (!children || !React.isValidElement(children)) {\r\n return null;\r\n }\r\n\r\n const child = children as React.ReactElement<any>;\r\n const mergedClassName = [className, child.props.className].filter(Boolean).join(' ');\r\n const mergedStyle = { ...style, ...child.props.style };\r\n\r\n return React.cloneElement(child, {\r\n ...slotProps,\r\n ...child.props,\r\n className: mergedClassName || undefined,\r\n style: mergedStyle,\r\n ref,\r\n });\r\n },\r\n);\r\n\r\n\r\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\r\n (\r\n {\r\n className,\r\n variant = 'default',\r\n size = 'default',\r\n asChild = false,\r\n selected = false,\r\n disabled = false,\r\n closeButton = false,\r\n style,\r\n ...props\r\n },\r\n ref,\r\n ) => {\r\n const Comp = asChild ? Slot : 'button';\r\n\r\n return (\r\n <Comp\r\n ref={ref}\r\n className={className}\r\n disabled={disabled}\r\n style={resolveButtonStyles({\r\n variant,\r\n size,\r\n selected,\r\n disabled,\r\n closeButton,\r\n style,\r\n })}\r\n {...props}\r\n />\r\n );\r\n },\r\n);\r\n\r\n","import type { LucideIcon as LucideIconType, LucideProps } from 'lucide-react';\r\n\r\ntype StrokeWidthValue = keyof typeof weights;\r\nconst weights = {\r\n thin: 2.25,\r\n light: 2.35,\r\n normal: 2.65,\r\n semibold: 2.75,\r\n bold: 2.85,\r\n extrabold: 3,\r\n};\r\n\r\ntype SizeValue = keyof typeof iconSizes;\r\n\r\nconst iconSizes = {\r\n xs: '0.937em',\r\n sm: '0.968em',\r\n base: '1em',\r\n md: '1.033em',\r\n lg: '1.067em',\r\n xl: '1.138em',\r\n '2xl': '1.215em',\r\n '3xl': '1.296em',\r\n h6: '1.067em',\r\n h5: '1.138em',\r\n h4: '1.215em',\r\n h3: '1.296em',\r\n h2: '1.383em',\r\n h1: '1.4757em',\r\n};\r\n\r\nconst css = {\r\n wrapper: {\r\n height: '0.75rem',\r\n display: 'inline-flex',\r\n justifyContent: 'center',\r\n alignItems: 'center',\r\n overflow: 'visible' as const,\r\n },\r\n} as const;\r\n\r\ninterface IconProps extends Omit<LucideProps, 'size' | 'strokeWidth'> {\r\n Icon: LucideIconType;\r\n size?: SizeValue | string;\r\n strokeWidth?: StrokeWidthValue | string;\r\n}\r\n\r\nexport const Icon = ({ Icon, size, className, strokeWidth, fill }: IconProps) => {\r\n return (\r\n <div data-icon style={css.wrapper}>\r\n <Icon\r\n size={iconSizes[size as SizeValue] || size || '1.067em'}\r\n strokeWidth={weights[strokeWidth as StrokeWidthValue] || strokeWidth || 2.6}\r\n className={className}\r\n fill={fill || 'none'}\r\n />\r\n </div>\r\n );\r\n};\r\n","import * as React from 'react';\r\n\r\nconst css = {\r\n base: {\r\n flexShrink: 0,\r\n backgroundColor: '#e5e7eb',\r\n },\r\n horizontal: {\r\n height: 1,\r\n width: '100%',\r\n },\r\n vertical: {\r\n height: '100%',\r\n width: 1,\r\n },\r\n} as const;\r\n\r\ntype SeparatorProps = React.HTMLAttributes<HTMLDivElement> & {\r\n orientation?: 'horizontal' | 'vertical';\r\n decorative?: boolean;\r\n};\r\n\r\nconst Separator = React.forwardRef<HTMLDivElement, SeparatorProps>(\r\n ({ className, orientation = 'horizontal', decorative = true, style, ...props }, ref) => {\r\n const dimensionStyle = orientation === 'horizontal' ? css.horizontal : css.vertical;\r\n\r\n const ariaProps = decorative\r\n ? { role: 'none' as const }\r\n : {\r\n role: 'separator' as const,\r\n 'aria-orientation': orientation,\r\n };\r\n\r\n return (\r\n <div\r\n ref={ref}\r\n style={{ ...css.base, ...dimensionStyle, ...style }}\r\n className={className}\r\n {...ariaProps}\r\n {...props}\r\n />\r\n );\r\n },\r\n);\r\nSeparator.displayName = 'Separator';\r\n\r\nexport { Separator };\r\n","import { ChevronDown, ChevronUp, X } from 'lucide-react';\nimport { MouseEvent } from 'react';\nimport { StateSetter } from '../../types';\nimport { Button, Icon, Separator } from '../ui/index';\n\nconst css = {\n container: {\n position: 'fixed',\n bottom: 8,\n right: 8,\n zIndex: 9999,\n pointerEvents: 'auto',\n height: 40,\n border: '1px solid rgba(148,163,184,0.8)',\n backgroundColor: 'rgba(255,255,255,0.70)',\n boxShadow: '0 1px 3px rgba(15,23,42,0.2)',\n display: 'flex',\n alignItems: 'center',\n paddingLeft: 14,\n paddingRight: 4,\n },\n label: {\n fontWeight: 500,\n fontSize: '1.21875rem',\n letterSpacing: '0.03em',\n paddingRight: 8,\n },\n buttonsRow: {\n height: '100%',\n display: 'flex',\n alignItems: 'center',\n gap: 4,\n },\n closeIcon: {\n color: '#dc2626',\n },\n} as const;\n\nexport function ConfigButton({\n onToggleConfig,\n open,\n setShow,\n}: {\n open: boolean;\n onToggleConfig: () => void;\n setShow: StateSetter<boolean>;\n}) {\n const handleClick = (e: MouseEvent<HTMLButtonElement>, item: number) => {\n if (item === 1) {\n onToggleConfig();\n } else {\n e.stopPropagation();\n setShow((v) => !v);\n }\n };\n\n return (\n <div style={css.container}>\n <span style={css.label}>\n Configurar\n </span>\n\n <div style={css.buttonsRow}>\n {[1, 2, 3].map((item) =>\n item !== 2 ? (\n <Button\n variant={'transparent'}\n size=\"icon-sm\"\n data-black\n key={item}\n onClick={(e) => {\n handleClick(e, item);\n }}>\n {item === 1 ? (\n <Icon Icon={open ? ChevronDown : ChevronUp} size={'xl'} strokeWidth=\"light\" />\n ) : (\n <Icon Icon={X} size=\"sm\" strokeWidth=\"light\" className={undefined} />\n )}\n </Button>\n ) : (\n <Separator orientation=\"vertical\" />\n )\n )}\n </div>\n </div>\n );\n}\n","export type FieldBinding = {\r\n value: number;\r\n set: (v: number) => void;\r\n};\r\n\r\nexport type ConfigOptionsProps = {\r\n lines: number;\r\n gap: number;\r\n opacity: number;\r\n color: string;\r\n setLines: (v: number) => void;\r\n setGap: (v: number) => void;\r\n setOpacity: (v: number) => void;\r\n setColor: (v: string) => void;\r\n};\r\n\r\nexport type NumberFieldConfig = {\r\n key: 'lines' | 'gap' | 'opacity';\r\n label: string;\r\n step?: number;\r\n quick: number[];\r\n};\r\n\r\nexport const NUMBER_FIELDS: NumberFieldConfig[] = [\r\n {\r\n key: 'lines',\r\n label: 'Linhas',\r\n quick: [2, 4, 8, 12],\r\n step: 4,\r\n },\r\n {\r\n key: 'gap',\r\n label: 'Gap',\r\n quick: [16, 24, 32, 40, 44],\r\n step: 4,\r\n },\r\n {\r\n key: 'opacity',\r\n label: 'Opacidade',\r\n quick: [0.2, 0.3, 0.5, 0.7],\r\n step: 0.05,\r\n },\r\n];\r\n\r\nexport const colorOptions = [\r\n { name: 'Azul', value: '#2563eb' },\r\n { name: 'Amarelo', value: '#eab308' },\r\n { name: 'Verde', value: '#16a34a' },\r\n { name: 'Roxo', value: '#7c3aed' },\r\n { name: 'Violeta', value: '#9333ea' },\r\n { name: 'Violeta', value: '#d71212' },\r\n];\r\n","import { Button } from '../ui';\r\nimport { ConfigOptionsProps, NUMBER_FIELDS, colorOptions } from './data';\r\n\r\nconst css = {\r\n container: {\r\n position: 'fixed',\r\n bottom: 52,\r\n right: 8,\r\n zIndex: 1000,\r\n pointerEvents: 'auto',\r\n fontSize: '1.3125rem',\r\n backgroundColor: 'rgba(255,255,255,0.94)',\r\n backdropFilter: 'blur(4px)',\r\n boxShadow: '0 4px 6px rgba(15,23,42,0.12)',\r\n border: \"1px solid rgba(148,163,184,0.5)\",\r\n borderRadius: 12,\r\n paddingInline: 12,\r\n paddingBlock: 8,\r\n width: 'auto',\r\n display: 'flex',\r\n flexDirection: 'column',\r\n gap: 8,\r\n },\r\n fieldRow: {\r\n width: '100%',\r\n borderBottom: \"1px solid rgba(148,163,184,0.4)\",\r\n paddingBottom: 12,\r\n display: 'flex',\r\n flexDirection: 'column',\r\n gap: 4,\r\n },\r\n wrapper: {\r\n display: 'flex',\r\n alignItems: 'flex-end',\r\n gap: 8,\r\n borderRadius: 4,\r\n },\r\n inputWrapper: {\r\n width: 104,\r\n },\r\n label: {\r\n display: 'block',\r\n fontSize: '1.125rem',\r\n fontWeight: 500,\r\n marginBottom: 4,\r\n },\r\n numberInput: {\r\n width: '100%',\r\n height: 32,\r\n borderRadius: 4,\r\n border: '1px solid #e5e7eb',\r\n paddingInline: 8,\r\n fontSize: '0.875rem',\r\n },\r\n quickRow: {\r\n display: 'flex',\r\n gap: 5,\r\n marginTop: 4,\r\n },\r\n quickButton: {\r\n fontWeight: 500,\r\n fontSize: '0.875rem',\r\n },\r\n colorSection: {\r\n marginTop: 8,\r\n },\r\n colorLabel: {\r\n display: 'block',\r\n fontSize: '1.125rem',\r\n fontWeight: 500,\r\n marginBottom: 4,\r\n },\r\n colorRow: {\r\n display: 'flex',\r\n gap: 8,\r\n },\r\n colorDot: {\r\n display: 'block',\r\n width: '80%',\r\n height: '80%',\r\n },\r\n} as const;\r\n\r\nexport function ConfigOptions(props: ConfigOptionsProps) {\r\n const fieldBindings = {\r\n lines: { value: props.lines, set: props.setLines },\r\n gap: { value: props.gap, set: props.setGap },\r\n opacity: { value: props.opacity, set: props.setOpacity },\r\n };\r\n\r\n return (\r\n <div style={css.container}>\r\n {NUMBER_FIELDS.map((field) => {\r\n const binding = fieldBindings[field.key];\r\n\r\n return (\r\n <div style={css.fieldRow} key={field.key}>\r\n <div style={css.wrapper}>\r\n <div style={css.inputWrapper}>\r\n <label style={css.label}>{field.label}</label>\r\n <input\r\n style={css.numberInput}\r\n type=\"number\"\r\n step={field.step}\r\n value={binding.value}\r\n onChange={(e) => binding.set(+e.target.value)}\r\n />\r\n </div>\r\n <div style={css.quickRow}>\r\n {field.quick.map((v) => {\r\n return (\r\n <Button\r\n selected={binding.value === v}\r\n key={v}\r\n data-option\r\n variant=\"ghost\"\r\n size=\"icon-sm\"\r\n style={css.quickButton}\r\n onClick={() => binding.set(v)}>\r\n {v}\r\n </Button>\r\n );\r\n })}\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n })}\r\n\r\n <div style={css.colorSection}>\r\n <span style={css.colorLabel}>Cor</span>\r\n <div style={css.colorRow}>\r\n {colorOptions.map((c) => (\r\n <Button\r\n key={c.value}\r\n variant=\"ghost\"\r\n size=\"icon-sm\"\r\n title={c.name}\r\n onClick={() => props.setColor(c.value)}>\r\n <span style={{ ...css.colorDot, backgroundColor: c.value }} />\r\n </Button>\r\n ))}\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n"],"mappings":"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","names":["import_lucide_react","import_react","import_jsx_runtime","Icon","React","import_jsx_runtime","css","import_jsx_runtime","css","import_lucide_react","import_jsx_runtime","css","import_jsx_runtime","css","import_jsx_runtime","css"]}
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/lines-overlay.tsx","../src/components/move-lines-button.tsx","../src/ui/button.tsx","../src/ui/lucide-icon.tsx","../src/ui/separator.tsx","../src/components/config-button.tsx","../src/components/data.ts","../src/components/config-options.tsx"],"sourcesContent":["export { LinesOverlay } from \"./lines-overlay\";\n","import { Eye } from \"lucide-react\";\r\nimport { useEffect, useRef, useState } from \"react\";\r\nimport {\r\n ConfigButton,\r\n ConfigOptions,\r\n MoveLinesButton,\r\n} from \"./components/index\";\r\nimport { StateSetter } from \"../types\";\r\nimport { Button, Icon } from \"./ui\";\r\n\r\ntype Props = {\r\n setShow: StateSetter<boolean>;\r\n show: boolean;\r\n};\r\n\r\nconst css = {\r\n overlay: {\r\n position: \"absolute\" as const,\r\n top: 175,\r\n left: 0,\r\n width: \"100%\",\r\n pointerEvents: \"none\" as const,\r\n display: \"flex\",\r\n justifyContent: \"center\",\r\n zIndex: 10,\r\n },\r\n grid: {\r\n width: \"100%\",\r\n },\r\n triggerButton: {\r\n position: \"absolute\" as const,\r\n bottom: 8,\r\n right: 8,\r\n zIndex: 20,\r\n backgroundColor: \"rgba(255,255,255,0.70)\",\r\n },\r\n} as const;\r\n\r\nfunction Core({ show, setShow }: Props) {\r\n const containerRef = useRef<HTMLDivElement>(null);\r\n const [lines, setLines] = useState(12);\r\n const [gap, setGap] = useState(24);\r\n const [opacity, setOpacity] = useState(0.3);\r\n const [color, setColor] = useState(\"#d71212\");\r\n const [showConfig, setShowConfig] = useState(false);\r\n\r\n // Toggle por tecla\r\n useEffect(() => {\r\n const handler = (e: KeyboardEvent) => {\r\n if (e.ctrlKey && e.key === \";\") {\r\n setShow((v) => !v);\r\n }\r\n };\r\n window.addEventListener(\"keydown\", handler);\r\n return () => window.removeEventListener(\"keydown\", handler);\r\n }, []);\r\n\r\n if (!show) return null;\r\n\r\n const height = lines * gap;\r\n\r\n return (\r\n <>\r\n <div ref={containerRef} style={{ ...css.overlay, height }}>\r\n {/* linhas */}\r\n <div\r\n style={{\r\n ...css.grid,\r\n height,\r\n backgroundImage: `repeating-linear-gradient(\r\n to bottom,\r\n ${color},\r\n ${color} 1.25px,\r\n transparent 1px,\r\n transparent ${gap}px\r\n )`,\r\n opacity,\r\n }}\r\n />\r\n {/* Move */}\r\n <MoveLinesButton\r\n targetRef={containerRef}\r\n color={color}\r\n opacity={opacity}\r\n />\r\n </div>\r\n {/* Config */}\r\n <ConfigButton\r\n setShow={setShow}\r\n onToggleConfig={() => setShowConfig((v) => !v)}\r\n open={showConfig}\r\n />\r\n {showConfig && (\r\n <ConfigOptions\r\n lines={lines}\r\n gap={gap}\r\n opacity={opacity}\r\n color={color}\r\n setLines={setLines}\r\n setGap={setGap}\r\n setOpacity={setOpacity}\r\n setColor={setColor}\r\n />\r\n )}\r\n </>\r\n );\r\n}\r\n\r\nexport function LinesOverlay() {\r\n const [show, setShow] = useState(false);\r\n\r\n return (\r\n <div\r\n style={{\r\n position: \"fixed\",\r\n zIndex: 9000,\r\n bottom: 0,\r\n left: 0,\r\n width: \"100%\",\r\n height: \"100dvh\",\r\n fontFamily: \"Inter, sans-serif\",\r\n }}\r\n >\r\n <Core setShow={setShow} show={show} />\r\n\r\n <Button\r\n size=\"sm\"\r\n variant=\"ghost\"\r\n style={{\r\n ...css.triggerButton,\r\n visibility: show ? \"hidden\" : \"visible\",\r\n }}\r\n onClick={() => setShow((v) => !v)}\r\n >\r\n <Icon Icon={Eye} size=\"xl\" />\r\n Mostrar linhas - <span style={{ color: \"#787878ff\" }}>Ctrl + ;</span>\r\n </Button>\r\n </div>\r\n );\r\n}\r\n","import { Move } from 'lucide-react';\r\nimport { useRef, type MouseEvent as ReactMouseEvent, type RefObject } from 'react';\r\nimport { Button, Icon } from '../ui';\r\n\r\nconst css = {\r\n wrapper: {\r\n width: \"100%\",\r\n height: \"100%\",\r\n position: \"absolute\" as const,\r\n left: 0,\r\n top: 0,\r\n display: \"flex\",\r\n alignItems: \"center\",\r\n justifyContent: \"center\",\r\n pointerEvents: \"auto\",\r\n },\r\n button: {\r\n backgroundColor: \"rgba(255,255,255,0.75)\",\r\n backdropFilter: \"blur(2px)\",\r\n borderRadius: 9999,\r\n },\r\n} as const;\r\n\r\nexport function MoveLinesButton({\r\n targetRef,\r\n color,\r\n opacity,\r\n}: {\r\n targetRef: RefObject<HTMLDivElement | null>;\r\n color: string;\r\n opacity: number;\r\n}) {\r\n const dragging = useRef(false);\r\n const last = useRef({ x: 0, y: 0 });\r\n\r\n function onMouseDown(e: ReactMouseEvent<HTMLButtonElement>) {\r\n dragging.current = true;\r\n last.current = { x: e.clientX, y: e.clientY };\r\n document.addEventListener(\"mousemove\", onMove);\r\n document.addEventListener(\"mouseup\", onUp);\r\n }\r\n\r\n function onMove(e: MouseEvent) {\r\n if (!dragging.current || !targetRef.current) return;\r\n\r\n const dx = e.clientX - last.current.x;\r\n const dy = e.clientY - last.current.y;\r\n\r\n const el = targetRef.current;\r\n\r\n el.style.left = `${el.offsetLeft + dx}px`;\r\n el.style.top = `${el.offsetTop + dy}px`;\r\n\r\n last.current = { x: e.clientX, y: e.clientY };\r\n }\r\n\r\n function onUp() {\r\n dragging.current = false;\r\n document.removeEventListener(\"mousemove\", onMove);\r\n document.removeEventListener(\"mouseup\", onUp);\r\n }\r\n\r\n return (\r\n <div style={css.wrapper}>\r\n <Button\r\n size=\"icon-sm\"\r\n data-black\r\n variant=\"ghost\"\r\n onMouseDown={onMouseDown}\r\n style={css.button}\r\n >\r\n <Icon Icon={Move} size=\"3xl\" strokeWidth=\"2\" />\r\n </Button>\r\n <div\r\n style={{\r\n width: \"100%\",\r\n height: 1.25,\r\n position: \"absolute\",\r\n left: 0,\r\n bottom: 0,\r\n backgroundColor: color,\r\n opacity,\r\n }}\r\n />\r\n </div>\r\n );\r\n}","import * as React from 'react';\r\n\r\ntype ButtonVariant = 'default' | 'ghost' | 'transparent';\r\ntype ButtonSize = 'default' | 'sm' | 'icon-sm';\r\n\r\nconst styles = {\r\n base: {\r\n width: 'auto',\r\n display: 'inline-flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n gap: 8,\n borderRadius: 4,\n position: 'relative',\r\n outline: 'none',\r\n userSelect: 'none',\r\n } satisfies React.CSSProperties,\r\n\r\n variants: {\r\n default: {\r\n backgroundColor: '#0ea5e9',\r\n color: '#ffffff',\r\n },\r\n ghost: {\r\n backgroundColor: 'transparent',\r\n color: '#111827',\r\n border: '1px solid #e5e7eb',\r\n },\r\n transparent: {\r\n backgroundColor: 'transparent',\r\n color: '#0ea5e9',\r\n },\r\n } satisfies Record<ButtonVariant, React.CSSProperties>,\r\n\r\n sizes: {\r\n default: {\r\n minHeight: 40,\r\n paddingInline: 12,\r\n paddingBlock: 12 * 0.73438 / 0.93,\r\n },\r\n sm: {\r\n minHeight: 36,\r\n paddingInline: 12,\r\n paddingBlock: 10,\r\n },\r\n 'icon-sm': {\r\n width: 32,\r\n height: 32,\r\n padding: 0,\r\n },\r\n } satisfies Record<ButtonSize, React.CSSProperties>,\r\n\r\n selected: {\r\n border: '2px solid #60a5fa',\r\n color: '#0ea5e9',\r\n backgroundColor: 'rgba(59,130,246,0.08)',\r\n } satisfies React.CSSProperties,\r\n\r\n closeButton: {\r\n color: '#0f172a',\r\n } satisfies React.CSSProperties,\r\n};\r\n\r\n\r\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n asChild?: boolean;\r\n selected?: boolean;\r\n disabled?: boolean;\r\n closeButton?: boolean;\r\n variant?: ButtonVariant;\r\n size?: ButtonSize;\r\n}\r\n\r\ntype ResolveButtonStyleParams = {\r\n variant: ButtonVariant;\r\n size: ButtonSize;\r\n selected?: boolean;\r\n disabled?: boolean;\r\n closeButton?: boolean;\r\n style?: React.CSSProperties;\r\n};\r\n\r\nexport function resolveButtonStyles({\r\n variant,\r\n size,\r\n selected,\r\n disabled,\r\n closeButton,\r\n style,\r\n}: ResolveButtonStyleParams): React.CSSProperties {\r\n return {\r\n ...styles.base,\r\n ...styles.variants[variant],\r\n ...styles.sizes[size],\r\n ...(disabled && { opacity: 0.6, cursor: 'not-allowed' }),\r\n ...(selected && styles.selected),\r\n ...(closeButton && styles.closeButton),\r\n ...style,\r\n };\r\n}\r\n\r\ntype SlotProps = React.HTMLAttributes<HTMLElement> & {\r\n children?: React.ReactNode;\r\n};\r\n\r\nconst Slot = React.forwardRef<HTMLElement, SlotProps>(\r\n ({ children, className, style, ...slotProps }, ref) => {\r\n if (!children || !React.isValidElement(children)) {\r\n return null;\r\n }\r\n\r\n const child = children as React.ReactElement<any>;\r\n const mergedClassName = [className, child.props.className].filter(Boolean).join(' ');\r\n const mergedStyle = { ...style, ...child.props.style };\r\n\r\n return React.cloneElement(child, {\r\n ...slotProps,\r\n ...child.props,\r\n className: mergedClassName || undefined,\r\n style: mergedStyle,\r\n ref,\r\n });\r\n },\r\n);\r\n\r\n\r\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\r\n (\r\n {\r\n className,\r\n variant = 'default',\r\n size = 'default',\r\n asChild = false,\r\n selected = false,\r\n disabled = false,\r\n closeButton = false,\r\n style,\r\n ...props\r\n },\r\n ref,\r\n ) => {\r\n const Comp = asChild ? Slot : 'button';\r\n\r\n return (\r\n <Comp\r\n ref={ref}\r\n className={className}\r\n disabled={disabled}\r\n style={resolveButtonStyles({\r\n variant,\r\n size,\r\n selected,\r\n disabled,\r\n closeButton,\r\n style,\r\n })}\r\n {...props}\r\n />\r\n );\r\n },\r\n);\r\n\r\n","import type { LucideIcon as LucideIconType, LucideProps } from 'lucide-react';\r\n\r\ntype StrokeWidthValue = keyof typeof weights;\r\nconst weights = {\r\n thin: 2.25,\r\n light: 2.35,\r\n normal: 2.65,\r\n semibold: 2.75,\r\n bold: 2.85,\r\n extrabold: 3,\r\n};\r\n\r\ntype SizeValue = keyof typeof iconSizes;\r\n\r\nconst iconSizes = {\r\n xs: '0.937em',\r\n sm: '0.968em',\r\n base: '1em',\r\n md: '1.033em',\r\n lg: '1.067em',\r\n xl: '1.138em',\r\n '2xl': '1.215em',\r\n '3xl': '1.296em',\r\n h6: '1.067em',\r\n h5: '1.138em',\r\n h4: '1.215em',\r\n h3: '1.296em',\r\n h2: '1.383em',\r\n h1: '1.4757em',\r\n};\r\n\r\nconst css = {\r\n wrapper: {\r\n height: '0.75rem',\r\n display: 'inline-flex',\r\n justifyContent: 'center',\r\n alignItems: 'center',\r\n overflow: 'visible' as const,\r\n },\r\n} as const;\r\n\r\ninterface IconProps extends Omit<LucideProps, 'size' | 'strokeWidth'> {\r\n Icon: LucideIconType;\r\n size?: SizeValue | string;\r\n strokeWidth?: StrokeWidthValue | string;\r\n}\r\n\r\nexport const Icon = ({ Icon, size, className, strokeWidth, fill }: IconProps) => {\r\n return (\r\n <div data-icon style={css.wrapper}>\r\n <Icon\r\n size={iconSizes[size as SizeValue] || size || '1.067em'}\r\n strokeWidth={weights[strokeWidth as StrokeWidthValue] || strokeWidth || 2.6}\r\n className={className}\r\n fill={fill || 'none'}\r\n />\r\n </div>\r\n );\r\n};\r\n","import * as React from 'react';\r\n\r\nconst css = {\r\n base: {\r\n flexShrink: 0,\r\n backgroundColor: '#e5e7eb',\r\n },\r\n horizontal: {\r\n height: 1,\r\n width: '100%',\r\n },\r\n vertical: {\r\n height: '100%',\r\n width: 1,\r\n },\r\n} as const;\r\n\r\ntype SeparatorProps = React.HTMLAttributes<HTMLDivElement> & {\r\n orientation?: 'horizontal' | 'vertical';\r\n decorative?: boolean;\r\n};\r\n\r\nconst Separator = React.forwardRef<HTMLDivElement, SeparatorProps>(\r\n ({ className, orientation = 'horizontal', decorative = true, style, ...props }, ref) => {\r\n const dimensionStyle = orientation === 'horizontal' ? css.horizontal : css.vertical;\r\n\r\n const ariaProps = decorative\r\n ? { role: 'none' as const }\r\n : {\r\n role: 'separator' as const,\r\n 'aria-orientation': orientation,\r\n };\r\n\r\n return (\r\n <div\r\n ref={ref}\r\n style={{ ...css.base, ...dimensionStyle, ...style }}\r\n className={className}\r\n {...ariaProps}\r\n {...props}\r\n />\r\n );\r\n },\r\n);\r\nSeparator.displayName = 'Separator';\r\n\r\nexport { Separator };\r\n","import { ChevronDown, ChevronUp, X } from 'lucide-react';\nimport type { MouseEvent } from 'react';\nimport type { StateSetter } from '../../types';\nimport { Button, Icon, Separator } from '../ui/index';\n\nconst css = {\n container: {\n position: \"fixed\",\n bottom: 8,\n right: 8,\n zIndex: 9999,\n pointerEvents: \"auto\",\n height: 40,\n border: \"1px solid rgba(148,163,184,0.5)\",\n backgroundColor: \"rgba(255,255,255,0.70)\",\n boxShadow: \"0 1px 3px rgba(15,23,42,0.2)\",\n display: \"flex\",\n alignItems: \"center\",\n paddingLeft: 14,\n paddingRight: 4,\n borderRadius: 4,\n },\n label: {\n fontWeight: 600,\n letterSpacing: \"0.03em\",\n paddingRight: 8,\n fontSize: 14,\n userSelect: \"none\",\n },\n buttonsRow: {\n height: \"100%\",\n display: \"flex\",\n alignItems: \"center\",\n gap: 4,\n },\n closeIcon: {\n color: \"#dc2626\",\n },\n} as const;\n\nexport function ConfigButton({\n onToggleConfig,\n open,\n setShow,\n}: {\n open: boolean;\n onToggleConfig: () => void;\n setShow: StateSetter<boolean>;\n}) {\n const handleClick = (e: MouseEvent<HTMLButtonElement>, item: number) => {\n if (item === 1) {\n onToggleConfig();\n } else {\n e.stopPropagation();\n setShow((v) => !v);\n }\n };\n\n return (\n <div style={css.container}>\n <span\n style={css.label}\n onClick={(e) => {\n e.stopPropagation();\n onToggleConfig();\n }}\n >\n Configurar\n </span>\n\n <div style={css.buttonsRow}>\n {[1, 2, 3].map((item) =>\n item !== 2 ? (\n <Button\n style={{\n outlineWidth: 1,\n }}\n variant={\"transparent\"}\n size=\"icon-sm\"\n data-black\n key={item}\n onClick={(e) => {\n handleClick(e, item);\n }}\n >\n {item === 1 ? (\n <Icon\n Icon={open ? ChevronDown : ChevronUp}\n size={\"xl\"}\n strokeWidth=\"light\"\n />\n ) : (\n <Icon Icon={X} size=\"sm\" strokeWidth=\"light\" />\n )}\n </Button>\n ) : (\n <Separator orientation=\"vertical\" />\n )\n )}\n </div>\n </div>\n );\n}\n","export type FieldBinding = {\r\n value: number;\r\n set: (v: number) => void;\r\n};\r\n\r\nexport type ConfigOptionsProps = {\r\n lines: number;\r\n gap: number;\r\n opacity: number;\r\n color: string;\r\n setLines: (v: number) => void;\r\n setGap: (v: number) => void;\r\n setOpacity: (v: number) => void;\r\n setColor: (v: string) => void;\r\n};\r\n\r\nexport type NumberFieldConfig = {\r\n key: 'lines' | 'gap' | 'opacity';\r\n label: string;\r\n step?: number;\r\n quick: number[];\r\n};\r\n\r\nexport const NUMBER_FIELDS: NumberFieldConfig[] = [\r\n {\r\n key: 'lines',\r\n label: 'Linhas',\r\n quick: [2, 4, 8, 12],\r\n step: 4,\r\n },\r\n {\r\n key: 'gap',\r\n label: 'Gap',\r\n quick: [16, 24, 32, 40, 44],\r\n step: 4,\r\n },\r\n {\r\n key: 'opacity',\r\n label: 'Opacidade',\r\n quick: [0.2, 0.3, 0.5, 0.7],\r\n step: 0.05,\r\n },\r\n];\r\n\r\nexport const colorOptions = [\r\n { name: 'Azul', value: '#2563eb' },\r\n { name: 'Amarelo', value: '#eab308' },\r\n { name: 'Verde', value: '#16a34a' },\r\n { name: 'Roxo', value: '#7c3aed' },\r\n { name: 'Violeta', value: '#9333ea' },\r\n { name: 'Violeta', value: '#d71212' },\r\n];\r\n","import { Button } from '../ui';\r\nimport { type ConfigOptionsProps, NUMBER_FIELDS, colorOptions } from \"./data\";\r\n\r\nconst css = {\r\n container: {\r\n position: \"fixed\",\r\n bottom: 52,\r\n right: 8,\r\n zIndex: 1000,\r\n pointerEvents: \"auto\",\r\n backgroundColor: \"rgba(255,255,255,0.94)\",\r\n backdropFilter: \"blur(4px)\",\r\n boxShadow: \"0 4px 6px rgba(15,23,42,0.12)\",\r\n border: \"1px solid rgba(148,163,184,0.3)\",\r\n borderRadius: 8,\r\n paddingInline: 12,\r\n paddingBlock: 10,\r\n width: \"auto\",\r\n display: \"flex\",\r\n flexDirection: \"column\",\r\n gap: 4,\r\n },\r\n fieldRow: {\r\n width: \"100%\",\r\n marginBottom: 12,\r\n display: \"flex\",\r\n flexDirection: \"column\",\r\n gap: 8,\r\n },\r\n wrapper: {\r\n display: \"flex\",\r\n alignItems: \"flex-end\",\r\n gap: 8,\r\n borderRadius: 4,\r\n },\r\n inputWrapper: {\r\n width: 104,\r\n },\r\n label: {\r\n display: \"block\",\r\n fontWeight: 500,\r\n marginBottom: 4,\r\n fontSize: 14,\r\n },\r\n numberInput: {\r\n width: \"100%\",\r\n height: 32,\r\n borderRadius: 4,\r\n border: \"1px solid #e5e7eb\",\r\n paddingInline: 8,\r\n boxSizing: \"border-box\",\r\n },\r\n quickRow: {\r\n display: \"flex\",\r\n gap: 6,\r\n marginTop: 4,\r\n },\r\n quickButton: {\r\n fontWeight: 500,\r\n borderRadius: 999,\r\n },\r\n colorSection: {\r\n marginTop: 0,\r\n },\r\n colorLabel: {\r\n display: \"block\",\r\n fontWeight: 500,\r\n marginBottom: 4,\r\n fontSize: 14,\r\n },\r\n colorRow: {\r\n display: \"flex\",\r\n gap: 8,\r\n },\r\n colorDot: {\r\n display: \"block\",\r\n width: \"80%\",\r\n height: \"80%\",\r\n borderRadius: 999,\r\n },\r\n} as const;\r\n\r\nexport function ConfigOptions(props: ConfigOptionsProps) {\r\n const fieldBindings = {\r\n lines: { value: props.lines, set: props.setLines },\r\n gap: { value: props.gap, set: props.setGap },\r\n opacity: { value: props.opacity, set: props.setOpacity },\r\n };\r\n\r\n return (\r\n <div style={css.container}>\r\n {NUMBER_FIELDS.map((field) => {\r\n const binding = fieldBindings[field.key];\r\n\r\n return (\r\n <div style={css.fieldRow} key={field.key}>\r\n <div style={css.wrapper}>\r\n <div style={css.inputWrapper}>\r\n <label style={css.label}>{field.label}</label>\r\n <input\r\n style={css.numberInput}\r\n type=\"number\"\r\n step={field.step}\r\n value={binding.value}\r\n onChange={(e) => binding.set(+e.target.value)}\r\n />\r\n </div>\r\n <div style={css.quickRow}>\r\n {field.quick.map((v) => {\r\n return (\r\n <Button\r\n selected={binding.value === v}\r\n key={v}\r\n data-option\r\n variant=\"ghost\"\r\n size=\"icon-sm\"\r\n style={css.quickButton}\r\n onClick={() => binding.set(v)}\r\n >\r\n {v}\r\n </Button>\r\n );\r\n })}\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n })}\r\n\r\n <div style={css.colorSection}>\r\n <span style={css.colorLabel}>Cor</span>\r\n <div style={css.colorRow}>\r\n {colorOptions.map((c) => (\r\n <Button\r\n style={{ borderRadius: 999 }}\r\n key={c.value}\r\n variant=\"ghost\"\r\n size=\"icon-sm\"\r\n title={c.name}\r\n onClick={() => props.setColor(c.value)}\r\n >\r\n <span style={{ ...css.colorDot, backgroundColor: c.value }} />\r\n </Button>\r\n ))}\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n"],"mappings":"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","names":["import_lucide_react","import_react","import_jsx_runtime","Icon","React","import_jsx_runtime","css","import_jsx_runtime","css","import_lucide_react","import_jsx_runtime","css","import_jsx_runtime","css","import_jsx_runtime","css"]}
|