uui-toggle: Change customElement to defineElement

Author: iOvergaard

packages/uui-toggle/lib/uui-toggle.element.ts

@@ -2,13 +2,13 @@ import {
   UUIHorizontalShakeAnimationValue,
   UUIHorizontalShakeKeyframes,
 } from '@umbraco-ui/uui-base/lib/animations';
+import { defineElement } from '@umbraco-ui/uui-base/lib/registration';
 import { UUIBooleanInputElement } from '@umbraco-ui/uui-boolean-input/lib';
 import {
   iconCheck,
   iconWrong,
 } from '@umbraco-ui/uui-icon-registry-essential/lib/svgs';
 import { css, html } from 'lit';
-import { customElement } from 'lit/decorators.js';
 
 /**
  *  Umbraco Toggle-switch, toggles between off/on. Technically a checkbox.
@@ -25,7 +25,7 @@ import { customElement } from 'lit/decorators.js';
  *  @cssprop --uui-toggle-background-color-focus - Set the toggle background color when focused
  *  @extends UUIBooleanInputElement
  */
-@customElement('uui-toggle')
+@defineElement('uui-toggle')
 export class UUIToggleElement extends UUIBooleanInputElement {
   /**
    * This is a static class field indicating that the element is can be used inside a native form and participate in its events. It may require a polyfill, check support here https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/attachInternals.  Read more about form controls here https://web.dev/more-capable-form-controls/