@yoamigo.com/core 0.1.0 → 0.1.2
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/dist/index.d.ts +1 -10
- package/dist/index.js +268 -0
- package/dist/plugin.js +3 -1
- package/dist/router.d.ts +1 -0
- package/dist/router.js +5 -0
- package/package.json +4 -6
- package/dist/index.css +0 -372
- package/src/styles/index.css +0 -5
package/dist/index.d.ts
CHANGED
|
@@ -2,6 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
|
2
2
|
import React, { ReactNode } from 'react';
|
|
3
3
|
export { C as ContentStoreProviderProd, d as MarkdownText, e as MarkdownTextProps, P as PageInfo, b as StaticImage, c as StaticImageProps, M as StaticText, S as StaticTextProps, Y as YaLink, f as YaLinkProps, u as useContentStoreProd } from './MarkdownText-mylt-QX-.js';
|
|
4
4
|
export { Link, LinkProps, NavigateFunction, Router, RouterProps, useNavigate } from './router.js';
|
|
5
|
+
export { Route, Switch } from 'wouter';
|
|
5
6
|
export { A as AssetResolverFn, C as ContentRegistry, c as contentRegistry, a as getAllContent, g as getContent, h as hasContent, r as registerContent, b as resolveAssetUrl, s as setAssetResolver } from './asset-resolver-BnIvDkVv.js';
|
|
6
7
|
export { i as initBuilderSelection } from './builder-selection-CYP91nRu.js';
|
|
7
8
|
|
|
@@ -60,16 +61,6 @@ declare module '@tiptap/core' {
|
|
|
60
61
|
}
|
|
61
62
|
declare function YaText({ fieldId, className, as: Component, children }: YaTextProps): react_jsx_runtime.JSX.Element;
|
|
62
63
|
|
|
63
|
-
/**
|
|
64
|
-
* YaImage Component - Inline image editing
|
|
65
|
-
*
|
|
66
|
-
* Features:
|
|
67
|
-
* - Read mode: Renders image statically
|
|
68
|
-
* - Edit mode: Click to open image editor panel in parent
|
|
69
|
-
* - Supports: objectFit, objectPosition, focalPoint
|
|
70
|
-
* - Stores content as JSON in content.json
|
|
71
|
-
* - Protected from AI structural changes (data-ya-restricted="true")
|
|
72
|
-
*/
|
|
73
64
|
interface ImageFieldValue {
|
|
74
65
|
src: string;
|
|
75
66
|
alt?: string;
|
package/dist/index.js
CHANGED
|
@@ -503,6 +503,256 @@ function SafeHtml({ content, className, mode = "read-only" }) {
|
|
|
503
503
|
] });
|
|
504
504
|
}
|
|
505
505
|
|
|
506
|
+
// #style-inject:#style-inject
|
|
507
|
+
function styleInject(css, { insertAt } = {}) {
|
|
508
|
+
if (!css || typeof document === "undefined") return;
|
|
509
|
+
const head = document.head || document.getElementsByTagName("head")[0];
|
|
510
|
+
const style = document.createElement("style");
|
|
511
|
+
style.type = "text/css";
|
|
512
|
+
if (insertAt === "top") {
|
|
513
|
+
if (head.firstChild) {
|
|
514
|
+
head.insertBefore(style, head.firstChild);
|
|
515
|
+
} else {
|
|
516
|
+
head.appendChild(style);
|
|
517
|
+
}
|
|
518
|
+
} else {
|
|
519
|
+
head.appendChild(style);
|
|
520
|
+
}
|
|
521
|
+
if (style.styleSheet) {
|
|
522
|
+
style.styleSheet.cssText = css;
|
|
523
|
+
} else {
|
|
524
|
+
style.appendChild(document.createTextNode(css));
|
|
525
|
+
}
|
|
526
|
+
}
|
|
527
|
+
|
|
528
|
+
// src/components/ya-text.css
|
|
529
|
+
styleInject(`.ya-text-editable {
|
|
530
|
+
cursor: text;
|
|
531
|
+
transition: outline 0.15s ease;
|
|
532
|
+
}
|
|
533
|
+
.ya-text-editable:hover {
|
|
534
|
+
outline: 2px dashed var(--color-primary, #D4A574);
|
|
535
|
+
outline-offset: 4px;
|
|
536
|
+
border-radius: 4px;
|
|
537
|
+
}
|
|
538
|
+
body.builder-selector-active .ya-text-editable:hover {
|
|
539
|
+
outline: none;
|
|
540
|
+
cursor: inherit;
|
|
541
|
+
}
|
|
542
|
+
.ya-text-editing {
|
|
543
|
+
outline: 2px solid var(--color-primary, #D4A574);
|
|
544
|
+
outline-offset: 4px;
|
|
545
|
+
border-radius: 4px;
|
|
546
|
+
position: relative;
|
|
547
|
+
}
|
|
548
|
+
.ya-bubble-menu {
|
|
549
|
+
display: flex;
|
|
550
|
+
gap: 4px;
|
|
551
|
+
padding: 6px 8px;
|
|
552
|
+
background: #1a1a1a;
|
|
553
|
+
border-radius: 8px;
|
|
554
|
+
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
|
|
555
|
+
animation: ya-bubble-fade-in 0.15s ease;
|
|
556
|
+
font-family:
|
|
557
|
+
system-ui,
|
|
558
|
+
-apple-system,
|
|
559
|
+
BlinkMacSystemFont,
|
|
560
|
+
"Segoe UI",
|
|
561
|
+
sans-serif;
|
|
562
|
+
}
|
|
563
|
+
@keyframes ya-bubble-fade-in {
|
|
564
|
+
from {
|
|
565
|
+
opacity: 0;
|
|
566
|
+
transform: translateY(4px);
|
|
567
|
+
}
|
|
568
|
+
to {
|
|
569
|
+
opacity: 1;
|
|
570
|
+
transform: translateY(0);
|
|
571
|
+
}
|
|
572
|
+
}
|
|
573
|
+
.ya-bubble-btn {
|
|
574
|
+
display: flex;
|
|
575
|
+
align-items: center;
|
|
576
|
+
justify-content: center;
|
|
577
|
+
width: 32px;
|
|
578
|
+
height: 32px;
|
|
579
|
+
padding: 0;
|
|
580
|
+
border: none;
|
|
581
|
+
background: transparent;
|
|
582
|
+
color: #e0e0e0;
|
|
583
|
+
border-radius: 6px;
|
|
584
|
+
cursor: pointer;
|
|
585
|
+
transition: all 0.15s ease;
|
|
586
|
+
font-size: 14px;
|
|
587
|
+
}
|
|
588
|
+
.ya-bubble-btn:hover {
|
|
589
|
+
background: rgba(255, 255, 255, 0.1);
|
|
590
|
+
color: #ffffff;
|
|
591
|
+
}
|
|
592
|
+
.ya-bubble-btn.is-active {
|
|
593
|
+
background: var(--color-primary, #D4A574);
|
|
594
|
+
color: #1a1a1a;
|
|
595
|
+
}
|
|
596
|
+
.ya-bubble-btn.is-active:hover {
|
|
597
|
+
background: var(--color-primary, #D4A574);
|
|
598
|
+
filter: brightness(1.1);
|
|
599
|
+
}
|
|
600
|
+
.ya-bubble-divider {
|
|
601
|
+
width: 1px;
|
|
602
|
+
height: 20px;
|
|
603
|
+
background: rgba(255, 255, 255, 0.2);
|
|
604
|
+
margin: 6px 4px;
|
|
605
|
+
}
|
|
606
|
+
.ya-bubble-select {
|
|
607
|
+
appearance: none;
|
|
608
|
+
background: transparent;
|
|
609
|
+
color: #e0e0e0;
|
|
610
|
+
border: 1px solid rgba(255, 255, 255, 0.2);
|
|
611
|
+
border-radius: 6px;
|
|
612
|
+
padding: 6px 24px 6px 10px;
|
|
613
|
+
font-size: 12px;
|
|
614
|
+
cursor: pointer;
|
|
615
|
+
transition: all 0.15s ease;
|
|
616
|
+
min-width: 70px;
|
|
617
|
+
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23e0e0e0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
|
|
618
|
+
background-repeat: no-repeat;
|
|
619
|
+
background-position: right 6px center;
|
|
620
|
+
}
|
|
621
|
+
.ya-bubble-select:hover {
|
|
622
|
+
border-color: rgba(255, 255, 255, 0.4);
|
|
623
|
+
background-color: rgba(255, 255, 255, 0.05);
|
|
624
|
+
}
|
|
625
|
+
.ya-bubble-select:focus {
|
|
626
|
+
outline: none;
|
|
627
|
+
border-color: var(--color-primary, #D4A574);
|
|
628
|
+
}
|
|
629
|
+
.ya-bubble-select option {
|
|
630
|
+
background: #1a1a1a;
|
|
631
|
+
color: #e0e0e0;
|
|
632
|
+
padding: 8px;
|
|
633
|
+
}
|
|
634
|
+
.ProseMirror {
|
|
635
|
+
outline: none;
|
|
636
|
+
}
|
|
637
|
+
.ProseMirror p {
|
|
638
|
+
margin: 0;
|
|
639
|
+
}
|
|
640
|
+
.ProseMirror a {
|
|
641
|
+
color: var(--color-primary, #D4A574);
|
|
642
|
+
text-decoration: underline;
|
|
643
|
+
}
|
|
644
|
+
.ProseMirror a:hover {
|
|
645
|
+
color: var(--color-secondary, #5C4033);
|
|
646
|
+
}
|
|
647
|
+
.ProseMirror ::selection {
|
|
648
|
+
background: rgba(212, 165, 116, 0.3);
|
|
649
|
+
}
|
|
650
|
+
.ProseMirror p.is-editor-empty:first-child::before {
|
|
651
|
+
content: attr(data-placeholder);
|
|
652
|
+
float: left;
|
|
653
|
+
color: #adb5bd;
|
|
654
|
+
pointer-events: none;
|
|
655
|
+
height: 0;
|
|
656
|
+
}
|
|
657
|
+
.ya-text-actions {
|
|
658
|
+
display: flex;
|
|
659
|
+
gap: 8px;
|
|
660
|
+
position: absolute;
|
|
661
|
+
bottom: -48px;
|
|
662
|
+
right: 0;
|
|
663
|
+
z-index: 10;
|
|
664
|
+
background: rgba(26, 26, 26, 0.8);
|
|
665
|
+
padding: 8px 10px;
|
|
666
|
+
border-radius: 8px;
|
|
667
|
+
font-family:
|
|
668
|
+
system-ui,
|
|
669
|
+
-apple-system,
|
|
670
|
+
BlinkMacSystemFont,
|
|
671
|
+
"Segoe UI",
|
|
672
|
+
sans-serif;
|
|
673
|
+
}
|
|
674
|
+
.ya-text-btn {
|
|
675
|
+
padding: 6px 14px;
|
|
676
|
+
font-size: 12px;
|
|
677
|
+
font-weight: 500;
|
|
678
|
+
border-radius: 6px;
|
|
679
|
+
cursor: pointer;
|
|
680
|
+
transition: all 0.15s ease;
|
|
681
|
+
border: none;
|
|
682
|
+
}
|
|
683
|
+
.ya-text-btn-cancel {
|
|
684
|
+
background: #333333;
|
|
685
|
+
color: #ffffff;
|
|
686
|
+
border: 1px solid #555555;
|
|
687
|
+
}
|
|
688
|
+
.ya-text-btn-cancel:hover {
|
|
689
|
+
background: #444444;
|
|
690
|
+
color: #ffffff;
|
|
691
|
+
border-color: #666666;
|
|
692
|
+
}
|
|
693
|
+
.ya-text-btn-save {
|
|
694
|
+
background: #D4A574;
|
|
695
|
+
color: #1a1a1a;
|
|
696
|
+
}
|
|
697
|
+
.ya-text-btn-save:hover {
|
|
698
|
+
background: #c4956a;
|
|
699
|
+
}
|
|
700
|
+
.ya-link-popover {
|
|
701
|
+
position: fixed;
|
|
702
|
+
z-index: 9999;
|
|
703
|
+
display: flex;
|
|
704
|
+
align-items: center;
|
|
705
|
+
gap: 6px;
|
|
706
|
+
padding: 8px 12px;
|
|
707
|
+
background: #1a1a1a;
|
|
708
|
+
color: #e0e0e0;
|
|
709
|
+
border-radius: 8px;
|
|
710
|
+
font-size: 13px;
|
|
711
|
+
font-weight: 500;
|
|
712
|
+
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
|
|
713
|
+
cursor: pointer;
|
|
714
|
+
white-space: nowrap;
|
|
715
|
+
transform: translateX(-50%);
|
|
716
|
+
pointer-events: auto;
|
|
717
|
+
animation: ya-link-popover-fade-in 0.1s ease;
|
|
718
|
+
}
|
|
719
|
+
.ya-link-popover:hover {
|
|
720
|
+
background: #2a2a2a;
|
|
721
|
+
}
|
|
722
|
+
@keyframes ya-link-popover-fade-in {
|
|
723
|
+
from {
|
|
724
|
+
opacity: 0;
|
|
725
|
+
transform: translateX(-50%) translateY(-4px);
|
|
726
|
+
}
|
|
727
|
+
to {
|
|
728
|
+
opacity: 1;
|
|
729
|
+
transform: translateX(-50%) translateY(0);
|
|
730
|
+
}
|
|
731
|
+
}
|
|
732
|
+
.ya-link-popover::before {
|
|
733
|
+
content: "";
|
|
734
|
+
position: absolute;
|
|
735
|
+
top: -6px;
|
|
736
|
+
left: 50%;
|
|
737
|
+
transform: translateX(-50%);
|
|
738
|
+
border-left: 6px solid transparent;
|
|
739
|
+
border-right: 6px solid transparent;
|
|
740
|
+
border-bottom: 6px solid #1a1a1a;
|
|
741
|
+
}
|
|
742
|
+
.ya-link-popover-icon {
|
|
743
|
+
width: 14px;
|
|
744
|
+
height: 14px;
|
|
745
|
+
opacity: 0.8;
|
|
746
|
+
flex-shrink: 0;
|
|
747
|
+
}
|
|
748
|
+
.ya-link-popover-prefix {
|
|
749
|
+
opacity: 0.7;
|
|
750
|
+
}
|
|
751
|
+
.ya-link-popover-name {
|
|
752
|
+
color: var(--color-primary, #D4A574);
|
|
753
|
+
}
|
|
754
|
+
`);
|
|
755
|
+
|
|
506
756
|
// src/components/YaText.tsx
|
|
507
757
|
import { Fragment as Fragment2, jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
508
758
|
var FontSize = Extension.create({
|
|
@@ -907,6 +1157,11 @@ function resolveAssetUrl(path) {
|
|
|
907
1157
|
// src/components/YaTooltip.tsx
|
|
908
1158
|
import { useEffect as useEffect4, useRef as useRef4, useState as useState4, useCallback as useCallback4 } from "react";
|
|
909
1159
|
import { createPortal as createPortal3 } from "react-dom";
|
|
1160
|
+
|
|
1161
|
+
// src/components/ya-tooltip.css
|
|
1162
|
+
styleInject('.ya-tooltip {\n position: fixed;\n z-index: 9999;\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 8px 12px;\n background: #1a1a1a;\n color: white;\n border-radius: 6px;\n font-size: 13px;\n font-weight: 500;\n font-family:\n system-ui,\n -apple-system,\n BlinkMacSystemFont,\n "Segoe UI",\n sans-serif;\n white-space: nowrap;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);\n animation: ya-tooltip-fade-in 0.15s ease;\n pointer-events: none;\n}\n@keyframes ya-tooltip-fade-in {\n from {\n opacity: 0;\n transform: scale(0.95);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n.ya-tooltip svg {\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n}\n.ya-tooltip-bottom {\n transform: translateX(-50%);\n}\n.ya-tooltip-bottom::before {\n content: "";\n position: absolute;\n bottom: 100%;\n left: 50%;\n transform: translateX(-50%);\n border: 6px solid transparent;\n border-bottom-color: #1a1a1a;\n}\n.ya-tooltip-top {\n transform: translateX(-50%);\n}\n.ya-tooltip-top::before {\n content: "";\n position: absolute;\n top: 100%;\n left: 50%;\n transform: translateX(-50%);\n border: 6px solid transparent;\n border-top-color: #1a1a1a;\n}\n.ya-tooltip-right {\n transform: translateY(-50%);\n}\n.ya-tooltip-right::before {\n content: "";\n position: absolute;\n right: 100%;\n top: 50%;\n transform: translateY(-50%);\n border: 6px solid transparent;\n border-right-color: #1a1a1a;\n}\n.ya-tooltip-left {\n transform: translateY(-50%);\n}\n.ya-tooltip-left::before {\n content: "";\n position: absolute;\n left: 100%;\n top: 50%;\n transform: translateY(-50%);\n border: 6px solid transparent;\n border-left-color: #1a1a1a;\n}\n');
|
|
1163
|
+
|
|
1164
|
+
// src/components/YaTooltip.tsx
|
|
910
1165
|
import { jsx as jsx5 } from "react/jsx-runtime";
|
|
911
1166
|
function YaTooltip({
|
|
912
1167
|
anchorRef,
|
|
@@ -1032,6 +1287,9 @@ function YaTooltip({
|
|
|
1032
1287
|
);
|
|
1033
1288
|
}
|
|
1034
1289
|
|
|
1290
|
+
// src/components/ya-image.css
|
|
1291
|
+
styleInject('.ya-image-container {\n position: relative;\n display: inline-block;\n min-width: 45px;\n min-height: 45px;\n cursor: pointer;\n transition: outline 0.15s ease;\n}\n.ya-image-container img {\n display: block;\n}\n.ya-image-editable {\n cursor: pointer;\n}\n.ya-image-editable:hover {\n outline: 2px dashed var(--color-primary, #D4A574);\n outline-offset: 4px;\n}\n.ya-image-selected {\n outline: 3px solid var(--color-primary, #D4A574);\n outline-offset: 4px;\n}\n.ya-image-overlay {\n position: absolute;\n inset: 0;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 8px;\n background: rgba(0, 0, 0, 0.5);\n opacity: 0;\n transition: opacity 0.2s ease;\n pointer-events: none;\n border-radius: inherit;\n}\n.ya-image-editable:hover .ya-image-overlay {\n opacity: 1;\n}\n.ya-image-selected .ya-image-overlay {\n opacity: 0;\n}\n.ya-image-edit-icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 48px;\n height: 48px;\n background: white;\n border-radius: 50%;\n color: #1a1a1a;\n box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);\n}\n.ya-image-edit-icon svg {\n width: 24px;\n height: 24px;\n}\n.ya-image-edit-label {\n color: white;\n font-size: 14px;\n font-weight: 500;\n text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);\n}\n@keyframes ya-image-success {\n 0% {\n outline-color: var(--color-primary, #D4A574);\n }\n 50% {\n outline-color: #22c55e;\n outline-width: 4px;\n }\n 100% {\n outline-color: var(--color-primary, #D4A574);\n outline-width: 2px;\n }\n}\n.ya-image-success {\n animation: ya-image-success 0.4s ease;\n}\n.ya-image-loading::after {\n content: "";\n position: absolute;\n inset: 0;\n background:\n linear-gradient(\n 90deg,\n rgba(255, 255, 255, 0) 0%,\n rgba(255, 255, 255, 0.3) 50%,\n rgba(255, 255, 255, 0) 100%);\n background-size: 200% 100%;\n animation: ya-image-shimmer 1.5s infinite;\n}\n@keyframes ya-image-shimmer {\n 0% {\n background-position: -200% 0;\n }\n 100% {\n background-position: 200% 0;\n }\n}\n.ya-image-container:focus {\n outline: 3px solid var(--color-primary, #D4A574);\n outline-offset: 4px;\n}\n.ya-image-container:focus:not(:focus-visible) {\n outline: none;\n}\n.ya-image-container:focus-visible {\n outline: 3px solid var(--color-primary, #D4A574);\n outline-offset: 4px;\n}\n.ya-image-small .ya-image-overlay {\n display: none;\n}\n');
|
|
1292
|
+
|
|
1035
1293
|
// src/components/YaImage.tsx
|
|
1036
1294
|
import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
1037
1295
|
function parseImageValue(value) {
|
|
@@ -1272,6 +1530,11 @@ import StarterKit2 from "@tiptap/starter-kit";
|
|
|
1272
1530
|
import { TextStyle as TextStyle2 } from "@tiptap/extension-text-style";
|
|
1273
1531
|
import { Extension as Extension2 } from "@tiptap/core";
|
|
1274
1532
|
import { Link as WouterLink, useLocation } from "wouter";
|
|
1533
|
+
|
|
1534
|
+
// src/components/ya-link.css
|
|
1535
|
+
styleInject('.ya-link-wrapper {\n position: relative;\n display: inline;\n}\n.ya-link-editable {\n cursor: pointer;\n transition: outline 0.15s ease;\n}\n.ya-link-editable:hover {\n outline: 2px dashed var(--color-primary, #D4A574);\n outline-offset: 4px;\n border-radius: 4px;\n}\nbody.builder-selector-active .ya-link-editable:hover {\n outline: none;\n cursor: inherit;\n}\n.ya-link-editing {\n outline: 2px solid var(--color-primary, #D4A574);\n outline-offset: 4px;\n border-radius: 4px;\n position: relative;\n}\n.ya-link-actions {\n display: flex;\n gap: 8px;\n position: absolute;\n bottom: -60px;\n right: 0;\n z-index: 10;\n background: rgba(26, 26, 26, 0.95);\n padding: 8px 10px;\n border-radius: 8px;\n box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);\n font-family:\n system-ui,\n -apple-system,\n BlinkMacSystemFont,\n "Segoe UI",\n sans-serif;\n}\n.ya-link-btn {\n padding: 6px 14px;\n font-size: 12px;\n font-weight: 500;\n border-radius: 6px;\n cursor: pointer;\n transition: all 0.15s ease;\n border: none;\n}\n.ya-link-btn-cancel {\n background: #333333;\n color: #ffffff;\n border: 1px solid #555555;\n}\n.ya-link-btn-cancel:hover {\n background: #444444;\n color: #ffffff;\n border-color: #666666;\n}\n.ya-link-btn-save {\n background: #D4A574;\n color: #1a1a1a;\n}\n.ya-link-btn-save:hover {\n background: #c4956a;\n}\n.ya-href-popover {\n position: absolute;\n top: 100%;\n left: 50%;\n margin-top: 8px;\n z-index: 10;\n min-width: 280px;\n max-width: 320px;\n background: #1a1a1a;\n border-radius: 12px;\n box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);\n transform: translateX(-50%);\n animation: ya-href-popover-fade-in 0.15s ease;\n overflow: hidden;\n font-family:\n system-ui,\n -apple-system,\n BlinkMacSystemFont,\n "Segoe UI",\n sans-serif;\n}\n@keyframes ya-href-popover-fade-in {\n from {\n opacity: 0;\n transform: translateX(-50%) translateY(-8px);\n }\n to {\n opacity: 1;\n transform: translateX(-50%) translateY(0);\n }\n}\n.ya-href-popover::before {\n content: "";\n position: absolute;\n top: -6px;\n left: 50%;\n transform: translateX(-50%);\n border-left: 8px solid transparent;\n border-right: 8px solid transparent;\n border-bottom: 8px solid #1a1a1a;\n}\n.ya-href-popover-header {\n padding: 12px 16px;\n font-size: 13px;\n font-weight: 600;\n color: #ffffff;\n border-bottom: 1px solid rgba(255, 255, 255, 0.1);\n}\n.ya-href-popover-section {\n padding: 12px 16px;\n}\n.ya-href-popover-label {\n display: block;\n font-size: 11px;\n font-weight: 500;\n color: rgba(255, 255, 255, 0.6);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n margin-bottom: 8px;\n}\n.ya-href-collapsible-header {\n display: flex;\n align-items: center;\n gap: 6px;\n width: 100%;\n padding: 0;\n background: transparent;\n border: none;\n cursor: pointer;\n transition: color 0.15s ease;\n}\n.ya-href-collapsible-header:hover {\n color: rgba(255, 255, 255, 0.8);\n}\n.ya-href-chevron {\n font-size: 8px;\n color: rgba(255, 255, 255, 0.4);\n}\n.ya-href-popover-pages {\n display: flex;\n flex-direction: column;\n gap: 4px;\n max-height: 200px;\n overflow-y: auto;\n}\n.ya-href-page-btn {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 4px;\n width: 100%;\n padding: 10px 12px;\n background: rgba(255, 255, 255, 0.05);\n border: 1px solid transparent;\n border-radius: 8px;\n color: #e0e0e0;\n font-size: 13px;\n font-weight: 500;\n text-align: left;\n cursor: pointer;\n transition: all 0.15s ease;\n}\n.ya-href-page-btn:hover {\n background: rgba(255, 255, 255, 0.1);\n border-color: rgba(255, 255, 255, 0.2);\n}\n.ya-href-page-btn.is-selected {\n background: #D4A574;\n color: #1a1a1a;\n}\n.ya-href-page-btn.is-selected .ya-href-page-path {\n color: rgba(26, 26, 26, 0.6);\n}\n.ya-href-page-path {\n font-size: 11px;\n color: rgba(255, 255, 255, 0.4);\n font-family: monospace;\n word-break: break-all;\n}\n.ya-href-external-toggle {\n display: block;\n width: 100%;\n padding: 10px 16px;\n background: transparent;\n border: none;\n border-top: 1px solid rgba(255, 255, 255, 0.1);\n color: #D4A574;\n font-size: 12px;\n font-weight: 500;\n text-align: center;\n cursor: pointer;\n transition: background 0.15s ease;\n}\n.ya-href-external-toggle:hover {\n background: rgba(255, 255, 255, 0.05);\n}\n.ya-href-url-input {\n width: 100%;\n padding: 10px 12px;\n background: rgba(255, 255, 255, 0.05);\n border: 1px solid rgba(255, 255, 255, 0.2);\n border-radius: 8px;\n color: #ffffff;\n font-size: 13px;\n outline: none;\n transition: border-color 0.15s ease;\n}\n.ya-href-url-input::placeholder {\n color: rgba(255, 255, 255, 0.4);\n}\n.ya-href-url-input:focus {\n border-color: var(--color-primary, #D4A574);\n}\n.ya-href-popover-actions {\n display: flex;\n justify-content: flex-end;\n gap: 8px;\n padding: 12px 16px;\n border-top: 1px solid rgba(255, 255, 255, 0.1);\n}\n.ya-link-edit-popover {\n position: absolute;\n top: 100%;\n left: 50%;\n margin-top: 8px;\n z-index: 10;\n background: #2a2a2a;\n border-radius: 6px;\n padding: 4px;\n display: flex;\n gap: 4px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);\n transform: translateX(-50%);\n animation: ya-edit-popover-fade-in 0.1s ease;\n font-family:\n system-ui,\n -apple-system,\n BlinkMacSystemFont,\n "Segoe UI",\n sans-serif;\n white-space: nowrap;\n}\n@keyframes ya-edit-popover-fade-in {\n from {\n opacity: 0;\n transform: translateX(-50%) translateY(-4px);\n }\n to {\n opacity: 1;\n transform: translateX(-50%) translateY(0);\n }\n}\n.ya-link-edit-popover::before {\n content: "";\n position: absolute;\n top: -5px;\n left: 50%;\n transform: translateX(-50%);\n border-left: 6px solid transparent;\n border-right: 6px solid transparent;\n border-bottom: 6px solid #2a2a2a;\n}\n.ya-link-edit-popover button {\n background: #3a3a3a;\n border: none;\n color: #fff;\n padding: 6px 12px;\n border-radius: 4px;\n cursor: pointer;\n font-size: 13px;\n font-weight: 500;\n transition: background 0.15s ease;\n}\n.ya-link-edit-popover button:hover {\n background: #4a4a4a;\n}\n');
|
|
1536
|
+
|
|
1537
|
+
// src/components/YaLink.tsx
|
|
1275
1538
|
import { Fragment as Fragment3, jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
1276
1539
|
function isInternalPath(path) {
|
|
1277
1540
|
if (!path) return false;
|
|
@@ -2006,6 +2269,9 @@ function Router({ children, base }) {
|
|
|
2006
2269
|
return /* @__PURE__ */ jsx12(WouterRouter, { base: basename, children });
|
|
2007
2270
|
}
|
|
2008
2271
|
|
|
2272
|
+
// src/router/index.ts
|
|
2273
|
+
import { Route, Switch } from "wouter";
|
|
2274
|
+
|
|
2009
2275
|
// src/lib/builder-selection.ts
|
|
2010
2276
|
var SELECTABLE_SELECTORS = [
|
|
2011
2277
|
// Interactive elements
|
|
@@ -2557,10 +2823,12 @@ export {
|
|
|
2557
2823
|
ContentStoreProvider2 as ContentStoreProviderProd,
|
|
2558
2824
|
Link2 as Link,
|
|
2559
2825
|
MarkdownText,
|
|
2826
|
+
Route,
|
|
2560
2827
|
Router,
|
|
2561
2828
|
SafeHtml,
|
|
2562
2829
|
MpImage as StaticImage,
|
|
2563
2830
|
MpText as StaticText,
|
|
2831
|
+
Switch,
|
|
2564
2832
|
YaImage,
|
|
2565
2833
|
YaLink,
|
|
2566
2834
|
YaText,
|
package/dist/plugin.js
CHANGED
|
@@ -63,7 +63,9 @@ function yoamigoPlugin(options = {}) {
|
|
|
63
63
|
// This ensures HMR WebSocket connects to the proxy (router) not directly to Vite
|
|
64
64
|
clientPort: void 0,
|
|
65
65
|
host: void 0,
|
|
66
|
-
protocol: void 0
|
|
66
|
+
protocol: void 0,
|
|
67
|
+
// Hide error overlay from end users in the builder
|
|
68
|
+
overlay: false
|
|
67
69
|
}
|
|
68
70
|
},
|
|
69
71
|
// Dynamic base URL for different deployment contexts:
|
package/dist/router.d.ts
CHANGED
package/dist/router.js
CHANGED
|
@@ -35,8 +35,13 @@ function Router({ children, base }) {
|
|
|
35
35
|
const basename = base ?? detectBasename();
|
|
36
36
|
return /* @__PURE__ */ jsx2(WouterRouter, { base: basename, children });
|
|
37
37
|
}
|
|
38
|
+
|
|
39
|
+
// src/router/index.ts
|
|
40
|
+
import { Route, Switch } from "wouter";
|
|
38
41
|
export {
|
|
39
42
|
Link,
|
|
43
|
+
Route,
|
|
40
44
|
Router,
|
|
45
|
+
Switch,
|
|
41
46
|
useNavigate
|
|
42
47
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@yoamigo.com/core",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.2",
|
|
4
4
|
"description": "Core components, router, and utilities for YoAmigo templates",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"license": "SEE LICENSE IN LICENSE",
|
|
@@ -30,13 +30,10 @@
|
|
|
30
30
|
"./lib/prod": {
|
|
31
31
|
"types": "./dist/lib-prod.d.ts",
|
|
32
32
|
"import": "./dist/lib-prod.js"
|
|
33
|
-
}
|
|
34
|
-
"./styles": "./src/styles/index.css",
|
|
35
|
-
"./styles/*": "./src/styles/*"
|
|
33
|
+
}
|
|
36
34
|
},
|
|
37
35
|
"files": [
|
|
38
36
|
"dist",
|
|
39
|
-
"src/styles",
|
|
40
37
|
"LICENSE",
|
|
41
38
|
"README.md"
|
|
42
39
|
],
|
|
@@ -69,7 +66,8 @@
|
|
|
69
66
|
"dev": "tsup --watch",
|
|
70
67
|
"typecheck": "tsc --noEmit",
|
|
71
68
|
"lint": "eslint src --ext .ts,.tsx",
|
|
72
|
-
"lint:check": "eslint src --ext .ts,.tsx"
|
|
69
|
+
"lint:check": "eslint src --ext .ts,.tsx",
|
|
70
|
+
"prepublishOnly": "pnpm build"
|
|
73
71
|
},
|
|
74
72
|
"dependencies": {
|
|
75
73
|
"clsx": "^2.1.1",
|
package/dist/index.css
DELETED
|
@@ -1,372 +0,0 @@
|
|
|
1
|
-
/* src/components/ya-tooltip.css */
|
|
2
|
-
.ya-tooltip {
|
|
3
|
-
position: fixed;
|
|
4
|
-
z-index: 9999;
|
|
5
|
-
display: flex;
|
|
6
|
-
align-items: center;
|
|
7
|
-
gap: 6px;
|
|
8
|
-
padding: 8px 12px;
|
|
9
|
-
background: #1a1a1a;
|
|
10
|
-
color: white;
|
|
11
|
-
border-radius: 6px;
|
|
12
|
-
font-size: 13px;
|
|
13
|
-
font-weight: 500;
|
|
14
|
-
font-family:
|
|
15
|
-
system-ui,
|
|
16
|
-
-apple-system,
|
|
17
|
-
BlinkMacSystemFont,
|
|
18
|
-
"Segoe UI",
|
|
19
|
-
sans-serif;
|
|
20
|
-
white-space: nowrap;
|
|
21
|
-
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
|
|
22
|
-
animation: ya-tooltip-fade-in 0.15s ease;
|
|
23
|
-
pointer-events: none;
|
|
24
|
-
}
|
|
25
|
-
@keyframes ya-tooltip-fade-in {
|
|
26
|
-
from {
|
|
27
|
-
opacity: 0;
|
|
28
|
-
transform: scale(0.95);
|
|
29
|
-
}
|
|
30
|
-
to {
|
|
31
|
-
opacity: 1;
|
|
32
|
-
transform: scale(1);
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
.ya-tooltip svg {
|
|
36
|
-
width: 16px;
|
|
37
|
-
height: 16px;
|
|
38
|
-
flex-shrink: 0;
|
|
39
|
-
}
|
|
40
|
-
.ya-tooltip-bottom {
|
|
41
|
-
transform: translateX(-50%);
|
|
42
|
-
}
|
|
43
|
-
.ya-tooltip-bottom::before {
|
|
44
|
-
content: "";
|
|
45
|
-
position: absolute;
|
|
46
|
-
bottom: 100%;
|
|
47
|
-
left: 50%;
|
|
48
|
-
transform: translateX(-50%);
|
|
49
|
-
border: 6px solid transparent;
|
|
50
|
-
border-bottom-color: #1a1a1a;
|
|
51
|
-
}
|
|
52
|
-
.ya-tooltip-top {
|
|
53
|
-
transform: translateX(-50%);
|
|
54
|
-
}
|
|
55
|
-
.ya-tooltip-top::before {
|
|
56
|
-
content: "";
|
|
57
|
-
position: absolute;
|
|
58
|
-
top: 100%;
|
|
59
|
-
left: 50%;
|
|
60
|
-
transform: translateX(-50%);
|
|
61
|
-
border: 6px solid transparent;
|
|
62
|
-
border-top-color: #1a1a1a;
|
|
63
|
-
}
|
|
64
|
-
.ya-tooltip-right {
|
|
65
|
-
transform: translateY(-50%);
|
|
66
|
-
}
|
|
67
|
-
.ya-tooltip-right::before {
|
|
68
|
-
content: "";
|
|
69
|
-
position: absolute;
|
|
70
|
-
right: 100%;
|
|
71
|
-
top: 50%;
|
|
72
|
-
transform: translateY(-50%);
|
|
73
|
-
border: 6px solid transparent;
|
|
74
|
-
border-right-color: #1a1a1a;
|
|
75
|
-
}
|
|
76
|
-
.ya-tooltip-left {
|
|
77
|
-
transform: translateY(-50%);
|
|
78
|
-
}
|
|
79
|
-
.ya-tooltip-left::before {
|
|
80
|
-
content: "";
|
|
81
|
-
position: absolute;
|
|
82
|
-
left: 100%;
|
|
83
|
-
top: 50%;
|
|
84
|
-
transform: translateY(-50%);
|
|
85
|
-
border: 6px solid transparent;
|
|
86
|
-
border-left-color: #1a1a1a;
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
/* src/components/ya-link.css */
|
|
90
|
-
.ya-link-wrapper {
|
|
91
|
-
position: relative;
|
|
92
|
-
display: inline;
|
|
93
|
-
}
|
|
94
|
-
.ya-link-editable {
|
|
95
|
-
cursor: pointer;
|
|
96
|
-
transition: outline 0.15s ease;
|
|
97
|
-
}
|
|
98
|
-
.ya-link-editable:hover {
|
|
99
|
-
outline: 2px dashed var(--color-primary, #D4A574);
|
|
100
|
-
outline-offset: 4px;
|
|
101
|
-
border-radius: 4px;
|
|
102
|
-
}
|
|
103
|
-
body.builder-selector-active .ya-link-editable:hover {
|
|
104
|
-
outline: none;
|
|
105
|
-
cursor: inherit;
|
|
106
|
-
}
|
|
107
|
-
.ya-link-editing {
|
|
108
|
-
outline: 2px solid var(--color-primary, #D4A574);
|
|
109
|
-
outline-offset: 4px;
|
|
110
|
-
border-radius: 4px;
|
|
111
|
-
position: relative;
|
|
112
|
-
}
|
|
113
|
-
.ya-link-actions {
|
|
114
|
-
display: flex;
|
|
115
|
-
gap: 8px;
|
|
116
|
-
position: absolute;
|
|
117
|
-
bottom: -60px;
|
|
118
|
-
right: 0;
|
|
119
|
-
z-index: 10;
|
|
120
|
-
background: rgba(26, 26, 26, 0.95);
|
|
121
|
-
padding: 8px 10px;
|
|
122
|
-
border-radius: 8px;
|
|
123
|
-
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
|
|
124
|
-
font-family:
|
|
125
|
-
system-ui,
|
|
126
|
-
-apple-system,
|
|
127
|
-
BlinkMacSystemFont,
|
|
128
|
-
"Segoe UI",
|
|
129
|
-
sans-serif;
|
|
130
|
-
}
|
|
131
|
-
.ya-link-btn {
|
|
132
|
-
padding: 6px 14px;
|
|
133
|
-
font-size: 12px;
|
|
134
|
-
font-weight: 500;
|
|
135
|
-
border-radius: 6px;
|
|
136
|
-
cursor: pointer;
|
|
137
|
-
transition: all 0.15s ease;
|
|
138
|
-
border: none;
|
|
139
|
-
}
|
|
140
|
-
.ya-link-btn-cancel {
|
|
141
|
-
background: #333333;
|
|
142
|
-
color: #ffffff;
|
|
143
|
-
border: 1px solid #555555;
|
|
144
|
-
}
|
|
145
|
-
.ya-link-btn-cancel:hover {
|
|
146
|
-
background: #444444;
|
|
147
|
-
color: #ffffff;
|
|
148
|
-
border-color: #666666;
|
|
149
|
-
}
|
|
150
|
-
.ya-link-btn-save {
|
|
151
|
-
background: #D4A574;
|
|
152
|
-
color: #1a1a1a;
|
|
153
|
-
}
|
|
154
|
-
.ya-link-btn-save:hover {
|
|
155
|
-
background: #c4956a;
|
|
156
|
-
}
|
|
157
|
-
.ya-href-popover {
|
|
158
|
-
position: absolute;
|
|
159
|
-
top: 100%;
|
|
160
|
-
left: 50%;
|
|
161
|
-
margin-top: 8px;
|
|
162
|
-
z-index: 10;
|
|
163
|
-
min-width: 280px;
|
|
164
|
-
max-width: 320px;
|
|
165
|
-
background: #1a1a1a;
|
|
166
|
-
border-radius: 12px;
|
|
167
|
-
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
|
|
168
|
-
transform: translateX(-50%);
|
|
169
|
-
animation: ya-href-popover-fade-in 0.15s ease;
|
|
170
|
-
overflow: hidden;
|
|
171
|
-
font-family:
|
|
172
|
-
system-ui,
|
|
173
|
-
-apple-system,
|
|
174
|
-
BlinkMacSystemFont,
|
|
175
|
-
"Segoe UI",
|
|
176
|
-
sans-serif;
|
|
177
|
-
}
|
|
178
|
-
@keyframes ya-href-popover-fade-in {
|
|
179
|
-
from {
|
|
180
|
-
opacity: 0;
|
|
181
|
-
transform: translateX(-50%) translateY(-8px);
|
|
182
|
-
}
|
|
183
|
-
to {
|
|
184
|
-
opacity: 1;
|
|
185
|
-
transform: translateX(-50%) translateY(0);
|
|
186
|
-
}
|
|
187
|
-
}
|
|
188
|
-
.ya-href-popover::before {
|
|
189
|
-
content: "";
|
|
190
|
-
position: absolute;
|
|
191
|
-
top: -6px;
|
|
192
|
-
left: 50%;
|
|
193
|
-
transform: translateX(-50%);
|
|
194
|
-
border-left: 8px solid transparent;
|
|
195
|
-
border-right: 8px solid transparent;
|
|
196
|
-
border-bottom: 8px solid #1a1a1a;
|
|
197
|
-
}
|
|
198
|
-
.ya-href-popover-header {
|
|
199
|
-
padding: 12px 16px;
|
|
200
|
-
font-size: 13px;
|
|
201
|
-
font-weight: 600;
|
|
202
|
-
color: #ffffff;
|
|
203
|
-
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
|
204
|
-
}
|
|
205
|
-
.ya-href-popover-section {
|
|
206
|
-
padding: 12px 16px;
|
|
207
|
-
}
|
|
208
|
-
.ya-href-popover-label {
|
|
209
|
-
display: block;
|
|
210
|
-
font-size: 11px;
|
|
211
|
-
font-weight: 500;
|
|
212
|
-
color: rgba(255, 255, 255, 0.6);
|
|
213
|
-
text-transform: uppercase;
|
|
214
|
-
letter-spacing: 0.5px;
|
|
215
|
-
margin-bottom: 8px;
|
|
216
|
-
}
|
|
217
|
-
.ya-href-collapsible-header {
|
|
218
|
-
display: flex;
|
|
219
|
-
align-items: center;
|
|
220
|
-
gap: 6px;
|
|
221
|
-
width: 100%;
|
|
222
|
-
padding: 0;
|
|
223
|
-
background: transparent;
|
|
224
|
-
border: none;
|
|
225
|
-
cursor: pointer;
|
|
226
|
-
transition: color 0.15s ease;
|
|
227
|
-
}
|
|
228
|
-
.ya-href-collapsible-header:hover {
|
|
229
|
-
color: rgba(255, 255, 255, 0.8);
|
|
230
|
-
}
|
|
231
|
-
.ya-href-chevron {
|
|
232
|
-
font-size: 8px;
|
|
233
|
-
color: rgba(255, 255, 255, 0.4);
|
|
234
|
-
}
|
|
235
|
-
.ya-href-popover-pages {
|
|
236
|
-
display: flex;
|
|
237
|
-
flex-direction: column;
|
|
238
|
-
gap: 4px;
|
|
239
|
-
max-height: 200px;
|
|
240
|
-
overflow-y: auto;
|
|
241
|
-
}
|
|
242
|
-
.ya-href-page-btn {
|
|
243
|
-
display: flex;
|
|
244
|
-
flex-direction: column;
|
|
245
|
-
align-items: flex-start;
|
|
246
|
-
gap: 4px;
|
|
247
|
-
width: 100%;
|
|
248
|
-
padding: 10px 12px;
|
|
249
|
-
background: rgba(255, 255, 255, 0.05);
|
|
250
|
-
border: 1px solid transparent;
|
|
251
|
-
border-radius: 8px;
|
|
252
|
-
color: #e0e0e0;
|
|
253
|
-
font-size: 13px;
|
|
254
|
-
font-weight: 500;
|
|
255
|
-
text-align: left;
|
|
256
|
-
cursor: pointer;
|
|
257
|
-
transition: all 0.15s ease;
|
|
258
|
-
}
|
|
259
|
-
.ya-href-page-btn:hover {
|
|
260
|
-
background: rgba(255, 255, 255, 0.1);
|
|
261
|
-
border-color: rgba(255, 255, 255, 0.2);
|
|
262
|
-
}
|
|
263
|
-
.ya-href-page-btn.is-selected {
|
|
264
|
-
background: #D4A574;
|
|
265
|
-
color: #1a1a1a;
|
|
266
|
-
}
|
|
267
|
-
.ya-href-page-btn.is-selected .ya-href-page-path {
|
|
268
|
-
color: rgba(26, 26, 26, 0.6);
|
|
269
|
-
}
|
|
270
|
-
.ya-href-page-path {
|
|
271
|
-
font-size: 11px;
|
|
272
|
-
color: rgba(255, 255, 255, 0.4);
|
|
273
|
-
font-family: monospace;
|
|
274
|
-
word-break: break-all;
|
|
275
|
-
}
|
|
276
|
-
.ya-href-external-toggle {
|
|
277
|
-
display: block;
|
|
278
|
-
width: 100%;
|
|
279
|
-
padding: 10px 16px;
|
|
280
|
-
background: transparent;
|
|
281
|
-
border: none;
|
|
282
|
-
border-top: 1px solid rgba(255, 255, 255, 0.1);
|
|
283
|
-
color: #D4A574;
|
|
284
|
-
font-size: 12px;
|
|
285
|
-
font-weight: 500;
|
|
286
|
-
text-align: center;
|
|
287
|
-
cursor: pointer;
|
|
288
|
-
transition: background 0.15s ease;
|
|
289
|
-
}
|
|
290
|
-
.ya-href-external-toggle:hover {
|
|
291
|
-
background: rgba(255, 255, 255, 0.05);
|
|
292
|
-
}
|
|
293
|
-
.ya-href-url-input {
|
|
294
|
-
width: 100%;
|
|
295
|
-
padding: 10px 12px;
|
|
296
|
-
background: rgba(255, 255, 255, 0.05);
|
|
297
|
-
border: 1px solid rgba(255, 255, 255, 0.2);
|
|
298
|
-
border-radius: 8px;
|
|
299
|
-
color: #ffffff;
|
|
300
|
-
font-size: 13px;
|
|
301
|
-
outline: none;
|
|
302
|
-
transition: border-color 0.15s ease;
|
|
303
|
-
}
|
|
304
|
-
.ya-href-url-input::placeholder {
|
|
305
|
-
color: rgba(255, 255, 255, 0.4);
|
|
306
|
-
}
|
|
307
|
-
.ya-href-url-input:focus {
|
|
308
|
-
border-color: var(--color-primary, #D4A574);
|
|
309
|
-
}
|
|
310
|
-
.ya-href-popover-actions {
|
|
311
|
-
display: flex;
|
|
312
|
-
justify-content: flex-end;
|
|
313
|
-
gap: 8px;
|
|
314
|
-
padding: 12px 16px;
|
|
315
|
-
border-top: 1px solid rgba(255, 255, 255, 0.1);
|
|
316
|
-
}
|
|
317
|
-
.ya-link-edit-popover {
|
|
318
|
-
position: absolute;
|
|
319
|
-
top: 100%;
|
|
320
|
-
left: 50%;
|
|
321
|
-
margin-top: 8px;
|
|
322
|
-
z-index: 10;
|
|
323
|
-
background: #2a2a2a;
|
|
324
|
-
border-radius: 6px;
|
|
325
|
-
padding: 4px;
|
|
326
|
-
display: flex;
|
|
327
|
-
gap: 4px;
|
|
328
|
-
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
|
|
329
|
-
transform: translateX(-50%);
|
|
330
|
-
animation: ya-edit-popover-fade-in 0.1s ease;
|
|
331
|
-
font-family:
|
|
332
|
-
system-ui,
|
|
333
|
-
-apple-system,
|
|
334
|
-
BlinkMacSystemFont,
|
|
335
|
-
"Segoe UI",
|
|
336
|
-
sans-serif;
|
|
337
|
-
white-space: nowrap;
|
|
338
|
-
}
|
|
339
|
-
@keyframes ya-edit-popover-fade-in {
|
|
340
|
-
from {
|
|
341
|
-
opacity: 0;
|
|
342
|
-
transform: translateX(-50%) translateY(-4px);
|
|
343
|
-
}
|
|
344
|
-
to {
|
|
345
|
-
opacity: 1;
|
|
346
|
-
transform: translateX(-50%) translateY(0);
|
|
347
|
-
}
|
|
348
|
-
}
|
|
349
|
-
.ya-link-edit-popover::before {
|
|
350
|
-
content: "";
|
|
351
|
-
position: absolute;
|
|
352
|
-
top: -5px;
|
|
353
|
-
left: 50%;
|
|
354
|
-
transform: translateX(-50%);
|
|
355
|
-
border-left: 6px solid transparent;
|
|
356
|
-
border-right: 6px solid transparent;
|
|
357
|
-
border-bottom: 6px solid #2a2a2a;
|
|
358
|
-
}
|
|
359
|
-
.ya-link-edit-popover button {
|
|
360
|
-
background: #3a3a3a;
|
|
361
|
-
border: none;
|
|
362
|
-
color: #fff;
|
|
363
|
-
padding: 6px 12px;
|
|
364
|
-
border-radius: 4px;
|
|
365
|
-
cursor: pointer;
|
|
366
|
-
font-size: 13px;
|
|
367
|
-
font-weight: 500;
|
|
368
|
-
transition: background 0.15s ease;
|
|
369
|
-
}
|
|
370
|
-
.ya-link-edit-popover button:hover {
|
|
371
|
-
background: #4a4a4a;
|
|
372
|
-
}
|