<!--
  Copyright 2023 Comcast Cable Communications Management, LLC

  Licensed under the Apache License, Version 2.0 (the "License");
  you may not use this file except in compliance with the License.
  You may obtain a copy of the License at

  http://www.apache.org/licenses/LICENSE-2.0

  Unless required by applicable law or agreed to in writing, software
  distributed under the License is distributed on an "AS IS" BASIS,
  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  See the License for the specific language governing permissions and
  limitations under the License.

  SPDX-License-Identifier: Apache-2.0
-->

import { Canvas, Story } from '@storybook/addon-docs';

# withUpdates

The `withUpdates` mixin can be wrapped around a parent component to have properties which call an `_update` function.

## Source

https://github.com/rdkcentral/Lightning-UI-Components/blob/develop/packages/@lightningjs/ui-components/src/mixins/withUpdates/index.js

## Usage

`withUpdates` looks for a `static get properties` which returns an array of properties to add getters and setters for.
You can add a `_get${PropName}(value)` function to override the default return value from the getter. Likewise, you
can add a `_set${PropName}(value)` function which returns a processed value for storing. The setter automatically calls
`requestUpdate` which in turn calls `_update` in components to render. Additionally, a private property `_${propName}`
is created to store the value, which can be utilized to set initial values.

Important to note that you can not override properties which exist on the component, ie w or h.

```js
class Example extends withUpdates(lng.Component) {
  static get properties() {
    return ['title'];
  }

  _init() {
    this._title = 'Default Title Value';
  }

  _update() {
    this.text = {
      text: this.title
    };
  }
}
```
