@daikin-oss/design-system-web-components 1.3.0 → 1.3.2

package/dist/cjs/components/loading/daikin-loading.d.cts

@@ -1,4 +1,4 @@
-import { LitElement } from 'lit';
+import { DDSElement } from "../../base/index.cjs";
 /**
  * The loading component displays a spinner to indicate that a process is in progress.
  * If the spinner is expected to blend into the background, set the background color. You can use the `background` attribute for such cases.
@@ -13,7 +13,7 @@ import { LitElement } from 'lit';
  *  <daikin-loading></daikin-loading>
  * ```
  */
-export declare class DaikinLoading extends LitElement {
+export declare class DaikinLoading extends DDSElement {
     static readonly styles: import('lit').CSSResult;
     /**
      * Size of the loading.

package/dist/cjs/components/logo/daikin-logo.cjs

@@ -4,13 +4,17 @@ const classVarianceAuthority = require("class-variance-authority");
 const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ifDefined_js = require("lit/directives/if-defined.js");
+const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
+const decorators = require("../../base/decorators.cjs");
+require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
+var __decorateClass = (decorators2, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
+  for (var i = decorators2.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators2[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result) __defProp(target, key, result);
   return result;
@@ -42,7 +46,7 @@ const cvaWrapper = classVarianceAuthority.cva(
     }
   }
 );
-exports.DaikinLogo = class DaikinLogo extends lit.LitElement {
+exports.DaikinLogo = class DaikinLogo extends ddsElement.DDSElement {
   constructor() {
     super(...arguments);
     this.href = null;
@@ -101,5 +105,5 @@ __decorateClass([
   decorators_js.query("a")
 ], exports.DaikinLogo.prototype, "_focusableElement", 2);
 exports.DaikinLogo = __decorateClass([
-  decorators_js.customElement("daikin-logo")
+  decorators.ddsElement("daikin-logo")
 ], exports.DaikinLogo);

package/dist/cjs/components/logo/daikin-logo.d.cts

@@ -1,4 +1,4 @@
-import { LitElement } from 'lit';
+import { DDSElement } from "../../base/index.cjs";
 /**
  * The logo is a UI element that represents a brand, company or service. It serves as a visual identifier, helping users recognize and navigate within a specific application or website.
  *
@@ -18,7 +18,7 @@ import { LitElement } from 'lit';
  * </div>
  * ```
  */
-export declare class DaikinLogo extends LitElement {
+export declare class DaikinLogo extends DDSElement {
     static readonly styles: import('lit').CSSResult;
     /**
      * Link `href`.

package/dist/cjs/components/menu/daikin-menu.cjs

@@ -6,6 +6,7 @@ const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const guard_js = require("lit/directives/guard.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const floatingUiAutoUpdate = require("../../controllers/floating-ui-auto-update.cjs");
@@ -202,4 +203,3 @@ __decorateClass([
 exports.DaikinMenu = __decorateClass([
   decorators.ddsElement("daikin-menu")
 ], exports.DaikinMenu);
-exports.DaikinMenu.registerCSSCustomProperties();

package/dist/cjs/components/modal/daikin-modal.cjs

@@ -6,6 +6,7 @@ const decorators_js = require("lit/decorators.js");
 const guard_js = require("lit/directives/guard.js");
 const ifDefined_js = require("lit/directives/if-defined.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const focusTrap = require("../../controllers/focus-trap.cjs");

package/dist/cjs/components/modal-footer/daikin-modal-footer.cjs

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const lit = require("lit");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/modal-header/daikin-modal-header.cjs

@@ -5,6 +5,7 @@ const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ref_js = require("lit/directives/ref.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/pagination/daikin-pagination.cjs

@@ -6,6 +6,7 @@ const decorators_js = require("lit/decorators.js");
 const ifDefined_js = require("lit/directives/if-defined.js");
 const repeat_js = require("lit/directives/repeat.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/progress-bar/daikin-progress-bar.cjs

@@ -4,6 +4,7 @@ const classVarianceAuthority = require("class-variance-authority");
 const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/progress-indicator/daikin-progress-indicator.cjs

@@ -3,6 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/progress-indicator-item/daikin-progress-indicator-item.cjs

@@ -5,6 +5,7 @@ const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ifDefined_js = require("lit/directives/if-defined.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/radio/daikin-radio.cjs

@@ -5,9 +5,9 @@ const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ifDefined_js = require("lit/directives/if-defined.js");
 require("../../base/dds-element.cjs");
+const ddsFormElement = require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
-const ddsFormElement = require("../../base/dds-form-element.cjs");
 const tailwind = require("../../tailwind.css.cjs");
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;

package/dist/cjs/components/radio/daikin-radio.d.cts

@@ -1,4 +1,4 @@
-import { DDSFormElement } from "../../base/dds-form-element.cjs";
+import { DDSFormElement } from "../../base/index.cjs";
 /**
  * The radio button component is a UI element that allows users to select one options from a set of choices.
  * It functions similarly to the HTML `<input type="radio">` tag. \

package/dist/cjs/components/radio-group/daikin-radio-group.cjs

@@ -5,6 +5,7 @@ const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ifDefined_js = require("lit/directives/if-defined.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/select/daikin-select.cjs

@@ -4,6 +4,7 @@ const classVarianceAuthority = require("class-variance-authority");
 const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/slider/daikin-slider.cjs

@@ -4,15 +4,18 @@ const classVarianceAuthority = require("class-variance-authority");
 const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ref_js = require("lit/directives/ref.js");
+require("../../base/dds-element.cjs");
 const ddsFormElement = require("../../base/dds-form-element.cjs");
+const decorators = require("../../base/decorators.cjs");
+require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");
 const sliderUtils = require("./slider-utils.cjs");
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
+var __decorateClass = (decorators2, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
+  for (var i = decorators2.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators2[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result) __defProp(target, key, result);
   return result;
@@ -259,5 +262,5 @@ __decorateClass([
   decorators_js.state()
 ], exports.DaikinSlider.prototype, "_dragging", 2);
 exports.DaikinSlider = __decorateClass([
-  decorators_js.customElement("daikin-slider")
+  decorators.ddsElement("daikin-slider")
 ], exports.DaikinSlider);

package/dist/cjs/components/slider/daikin-slider.d.cts

@@ -1,5 +1,5 @@
 import { PropertyValues } from 'lit';
-import { DDSFormElement } from "../../base/dds-form-element.cjs";
+import { DDSFormElement } from "../../base/index.cjs";
 /**
  * The slider component is a control that allows users to input numerical values within a specific range intuitively.
  * It functions similarly to the HTML `<input type="range">` tag, allows you to set the range of values.

package/dist/cjs/components/tab/daikin-tab.cjs

@@ -4,6 +4,7 @@ const classVarianceAuthority = require("class-variance-authority");
 const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/tab-panels/daikin-tab-panels.cjs

@@ -4,6 +4,7 @@ const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const repeat_js = require("lit/directives/repeat.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/table/daikin-table.cjs

@@ -7,6 +7,7 @@ const ifDefined_js = require("lit/directives/if-defined.js");
 const ref_js = require("lit/directives/ref.js");
 const repeat_js = require("lit/directives/repeat.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/table-cell/daikin-table-cell.cjs

@@ -4,6 +4,7 @@ const classVarianceAuthority = require("class-variance-authority");
 const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/table-header-cell/daikin-table-header-cell.cjs

@@ -4,6 +4,7 @@ const classVarianceAuthority = require("class-variance-authority");
 const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/tabs/daikin-tabs.cjs

@@ -3,6 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/text-area/daikin-text-area.cjs

@@ -5,9 +5,9 @@ const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ifDefined_js = require("lit/directives/if-defined.js");
 require("../../base/dds-element.cjs");
+const ddsFormElement = require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
-const ddsFormElement = require("../../base/dds-form-element.cjs");
 const tailwind = require("../../tailwind.css.cjs");
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;

package/dist/cjs/components/text-area/daikin-text-area.d.cts

@@ -1,5 +1,5 @@
 import { PropertyValues } from 'lit';
-import { DDSFormElement } from "../../base/dds-form-element.cjs";
+import { DDSFormElement } from "../../base/index.cjs";
 import { DaikinInputGroup } from "../input-group/index.cjs";
 /**
  * The text area component is designed for multiline text input, similar to the HTML `<textarea>` tag.

package/dist/cjs/components/text-field/daikin-text-field.cjs

@@ -5,9 +5,9 @@ const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ifDefined_js = require("lit/directives/if-defined.js");
 require("../../base/dds-element.cjs");
+const ddsFormElement = require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
-const ddsFormElement = require("../../base/dds-form-element.cjs");
 const tailwind = require("../../tailwind.css.cjs");
 const isSimpleKey = require("../../utils/is-simple-key.cjs");
 require("../icon-button/daikin-icon-button.cjs");

package/dist/cjs/components/text-field/daikin-text-field.d.cts

@@ -1,5 +1,5 @@
 import { PropertyValues, TemplateResult } from 'lit';
-import { DDSFormElement } from "../../base/dds-form-element.cjs";
+import { DDSFormElement } from "../../base/index.cjs";
 import { DaikinInputGroup } from "../input-group/index.cjs";
 /**
  * The text field component is a UI element that allows users to input single-line text data.

package/dist/cjs/components/text-masked-field/daikin-text-masked-field.cjs

@@ -7,9 +7,9 @@ const decorators_js = require("lit/decorators.js");
 const ifDefined_js = require("lit/directives/if-defined.js");
 const ref_js = require("lit/directives/ref.js");
 require("../../base/dds-element.cjs");
+const ddsFormElement = require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
-const ddsFormElement = require("../../base/dds-form-element.cjs");
 const tailwind = require("../../tailwind.css.cjs");
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;

package/dist/cjs/components/text-masked-field/daikin-text-masked-field.d.cts

@@ -1,6 +1,6 @@
 import { InputMask, FactoryOpts } from 'imask';
 import { PropertyValues, TemplateResult } from 'lit';
-import { DDSFormElement } from "../../base/dds-form-element.cjs";
+import { DDSFormElement } from "../../base/index.cjs";
 import { DaikinInputGroup } from "../input-group/index.cjs";
 export type { FactoryOpts, InputMask };
 /**

package/dist/cjs/components/time-picker/daikin-time-picker.cjs

@@ -5,16 +5,19 @@ const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ifDefined_js = require("lit/directives/if-defined.js");
 const ref_js = require("lit/directives/ref.js");
+require("../../base/dds-element.cjs");
 const ddsFormElement = require("../../base/dds-form-element.cjs");
+const decorators = require("../../base/decorators.cjs");
+require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");
 require("../dropdown-item/daikin-dropdown-item.cjs");
 require("../dropdown/daikin-dropdown.cjs");
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
+var __decorateClass = (decorators2, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
+  for (var i = decorators2.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators2[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result) __defProp(target, key, result);
   return result;
@@ -563,7 +566,7 @@ __decorateClass([
   decorators_js.state()
 ], exports.DaikinTimePicker.prototype, "_meridiem", 2);
 exports.DaikinTimePicker = __decorateClass([
-  decorators_js.customElement("daikin-time-picker")
+  decorators.ddsElement("daikin-time-picker")
 ], exports.DaikinTimePicker);
 exports.calcDigitInput = calcDigitInput;
 exports.formatPartsForUI = formatPartsForUI;

package/dist/cjs/components/time-picker/daikin-time-picker.d.cts

@@ -1,5 +1,5 @@
 import { PropertyValues } from 'lit';
-import { DDSFormElement } from "../../base/dds-form-element.cjs";
+import { DDSFormElement } from "../../base/index.cjs";
 import { default as DaikinInputGroup } from "../input-group/daikin-input-group.cjs";
 /**
  * Represents the hour and minute parts of a time value.

package/dist/cjs/components/toast-notification/daikin-toast-notification.cjs

@@ -3,6 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/toast-notification-manager/daikin-toast-notification-manager.cjs

@@ -5,6 +5,7 @@ const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ref_js = require("lit/directives/ref.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/toggle/daikin-toggle.cjs

@@ -4,9 +4,9 @@ const classVarianceAuthority = require("class-variance-authority");
 const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 require("../../base/dds-element.cjs");
+const ddsFormElement = require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
-const ddsFormElement = require("../../base/dds-form-element.cjs");
 const tailwind = require("../../tailwind.css.cjs");
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;

package/dist/cjs/components/toggle/daikin-toggle.d.cts

@@ -1,5 +1,5 @@
 import { PropertyValues } from 'lit';
-import { DDSFormElement } from "../../base/dds-form-element.cjs";
+import { DDSFormElement } from "../../base/index.cjs";
 /**
  * The toggle switch component is a UI element that allows users to switch between two states, typically "on" and "off".
  * It functions similarly to a `daikin-checkbox` component but provides a more visually intuitive way to represent binary options.

package/dist/cjs/components/tooltip/daikin-tooltip.cjs

@@ -6,6 +6,7 @@ const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const guard_js = require("lit/directives/guard.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const floatingUiAutoUpdate = require("../../controllers/floating-ui-auto-update.cjs");
@@ -212,4 +213,3 @@ __decorateClass([
 exports.DaikinTooltip = __decorateClass([
   decorators.ddsElement("daikin-tooltip")
 ], exports.DaikinTooltip);
-exports.DaikinTooltip.registerCSSCustomProperties();

package/dist/cjs/components/tree/daikin-tree.cjs

@@ -3,6 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/tree-item/daikin-tree-item.cjs

@@ -6,6 +6,7 @@ const decorators_js = require("lit/decorators.js");
 const ifDefined_js = require("lit/directives/if-defined.js");
 const ref_js = require("lit/directives/ref.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs/components/tree-section/daikin-tree-section.cjs

@@ -5,6 +5,7 @@ const decorators_js = require("lit/decorators.js");
 const ifDefined_js = require("lit/directives/if-defined.js");
 const ref_js = require("lit/directives/ref.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs-dev/base/dds-element.cjs

@@ -3,6 +3,6 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const lit = require("lit");
 const _DDSElement = class _DDSElement extends lit.LitElement {
 };
-_DDSElement.version = "1.3.0";
+_DDSElement.version = "1.3.2";
 let DDSElement = _DDSElement;
 exports.DDSElement = DDSElement;

package/dist/cjs-dev/base/define.cjs

@@ -3,6 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const ddsElement = require("./dds-element.cjs");
 const currentVersion = ddsElement.DDSElement.version;
 function defineDDSElement(ctor, name) {
+  var _a;
   const existing = customElements.get(name);
   if (existing) {
     const existingVersion = existing.version ?? "unknown version";
@@ -13,6 +14,7 @@ function defineDDSElement(ctor, name) {
     }
     return;
   }
+  (_a = ctor.registerCSSCustomProperties) == null ? void 0 : _a.call(ctor);
   customElements.define(name, ctor);
 }
 exports.defineDDSElement = defineDDSElement;

package/dist/cjs-dev/base/index.cjs

@@ -1,8 +1,11 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const ddsElement = require("./dds-element.cjs");
+const ddsFormElement = require("./dds-form-element.cjs");
 const decorators = require("./decorators.cjs");
 const define = require("./define.cjs");
 exports.DDSElement = ddsElement.DDSElement;
+exports.DDSFormElement = ddsFormElement.DDSFormElement;
+exports.DDSFormSubmitElement = ddsFormElement.DDSFormSubmitElement;
 exports.ddsElement = decorators.ddsElement;
 exports.defineDDSElement = define.defineDDSElement;

package/dist/cjs-dev/base/index.d.cts

@@ -1,3 +1,4 @@
 export * from "./dds-element.cjs";
+export * from "./dds-form-element.cjs";
 export * from "./decorators.cjs";
 export * from "./define.cjs";

package/dist/cjs-dev/components/accordion/daikin-accordion.cjs

@@ -3,6 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs-dev/components/accordion-item/daikin-accordion-item.cjs

@@ -5,6 +5,7 @@ const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ref_js = require("lit/directives/ref.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs-dev/components/avatar/daikin-avatar.cjs

@@ -4,13 +4,17 @@ const classVarianceAuthority = require("class-variance-authority");
 const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ifDefined_js = require("lit/directives/if-defined.js");
+const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
+const decorators = require("../../base/decorators.cjs");
+require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
+var __decorateClass = (decorators2, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
+  for (var i = decorators2.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators2[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result) __defProp(target, key, result);
   return result;
@@ -59,7 +63,7 @@ const cvaWrapper = classVarianceAuthority.cva(
     }
   }
 );
-exports.DaikinAvatar = class DaikinAvatar extends lit.LitElement {
+exports.DaikinAvatar = class DaikinAvatar extends ddsElement.DDSElement {
   constructor() {
     super();
     this.type = "icon";
@@ -157,5 +161,5 @@ __decorateClass([
   decorators_js.query("a,button")
 ], exports.DaikinAvatar.prototype, "_focusableElement", 2);
 exports.DaikinAvatar = __decorateClass([
-  decorators_js.customElement("daikin-avatar")
+  decorators.ddsElement("daikin-avatar")
 ], exports.DaikinAvatar);

package/dist/cjs-dev/components/avatar/daikin-avatar.d.cts

@@ -1,4 +1,4 @@
-import { LitElement } from 'lit';
+import { DDSElement } from "../../base/index.cjs";
 import { MergeVariantProps } from "../../type-utils.cjs";
 declare const cvaWrapper: (props?: ({
     type?: "button" | "icon" | "link" | null | undefined;
@@ -19,7 +19,7 @@ type AvatarVariantProps = MergeVariantProps<typeof cvaWrapper>;
  * <daikin-avatar></daikin-avatar>
  * ```
  */
-export declare class DaikinAvatar extends LitElement {
+export declare class DaikinAvatar extends DDSElement {
     static readonly styles: import('lit').CSSResult;
     /**
      * Replace the wrapping element.

package/dist/cjs-dev/components/breadcrumb/daikin-breadcrumb.cjs

@@ -3,6 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs-dev/components/breadcrumb-item/daikin-breadcrumb-item.cjs

@@ -4,6 +4,7 @@ const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ifDefined_js = require("lit/directives/if-defined.js");
 const ddsElement = require("../../base/dds-element.cjs");
+require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
 const tailwind = require("../../tailwind.css.cjs");

package/dist/cjs-dev/components/button/daikin-button.cjs

@@ -5,9 +5,9 @@ const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
 const ifDefined_js = require("lit/directives/if-defined.js");
 require("../../base/dds-element.cjs");
+const ddsFormElement = require("../../base/dds-form-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
-const ddsFormElement = require("../../base/dds-form-element.cjs");
 const tailwind = require("../../tailwind.css.cjs");
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;