@ptengine/inline-editor 0.1.4 → 0.1.6

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.
Files changed (51) hide show
  1. package/CHANGELOG.md +54 -0
  2. package/dist/InlineEditor.d.ts +15 -1
  3. package/dist/InlineEditor.js +85 -54
  4. package/dist/canvas-ui/tree/TreePanel.d.ts +2 -1
  5. package/dist/canvas-ui/tree/TreePanel.js +79 -39
  6. package/dist/chrome/EditorChrome.d.ts +2 -0
  7. package/dist/chrome/EditorChrome.js +1 -1
  8. package/dist/chrome/VersionMenu.d.ts +3 -1
  9. package/dist/chrome/VersionMenu.js +24 -12
  10. package/dist/chrome/topbarPrimitives.d.ts +5 -52
  11. package/dist/chrome/topbarPrimitives.js +13 -31
  12. package/dist/dialogs/ClickActionDialog.js +4 -5
  13. package/dist/dialogs/CodeField.d.ts +4 -0
  14. package/dist/dialogs/CodeField.js +10 -0
  15. package/dist/dialogs/HtmlEditDialog.js +3 -2
  16. package/dist/dialogs/ImageEditDialog.js +53 -15
  17. package/dist/dialogs/ImageSettingDialog.js +3 -3
  18. package/dist/dialogs/InsertElementDialog.js +6 -6
  19. package/dist/dialogs/MediaPreview.d.ts +5 -0
  20. package/dist/dialogs/MediaPreview.js +34 -0
  21. package/dist/dialogs/ReplaceVideoDialog.js +8 -4
  22. package/dist/index.d.ts +1 -0
  23. package/dist/kernel/blocks/BlockOverlay.js +1 -1
  24. package/dist/kernel/blocks/resolveBlocks.d.ts +16 -0
  25. package/dist/kernel/blocks/resolveBlocks.js +39 -6
  26. package/dist/kernel/canvasCommands.d.ts +7 -1
  27. package/dist/kernel/canvasCommands.js +3 -0
  28. package/dist/kernel/changelist/ChangeListPanel.js +11 -9
  29. package/dist/kernel/changelist/useChangeList.d.ts +4 -0
  30. package/dist/kernel/changelist/useChangeList.js +84 -10
  31. package/dist/kernel/selection/SelectionOverlay.js +1 -1
  32. package/dist/kernel/selection/SelectionToolbar.js +26 -8
  33. package/dist/kernel/selection/buildRootShelf.d.ts +49 -2
  34. package/dist/kernel/selection/buildRootShelf.js +156 -41
  35. package/dist/kernel/selection/elementAiContext.d.ts +11 -3
  36. package/dist/kernel/selection/resolveAnchors.d.ts +17 -0
  37. package/dist/kernel/selection/resolveAnchors.js +59 -11
  38. package/dist/locales.d.ts +186 -48
  39. package/dist/locales.js +10 -9
  40. package/dist/panels/EditorStatus.d.ts +5 -0
  41. package/dist/panels/EditorStatus.js +4 -0
  42. package/dist/panels/ScreenshotCard.d.ts +7 -0
  43. package/dist/panels/ScreenshotCard.js +57 -0
  44. package/dist/panels/StylePanel.d.ts +7 -1
  45. package/dist/panels/StylePanel.js +105 -12
  46. package/dist/reviewLocales.d.ts +140 -0
  47. package/dist/reviewLocales.js +134 -0
  48. package/dist/tree/LayersPanel.js +4 -2
  49. package/dist/useInlineEditor.d.ts +12 -1
  50. package/dist/useInlineEditor.js +21 -4
  51. package/package.json +1 -1
package/dist/locales.d.ts CHANGED
@@ -551,8 +551,54 @@ export declare const jaJP: {
551
551
  };
552
552
  export declare const inlineEditorLocales: {
553
553
  readonly 'zh-CN': {
554
- inlineCanvas: {
555
- action: {
554
+ readonly inlineCanvas: {
555
+ readonly review: {
556
+ readonly generating: "正在生成截图…";
557
+ readonly noLayers: "没有匹配的图层";
558
+ readonly clearSearch: "清除搜索";
559
+ readonly searchLayers: "搜索图层";
560
+ readonly linkCopied: "链接已复制";
561
+ readonly copyLinkManual: "复制失败,请从下方手动复制链接";
562
+ readonly uploadError: "上传失败,可重试;本地图片仍可下载";
563
+ readonly screenshot: "元素截图";
564
+ readonly enlarge: "放大预览";
565
+ readonly shotTruncated: "元素超出可视区,只截到可见部分";
566
+ readonly shotScale: "截图分辨率约为原图的 {{scale}}%";
567
+ readonly downloadImage: "下载图片";
568
+ readonly imageCopied: "图片已复制";
569
+ readonly copyError: "复制失败,请下载图片";
570
+ readonly copyImage: "复制图片";
571
+ readonly uploading: "正在上传…";
572
+ readonly copyLink: "复制链接";
573
+ readonly shotLink: "截图链接";
574
+ readonly reset: "清除覆盖";
575
+ readonly colorSwatch: "选择颜色";
576
+ readonly saveDraft: "保存草稿";
577
+ readonly versions: "版本管理";
578
+ readonly removeEmptyVersion: "移除空版本";
579
+ readonly versionLimit: "最多 4 个版本";
580
+ readonly imageLimit: "请选择不超过 10 MB 的图片";
581
+ readonly currentMedia: "当前媒体";
582
+ readonly uploadFile: "上传文件";
583
+ readonly useLink: "使用链接";
584
+ readonly replaceImage: "替换当前图片";
585
+ readonly replaceBackground: "替换背景图片";
586
+ readonly insertImage: "插入新图片";
587
+ readonly dropImage: "拖入图片或选择文件,支持图片格式,最大 10 MB。上传只准备素材,应用后才修改画布。";
588
+ readonly pendingMedia: "待应用媒体";
589
+ readonly altHelp: "替代文本用于描述图片内容。装饰图片可留空。";
590
+ readonly videoLinkHint: "支持视频文件链接和 YouTube 嵌入链接。加载就绪后应用到画布。";
591
+ readonly mediaPreview: "媒体预览";
592
+ readonly loading: "正在加载预览…";
593
+ readonly loadError: "预览加载失败";
594
+ readonly retry: "重试";
595
+ readonly ready: "媒体已就绪,应用后修改画布";
596
+ readonly align_left: "左对齐";
597
+ readonly align_center: "居中";
598
+ readonly align_right: "右对齐";
599
+ readonly align_justify: "两端对齐";
600
+ };
601
+ readonly action: {
556
602
  title: string;
557
603
  enable: string;
558
604
  type: string;
@@ -572,17 +618,17 @@ export declare const inlineEditorLocales: {
572
618
  fileUrl: string;
573
619
  code: string;
574
620
  };
575
- video: {
621
+ readonly video: {
576
622
  title: string;
577
623
  url: string;
578
624
  hint: string;
579
625
  };
580
- insert: {
626
+ readonly insert: {
581
627
  title: string;
582
628
  html: string;
583
629
  position: string;
584
630
  };
585
- image: {
631
+ readonly image: {
586
632
  replaceTitle: string;
587
633
  settingTitle: string;
588
634
  url: string;
@@ -591,7 +637,7 @@ export declare const inlineEditorLocales: {
591
637
  alt: string;
592
638
  insertPosition: string;
593
639
  };
594
- move: {
640
+ readonly move: {
595
641
  title: string;
596
642
  pickTarget: string;
597
643
  cancel: string;
@@ -601,7 +647,7 @@ export declare const inlineEditorLocales: {
601
647
  before: string;
602
648
  after: string;
603
649
  };
604
- clipboard: {
650
+ readonly clipboard: {
605
651
  copied: string;
606
652
  nothingToPaste: string;
607
653
  pastePosition: string;
@@ -610,7 +656,7 @@ export declare const inlineEditorLocales: {
610
656
  before: string;
611
657
  after: string;
612
658
  };
613
- chrome: {
659
+ readonly chrome: {
614
660
  exit: string;
615
661
  close: string;
616
662
  save: string;
@@ -630,17 +676,17 @@ export declare const inlineEditorLocales: {
630
676
  pc: string;
631
677
  mobile: string;
632
678
  };
633
- version: {
679
+ readonly version: {
634
680
  switching: string;
635
681
  };
636
- preview: {
682
+ readonly preview: {
637
683
  loading: string;
638
684
  ready: string;
639
685
  failed: string;
640
686
  failedHint: string;
641
687
  blockCount: string;
642
688
  };
643
- html: {
689
+ readonly html: {
644
690
  title: string;
645
691
  tip: string;
646
692
  scriptStripped: string;
@@ -648,11 +694,11 @@ export declare const inlineEditorLocales: {
648
694
  errorNoElement: string;
649
695
  errorMultipleRoots: string;
650
696
  };
651
- text: {
697
+ readonly text: {
652
698
  title: string;
653
699
  tip: string;
654
700
  };
655
- style: {
701
+ readonly style: {
656
702
  footnote: string;
657
703
  size: string;
658
704
  width: string;
@@ -673,7 +719,7 @@ export declare const inlineEditorLocales: {
673
719
  borderAll: string;
674
720
  borderRadius: string;
675
721
  };
676
- toolbar: {
722
+ readonly toolbar: {
677
723
  screenshot: string;
678
724
  replaceVideo: string;
679
725
  insert: string;
@@ -689,11 +735,11 @@ export declare const inlineEditorLocales: {
689
735
  delete: string;
690
736
  askAi: string;
691
737
  };
692
- selectorPath: {
738
+ readonly selectorPath: {
693
739
  label: string;
694
740
  };
695
741
  };
696
- taginfo: {
742
+ readonly taginfo: {
697
743
  A: string;
698
744
  B: string;
699
745
  BODY: string;
@@ -731,8 +777,54 @@ export declare const inlineEditorLocales: {
731
777
  };
732
778
  };
733
779
  readonly 'en-US': {
734
- inlineCanvas: {
735
- action: {
780
+ readonly inlineCanvas: {
781
+ readonly review: {
782
+ readonly generating: "Generating screenshot…";
783
+ readonly noLayers: "No matching layers";
784
+ readonly clearSearch: "Clear search";
785
+ readonly searchLayers: "Search layers";
786
+ readonly linkCopied: "Link copied";
787
+ readonly copyLinkManual: "Copy failed. Copy the link below manually.";
788
+ readonly uploadError: "Upload failed. Retry or download the local image.";
789
+ readonly screenshot: "Element screenshot";
790
+ readonly enlarge: "Enlarge preview";
791
+ readonly shotTruncated: "Only the visible part of the element was captured.";
792
+ readonly shotScale: "Screenshot resolution is about {{scale}}% of the original.";
793
+ readonly downloadImage: "Download image";
794
+ readonly imageCopied: "Image copied";
795
+ readonly copyError: "Copy failed. Download the image instead.";
796
+ readonly copyImage: "Copy image";
797
+ readonly uploading: "Uploading…";
798
+ readonly copyLink: "Copy link";
799
+ readonly shotLink: "Screenshot link";
800
+ readonly reset: "Clear override";
801
+ readonly colorSwatch: "Choose color";
802
+ readonly saveDraft: "Save draft";
803
+ readonly versions: "Manage versions";
804
+ readonly removeEmptyVersion: "Remove empty version";
805
+ readonly versionLimit: "Maximum 4 versions";
806
+ readonly imageLimit: "Choose an image up to 10 MB.";
807
+ readonly currentMedia: "Current media";
808
+ readonly uploadFile: "Upload file";
809
+ readonly useLink: "Use link";
810
+ readonly replaceImage: "Replace current image";
811
+ readonly replaceBackground: "Replace background image";
812
+ readonly insertImage: "Insert new image";
813
+ readonly dropImage: "Drop an image or choose a file, up to 10 MB. Upload prepares the asset; Apply changes the canvas.";
814
+ readonly pendingMedia: "Media to apply";
815
+ readonly altHelp: "Describe the image for assistive technology. Leave blank for decorative images.";
816
+ readonly videoLinkHint: "Use a video file URL or YouTube embed link. Apply after the preview is ready.";
817
+ readonly mediaPreview: "Media preview";
818
+ readonly loading: "Loading preview…";
819
+ readonly loadError: "Preview failed to load";
820
+ readonly retry: "Retry";
821
+ readonly ready: "Ready. Apply to update the canvas.";
822
+ readonly align_left: "Align left";
823
+ readonly align_center: "Center";
824
+ readonly align_right: "Align right";
825
+ readonly align_justify: "Justify";
826
+ };
827
+ readonly action: {
736
828
  title: string;
737
829
  enable: string;
738
830
  type: string;
@@ -752,17 +844,17 @@ export declare const inlineEditorLocales: {
752
844
  fileUrl: string;
753
845
  code: string;
754
846
  };
755
- video: {
847
+ readonly video: {
756
848
  title: string;
757
849
  url: string;
758
850
  hint: string;
759
851
  };
760
- insert: {
852
+ readonly insert: {
761
853
  title: string;
762
854
  html: string;
763
855
  position: string;
764
856
  };
765
- image: {
857
+ readonly image: {
766
858
  replaceTitle: string;
767
859
  settingTitle: string;
768
860
  url: string;
@@ -771,7 +863,7 @@ export declare const inlineEditorLocales: {
771
863
  alt: string;
772
864
  insertPosition: string;
773
865
  };
774
- move: {
866
+ readonly move: {
775
867
  title: string;
776
868
  pickTarget: string;
777
869
  cancel: string;
@@ -781,7 +873,7 @@ export declare const inlineEditorLocales: {
781
873
  before: string;
782
874
  after: string;
783
875
  };
784
- clipboard: {
876
+ readonly clipboard: {
785
877
  copied: string;
786
878
  nothingToPaste: string;
787
879
  pastePosition: string;
@@ -790,7 +882,7 @@ export declare const inlineEditorLocales: {
790
882
  before: string;
791
883
  after: string;
792
884
  };
793
- chrome: {
885
+ readonly chrome: {
794
886
  exit: string;
795
887
  close: string;
796
888
  save: string;
@@ -810,17 +902,17 @@ export declare const inlineEditorLocales: {
810
902
  pc: string;
811
903
  mobile: string;
812
904
  };
813
- version: {
905
+ readonly version: {
814
906
  switching: string;
815
907
  };
816
- preview: {
908
+ readonly preview: {
817
909
  loading: string;
818
910
  ready: string;
819
911
  failed: string;
820
912
  failedHint: string;
821
913
  blockCount: string;
822
914
  };
823
- html: {
915
+ readonly html: {
824
916
  title: string;
825
917
  tip: string;
826
918
  scriptStripped: string;
@@ -828,11 +920,11 @@ export declare const inlineEditorLocales: {
828
920
  errorNoElement: string;
829
921
  errorMultipleRoots: string;
830
922
  };
831
- text: {
923
+ readonly text: {
832
924
  title: string;
833
925
  tip: string;
834
926
  };
835
- style: {
927
+ readonly style: {
836
928
  footnote: string;
837
929
  size: string;
838
930
  width: string;
@@ -853,7 +945,7 @@ export declare const inlineEditorLocales: {
853
945
  borderAll: string;
854
946
  borderRadius: string;
855
947
  };
856
- toolbar: {
948
+ readonly toolbar: {
857
949
  screenshot: string;
858
950
  replaceVideo: string;
859
951
  insert: string;
@@ -869,11 +961,11 @@ export declare const inlineEditorLocales: {
869
961
  delete: string;
870
962
  askAi: string;
871
963
  };
872
- selectorPath: {
964
+ readonly selectorPath: {
873
965
  label: string;
874
966
  };
875
967
  };
876
- taginfo: {
968
+ readonly taginfo: {
877
969
  A: string;
878
970
  B: string;
879
971
  BODY: string;
@@ -911,8 +1003,54 @@ export declare const inlineEditorLocales: {
911
1003
  };
912
1004
  };
913
1005
  readonly 'ja-JP': {
914
- inlineCanvas: {
915
- action: {
1006
+ readonly inlineCanvas: {
1007
+ readonly review: {
1008
+ readonly generating: "スクリーンショットを生成中…";
1009
+ readonly noLayers: "一致するレイヤーがありません";
1010
+ readonly clearSearch: "検索をクリア";
1011
+ readonly searchLayers: "レイヤーを検索";
1012
+ readonly linkCopied: "リンクをコピーしました";
1013
+ readonly copyLinkManual: "コピーできませんでした。下のリンクを手動でコピーしてください。";
1014
+ readonly uploadError: "アップロードできませんでした。再試行または画像をダウンロードしてください。";
1015
+ readonly screenshot: "要素のスクリーンショット";
1016
+ readonly enlarge: "プレビューを拡大";
1017
+ readonly shotTruncated: "表示されている部分のみ撮影しました。";
1018
+ readonly shotScale: "解像度は元の約 {{scale}}% です。";
1019
+ readonly downloadImage: "画像をダウンロード";
1020
+ readonly imageCopied: "画像をコピーしました";
1021
+ readonly copyError: "コピーできませんでした。画像をダウンロードしてください。";
1022
+ readonly copyImage: "画像をコピー";
1023
+ readonly uploading: "アップロード中…";
1024
+ readonly copyLink: "リンクをコピー";
1025
+ readonly shotLink: "スクリーンショットのリンク";
1026
+ readonly reset: "上書きを解除";
1027
+ readonly colorSwatch: "色を選択";
1028
+ readonly saveDraft: "下書きを保存";
1029
+ readonly versions: "バージョン管理";
1030
+ readonly removeEmptyVersion: "空のバージョンを削除";
1031
+ readonly versionLimit: "最大4バージョン";
1032
+ readonly imageLimit: "10 MB 以下の画像を選択してください。";
1033
+ readonly currentMedia: "現在のメディア";
1034
+ readonly uploadFile: "ファイルをアップロード";
1035
+ readonly useLink: "リンクを使用";
1036
+ readonly replaceImage: "現在の画像を置き換え";
1037
+ readonly replaceBackground: "背景画像を置き換え";
1038
+ readonly insertImage: "新しい画像を挿入";
1039
+ readonly dropImage: "画像をドロップするか選択してください(最大10 MB)。アップロードで素材を準備し、適用でキャンバスを変更します。";
1040
+ readonly pendingMedia: "適用するメディア";
1041
+ readonly altHelp: "画像の内容を説明してください。装飾用の画像は空欄にできます。";
1042
+ readonly videoLinkHint: "動画ファイルのURLまたはYouTube埋め込みリンクを入力し、読み込み後に適用してください。";
1043
+ readonly mediaPreview: "メディアプレビュー";
1044
+ readonly loading: "プレビューを読み込み中…";
1045
+ readonly loadError: "プレビューを読み込めませんでした";
1046
+ readonly retry: "再試行";
1047
+ readonly ready: "準備完了。適用するとキャンバスを変更します。";
1048
+ readonly align_left: "左揃え";
1049
+ readonly align_center: "中央揃え";
1050
+ readonly align_right: "右揃え";
1051
+ readonly align_justify: "両端揃え";
1052
+ };
1053
+ readonly action: {
916
1054
  title: string;
917
1055
  enable: string;
918
1056
  type: string;
@@ -932,17 +1070,17 @@ export declare const inlineEditorLocales: {
932
1070
  fileUrl: string;
933
1071
  code: string;
934
1072
  };
935
- video: {
1073
+ readonly video: {
936
1074
  title: string;
937
1075
  url: string;
938
1076
  hint: string;
939
1077
  };
940
- insert: {
1078
+ readonly insert: {
941
1079
  title: string;
942
1080
  html: string;
943
1081
  position: string;
944
1082
  };
945
- image: {
1083
+ readonly image: {
946
1084
  replaceTitle: string;
947
1085
  settingTitle: string;
948
1086
  url: string;
@@ -951,7 +1089,7 @@ export declare const inlineEditorLocales: {
951
1089
  alt: string;
952
1090
  insertPosition: string;
953
1091
  };
954
- move: {
1092
+ readonly move: {
955
1093
  title: string;
956
1094
  pickTarget: string;
957
1095
  cancel: string;
@@ -961,7 +1099,7 @@ export declare const inlineEditorLocales: {
961
1099
  before: string;
962
1100
  after: string;
963
1101
  };
964
- clipboard: {
1102
+ readonly clipboard: {
965
1103
  copied: string;
966
1104
  nothingToPaste: string;
967
1105
  pastePosition: string;
@@ -970,7 +1108,7 @@ export declare const inlineEditorLocales: {
970
1108
  before: string;
971
1109
  after: string;
972
1110
  };
973
- chrome: {
1111
+ readonly chrome: {
974
1112
  exit: string;
975
1113
  close: string;
976
1114
  save: string;
@@ -990,17 +1128,17 @@ export declare const inlineEditorLocales: {
990
1128
  pc: string;
991
1129
  mobile: string;
992
1130
  };
993
- version: {
1131
+ readonly version: {
994
1132
  switching: string;
995
1133
  };
996
- preview: {
1134
+ readonly preview: {
997
1135
  loading: string;
998
1136
  ready: string;
999
1137
  failed: string;
1000
1138
  failedHint: string;
1001
1139
  blockCount: string;
1002
1140
  };
1003
- html: {
1141
+ readonly html: {
1004
1142
  title: string;
1005
1143
  tip: string;
1006
1144
  scriptStripped: string;
@@ -1008,11 +1146,11 @@ export declare const inlineEditorLocales: {
1008
1146
  errorNoElement: string;
1009
1147
  errorMultipleRoots: string;
1010
1148
  };
1011
- text: {
1149
+ readonly text: {
1012
1150
  title: string;
1013
1151
  tip: string;
1014
1152
  };
1015
- style: {
1153
+ readonly style: {
1016
1154
  footnote: string;
1017
1155
  size: string;
1018
1156
  width: string;
@@ -1033,7 +1171,7 @@ export declare const inlineEditorLocales: {
1033
1171
  borderAll: string;
1034
1172
  borderRadius: string;
1035
1173
  };
1036
- toolbar: {
1174
+ readonly toolbar: {
1037
1175
  screenshot: string;
1038
1176
  replaceVideo: string;
1039
1177
  insert: string;
@@ -1049,11 +1187,11 @@ export declare const inlineEditorLocales: {
1049
1187
  delete: string;
1050
1188
  askAi: string;
1051
1189
  };
1052
- selectorPath: {
1190
+ readonly selectorPath: {
1053
1191
  label: string;
1054
1192
  };
1055
1193
  };
1056
- taginfo: {
1194
+ readonly taginfo: {
1057
1195
  A: string;
1058
1196
  B: string;
1059
1197
  BODY: string;
package/dist/locales.js CHANGED
@@ -1,3 +1,4 @@
1
+ import { reviewLocales } from './reviewLocales.js';
1
2
  export const zhCN = {
2
3
  inlineCanvas: {
3
4
  action: {
@@ -32,7 +33,7 @@ export const zhCN = {
32
33
  },
33
34
  image: {
34
35
  replaceTitle: '替换图片',
35
- settingTitle: '图片设置',
36
+ settingTitle: '图片替代文本',
36
37
  url: '图片地址',
37
38
  upload: '上传图片',
38
39
  uploading: '上传中…',
@@ -90,7 +91,7 @@ export const zhCN = {
90
91
  },
91
92
  html: {
92
93
  title: '编辑 HTML',
93
- tip: '编辑的是整个元素(outerHTML)。保存后 SDK 会用它整体替换原元素。',
94
+ tip: '编辑整个元素(outerHTML)。应用后替换画布中的元素;保存草稿后才写入体验配置。',
94
95
  scriptStripped: '其中 {{count}} 段 script/noscript 会被移除',
95
96
  errorEmpty: '内容不能为空',
96
97
  errorNoElement: '需要一个完整的元素标签,纯文本请用「编辑文字」',
@@ -212,7 +213,7 @@ export const enUS = {
212
213
  },
213
214
  image: {
214
215
  replaceTitle: 'Replace image',
215
- settingTitle: 'Image settings',
216
+ settingTitle: 'Image alternative text',
216
217
  url: 'Image URL',
217
218
  upload: 'Upload image',
218
219
  uploading: 'Uploading…',
@@ -270,7 +271,7 @@ export const enUS = {
270
271
  },
271
272
  html: {
272
273
  title: 'Edit HTML',
273
- tip: 'You are editing the whole element (outerHTML). The SDK replaces the original element with it.',
274
+ tip: 'Edit the entire element (outerHTML). Apply updates the canvas; Save draft stores the experience configuration.',
274
275
  scriptStripped: '{{count}} script/noscript block(s) will be removed',
275
276
  errorEmpty: 'Content cannot be empty',
276
277
  errorNoElement: 'A complete element tag is required; use Edit text for plain text',
@@ -392,7 +393,7 @@ export const jaJP = {
392
393
  },
393
394
  image: {
394
395
  replaceTitle: '画像を差し替え',
395
- settingTitle: '画像設定',
396
+ settingTitle: '画像の代替テキスト',
396
397
  url: '画像 URL',
397
398
  upload: '画像をアップロード',
398
399
  uploading: 'アップロード中…',
@@ -450,7 +451,7 @@ export const jaJP = {
450
451
  },
451
452
  html: {
452
453
  title: 'HTML を編集',
453
- tip: '要素全体(outerHTML)を編集します。保存後、SDK が元の要素をこれで置き換えます。',
454
+ tip: '要素全体(outerHTML)を編集します。適用でキャンバスを更新し、下書きを保存すると設定が保存されます。',
454
455
  scriptStripped: 'うち {{count}} 個の script/noscript は削除されます',
455
456
  errorEmpty: '内容を入力してください',
456
457
  errorNoElement: '完全な要素タグが必要です。プレーンテキストは「テキストを編集」をご利用ください',
@@ -539,7 +540,7 @@ export const jaJP = {
539
540
  }
540
541
  };
541
542
  export const inlineEditorLocales = {
542
- 'zh-CN': zhCN,
543
- 'en-US': enUS,
544
- 'ja-JP': jaJP
543
+ 'zh-CN': { ...zhCN, inlineCanvas: { ...zhCN.inlineCanvas, review: reviewLocales['zh-CN'] } },
544
+ 'en-US': { ...enUS, inlineCanvas: { ...enUS.inlineCanvas, review: reviewLocales['en-US'] } },
545
+ 'ja-JP': { ...jaJP, inlineCanvas: { ...jaJP.inlineCanvas, review: reviewLocales['ja-JP'] } }
545
546
  };
@@ -0,0 +1,5 @@
1
+ import type { HTMLAttributes } from 'react';
2
+ /** Shared contextual feedback. Actions remain explicit buttons supplied by the caller. */
3
+ export declare function EditorStatus({ tone, className, ...props }: HTMLAttributes<HTMLDivElement> & {
4
+ tone?: 'info' | 'error';
5
+ }): import("react").JSX.Element;
@@ -0,0 +1,4 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ export function EditorStatus({ tone = 'info', className = '', ...props }) {
3
+ return (_jsx("div", { role: tone === 'error' ? 'alert' : 'status', ...props, className: `fixed z-[903] flex max-w-[min(640px,calc(100vw-32px))] -translate-x-1/2 flex-wrap items-center gap-2 rounded-lg border bg-popover px-3 py-2 text-xs text-popover-foreground shadow-md ${tone === 'error' ? 'border-destructive' : ''} ${className}` }));
4
+ }
@@ -0,0 +1,7 @@
1
+ export declare function ScreenshotCard({ dataUrl, truncated, scale, uploadImage, onClose }: {
2
+ dataUrl: string;
3
+ truncated: boolean;
4
+ scale: number;
5
+ uploadImage?: (blob: Blob) => Promise<string>;
6
+ onClose: () => void;
7
+ }): import("react").JSX.Element;
@@ -0,0 +1,57 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { useRef, useState } from 'react';
3
+ import { X } from 'lucide-react';
4
+ import { Button, Dialog, DialogContent, DialogTitle, Input } from '@ptengine/design-components';
5
+ import { useTranslation } from 'react-i18next';
6
+ export function ScreenshotCard({ dataUrl, truncated, scale, uploadImage, onClose }) {
7
+ const { t } = useTranslation();
8
+ const [url, setUrl] = useState('');
9
+ const [busy, setBusy] = useState(false);
10
+ const [note, setNote] = useState('');
11
+ const [zoom, setZoom] = useState(false);
12
+ const pending = useRef(false);
13
+ const copyLink = async () => {
14
+ if (pending.current)
15
+ return;
16
+ pending.current = true;
17
+ setBusy(true);
18
+ setNote('');
19
+ try {
20
+ let link = url;
21
+ if (!link) {
22
+ link = await uploadImage(await (await fetch(dataUrl)).blob());
23
+ setUrl(link);
24
+ }
25
+ try {
26
+ await navigator.clipboard.writeText(link);
27
+ setNote(t('inlineCanvas.review.linkCopied', '链接已复制'));
28
+ }
29
+ catch {
30
+ setNote(t('inlineCanvas.review.copyLinkManual', '复制失败,请从下方手动复制链接'));
31
+ }
32
+ }
33
+ catch {
34
+ setNote(t('inlineCanvas.review.uploadError', '上传失败,可重试;本地图片仍可下载'));
35
+ }
36
+ finally {
37
+ pending.current = false;
38
+ setBusy(false);
39
+ }
40
+ };
41
+ return (_jsxs("section", { "data-testid": "inline-editor-shot", className: "absolute bottom-4 right-4 z-30 w-[320px] max-w-full space-y-2 rounded-lg border border-border bg-popover p-3 text-popover-foreground shadow-lg", children: [_jsxs("header", { className: "flex items-center justify-between text-sm font-semibold", children: [t('inlineCanvas.review.screenshot', '元素截图'), _jsx(Button, { size: "icon-sm", variant: "ghost", "aria-label": t('inlineCanvas.chrome.close', '关闭'), onClick: onClose, children: _jsx(X, { className: "size-4" }) })] }), _jsx(Button, { variant: "ghost", className: "h-auto w-full p-0", "aria-label": t('inlineCanvas.review.enlarge', '放大预览'), onClick: () => setZoom(true), children: _jsx("img", { src: dataUrl, alt: t('inlineCanvas.review.screenshot', '元素截图'), className: "max-h-40 w-full object-contain" }) }), truncated && (_jsx("p", { className: "text-xs text-muted-foreground", children: t('inlineCanvas.review.shotTruncated', '元素超出可视区,只截到可见部分') })), scale < 1 && (_jsx("p", { className: "text-xs text-muted-foreground", children: t('inlineCanvas.review.shotScale', '截图分辨率约为原图的 {{scale}}%', {
42
+ scale: Math.round(scale * 100)
43
+ }) })), _jsxs("div", { className: "flex flex-wrap gap-2", children: [_jsx(Button, { size: "sm", variant: "secondary", asChild: true, children: _jsx("a", { href: dataUrl, download: "element-screenshot.png", children: t('inlineCanvas.review.downloadImage', '下载图片') }) }), typeof ClipboardItem !== 'undefined' && navigator.clipboard?.write && (_jsx(Button, { size: "sm", variant: "secondary", onClick: async () => {
44
+ try {
45
+ const blob = await (await fetch(dataUrl)).blob();
46
+ await navigator.clipboard.write([
47
+ new ClipboardItem({ [blob.type]: blob })
48
+ ]);
49
+ setNote(t('inlineCanvas.review.imageCopied', '图片已复制'));
50
+ }
51
+ catch {
52
+ setNote(t('inlineCanvas.review.copyError', '复制失败,请下载图片'));
53
+ }
54
+ }, children: t('inlineCanvas.review.copyImage', '复制图片') })), uploadImage && (_jsx(Button, { size: "sm", variant: "secondary", disabled: busy, onClick: () => void copyLink(), children: busy
55
+ ? t('inlineCanvas.review.uploading', '正在上传…')
56
+ : t('inlineCanvas.review.copyLink', '复制链接') }))] }), note && (_jsx("p", { role: "status", className: "text-xs", children: note })), url && (_jsx(Input, { readOnly: true, "aria-label": t('inlineCanvas.review.shotLink', '截图链接'), value: url, onFocus: e => e.target.select() })), _jsx(Dialog, { open: zoom, onOpenChange: setZoom, children: _jsxs(DialogContent, { size: "lg", closeLabel: t('inlineCanvas.chrome.close', '关闭'), children: [_jsx(DialogTitle, { children: t('inlineCanvas.review.screenshot', '元素截图') }), _jsx("img", { src: dataUrl, alt: t('inlineCanvas.review.screenshot', '元素截图'), className: "max-h-[70vh] w-full object-contain" })] }) })] }));
57
+ }
@@ -13,6 +13,11 @@ import type { ElementCapabilities } from '@ptengine/inline-core/protocol';
13
13
  * 真的打到了客户页 DOM 上,还各发了一次跨三跳的命令)。
14
14
  */
15
15
  export interface StylePanelProps {
16
+ /** Initial viewport position; subsequent selection geometry must not move the panel. */
17
+ anchor?: {
18
+ x: number;
19
+ y: number;
20
+ };
16
21
  tag: string;
17
22
  capabilities: ElementCapabilities | null;
18
23
  /** 元素当前的 author 层声明,用作输入框初值。 */
@@ -20,5 +25,6 @@ export interface StylePanelProps {
20
25
  /** 提交一条样式改动。由宿主接到 `changeList.addStyle`。 */
21
26
  onApply: (property: string, value: string) => void | Promise<unknown>;
22
27
  onClose: () => void;
28
+ onReset?: (property: string) => void;
23
29
  }
24
- export declare function StylePanel({ tag, capabilities, declaredStyles, onApply, onClose }: StylePanelProps): import("react").JSX.Element | null;
30
+ export declare function StylePanel({ anchor, tag, capabilities, declaredStyles, onApply, onReset, onClose }: StylePanelProps): import("react").JSX.Element | null;