Skip to content

Commit

Permalink
Merge pull request #13121 from ckeditor/ck/12995
Browse files Browse the repository at this point in the history
Other (alignment): Rewritten ckeditor5-alignment to TypeScript. Closes #12995.
  • Loading branch information
przemyslaw-zan authored Dec 21, 2022
2 parents f6c3aa5 + dd7c88f commit 8a10049
Show file tree
Hide file tree
Showing 18 changed files with 770 additions and 12 deletions.
11 changes: 6 additions & 5 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -26,12 +26,18 @@ mrgit.json
yalc.lock

# Ignore compiled TypeScript files.
packages/ckeditor5-alignment/src/**/*.js
packages/ckeditor5-basic-styles/src/**/*.js
packages/ckeditor5-clipboard/src/**/*.js
packages/ckeditor5-code-block/src/**/*.js
packages/ckeditor5-core/src/**/*.js
packages/ckeditor5-editor-balloon/src/**/*.js
packages/ckeditor5-editor-classic/src/**/*.js
packages/ckeditor5-editor-decoupled/src/**/*.js
packages/ckeditor5-editor-inline/src/**/*.js
packages/ckeditor5-engine/src/**/*.js
packages/ckeditor5-enter/src/**/*.js
packages/ckeditor5-essentials/src/**/*.js
packages/ckeditor5-list/src/**/*.js
packages/ckeditor5-paragraph/src/**/*.js
packages/ckeditor5-paste-from-office/src/**/*.js
Expand All @@ -42,11 +48,6 @@ packages/ckeditor5-undo/src/**/*.js
packages/ckeditor5-upload/src/**/*.js
packages/ckeditor5-utils/src/**/*.js
packages/ckeditor5-widget/src/**/*.js
packages/ckeditor5-editor-classic/src/**/*.js
packages/ckeditor5-editor-inline/src/**/*.js
packages/ckeditor5-editor-balloon/src/**/*.js
packages/ckeditor5-editor-decoupled/src/**/*.js
packages/ckeditor5-essentials/src/**/*.js
packages/ckeditor5-word-count/src/**/*.js
packages/*/src/**/*.d.ts
src/**/*.js
Expand Down
File renamed without changes.
File renamed without changes.
10 changes: 7 additions & 3 deletions packages/ckeditor5-alignment/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
"ckeditor5-plugin",
"ckeditor5-dll"
],
"main": "src/index.js",
"main": "src/index.ts",
"dependencies": {
"ckeditor5": "^35.4.0"
},
Expand All @@ -27,6 +27,7 @@
"@ckeditor/ckeditor5-paragraph": "^35.4.0",
"@ckeditor/ckeditor5-theme-lark": "^35.4.0",
"@ckeditor/ckeditor5-typing": "^35.4.0",
"typescript": "^4.8.4",
"webpack": "^5.58.1",
"webpack-cli": "^4.9.0"
},
Expand All @@ -45,13 +46,16 @@
},
"files": [
"lang",
"src",
"src/**/*.js",
"src/**/*.d.ts",
"theme",
"build",
"ckeditor5-metadata.json",
"CHANGELOG.md"
],
"scripts": {
"dll:build": "webpack"
"dll:build": "webpack",
"build": "tsc -p ./tsconfig.release.json",
"postversion": "npm run build"
}
}
44 changes: 44 additions & 0 deletions packages/ckeditor5-alignment/src/alignment.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
/**
* @license Copyright (c) 2003-2022, CKSource Holding sp. z o.o. All rights reserved.
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
*/

/**
* @module alignment/alignment
*/

import { Plugin, type PluginDependencies } from 'ckeditor5/src/core';

import AlignmentEditing from './alignmentediting';
import AlignmentUI from './alignmentui';

/**
* The text alignment plugin.
*
* For a detailed overview, check the {@glink features/text-alignment Text alignment feature documentation}
* and the {@glink api/alignment package page}.
*
* This is a "glue" plugin which loads the {@link module:alignment/alignmentediting~AlignmentEditing} and
* {@link module:alignment/alignmentui~AlignmentUI} plugins.
*/
export default class Alignment extends Plugin {
/**
* @inheritDoc
*/
public static get requires(): PluginDependencies {
return [ AlignmentEditing, AlignmentUI ];
}

/**
* @inheritDoc
*/
public static get pluginName(): 'Alignment' {
return 'Alignment';
}
}

declare module '@ckeditor/ckeditor5-core' {
interface PluginsMap {
[ Alignment.pluginName ]: Alignment;
}
}
111 changes: 111 additions & 0 deletions packages/ckeditor5-alignment/src/alignmentcommand.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,111 @@
/**
* @license Copyright (c) 2003-2022, CKSource Holding sp. z o.o. All rights reserved.
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
*/

/**
* @module alignment/alignmentcommand
*/

import { Command } from 'ckeditor5/src/core';
import { first } from 'ckeditor5/src/utils';
import type { Element, Writer } from 'ckeditor5/src/engine';

import { isDefault } from './utils';
import type { SupportedOption } from './alignmentediting';

const ALIGNMENT = 'alignment';

/**
* The alignment command plugin.
*/
export default class AlignmentCommand extends Command {
/**
* A value of the current block's alignment.
*
* @observable
* @readonly
*/
declare public value: SupportedOption;

/**
* @inheritDoc
*/
public override refresh(): void {
const editor = this.editor;
const locale = editor.locale;
const firstBlock = first( this.editor.model.document.selection.getSelectedBlocks() )!;

// As first check whether to enable or disable the command as the value will always be false if the command cannot be enabled.
this.isEnabled = Boolean( firstBlock ) && this._canBeAligned( firstBlock );

if ( this.isEnabled && firstBlock.hasAttribute( 'alignment' ) ) {
this.value = firstBlock.getAttribute( 'alignment' ) as SupportedOption;
} else {
this.value = locale.contentLanguageDirection === 'rtl' ? 'right' : 'left';
}
}

/**
* Executes the command. Applies the alignment `value` to the selected blocks.
* If no `value` is passed, the `value` is the default one or it is equal to the currently selected block's alignment attribute,
* the command will remove the attribute from the selected blocks.
*
* @param options Options for the executed command.
* @param options.value The value to apply.
* @fires execute
*/
public override execute( options: { value?: SupportedOption } = {} ): void {
const editor = this.editor;
const locale = editor.locale;
const model = editor.model;
const doc = model.document;

const value = options.value!;

model.change( writer => {
// Get only those blocks from selected that can have alignment set
const blocks = Array.from( doc.selection.getSelectedBlocks() ).filter( block => this._canBeAligned( block ) );
const currentAlignment = blocks[ 0 ].getAttribute( 'alignment' );

// Remove alignment attribute if current alignment is:
// - default (should not be stored in model as it will bloat model data)
// - equal to currently set
// - or no value is passed - denotes default alignment.
const removeAlignment = isDefault( value, locale ) || currentAlignment === value || !value;

if ( removeAlignment ) {
removeAlignmentFromSelection( blocks, writer );
} else {
setAlignmentOnSelection( blocks, writer, value );
}
} );
}

/**
* Checks whether a block can have alignment set.
*
* @param block The block to be checked.
*/
private _canBeAligned( block: Element ) {
return this.editor.model.schema.checkAttribute( block, ALIGNMENT );
}
}

/**
* Removes the alignment attribute from blocks.
*/
function removeAlignmentFromSelection( blocks: Array<Element>, writer: Writer ) {
for ( const block of blocks ) {
writer.removeAttribute( ALIGNMENT, block );
}
}

/**
* Sets the alignment attribute on blocks.
*/
function setAlignmentOnSelection( blocks: Array<Element>, writer: Writer, alignment: string ) {
for ( const block of blocks ) {
writer.setAttribute( ALIGNMENT, alignment, block );
}
}
Loading

0 comments on commit 8a10049

Please sign in to comment.