# engine/view/styles/utils

module

<a id="functions">

## Functions

<a id="function-getBoxSidesStyleShorthandValue">

### `getBoxSidesStyleShorthandValue( __namedParameters ) → string`

Returns a [shorthand](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties) notation of a CSS property value.

```typescript
getBoxSidesStyleShorthandValue( { top: '1px', right: '1px', bottom: '2px', left: '1px' } );
// will return '1px 1px 2px'
```

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/view/styles/utils.ts#L242)

#### Parameters

* `__namedParameters: BoxStyleSides`

#### Returns

* `string`

<a id="function-getBoxSidesStyleValueReducer">

### `getBoxSidesStyleValueReducer( styleShorthand ) → ( value: StyleValue ) => Array<StylePropertyDescriptor>`

Default reducer for CSS properties that concerns edges of a box [shorthand](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties) notations:

```typescript
stylesProcessor.setReducer( 'padding', getBoxSidesStyleValueReducer( 'padding' ) );
```

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/view/styles/utils.ts#L203)

#### Parameters

* `styleShorthand: string`

#### Returns

* `( value: StyleValue ) => Array<StylePropertyDescriptor>`

<a id="function-getBoxSidesStyleValues">

### `getBoxSidesStyleValues( value ) → BoxStyleSides`

Parses box sides as individual values.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/view/styles/utils.ts#L180)

#### Parameters

* `value: string`

  Defaults to `''`

#### Returns

* `BoxStyleSides`

<a id="function-getPositionStyleShorthandNormalizer">

### `getPositionStyleShorthandNormalizer( shorthand ) → ( value: string ) => object`

Creates a normalizer for a [shorthand](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties) 1-to-4 value.

```typescript
stylesProcessor.setNormalizer( 'margin', getPositionStyleShorthandNormalizer( 'margin' ) );
```

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/view/styles/utils.ts#L265)

#### Parameters

* `shorthand: string`

#### Returns

* `( value: string ) => object`

<a id="function-getShorthandStylesValues">

### `getShorthandStylesValues( string ) → Array<string>`

Parses parts of a 1-to-4 value notation - handles some CSS values with spaces (like RGB()).

```typescript
getShorthandStylesValues( 'red blue RGB(0, 0, 0)');
// will return [ 'red', 'blue', 'RGB(0, 0, 0)' ]
```

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/view/styles/utils.ts#L282)

#### Parameters

* `string: string`

#### Returns

* `Array<string>`

<a id="function-isAttachmentStyleValue">

### `isAttachmentStyleValue( string ) → boolean`

Checks if string contains [background attachment](https://developer.mozilla.org/en-US/docs/Web/CSS/background-attachment) CSS value.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/view/styles/utils.ts#L146)

#### Parameters

* `string: string`

#### Returns

* `boolean`

<a id="function-isClipStyleValue">

### `isClipStyleValue( string ) → boolean`

Checks if string contains [background clip](https://developer.mozilla.org/en-US/docs/Web/CSS/background-clip) CSS value.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/view/styles/utils.ts#L164)

#### Parameters

* `string: string`

#### Returns

* `boolean`

<a id="function-isColorStyleValue">

### `isColorStyleValue( string ) → boolean`

Checks if string contains [color](https://developer.mozilla.org/en-US/docs/Web/CSS/color) CSS value.

```typescript
isColorStyleValue( '#f00' );						// true
isColorStyleValue( '#AA00BB33' );				// true
isColorStyleValue( 'rgb(0, 0, 250)' );			// true
isColorStyleValue( 'hsla(240, 100%, 50%, .7)' );	// true
isColorStyleValue( 'deepskyblue' );				// true
```

**Note**: It does not support CSS Level 4 whitespace syntax, system colors and radius values for HSL colors.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/view/styles/utils.ts#L69)

#### Parameters

* `string: string`

#### Returns

* `boolean`

<a id="function-isLengthStyleValue">

### `isLengthStyleValue( string ) → boolean`

Checks if string contains [length](https://developer.mozilla.org/en-US/docs/Web/CSS/length) CSS value.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/view/styles/utils.ts#L101)

#### Parameters

* `string: string`

#### Returns

* `boolean`

<a id="function-isLineStyleValue">

### `isLineStyleValue( string ) → boolean`

Checks if string contains [line style](https://developer.mozilla.org/en-US/docs/Web/CSS/border-style) CSS value.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/view/styles/utils.ts#L92)

#### Parameters

* `string: string`

#### Returns

* `boolean`

<a id="function-isOriginStyleValue">

### `isOriginStyleValue( string ) → boolean`

Checks if string contains [background origin](https://developer.mozilla.org/en-US/docs/Web/CSS/background-origin) CSS value.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/view/styles/utils.ts#L155)

#### Parameters

* `string: string`

#### Returns

* `boolean`

<a id="function-isPercentageStyleValue">

### `isPercentageStyleValue( string ) → boolean`

Checks if string contains [percentage](https://developer.mozilla.org/en-US/docs/Web/CSS/percentage) CSS value.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/view/styles/utils.ts#L110)

#### Parameters

* `string: string`

#### Returns

* `boolean`

<a id="function-isPositionStyleValue">

### `isPositionStyleValue( string ) → boolean`

Checks if string contains [background position](https://developer.mozilla.org/en-US/docs/Web/CSS/background-position) CSS value.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/view/styles/utils.ts#L137)

#### Parameters

* `string: string`

#### Returns

* `boolean`

<a id="function-isRepeatStyleValue">

### `isRepeatStyleValue( string ) → boolean`

Checks if string contains [background repeat](https://developer.mozilla.org/en-US/docs/Web/CSS/background-repeat) CSS value.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/view/styles/utils.ts#L128)

#### Parameters

* `string: string`

#### Returns

* `boolean`

<a id="function-isSizeStyleValue">

### `isSizeStyleValue( value ) → boolean`

Checks if a string is a valid CSS `background-size` value token.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/view/styles/utils.ts#L119)

#### Parameters

* `value: string`

#### Returns

* `boolean`

<a id="function-isURLStyleValue">

### `isURLStyleValue( string ) → boolean`

Checks if string contains [URL](https://developer.mozilla.org/en-US/docs/Web/CSS/url) CSS value.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/view/styles/utils.ts#L173)

#### Parameters

* `string: string`

#### Returns

* `boolean`

---

Full index of the CKEditor 5 API reference: [llms.txt](llms.txt)