diff --git a/src/extensions/markdown/Image/ImageSpecs/index.ts b/src/extensions/markdown/Image/ImageSpecs/index.ts index 2fbef404..361c4939 100644 --- a/src/extensions/markdown/Image/ImageSpecs/index.ts +++ b/src/extensions/markdown/Image/ImageSpecs/index.ts @@ -8,6 +8,7 @@ export const ImageAttr = { Src: 'src', Alt: 'alt', Title: 'title', + Loading: 'loading', } as const; export const ImageSpecs: ExtensionAuto = (builder) => { @@ -18,6 +19,7 @@ export const ImageSpecs: ExtensionAuto = (builder) => { [ImageAttr.Src]: {}, [ImageAttr.Alt]: {default: null}, [ImageAttr.Title]: {default: null}, + [ImageAttr.Loading]: {default: null}, }, group: 'inline', draggable: true, @@ -29,6 +31,7 @@ export const ImageSpecs: ExtensionAuto = (builder) => { [ImageAttr.Src]: (dom as Element).getAttribute(ImageAttr.Src), [ImageAttr.Alt]: (dom as Element).getAttribute(ImageAttr.Alt), [ImageAttr.Title]: (dom as Element).getAttribute(ImageAttr.Title), + [ImageAttr.Loading]: (dom as Element).getAttribute(ImageAttr.Loading), }; }, }, @@ -44,6 +47,7 @@ export const ImageSpecs: ExtensionAuto = (builder) => { getAttrs: (tok) => ({ [ImageAttr.Src]: tok.attrGet('src'), [ImageAttr.Title]: tok.attrGet('title') || null, + [ImageAttr.Loading]: tok.attrGet(ImageAttr.Loading) || null, [ImageAttr.Alt]: tok.children?.[0]?.content || null, }), }, diff --git a/src/extensions/yfm/ImgSize/ImgSizeSpecs/const.ts b/src/extensions/yfm/ImgSize/ImgSizeSpecs/const.ts new file mode 100644 index 00000000..5b02c243 --- /dev/null +++ b/src/extensions/yfm/ImgSize/ImgSizeSpecs/const.ts @@ -0,0 +1,10 @@ +import {ImsizeAttr} from '@diplodoc/transform/lib/plugins/imsize/const'; + +export const ImgSizeAttr = { + Alt: ImsizeAttr.Alt, + Src: ImsizeAttr.Src, + Title: ImsizeAttr.Title, + Width: ImsizeAttr.Width, + Height: ImsizeAttr.Height, + Loading: 'loading', +} as const; diff --git a/src/extensions/yfm/ImgSize/ImgSizeSpecs/index.ts b/src/extensions/yfm/ImgSize/ImgSizeSpecs/index.ts index f3ca8f88..4f582b36 100644 --- a/src/extensions/yfm/ImgSize/ImgSizeSpecs/index.ts +++ b/src/extensions/yfm/ImgSize/ImgSizeSpecs/index.ts @@ -1,11 +1,11 @@ import isNumber from 'is-number'; import type {NodeSpec} from 'prosemirror-model'; import imsize from '@diplodoc/transform/lib/plugins/imsize'; -import {ImsizeAttr as ImgSizeAttr} from '@diplodoc/transform/lib/plugins/imsize/const'; import log from '@diplodoc/transform/lib/log'; import type {ExtensionAuto} from '../../../../core'; import {imageNodeName} from '../../../markdown/Image/const'; +import {ImgSizeAttr} from './const'; type ImsizeTypedAttributes = { [ImgSizeAttr.Src]: string; @@ -13,6 +13,7 @@ type ImsizeTypedAttributes = { [ImgSizeAttr.Alt]: string | null; [ImgSizeAttr.Width]: string | null; [ImgSizeAttr.Height]: string | null; + [ImgSizeAttr.Loading]: string | null; }; export {ImgSizeAttr}; @@ -37,6 +38,7 @@ export const ImgSizeSpecs: ExtensionAuto = (builder, opts) [ImgSizeAttr.Title]: {default: null}, [ImgSizeAttr.Height]: {default: null}, [ImgSizeAttr.Width]: {default: null}, + [ImgSizeAttr.Loading]: {default: null}, }, placeholder: placeholderContent ? {content: placeholderContent} : opts.placeholder, group: 'inline', @@ -52,6 +54,9 @@ export const ImgSizeSpecs: ExtensionAuto = (builder, opts) [ImgSizeAttr.Src]: (dom as Element).getAttribute(ImgSizeAttr.Src), [ImgSizeAttr.Alt]: (dom as Element).getAttribute(ImgSizeAttr.Alt), [ImgSizeAttr.Title]: (dom as Element).getAttribute(ImgSizeAttr.Title), + [ImgSizeAttr.Loading]: (dom as Element).getAttribute( + ImgSizeAttr.Loading, + ), [ImgSizeAttr.Height]: isNumber(height) ? height : null, [ImgSizeAttr.Width]: isNumber(width) ? height : null, }; @@ -71,6 +76,7 @@ export const ImgSizeSpecs: ExtensionAuto = (builder, opts) [ImgSizeAttr.Title]: tok.attrGet(ImgSizeAttr.Title), [ImgSizeAttr.Height]: tok.attrGet(ImgSizeAttr.Height), [ImgSizeAttr.Width]: tok.attrGet(ImgSizeAttr.Width), + [ImgSizeAttr.Loading]: tok.attrGet(ImgSizeAttr.Loading), [ImgSizeAttr.Alt]: tok.children?.[0]?.content || null, }), },