-
-
Notifications
You must be signed in to change notification settings - Fork 3.7k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #13121 from ckeditor/ck/12995
Other (alignment): Rewritten ckeditor5-alignment to TypeScript. Closes #12995.
- Loading branch information
Showing
18 changed files
with
770 additions
and
12 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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 ); | ||
} | ||
} |
Oops, something went wrong.