@jvs-milkdown/components 1.2.1 → 1.2.3
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/lib/__internal__/components/icon.d.ts +24 -0
- package/lib/__internal__/components/icon.d.ts.map +1 -0
- package/lib/__internal__/components/image-input.d.ts +17 -0
- package/lib/__internal__/components/image-input.d.ts.map +1 -0
- package/lib/__internal__/keep-alive.d.ts +2 -0
- package/lib/__internal__/keep-alive.d.ts.map +1 -0
- package/lib/__internal__/meta.d.ts +3 -0
- package/lib/__internal__/meta.d.ts.map +1 -0
- package/lib/__tests__/setup.d.ts +2 -0
- package/lib/__tests__/setup.d.ts.map +1 -0
- package/lib/code-block/config.d.ts +25 -0
- package/lib/code-block/config.d.ts.map +1 -0
- package/lib/code-block/index.d.ts +5 -0
- package/lib/code-block/index.d.ts.map +1 -0
- package/lib/code-block/view/components/code-block.d.ts +18 -0
- package/lib/code-block/view/components/code-block.d.ts.map +1 -0
- package/lib/code-block/view/components/copy-button.d.ts +9 -0
- package/lib/code-block/view/components/copy-button.d.ts.map +1 -0
- package/lib/code-block/view/components/language-picker.d.ts +5 -0
- package/lib/code-block/view/components/language-picker.d.ts.map +1 -0
- package/lib/code-block/view/components/preview-panel.d.ts +9 -0
- package/lib/code-block/view/components/preview-panel.d.ts.map +1 -0
- package/lib/code-block/view/index.d.ts +3 -0
- package/lib/code-block/view/index.d.ts.map +1 -0
- package/lib/code-block/view/loader.d.ts +13 -0
- package/lib/code-block/view/loader.d.ts.map +1 -0
- package/lib/code-block/view/node-view.d.ts +43 -0
- package/lib/code-block/view/node-view.d.ts.map +1 -0
- package/lib/image-block/config.d.ts +21 -0
- package/lib/image-block/config.d.ts.map +1 -0
- package/lib/image-block/convert-plugin.d.ts +2 -0
- package/lib/image-block/convert-plugin.d.ts.map +1 -0
- package/lib/image-block/index.d.ts +9 -0
- package/lib/image-block/index.d.ts.map +1 -0
- package/lib/image-block/index.js +120 -56
- package/lib/image-block/index.js.map +1 -1
- package/lib/image-block/paste-rule.d.ts +2 -0
- package/lib/image-block/paste-rule.d.ts.map +1 -0
- package/lib/image-block/remark-plugin.d.ts +2 -0
- package/lib/image-block/remark-plugin.d.ts.map +1 -0
- package/lib/image-block/schema.d.ts +3 -0
- package/lib/image-block/schema.d.ts.map +1 -0
- package/lib/image-block/view/components/__tests__/image-viewer.onImageLoadError.spec.d.ts +2 -0
- package/lib/image-block/view/components/__tests__/image-viewer.onImageLoadError.spec.d.ts.map +1 -0
- package/lib/image-block/view/components/image-block.d.ts +27 -0
- package/lib/image-block/view/components/image-block.d.ts.map +1 -0
- package/lib/image-block/view/components/image-viewer.d.ts +3 -0
- package/lib/image-block/view/components/image-viewer.d.ts.map +1 -0
- package/lib/image-block/view/index.d.ts +3 -0
- package/lib/image-block/view/index.d.ts.map +1 -0
- package/lib/image-inline/components/image-inline.d.ts +18 -0
- package/lib/image-inline/components/image-inline.d.ts.map +1 -0
- package/lib/image-inline/config.d.ts +11 -0
- package/lib/image-inline/config.d.ts.map +1 -0
- package/lib/image-inline/index.d.ts +5 -0
- package/lib/image-inline/index.d.ts.map +1 -0
- package/lib/image-inline/view.d.ts +3 -0
- package/lib/image-inline/view.d.ts.map +1 -0
- package/lib/index.d.ts +2 -0
- package/lib/index.d.ts.map +1 -0
- package/lib/link-tooltip/command.d.ts +2 -0
- package/lib/link-tooltip/command.d.ts.map +1 -0
- package/lib/link-tooltip/configure.d.ts +3 -0
- package/lib/link-tooltip/configure.d.ts.map +1 -0
- package/lib/link-tooltip/edit/component.d.ts +11 -0
- package/lib/link-tooltip/edit/component.d.ts.map +1 -0
- package/lib/link-tooltip/edit/edit-configure.d.ts +3 -0
- package/lib/link-tooltip/edit/edit-configure.d.ts.map +1 -0
- package/lib/link-tooltip/edit/edit-view.d.ts +15 -0
- package/lib/link-tooltip/edit/edit-view.d.ts.map +1 -0
- package/lib/link-tooltip/index.d.ts +7 -0
- package/lib/link-tooltip/index.d.ts.map +1 -0
- package/lib/link-tooltip/index.js +1 -2
- package/lib/link-tooltip/index.js.map +1 -1
- package/lib/link-tooltip/preview/component.d.ts +11 -0
- package/lib/link-tooltip/preview/component.d.ts.map +1 -0
- package/lib/link-tooltip/preview/preview-configure.d.ts +3 -0
- package/lib/link-tooltip/preview/preview-configure.d.ts.map +1 -0
- package/lib/link-tooltip/preview/preview-view.d.ts +14 -0
- package/lib/link-tooltip/preview/preview-view.d.ts.map +1 -0
- package/lib/link-tooltip/slices.d.ts +34 -0
- package/lib/link-tooltip/slices.d.ts.map +1 -0
- package/lib/link-tooltip/tooltips.d.ts +3 -0
- package/lib/link-tooltip/tooltips.d.ts.map +1 -0
- package/lib/link-tooltip/utils.d.ts +14 -0
- package/lib/link-tooltip/utils.d.ts.map +1 -0
- package/lib/list-item-block/component.d.ts +19 -0
- package/lib/list-item-block/component.d.ts.map +1 -0
- package/lib/list-item-block/config.d.ts +13 -0
- package/lib/list-item-block/config.d.ts.map +1 -0
- package/lib/list-item-block/index.d.ts +6 -0
- package/lib/list-item-block/index.d.ts.map +1 -0
- package/lib/list-item-block/view.d.ts +3 -0
- package/lib/list-item-block/view.d.ts.map +1 -0
- package/lib/table-block/config.d.ts +8 -0
- package/lib/table-block/config.d.ts.map +1 -0
- package/lib/table-block/dnd/calc-drag-over.d.ts +3 -0
- package/lib/table-block/dnd/calc-drag-over.d.ts.map +1 -0
- package/lib/table-block/dnd/create-drag-handler.d.ts +5 -0
- package/lib/table-block/dnd/create-drag-handler.d.ts.map +1 -0
- package/lib/table-block/dnd/drag-over-handler.d.ts +3 -0
- package/lib/table-block/dnd/drag-over-handler.d.ts.map +1 -0
- package/lib/table-block/dnd/prepare-dnd-context.d.ts +3 -0
- package/lib/table-block/dnd/prepare-dnd-context.d.ts.map +1 -0
- package/lib/table-block/dnd/preview.d.ts +3 -0
- package/lib/table-block/dnd/preview.d.ts.map +1 -0
- package/lib/table-block/index.d.ts +5 -0
- package/lib/table-block/index.d.ts.map +1 -0
- package/lib/table-block/index.js.map +1 -1
- package/lib/table-block/view/component.d.ts +16 -0
- package/lib/table-block/view/component.d.ts.map +1 -0
- package/lib/table-block/view/drag.d.ts +10 -0
- package/lib/table-block/view/drag.d.ts.map +1 -0
- package/lib/table-block/view/index.d.ts +2 -0
- package/lib/table-block/view/index.d.ts.map +1 -0
- package/lib/table-block/view/operation.d.ts +13 -0
- package/lib/table-block/view/operation.d.ts.map +1 -0
- package/lib/table-block/view/pointer.d.ts +7 -0
- package/lib/table-block/view/pointer.d.ts.map +1 -0
- package/lib/table-block/view/types.d.ts +28 -0
- package/lib/table-block/view/types.d.ts.map +1 -0
- package/lib/table-block/view/utils.d.ts +12 -0
- package/lib/table-block/view/utils.d.ts.map +1 -0
- package/lib/table-block/view/view.d.ts +22 -0
- package/lib/table-block/view/view.d.ts.map +1 -0
- package/lib/tsconfig.tsbuildinfo +1 -1
- package/package.json +10 -10
- package/src/image-block/convert-plugin.ts +1 -1
- package/src/image-block/paste-rule.ts +1 -21
- package/src/image-block/view/components/image-viewer.tsx +139 -53
- package/src/link-tooltip/edit/component.tsx +0 -1
- package/src/table-block/view/utils.ts +4 -3
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
type IconProps = {
|
|
2
|
+
icon?: string | null;
|
|
3
|
+
class?: string;
|
|
4
|
+
onClick?: (event: PointerEvent) => void;
|
|
5
|
+
};
|
|
6
|
+
export declare function Icon({ icon, class: className, onClick }: IconProps): import("vue/jsx-runtime").JSX.Element;
|
|
7
|
+
export declare namespace Icon {
|
|
8
|
+
var props: {
|
|
9
|
+
icon: {
|
|
10
|
+
type: StringConstructor;
|
|
11
|
+
required: boolean;
|
|
12
|
+
};
|
|
13
|
+
class: {
|
|
14
|
+
type: StringConstructor;
|
|
15
|
+
required: boolean;
|
|
16
|
+
};
|
|
17
|
+
onClick: {
|
|
18
|
+
type: FunctionConstructor;
|
|
19
|
+
required: boolean;
|
|
20
|
+
};
|
|
21
|
+
};
|
|
22
|
+
}
|
|
23
|
+
export {};
|
|
24
|
+
//# sourceMappingURL=icon.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../src/__internal__/components/icon.tsx"],"names":[],"mappings":"AAQA,KAAK,SAAS,GAAG;IACf,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAA;CACxC,CAAA;AAED,wBAAgB,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,EAAE,SAAS,yCAQlE;yBARe,IAAI"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { type Ref } from 'vue';
|
|
2
|
+
type ImageInputProps = {
|
|
3
|
+
src: Ref<string | undefined>;
|
|
4
|
+
selected: Ref<boolean>;
|
|
5
|
+
readonly: Ref<boolean>;
|
|
6
|
+
setLink: (link: string) => void;
|
|
7
|
+
imageIcon?: string;
|
|
8
|
+
uploadButton?: string;
|
|
9
|
+
confirmButton?: string;
|
|
10
|
+
uploadPlaceholderText?: string;
|
|
11
|
+
className?: string;
|
|
12
|
+
onUpload: (file: File) => Promise<string>;
|
|
13
|
+
onImageLoadError?: (event: Event) => void | Promise<void>;
|
|
14
|
+
};
|
|
15
|
+
export declare const ImageInput: import("vue").DefineComponent<ImageInputProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ImageInputProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
16
|
+
export {};
|
|
17
|
+
//# sourceMappingURL=image-input.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"image-input.d.ts","sourceRoot":"","sources":["../../../src/__internal__/components/image-input.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA2B,KAAK,GAAG,EAAE,MAAM,KAAK,CAAA;AASvD,KAAK,eAAe,GAAG;IACrB,GAAG,EAAE,GAAG,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IAC5B,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;IACtB,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;IACtB,OAAO,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IAE/B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAE9B,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,MAAM,CAAC,CAAA;IACzC,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAA;CAC1D,CAAA;AAED,eAAO,MAAM,UAAU,0SAiLrB,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"keep-alive.d.ts","sourceRoot":"","sources":["../../src/__internal__/keep-alive.ts"],"names":[],"mappings":"AAEA,wBAAgB,SAAS,CAAC,GAAG,KAAK,EAAE,OAAO,EAAE,QAAI"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../src/__internal__/meta.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAE7D,wBAAgB,QAAQ,CAAC,CAAC,SAAS,cAAc,EAC/C,MAAM,EAAE,CAAC,EACT,IAAI,EAAE,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,IAAI,EAAE,aAAa,CAAC,GAC9C,CAAC,CASH"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"setup.d.ts","sourceRoot":"","sources":["../../src/__tests__/setup.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import type { LanguageDescription } from '@codemirror/language';
|
|
2
|
+
import type { Extension } from '@codemirror/state';
|
|
3
|
+
export interface CodeBlockConfig {
|
|
4
|
+
extensions: Extension[];
|
|
5
|
+
languages: LanguageDescription[];
|
|
6
|
+
expandIcon: string;
|
|
7
|
+
searchIcon: string;
|
|
8
|
+
clearSearchIcon: string;
|
|
9
|
+
searchPlaceholder: string;
|
|
10
|
+
noResultText: string;
|
|
11
|
+
copyText: string;
|
|
12
|
+
copyIcon: string;
|
|
13
|
+
onCopy?: (text: string) => void;
|
|
14
|
+
renderLanguage: (language: string, selected: boolean) => string;
|
|
15
|
+
renderPreview: (language: string, content: string, applyPreview: (value: null | string | HTMLElement) => void) => void | null | string | HTMLElement;
|
|
16
|
+
previewToggleButton: (previewOnlyMode: boolean) => string;
|
|
17
|
+
previewLabel: string;
|
|
18
|
+
previewOnlyByDefault?: boolean;
|
|
19
|
+
previewLoading: string | HTMLElement;
|
|
20
|
+
wrapText: string;
|
|
21
|
+
wrapIcon: string;
|
|
22
|
+
}
|
|
23
|
+
export declare const defaultConfig: CodeBlockConfig;
|
|
24
|
+
export declare const codeBlockConfig: import("@jvs-milkdown/utils").$Ctx<CodeBlockConfig, "codeBlockConfigCtx">;
|
|
25
|
+
//# sourceMappingURL=config.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../src/code-block/config.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAA;AAC/D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAA;AAMlD,MAAM,WAAW,eAAe;IAC9B,UAAU,EAAE,SAAS,EAAE,CAAA;IACvB,SAAS,EAAE,mBAAmB,EAAE,CAAA;IAChC,UAAU,EAAE,MAAM,CAAA;IAClB,UAAU,EAAE,MAAM,CAAA;IAClB,eAAe,EAAE,MAAM,CAAA;IACvB,iBAAiB,EAAE,MAAM,CAAA;IACzB,YAAY,EAAE,MAAM,CAAA;IACpB,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IAC/B,cAAc,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,KAAK,MAAM,CAAA;IAC/D,aAAa,EAAE,CACb,QAAQ,EAAE,MAAM,EAChB,OAAO,EAAE,MAAM,EACf,YAAY,EAAE,CAAC,KAAK,EAAE,IAAI,GAAG,MAAM,GAAG,WAAW,KAAK,IAAI,KACvD,IAAI,GAAG,IAAI,GAAG,MAAM,GAAG,WAAW,CAAA;IACvC,mBAAmB,EAAE,CAAC,eAAe,EAAE,OAAO,KAAK,MAAM,CAAA;IACzD,YAAY,EAAE,MAAM,CAAA;IACpB,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,cAAc,EAAE,MAAM,GAAG,WAAW,CAAA;IACpC,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,MAAM,CAAA;CACjB;AAED,eAAO,MAAM,aAAa,EAAE,eAkB3B,CAAA;AAED,eAAO,MAAM,eAAe,2EAA4C,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/code-block/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAKvD,cAAc,UAAU,CAAA;AACxB,cAAc,QAAQ,CAAA;AAEtB,eAAO,MAAM,kBAAkB,EAAE,cAAc,EAG9C,CAAA"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import type { EditorView as CodeMirror } from '@codemirror/view';
|
|
2
|
+
import { type Ref } from 'vue';
|
|
3
|
+
import type { CodeBlockConfig } from '../../config';
|
|
4
|
+
import type { LanguageInfo } from '../loader';
|
|
5
|
+
export type CodeBlockProps = {
|
|
6
|
+
text: Ref<string>;
|
|
7
|
+
selected: Ref<boolean>;
|
|
8
|
+
getReadOnly: () => boolean;
|
|
9
|
+
codemirror: CodeMirror;
|
|
10
|
+
language: Ref<string>;
|
|
11
|
+
getAllLanguages: () => Array<LanguageInfo>;
|
|
12
|
+
setLanguage: (language: string) => void;
|
|
13
|
+
config: Omit<CodeBlockConfig, 'languages' | 'extensions'>;
|
|
14
|
+
wordWrap: Ref<boolean>;
|
|
15
|
+
toggleWordWrap: () => void;
|
|
16
|
+
};
|
|
17
|
+
export declare const CodeBlock: import("vue").DefineComponent<CodeBlockProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<CodeBlockProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
18
|
+
//# sourceMappingURL=code-block.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"code-block.d.ts","sourceRoot":"","sources":["../../../../src/code-block/view/components/code-block.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAIhE,OAAO,EAGL,KAAK,GAAG,EAKT,MAAM,KAAK,CAAA;AAEZ,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AACnD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAU7C,MAAM,MAAM,cAAc,GAAG;IAC3B,IAAI,EAAE,GAAG,CAAC,MAAM,CAAC,CAAA;IACjB,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;IACtB,WAAW,EAAE,MAAM,OAAO,CAAA;IAC1B,UAAU,EAAE,UAAU,CAAA;IACtB,QAAQ,EAAE,GAAG,CAAC,MAAM,CAAC,CAAA;IACrB,eAAe,EAAE,MAAM,KAAK,CAAC,YAAY,CAAC,CAAA;IAC1C,WAAW,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,MAAM,EAAE,IAAI,CAAC,eAAe,EAAE,WAAW,GAAG,YAAY,CAAC,CAAA;IACzD,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;IACtB,cAAc,EAAE,MAAM,IAAI,CAAA;CAC3B,CAAA;AAED,eAAO,MAAM,SAAS,wSA2JpB,CAAA"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
type CopyButtonProps = {
|
|
2
|
+
copyText: string;
|
|
3
|
+
copyIcon: string;
|
|
4
|
+
onCopy: (text: string) => void;
|
|
5
|
+
text: string;
|
|
6
|
+
};
|
|
7
|
+
export declare const CopyButton: import("vue").DefineComponent<CopyButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<CopyButtonProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
8
|
+
export {};
|
|
9
|
+
//# sourceMappingURL=copy-button.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"copy-button.d.ts","sourceRoot":"","sources":["../../../../src/code-block/view/components/copy-button.tsx"],"names":[],"mappings":"AAOA,KAAK,eAAe,GAAG;IACrB,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IAC9B,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AA8CD,eAAO,MAAM,UAAU,0SAqCrB,CAAA"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import type { CodeBlockProps } from './code-block';
|
|
2
|
+
type LanguagePickerProps = Pick<CodeBlockProps, 'language' | 'config' | 'setLanguage' | 'getAllLanguages' | 'getReadOnly'>;
|
|
3
|
+
export declare const LanguagePicker: import("vue").DefineComponent<LanguagePickerProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<LanguagePickerProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
4
|
+
export {};
|
|
5
|
+
//# sourceMappingURL=language-picker.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"language-picker.d.ts","sourceRoot":"","sources":["../../../../src/code-block/view/components/language-picker.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAOlD,KAAK,mBAAmB,GAAG,IAAI,CAC7B,cAAc,EACd,UAAU,GAAG,QAAQ,GAAG,aAAa,GAAG,iBAAiB,GAAG,aAAa,CAC1E,CAAA;AAED,eAAO,MAAM,cAAc,kTAqNzB,CAAA"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { type Ref } from 'vue';
|
|
2
|
+
import type { CodeBlockProps } from './code-block';
|
|
3
|
+
type PreviewPanelProps = Pick<CodeBlockProps, 'text' | 'language' | 'config'> & {
|
|
4
|
+
previewOnlyMode: Ref<boolean>;
|
|
5
|
+
preview: Ref<string | HTMLElement | null>;
|
|
6
|
+
};
|
|
7
|
+
export declare const PreviewPanel: import("vue").DefineComponent<PreviewPanelProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PreviewPanelProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
8
|
+
export {};
|
|
9
|
+
//# sourceMappingURL=preview-panel.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"preview-panel.d.ts","sourceRoot":"","sources":["../../../../src/code-block/view/components/preview-panel.tsx"],"names":[],"mappings":"AACA,OAAO,EAAqC,KAAK,GAAG,EAAe,MAAM,KAAK,CAAA;AAE9E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAMlD,KAAK,iBAAiB,GAAG,IAAI,CAC3B,cAAc,EACd,MAAM,GAAG,UAAU,GAAG,QAAQ,CAC/B,GAAG;IACF,eAAe,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;IAC7B,OAAO,EAAE,GAAG,CAAC,MAAM,GAAG,WAAW,GAAG,IAAI,CAAC,CAAA;CAC1C,CAAA;AAED,eAAO,MAAM,YAAY,8SA6DvB,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/code-block/view/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAA;AAUnE,eAAO,MAAM,aAAa,+FAQzB,CAAA"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { LanguageDescription, LanguageSupport } from '@codemirror/language';
|
|
2
|
+
export interface LanguageInfo {
|
|
3
|
+
name: string;
|
|
4
|
+
alias: readonly string[];
|
|
5
|
+
}
|
|
6
|
+
export declare class LanguageLoader {
|
|
7
|
+
private languages;
|
|
8
|
+
private readonly map;
|
|
9
|
+
constructor(languages: LanguageDescription[]);
|
|
10
|
+
getAll(): LanguageInfo[];
|
|
11
|
+
load(languageName: string): Promise<LanguageSupport | undefined>;
|
|
12
|
+
}
|
|
13
|
+
//# sourceMappingURL=loader.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"loader.d.ts","sourceRoot":"","sources":["../../../src/code-block/view/loader.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAA;AAEhF,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,SAAS,MAAM,EAAE,CAAA;CACzB;AAED,qBAAa,cAAc;IAGb,OAAO,CAAC,SAAS;IAF7B,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAqC;gBAErC,SAAS,EAAE,mBAAmB,EAAE;IAUpD,MAAM,IAAI,YAAY,EAAE;IASxB,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAAC,eAAe,GAAG,SAAS,CAAC;CAUjE"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import type { Node } from '@jvs-milkdown/prose/model';
|
|
2
|
+
import type { EditorView, NodeView } from '@jvs-milkdown/prose/view';
|
|
3
|
+
import { EditorView as CodeMirror } from '@codemirror/view';
|
|
4
|
+
import { type App } from 'vue';
|
|
5
|
+
import type { CodeBlockConfig } from '../config';
|
|
6
|
+
import type { LanguageLoader } from './loader';
|
|
7
|
+
export declare class CodeMirrorBlock implements NodeView {
|
|
8
|
+
node: Node;
|
|
9
|
+
view: EditorView;
|
|
10
|
+
getPos: () => number | undefined;
|
|
11
|
+
loader: LanguageLoader;
|
|
12
|
+
config: CodeBlockConfig;
|
|
13
|
+
dom: HTMLElement;
|
|
14
|
+
cm: CodeMirror;
|
|
15
|
+
app: App;
|
|
16
|
+
selected: import("vue").Ref<boolean, boolean>;
|
|
17
|
+
language: import("vue").Ref<string, string>;
|
|
18
|
+
text: import("vue").Ref<string, string>;
|
|
19
|
+
wordWrap: import("vue").Ref<boolean, boolean>;
|
|
20
|
+
private updating;
|
|
21
|
+
private languageName;
|
|
22
|
+
private disposeSelectedWatcher;
|
|
23
|
+
private readonly languageConf;
|
|
24
|
+
private readonly readOnlyConf;
|
|
25
|
+
private readonly lineWrappingConf;
|
|
26
|
+
constructor(node: Node, view: EditorView, getPos: () => number | undefined, loader: LanguageLoader, config: CodeBlockConfig);
|
|
27
|
+
private forwardUpdate;
|
|
28
|
+
private createApp;
|
|
29
|
+
private createDom;
|
|
30
|
+
private updateLanguage;
|
|
31
|
+
private codeMirrorKeymap;
|
|
32
|
+
private maybeEscape;
|
|
33
|
+
setSelection(anchor: number, head: number): void;
|
|
34
|
+
update(node: Node): boolean;
|
|
35
|
+
selectNode(): void;
|
|
36
|
+
deselectNode(): void;
|
|
37
|
+
stopEvent(): boolean;
|
|
38
|
+
destroy(): void;
|
|
39
|
+
setLanguage: (language: string) => void;
|
|
40
|
+
toggleWordWrap: () => void;
|
|
41
|
+
getAllLanguages: () => import("./loader").LanguageInfo[];
|
|
42
|
+
}
|
|
43
|
+
//# sourceMappingURL=node-view.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"node-view.d.ts","sourceRoot":"","sources":["../../../src/code-block/view/node-view.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAA;AACrD,OAAO,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAA;AAGpE,OAAO,EACL,UAAU,IAAI,UAAU,EAKzB,MAAM,kBAAkB,CAAA;AAIzB,OAAO,EAA+B,KAAK,GAAG,EAAoB,MAAM,KAAK,CAAA;AAE7E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,WAAW,CAAA;AAChD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAI9C,qBAAa,eAAgB,YAAW,QAAQ;IAmBrC,IAAI,EAAE,IAAI;IACV,IAAI,EAAE,UAAU;IAChB,MAAM,EAAE,MAAM,MAAM,GAAG,SAAS;IAChC,MAAM,EAAE,cAAc;IACtB,MAAM,EAAE,eAAe;IAtBhC,GAAG,EAAE,WAAW,CAAA;IAChB,EAAE,EAAE,UAAU,CAAA;IACd,GAAG,EAAE,GAAG,CAAA;IAER,QAAQ,sCAAa;IACrB,QAAQ,oCAAU;IAClB,IAAI,oCAAU;IACd,QAAQ,sCAAa;IAErB,OAAO,CAAC,QAAQ,CAAQ;IACxB,OAAO,CAAC,YAAY,CAAa;IACjC,OAAO,CAAC,sBAAsB,CAAa;IAE3C,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAa;IAC1C,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAa;IAC1C,OAAO,CAAC,QAAQ,CAAC,gBAAgB,CAAa;gBAGrC,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,UAAU,EAChB,MAAM,EAAE,MAAM,MAAM,GAAG,SAAS,EAChC,MAAM,EAAE,cAAc,EACtB,MAAM,EAAE,eAAe;IAqChC,OAAO,CAAC,aAAa,CAsBpB;IAED,OAAO,CAAC,SAAS,CAahB;IAED,OAAO,CAAC,SAAS;IAQjB,OAAO,CAAC,cAAc;IAoBtB,OAAO,CAAC,gBAAgB,CAiDvB;IAED,OAAO,CAAC,WAAW,CAgBlB;IAED,YAAY,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM;IASzC,MAAM,CAAC,IAAI,EAAE,IAAI;IA4BjB,UAAU;IAKV,YAAY;IAIZ,SAAS;IAIT,OAAO;IAMP,WAAW,GAAI,UAAU,MAAM,UAQ9B;IAED,cAAc,aAOb;IAED,eAAe,0CAEd;CACF"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
export interface ImageBlockConfig {
|
|
2
|
+
imageIcon: string | undefined;
|
|
3
|
+
captionIcon: string | undefined;
|
|
4
|
+
cropIcon: string | undefined;
|
|
5
|
+
borderIcon: string | undefined;
|
|
6
|
+
confirmIcon: string | undefined;
|
|
7
|
+
cancelIcon: string | undefined;
|
|
8
|
+
resetCropIcon: string | undefined;
|
|
9
|
+
uploadButton: string | undefined;
|
|
10
|
+
confirmButton: string | undefined;
|
|
11
|
+
uploadPlaceholderText: string;
|
|
12
|
+
captionPlaceholderText: string;
|
|
13
|
+
onUpload: (file: File) => Promise<string>;
|
|
14
|
+
proxyDomURL?: (url: string) => Promise<string> | string;
|
|
15
|
+
onImageLoadError?: (event: Event) => void | Promise<void>;
|
|
16
|
+
maxWidth?: number;
|
|
17
|
+
maxHeight?: number;
|
|
18
|
+
}
|
|
19
|
+
export declare const defaultImageBlockConfig: ImageBlockConfig;
|
|
20
|
+
export declare const imageBlockConfig: import("@jvs-milkdown/utils").$Ctx<ImageBlockConfig, "imageBlockConfigCtx">;
|
|
21
|
+
//# sourceMappingURL=config.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../src/image-block/config.ts"],"names":[],"mappings":"AAIA,MAAM,WAAW,gBAAgB;IAC/B,SAAS,EAAE,MAAM,GAAG,SAAS,CAAA;IAC7B,WAAW,EAAE,MAAM,GAAG,SAAS,CAAA;IAC/B,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAA;IAC5B,UAAU,EAAE,MAAM,GAAG,SAAS,CAAA;IAC9B,WAAW,EAAE,MAAM,GAAG,SAAS,CAAA;IAC/B,UAAU,EAAE,MAAM,GAAG,SAAS,CAAA;IAC9B,aAAa,EAAE,MAAM,GAAG,SAAS,CAAA;IACjC,YAAY,EAAE,MAAM,GAAG,SAAS,CAAA;IAChC,aAAa,EAAE,MAAM,GAAG,SAAS,CAAA;IACjC,qBAAqB,EAAE,MAAM,CAAA;IAC7B,sBAAsB,EAAE,MAAM,CAAA;IAC9B,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,MAAM,CAAC,CAAA;IACzC,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,MAAM,CAAC,GAAG,MAAM,CAAA;IACvD,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAA;IACzD,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,eAAO,MAAM,uBAAuB,EAAE,gBAarC,CAAA;AAED,eAAO,MAAM,gBAAgB,6EAG5B,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"convert-plugin.d.ts","sourceRoot":"","sources":["../../src/image-block/convert-plugin.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,uBAAuB,sCAmIlC,CAAA"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import type { MilkdownPlugin } from '@jvs-milkdown/ctx';
|
|
2
|
+
export * from './schema';
|
|
3
|
+
export * from './remark-plugin';
|
|
4
|
+
export * from './config';
|
|
5
|
+
export * from './view';
|
|
6
|
+
export * from './paste-rule';
|
|
7
|
+
export * from './convert-plugin';
|
|
8
|
+
export declare const imageBlockComponent: MilkdownPlugin[];
|
|
9
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/image-block/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AASvD,cAAc,UAAU,CAAA;AACxB,cAAc,iBAAiB,CAAA;AAC/B,cAAc,UAAU,CAAA;AACxB,cAAc,QAAQ,CAAA;AACtB,cAAc,cAAc,CAAA;AAC5B,cAAc,kBAAkB,CAAA;AAEhC,eAAO,MAAM,mBAAmB,EAAE,cAAc,EAOxC,CAAA"}
|
package/lib/image-block/index.js
CHANGED
|
@@ -217,7 +217,7 @@ const imageBlockConvertPlugin = $prose((ctx) => {
|
|
|
217
217
|
appendTransaction(transactions, _oldState, newState) {
|
|
218
218
|
if (!transactions.some((tr2) => tr2.docChanged)) return null;
|
|
219
219
|
const replacements = [];
|
|
220
|
-
newState.doc.descendants((node
|
|
220
|
+
newState.doc.descendants((node) => {
|
|
221
221
|
if (node.type === imageType) ;
|
|
222
222
|
});
|
|
223
223
|
newState.doc.descendants((node, pos) => {
|
|
@@ -665,8 +665,11 @@ const ImageViewer = defineComponent({
|
|
|
665
665
|
const timer = ref(0);
|
|
666
666
|
const showBorderPanel = ref(false);
|
|
667
667
|
const isCropping = ref(false);
|
|
668
|
-
const
|
|
669
|
-
const
|
|
668
|
+
const baseDisplayW = ref(0);
|
|
669
|
+
const baseDisplayH = ref(0);
|
|
670
|
+
const liveRatio = ref(null);
|
|
671
|
+
const localBorderWidth = ref(null);
|
|
672
|
+
const localBorderColor = ref(null);
|
|
670
673
|
const localCrop = ref({ top: 0, left: 0, width: 1, height: 1 });
|
|
671
674
|
let resizeDir = "";
|
|
672
675
|
let startY = 0;
|
|
@@ -682,7 +685,6 @@ const ImageViewer = defineComponent({
|
|
|
682
685
|
return t > 1e-3 || l > 1e-3 || w < 0.999 || h2 < 0.999;
|
|
683
686
|
};
|
|
684
687
|
const onImageLoad = () => {
|
|
685
|
-
var _a2;
|
|
686
688
|
const image = imageRef.value;
|
|
687
689
|
if (!image) return;
|
|
688
690
|
const host = image.closest(".milkdown-image-block");
|
|
@@ -693,17 +695,16 @@ const ImageViewer = defineComponent({
|
|
|
693
695
|
maxWidth = config.maxWidth;
|
|
694
696
|
const height = image.naturalHeight;
|
|
695
697
|
const width = image.naturalWidth;
|
|
696
|
-
|
|
697
|
-
|
|
698
|
+
if (!height || !width) return;
|
|
699
|
+
const aspect = width / height;
|
|
700
|
+
let transformedWidth = width < maxWidth ? width : maxWidth;
|
|
701
|
+
let transformedHeight = transformedWidth / aspect;
|
|
702
|
+
if (config.maxHeight && transformedHeight > config.maxHeight) {
|
|
698
703
|
transformedHeight = config.maxHeight;
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
if (config.maxWidth) image.style.maxWidth = `${config.maxWidth}px`;
|
|
704
|
-
const dw = width < maxWidth ? width : maxWidth;
|
|
705
|
-
displayW.value = dw;
|
|
706
|
-
displayH.value = parseFloat(h2);
|
|
704
|
+
transformedWidth = transformedHeight * aspect;
|
|
705
|
+
}
|
|
706
|
+
baseDisplayH.value = transformedHeight;
|
|
707
|
+
baseDisplayW.value = transformedWidth;
|
|
707
708
|
};
|
|
708
709
|
const onToggleCaption = (e) => {
|
|
709
710
|
e.preventDefault();
|
|
@@ -729,9 +730,8 @@ const ImageViewer = defineComponent({
|
|
|
729
730
|
setAttr("caption", value);
|
|
730
731
|
};
|
|
731
732
|
const onResizeHandlePointerMove = (e) => {
|
|
733
|
+
var _a2;
|
|
732
734
|
e.preventDefault();
|
|
733
|
-
const image = imageRef.value;
|
|
734
|
-
if (!image) return;
|
|
735
735
|
const deltaY = e.clientY - startY;
|
|
736
736
|
const deltaX = e.clientX - startX;
|
|
737
737
|
const aspect = startHeight / (startWidth || 1);
|
|
@@ -743,39 +743,54 @@ const ImageViewer = defineComponent({
|
|
|
743
743
|
dhX = -deltaX * aspect;
|
|
744
744
|
}
|
|
745
745
|
const dh = Math.abs(dhX) > Math.abs(dhY) ? dhX : dhY;
|
|
746
|
-
let
|
|
747
|
-
|
|
748
|
-
if (
|
|
749
|
-
|
|
750
|
-
|
|
751
|
-
|
|
752
|
-
|
|
746
|
+
let newWrapperHeight = startHeight + dh;
|
|
747
|
+
let newWrapperWidth = newWrapperHeight * (startWidth / (startHeight || 1));
|
|
748
|
+
if (newWrapperHeight < 20) {
|
|
749
|
+
newWrapperHeight = 20;
|
|
750
|
+
newWrapperWidth = newWrapperHeight * (startWidth / (startHeight || 1));
|
|
751
|
+
}
|
|
752
|
+
if (newWrapperWidth < 20) {
|
|
753
|
+
newWrapperWidth = 20;
|
|
754
|
+
newWrapperHeight = newWrapperWidth / (startWidth / (startHeight || 1));
|
|
755
|
+
}
|
|
756
|
+
const image = imageRef.value;
|
|
757
|
+
const host = image == null ? void 0 : image.closest(".milkdown-image-block");
|
|
758
|
+
const hostWidth = host == null ? void 0 : host.getBoundingClientRect().width;
|
|
759
|
+
const maxW = config.maxWidth && hostWidth ? Math.min(config.maxWidth, hostWidth) : hostWidth || Infinity;
|
|
760
|
+
if (newWrapperWidth > maxW) {
|
|
761
|
+
newWrapperWidth = maxW;
|
|
762
|
+
newWrapperHeight = newWrapperWidth / (startWidth / (startHeight || 1));
|
|
763
|
+
}
|
|
764
|
+
if (config.maxHeight && newWrapperHeight > config.maxHeight) {
|
|
765
|
+
newWrapperHeight = config.maxHeight;
|
|
766
|
+
}
|
|
767
|
+
const cHeight = isCropped() && !isCropping.value ? (_a2 = cropHeight.value) != null ? _a2 : 1 : 1;
|
|
768
|
+
const newBaseHeight = newWrapperHeight / cHeight;
|
|
769
|
+
const newRatio = newBaseHeight / (baseDisplayH.value || 1);
|
|
770
|
+
liveRatio.value = Number(newRatio.toFixed(2));
|
|
753
771
|
};
|
|
754
772
|
const onResizeHandlePointerUp = () => {
|
|
755
773
|
window.removeEventListener("pointermove", onResizeHandlePointerMove);
|
|
756
774
|
window.removeEventListener("pointerup", onResizeHandlePointerUp);
|
|
757
|
-
|
|
758
|
-
|
|
759
|
-
|
|
760
|
-
|
|
761
|
-
const ratio2 = Number.parseFloat(
|
|
762
|
-
Number(currentHeight / originHeight).toFixed(2)
|
|
763
|
-
);
|
|
764
|
-
if (Number.isNaN(ratio2)) return;
|
|
765
|
-
setAttr("ratio", ratio2);
|
|
775
|
+
if (liveRatio.value !== null) {
|
|
776
|
+
setAttr("ratio", liveRatio.value);
|
|
777
|
+
liveRatio.value = null;
|
|
778
|
+
}
|
|
766
779
|
};
|
|
767
780
|
const onResizeHandlePointerDown = (e, dir) => {
|
|
781
|
+
var _a2;
|
|
768
782
|
if (readonly.value) return;
|
|
769
783
|
e.preventDefault();
|
|
770
784
|
e.stopPropagation();
|
|
771
785
|
resizeDir = dir;
|
|
772
786
|
startY = e.clientY;
|
|
773
787
|
startX = e.clientX;
|
|
774
|
-
const
|
|
775
|
-
if (
|
|
776
|
-
startHeight =
|
|
777
|
-
startWidth =
|
|
788
|
+
const wrapper = wrapperRef.value;
|
|
789
|
+
if (wrapper) {
|
|
790
|
+
startHeight = wrapper.getBoundingClientRect().height;
|
|
791
|
+
startWidth = wrapper.getBoundingClientRect().width;
|
|
778
792
|
}
|
|
793
|
+
liveRatio.value = (_a2 = ratio.value) != null ? _a2 : 1;
|
|
779
794
|
window.addEventListener("pointermove", onResizeHandlePointerMove);
|
|
780
795
|
window.addEventListener("pointerup", onResizeHandlePointerUp);
|
|
781
796
|
};
|
|
@@ -911,43 +926,63 @@ const ImageViewer = defineComponent({
|
|
|
911
926
|
cropDragType = "";
|
|
912
927
|
};
|
|
913
928
|
return () => {
|
|
914
|
-
var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j;
|
|
929
|
+
var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
|
|
915
930
|
const currentBorderStyle = (_a2 = borderStyle.value) != null ? _a2 : "none";
|
|
916
|
-
const currentBorderWidth = (_b = borderWidth.value) != null ? _b : 0;
|
|
917
|
-
const currentBorderColor = (_c = borderColor.value) != null ? _c : "#000000";
|
|
931
|
+
const currentBorderWidth = localBorderWidth.value !== null ? localBorderWidth.value : (_b = borderWidth.value) != null ? _b : 0;
|
|
932
|
+
const currentBorderColor = localBorderColor.value !== null ? localBorderColor.value : (_c = borderColor.value) != null ? _c : "#000000";
|
|
918
933
|
const cTop = (_d = cropTop.value) != null ? _d : 0;
|
|
919
934
|
const cLeft = (_e = cropLeft.value) != null ? _e : 0;
|
|
920
935
|
const cWidth = (_f = cropWidth.value) != null ? _f : 1;
|
|
921
936
|
const cHeight = (_g = cropHeight.value) != null ? _g : 1;
|
|
922
937
|
const cropped = isCropped();
|
|
923
938
|
const borderStyleStr = currentBorderStyle !== "none" && currentBorderWidth > 0 ? `${currentBorderWidth}px ${currentBorderStyle} ${currentBorderColor}` : void 0;
|
|
924
|
-
const
|
|
925
|
-
|
|
926
|
-
|
|
927
|
-
const
|
|
928
|
-
const
|
|
929
|
-
const
|
|
930
|
-
const
|
|
939
|
+
const currentRatio = liveRatio.value !== null ? liveRatio.value : (_h = ratio.value) != null ? _h : 1;
|
|
940
|
+
let baseW = baseDisplayW.value * currentRatio;
|
|
941
|
+
let baseH = baseDisplayH.value * currentRatio;
|
|
942
|
+
const image = imageRef.value;
|
|
943
|
+
const host = image == null ? void 0 : image.closest(".milkdown-image-block");
|
|
944
|
+
const hostWidth = host == null ? void 0 : host.getBoundingClientRect().width;
|
|
945
|
+
const maxW = config.maxWidth && hostWidth ? Math.min(config.maxWidth, hostWidth) : hostWidth || Infinity;
|
|
946
|
+
const visibleW = isCropping.value ? baseW : cropped ? baseW * cWidth : baseW;
|
|
947
|
+
if (visibleW > maxW && maxW > 0) {
|
|
948
|
+
const scale = maxW / visibleW;
|
|
949
|
+
baseW = baseW * scale;
|
|
950
|
+
baseH = baseH * scale;
|
|
951
|
+
}
|
|
931
952
|
const cropPxW = baseW * cWidth;
|
|
932
953
|
const cropPxH = baseH * cHeight;
|
|
933
954
|
const cropPxL = baseW * cLeft;
|
|
934
955
|
const cropPxT = baseH * cTop;
|
|
935
|
-
const wrapperStyle = {
|
|
956
|
+
const wrapperStyle = {
|
|
957
|
+
minWidth: "20px",
|
|
958
|
+
minHeight: "20px",
|
|
959
|
+
border: !isCropping.value ? borderStyleStr != null ? borderStyleStr : "" : ""
|
|
960
|
+
};
|
|
961
|
+
if (cropped && !isCropping.value && cropPxW > 0 && cropPxH > 0) {
|
|
962
|
+
wrapperStyle.width = `${cropPxW}px`;
|
|
963
|
+
wrapperStyle.height = `${cropPxH}px`;
|
|
964
|
+
}
|
|
936
965
|
const cropClipStyle = cropped && !isCropping.value && baseW > 0 && baseH > 0 ? {
|
|
937
966
|
width: `${cropPxW}px`,
|
|
938
967
|
height: `${cropPxH}px`,
|
|
939
968
|
overflow: "hidden"
|
|
940
969
|
} : null;
|
|
941
|
-
const imgStyle = {
|
|
970
|
+
const imgStyle = {
|
|
971
|
+
minWidth: "0px",
|
|
972
|
+
minHeight: "0px"
|
|
973
|
+
};
|
|
942
974
|
if (cropped && !isCropping.value && baseW > 0 && baseH > 0) {
|
|
943
975
|
imgStyle.width = `${baseW}px`;
|
|
944
976
|
imgStyle.height = `${baseH}px`;
|
|
945
977
|
imgStyle.maxWidth = "none";
|
|
946
978
|
imgStyle.marginLeft = `${-cropPxL}px`;
|
|
947
979
|
imgStyle.marginTop = `${-cropPxT}px`;
|
|
948
|
-
imgStyle.border = borderStyleStr != null ? borderStyleStr : "";
|
|
949
980
|
} else {
|
|
950
|
-
|
|
981
|
+
if (baseH > 0 && baseW > 0) {
|
|
982
|
+
imgStyle.width = `${baseW}px`;
|
|
983
|
+
imgStyle.height = `${baseH}px`;
|
|
984
|
+
if (config.maxWidth) imgStyle.maxWidth = `${config.maxWidth}px`;
|
|
985
|
+
}
|
|
951
986
|
}
|
|
952
987
|
return /* @__PURE__ */ h(Fragment$2, null, !isCropping.value ? /* @__PURE__ */ h(
|
|
953
988
|
"div",
|
|
@@ -988,7 +1023,7 @@ const ImageViewer = defineComponent({
|
|
|
988
1023
|
resetCrop();
|
|
989
1024
|
}
|
|
990
1025
|
},
|
|
991
|
-
/* @__PURE__ */ h(Icon, { icon: (
|
|
1026
|
+
/* @__PURE__ */ h(Icon, { icon: (_i = config.resetCropIcon) != null ? _i : "\u21A9" })
|
|
992
1027
|
) : null,
|
|
993
1028
|
config.borderIcon ? /* @__PURE__ */ h(
|
|
994
1029
|
"div",
|
|
@@ -1003,7 +1038,14 @@ const ImageViewer = defineComponent({
|
|
|
1003
1038
|
"div",
|
|
1004
1039
|
{
|
|
1005
1040
|
class: "setting-panel border-panel",
|
|
1006
|
-
|
|
1041
|
+
draggable: "true",
|
|
1042
|
+
onClick: (e) => e.stopPropagation(),
|
|
1043
|
+
onMousedown: (e) => e.stopPropagation(),
|
|
1044
|
+
onPointerdown: (e) => e.stopPropagation(),
|
|
1045
|
+
onDragstart: (e) => {
|
|
1046
|
+
e.preventDefault();
|
|
1047
|
+
e.stopPropagation();
|
|
1048
|
+
}
|
|
1007
1049
|
},
|
|
1008
1050
|
/* @__PURE__ */ h("div", { class: "setting-panel-title" }, "\u8FB9\u6846\u8BBE\u7F6E"),
|
|
1009
1051
|
/* @__PURE__ */ h("div", { class: "setting-row" }, /* @__PURE__ */ h("span", { class: "setting-label" }, "\u6837\u5F0F"), /* @__PURE__ */ h("div", { class: "border-style-options" }, borderStyleOptions.map((opt) => /* @__PURE__ */ h(
|
|
@@ -1020,29 +1062,51 @@ const ImageViewer = defineComponent({
|
|
|
1020
1062
|
currentBorderStyle !== "none" ? /* @__PURE__ */ h("div", { class: "setting-row" }, /* @__PURE__ */ h("span", { class: "setting-label" }, "\u5BBD\u5EA6"), /* @__PURE__ */ h(
|
|
1021
1063
|
"input",
|
|
1022
1064
|
{
|
|
1065
|
+
draggable: "true",
|
|
1023
1066
|
type: "range",
|
|
1024
1067
|
min: "1",
|
|
1025
1068
|
max: "10",
|
|
1026
1069
|
value: currentBorderWidth,
|
|
1027
1070
|
onInput: (e) => {
|
|
1071
|
+
const target = e.target;
|
|
1072
|
+
localBorderWidth.value = Number(target.value);
|
|
1073
|
+
},
|
|
1074
|
+
onChange: (e) => {
|
|
1028
1075
|
const target = e.target;
|
|
1029
1076
|
setAttr("borderWidth", Number(target.value));
|
|
1077
|
+
localBorderWidth.value = null;
|
|
1030
1078
|
},
|
|
1031
1079
|
onClick: (e) => e.stopPropagation(),
|
|
1032
|
-
|
|
1080
|
+
onMousedown: (e) => e.stopPropagation(),
|
|
1081
|
+
onPointerdown: (e) => e.stopPropagation(),
|
|
1082
|
+
onDragstart: (e) => {
|
|
1083
|
+
e.preventDefault();
|
|
1084
|
+
e.stopPropagation();
|
|
1085
|
+
}
|
|
1033
1086
|
}
|
|
1034
1087
|
), /* @__PURE__ */ h("span", { class: "setting-value" }, currentBorderWidth, "px")) : null,
|
|
1035
1088
|
currentBorderStyle !== "none" ? /* @__PURE__ */ h("div", { class: "setting-row" }, /* @__PURE__ */ h("span", { class: "setting-label" }, "\u989C\u8272"), /* @__PURE__ */ h(
|
|
1036
1089
|
"input",
|
|
1037
1090
|
{
|
|
1091
|
+
draggable: "true",
|
|
1038
1092
|
type: "color",
|
|
1039
1093
|
value: currentBorderColor,
|
|
1040
1094
|
onInput: (e) => {
|
|
1095
|
+
const target = e.target;
|
|
1096
|
+
localBorderColor.value = target.value;
|
|
1097
|
+
},
|
|
1098
|
+
onChange: (e) => {
|
|
1041
1099
|
const target = e.target;
|
|
1042
1100
|
setAttr("borderColor", target.value);
|
|
1101
|
+
localBorderColor.value = null;
|
|
1043
1102
|
},
|
|
1044
1103
|
onClick: (e) => e.stopPropagation(),
|
|
1045
|
-
|
|
1104
|
+
onMousedown: (e) => e.stopPropagation(),
|
|
1105
|
+
onPointerdown: (e) => e.stopPropagation(),
|
|
1106
|
+
onDragstart: (e) => {
|
|
1107
|
+
e.preventDefault();
|
|
1108
|
+
e.stopPropagation();
|
|
1109
|
+
}
|
|
1046
1110
|
}
|
|
1047
1111
|
)) : null
|
|
1048
1112
|
) : null
|
|
@@ -1167,7 +1231,7 @@ const ImageViewer = defineComponent({
|
|
|
1167
1231
|
applyCrop();
|
|
1168
1232
|
}
|
|
1169
1233
|
},
|
|
1170
|
-
/* @__PURE__ */ h(Icon, { icon: (
|
|
1234
|
+
/* @__PURE__ */ h(Icon, { icon: (_j = config.confirmIcon) != null ? _j : "\u2713" })
|
|
1171
1235
|
), /* @__PURE__ */ h(
|
|
1172
1236
|
"div",
|
|
1173
1237
|
{
|
|
@@ -1177,7 +1241,7 @@ const ImageViewer = defineComponent({
|
|
|
1177
1241
|
cancelCrop();
|
|
1178
1242
|
}
|
|
1179
1243
|
},
|
|
1180
|
-
/* @__PURE__ */ h(Icon, { icon: (
|
|
1244
|
+
/* @__PURE__ */ h(Icon, { icon: (_k = config.cancelIcon) != null ? _k : "\u2715" })
|
|
1181
1245
|
))) : null,
|
|
1182
1246
|
!isCropping.value ? /* @__PURE__ */ h(Fragment$2, null, /* @__PURE__ */ h(
|
|
1183
1247
|
"div",
|