@vonage/vivid 4.14.0 → 4.14.1

package/shared/definition16.cjs

@@ -4,7 +4,7 @@ const definition$1 = require('./definition27.cjs');
 const definition = require('./definition63.cjs');
 const definition$2 = require('./definition35.cjs');
 const textField = require('./text-field.cjs');
-const defineVividComponent = require('./defineVividComponent.cjs');
+const vividElement = require('./vivid-element.cjs');
 const listbox = require('./listbox.cjs');
 const formAssociated = require('./form-associated.cjs');
 const affix = require('./affix.cjs');
@@ -114,7 +114,7 @@ let Combobox = class extends FormAssociatedCombobox {
       this.ariaControls = this.listboxId;
       this.ariaExpanded = "true";
       this.focusAndScrollOptionIntoView();
-      defineVividComponent.DOM.queueUpdate(() => this.focus());
+      vividElement.DOM.queueUpdate(() => this.focus());
       return;
     }
     this.ariaControls = "";
@@ -128,12 +128,12 @@ let Combobox = class extends FormAssociatedCombobox {
    * Overrides `Listbox.options`.
    */
   get options() {
-    defineVividComponent.Observable.track(this, "options");
+    vividElement.Observable.track(this, "options");
     return this.filteredOptions.length ? this.filteredOptions : this._options;
   }
   set options(value) {
     this._options = value;
-    defineVividComponent.Observable.notify(this, "options");
+    vividElement.Observable.notify(this, "options");
   }
   /**
    * Updates the placeholder on the proxy element.
@@ -150,7 +150,7 @@ let Combobox = class extends FormAssociatedCombobox {
    * @public
    */
   get value() {
-    defineVividComponent.Observable.track(this, "value");
+    vividElement.Observable.track(this, "value");
     return this._value;
   }
   set value(next) {
@@ -167,7 +167,7 @@ let Combobox = class extends FormAssociatedCombobox {
     if (prev !== next) {
       this._value = next;
       super.valueChanged(prev, next);
-      defineVividComponent.Observable.notify(this, "value");
+      vividElement.Observable.notify(this, "value");
     }
   }
   /**
@@ -504,26 +504,26 @@ let Combobox = class extends FormAssociatedCombobox {
   }
 };
 __decorateClass([
-  defineVividComponent.attr({ attribute: "autocomplete", mode: "fromView" })
+  vividElement.attr({ attribute: "autocomplete", mode: "fromView" })
 ], Combobox.prototype, "autocomplete", 2);
 __decorateClass([
-  defineVividComponent.attr
+  vividElement.attr
 ], Combobox.prototype, "appearance", 2);
 __decorateClass([
-  defineVividComponent.attr
+  vividElement.attr
 ], Combobox.prototype, "placement", 2);
 __decorateClass([
-  defineVividComponent.attr({ mode: "boolean", attribute: "fixed-dropdown" })
+  vividElement.attr({ mode: "boolean", attribute: "fixed-dropdown" })
 ], Combobox.prototype, "fixedDropdown", 2);
 __decorateClass([
-  defineVividComponent.observable
+  vividElement.observable
 ], Combobox.prototype, "maxHeight", 2);
 __decorateClass([
-  defineVividComponent.attr({ attribute: "open", mode: "boolean" })
+  vividElement.attr({ attribute: "open", mode: "boolean" })
 ], Combobox.prototype, "open", 2);
 // @ts-expect-error Type is incorrectly non-optional
 __decorateClass([
-  defineVividComponent.attr
+  vividElement.attr
 ], Combobox.prototype, "placeholder", 2);
 Combobox = __decorateClass([
   formElements.formElements
@@ -531,7 +531,7 @@ Combobox = __decorateClass([
 applyMixins.applyMixins(Combobox, affix.AffixIcon);
 
 function renderLabel() {
-  return defineVividComponent.html` <label for="control" class="label">
+  return vividElement.html` <label for="control" class="label">
 		${(x) => x.label}
 	</label>`;
 }
@@ -554,14 +554,15 @@ function setFixedDropdownVarWidth(x) {
 }
 function renderInput(context) {
   const affixIconTemplate = affix.affixIconTemplateFactory(context);
-  return defineVividComponent.html` <div class="${getStateClasses}" ${ref.ref("_anchor")}>
+  return vividElement.html` <div class="${getStateClasses}" ${ref.ref("_anchor")}>
 		${when.when((x) => x.label, renderLabel())}
 		<div class="fieldset">
 			<input
 				id="control"
+				autocomplete="off"
 				class="control"
 				aria-activedescendant="${(x) => x.open ? x.ariaActiveDescendant : null}"
-				aria-autocomplete="${(x) => x.ariaAutoComplete}"
+				aria-autocomplete="${(x) => x.autocomplete}"
 				aria-controls="${(x) => x.listboxId}"
 				aria-disabled="${(x) => x.ariaDisabled}"
 				aria-expanded="${(x) => x.open}"
@@ -580,7 +581,7 @@ function renderInput(context) {
 }
 const comboboxTemplate = (context) => {
   const popupTag = context.tagFor(definition.Popup);
-  return defineVividComponent.html`
+  return vividElement.html`
         <template
             aria-disabled="${(x) => x.ariaDisabled}"
             autocomplete="${(x) => x.autocomplete}"
@@ -616,7 +617,7 @@ const comboboxTemplate = (context) => {
 		`;
 };
 
-const comboboxDefinition = defineVividComponent.defineVividComponent(
+const comboboxDefinition = vividElement.defineVividComponent(
   "combobox",
   Combobox,
   comboboxTemplate,
@@ -628,7 +629,7 @@ const comboboxDefinition = defineVividComponent.defineVividComponent(
     }
   }
 );
-const registerCombobox = defineVividComponent.createRegisterFunction(comboboxDefinition);
+const registerCombobox = vividElement.createRegisterFunction(comboboxDefinition);
 
 exports.comboboxDefinition = comboboxDefinition;
 exports.registerCombobox = registerCombobox;

package/shared/definition16.js

@@ -2,7 +2,7 @@ import { i as iconDefinition } from './definition27.js';
 import { P as Popup, p as popupDefinition } from './definition63.js';
 import { l as listboxOptionDefinition } from './definition35.js';
 import { s as styles$1 } from './text-field.js';
-import { D as DOM, O as Observable, a as attr, o as observable, h as html, d as defineVividComponent, f as createRegisterFunction } from './defineVividComponent.js';
+import { D as DOM, O as Observable, a as attr, o as observable, h as html, d as defineVividComponent, f as createRegisterFunction } from './vivid-element.js';
 import { L as Listbox } from './listbox.js';
 import { F as FormAssociated } from './form-associated.js';
 import { A as AffixIcon, a as affixIconTemplateFactory } from './affix.js';
@@ -557,9 +557,10 @@ function renderInput(context) {
 		<div class="fieldset">
 			<input
 				id="control"
+				autocomplete="off"
 				class="control"
 				aria-activedescendant="${(x) => x.open ? x.ariaActiveDescendant : null}"
-				aria-autocomplete="${(x) => x.ariaAutoComplete}"
+				aria-autocomplete="${(x) => x.autocomplete}"
 				aria-controls="${(x) => x.listboxId}"
 				aria-disabled="${(x) => x.ariaDisabled}"
 				aria-expanded="${(x) => x.open}"

package/shared/definition17.cjs

@@ -1,7 +1,6 @@
 'use strict';
 
 const definition = require('./definition27.cjs');
-const defineVividComponent = require('./defineVividComponent.cjs');
 const vividElement = require('./vivid-element.cjs');
 const keyCodes = require('./key-codes.cjs');
 const repeat = require('./repeat.cjs');
@@ -124,7 +123,7 @@ const _DataGrid = class _DataGrid extends vividElement.VividElement {
     this.queueRowIndexUpdate = () => {
       if (!this.rowindexUpdateQueued) {
         this.rowindexUpdateQueued = true;
-        defineVividComponent.DOM.queueUpdate(this.updateRowIndexes);
+        vividElement.DOM.queueUpdate(this.updateRowIndexes);
       }
     };
     this.updateRowIndexes = () => {
@@ -376,8 +375,8 @@ const _DataGrid = class _DataGrid extends vividElement.VividElement {
     this.addEventListener(eventFocusOut, this.handleFocusOut);
     this.observer = new MutationObserver(this.onChildListChange);
     this.observer.observe(this, { childList: true });
-    defineVividComponent.DOM.queueUpdate(this.queueRowIndexUpdate);
-    defineVividComponent.Observable.getNotifier(this).subscribe(
+    vividElement.DOM.queueUpdate(this.queueRowIndexUpdate);
+    vividElement.Observable.getNotifier(this).subscribe(
       this.#changeHandler,
       "columnDefinitions"
     );
@@ -397,7 +396,7 @@ const _DataGrid = class _DataGrid extends vividElement.VividElement {
     this.observer.disconnect();
     this.rowsPlaceholder = null;
     this.generatedHeader = null;
-    defineVividComponent.Observable.getNotifier(this).unsubscribe(
+    vividElement.Observable.getNotifier(this).unsubscribe(
       this.#changeHandler,
       "columnDefinitions"
     );
@@ -515,7 +514,7 @@ const _DataGrid = class _DataGrid extends vividElement.VividElement {
     }
     if (this.pendingFocusUpdate === false) {
       this.pendingFocusUpdate = true;
-      defineVividComponent.DOM.queueUpdate(() => this.updateFocus());
+      vividElement.DOM.queueUpdate(() => this.updateFocus());
     }
   }
   updateFocus() {
@@ -568,7 +567,7 @@ const _DataGrid = class _DataGrid extends vividElement.VividElement {
   }
   selectionModeChanged(oldValue) {
     if (oldValue === void 0) {
-      defineVividComponent.DOM.queueUpdate(this.#initSelections);
+      vividElement.DOM.queueUpdate(this.#initSelections);
       return;
     }
     this.#resetSelection();
@@ -591,50 +590,50 @@ const _DataGrid = class _DataGrid extends vividElement.VividElement {
   }
 };
 __decorateClass$2([
-  defineVividComponent.attr({ attribute: "no-tabbing", mode: "boolean" })
+  vividElement.attr({ attribute: "no-tabbing", mode: "boolean" })
 ], _DataGrid.prototype, "noTabbing");
 __decorateClass$2([
-  defineVividComponent.attr({ attribute: "generate-header" })
+  vividElement.attr({ attribute: "generate-header" })
 ], _DataGrid.prototype, "generateHeader");
 // @ts-expect-error Type is incorrectly non-optional
 __decorateClass$2([
-  defineVividComponent.attr({ attribute: "grid-template-columns" })
+  vividElement.attr({ attribute: "grid-template-columns" })
 ], _DataGrid.prototype, "gridTemplateColumns");
 __decorateClass$2([
-  defineVividComponent.observable
+  vividElement.observable
 ], _DataGrid.prototype, "rowsData");
 __decorateClass$2([
-  defineVividComponent.observable
+  vividElement.observable
 ], _DataGrid.prototype, "columnDefinitions");
 __decorateClass$2([
-  defineVividComponent.observable
+  vividElement.observable
 ], _DataGrid.prototype, "rowItemTemplate");
 __decorateClass$2([
-  defineVividComponent.observable
+  vividElement.observable
 ], _DataGrid.prototype, "cellItemTemplate");
 __decorateClass$2([
-  defineVividComponent.observable
+  vividElement.observable
 ], _DataGrid.prototype, "headerCellItemTemplate");
 __decorateClass$2([
-  defineVividComponent.observable
+  vividElement.observable
 ], _DataGrid.prototype, "focusRowIndex");
 __decorateClass$2([
-  defineVividComponent.observable
+  vividElement.observable
 ], _DataGrid.prototype, "focusColumnIndex");
 __decorateClass$2([
-  defineVividComponent.observable
+  vividElement.observable
 ], _DataGrid.prototype, "defaultRowItemTemplate");
 __decorateClass$2([
-  defineVividComponent.observable
+  vividElement.observable
 ], _DataGrid.prototype, "rowElementTag");
 __decorateClass$2([
-  defineVividComponent.observable
+  vividElement.observable
 ], _DataGrid.prototype, "rowElements");
 __decorateClass$2([
-  defineVividComponent.observable
+  vividElement.observable
 ], _DataGrid.prototype, "slottedRowElements");
 __decorateClass$2([
-  defineVividComponent.attr({ attribute: "selection-mode" })
+  vividElement.attr({ attribute: "selection-mode" })
 ], _DataGrid.prototype, "selectionMode");
 let DataGrid = _DataGrid;
 
@@ -774,45 +773,45 @@ class DataGridRow extends vividElement.VividElement {
 }
 // @ts-expect-error Type is incorrectly non-optional
 __decorateClass$1([
-  defineVividComponent.attr({ attribute: "grid-template-columns" })
+  vividElement.attr({ attribute: "grid-template-columns" })
 ], DataGridRow.prototype, "gridTemplateColumns");
 __decorateClass$1([
-  defineVividComponent.attr({ attribute: "row-type" })
+  vividElement.attr({ attribute: "row-type" })
 ], DataGridRow.prototype, "rowType");
 __decorateClass$1([
-  defineVividComponent.observable
+  vividElement.observable
 ], DataGridRow.prototype, "rowData");
 __decorateClass$1([
-  defineVividComponent.observable
+  vividElement.observable
 ], DataGridRow.prototype, "columnDefinitions");
 __decorateClass$1([
-  defineVividComponent.observable
+  vividElement.observable
 ], DataGridRow.prototype, "cellItemTemplate");
 __decorateClass$1([
-  defineVividComponent.observable
+  vividElement.observable
 ], DataGridRow.prototype, "headerCellItemTemplate");
 __decorateClass$1([
-  defineVividComponent.observable
+  vividElement.observable
 ], DataGridRow.prototype, "rowIndex");
 __decorateClass$1([
-  defineVividComponent.observable
+  vividElement.observable
 ], DataGridRow.prototype, "activeCellItemTemplate");
 __decorateClass$1([
-  defineVividComponent.observable
+  vividElement.observable
 ], DataGridRow.prototype, "defaultCellItemTemplate");
 __decorateClass$1([
-  defineVividComponent.observable
+  vividElement.observable
 ], DataGridRow.prototype, "defaultHeaderCellItemTemplate");
 __decorateClass$1([
-  defineVividComponent.observable
+  vividElement.observable
 ], DataGridRow.prototype, "cellElements");
 __decorateClass$1([
-  defineVividComponent.attr({ attribute: "aria-selected" })
+  vividElement.attr({ attribute: "aria-selected" })
 ], DataGridRow.prototype, "ariaSelected");
 
 function createRowItemTemplate(context) {
   const rowTag = context.tagFor(DataGridRow);
-  return defineVividComponent.html`
+  return vividElement.html`
     <${rowTag}
         :rowData="${(x) => x}"
         :cellItemTemplate="${(_, c) => c.parent.cellItemTemplate}"
@@ -840,7 +839,7 @@ function handleColumnSort(_, { event }) {
 const DataGridTemplate = (context) => {
   const rowItemTemplate = createRowItemTemplate(context);
   const rowTag = context.tagFor(DataGridRow);
-  return defineVividComponent.html`
+  return vividElement.html`
 		<template
 			aria-multiselectable="${getMultiSelectAriaState}"
 			role="grid"
@@ -870,12 +869,12 @@ var __decorateClass = (decorators, target, key, kind) => {
   if (result) __defProp(target, key, result);
   return result;
 };
-const defaultCellContentsTemplate = defineVividComponent.html`
+const defaultCellContentsTemplate = vividElement.html`
 	<template>
 		${(x) => x.rowData === null || x.columnDefinition === null || x.columnDefinition.columnDataKey === null ? null : x.rowData[x.columnDefinition.columnDataKey]}
 	</template>
 `;
-const defaultHeaderCellContentsTemplate = defineVividComponent.html`
+const defaultHeaderCellContentsTemplate = vividElement.html`
 	<template>
 		${(x) => x.columnDefinition.title === void 0 ? x.columnDefinition.columnDataKey : x.columnDefinition.title}
 	</template>
@@ -1092,27 +1091,27 @@ class DataGridCell extends vividElement.VividElement {
   }
 }
 __decorateClass([
-  defineVividComponent.attr({ attribute: "cell-type" })
+  vividElement.attr({ attribute: "cell-type" })
 ], DataGridCell.prototype, "cellType");
 __decorateClass([
-  defineVividComponent.attr({ attribute: "grid-column" })
+  vividElement.attr({ attribute: "grid-column" })
 ], DataGridCell.prototype, "gridColumn");
 __decorateClass([
-  defineVividComponent.observable
+  vividElement.observable
 ], DataGridCell.prototype, "rowData");
 __decorateClass([
-  defineVividComponent.observable
+  vividElement.observable
 ], DataGridCell.prototype, "columnDefinition");
 __decorateClass([
-  defineVividComponent.attr({ attribute: "aria-selected", mode: "fromView" })
+  vividElement.attr({ attribute: "aria-selected", mode: "fromView" })
 ], DataGridCell.prototype, "ariaSelected");
 __decorateClass([
-  defineVividComponent.attr({ attribute: "aria-sort" })
+  vividElement.attr({ attribute: "aria-sort" })
 ], DataGridCell.prototype, "ariaSort");
 
 function createCellItemTemplate(context) {
   const cellTag = context.tagFor(DataGridCell);
-  return defineVividComponent.html`
+  return vividElement.html`
     <${cellTag}
         cell-type="${(x) => x.isRowHeader ? "rowheader" : void 0}"
         grid-column="${(_, c) => c.index + 1}"
@@ -1124,7 +1123,7 @@ function createCellItemTemplate(context) {
 }
 function createHeaderCellItemTemplate(context) {
   const cellTag = context.tagFor(DataGridCell);
-  return defineVividComponent.html`
+  return vividElement.html`
     <${cellTag}
         cell-type="columnheader"
         grid-column="${(_, c) => c.index + 1}"
@@ -1135,7 +1134,7 @@ function createHeaderCellItemTemplate(context) {
 const DataGridRowTemplate = (context) => {
   const cellItemTemplate = createCellItemTemplate(context);
   const headerCellItemTemplate = createHeaderCellItemTemplate(context);
-  return defineVividComponent.html`
+  return vividElement.html`
 		<template
 			role="row"
 			class="${(x) => x.rowType !== "default" ? x.rowType : ""}"
@@ -1169,10 +1168,10 @@ function getSortIcon(x) {
 }
 function renderSortIcons(c) {
   const iconTag = c.tagFor(definition.Icon);
-  return defineVividComponent.html`
+  return vividElement.html`
 		${when.when(
     shouldShowSortIcons,
-    defineVividComponent.html`
+    vividElement.html`
 				<${iconTag} class="header-icon" name="${getSortIcon}"></${iconTag}>
 			`
   )}
@@ -1185,7 +1184,7 @@ function handleKeyDown(x, e) {
   return true;
 }
 const DataGridCellTemplate = (context) => {
-  return defineVividComponent.html`
+  return vividElement.html`
 		<template
 			tabindex="-1"
 			role="${(x) => DataGridCellRole[x.cellType] ?? DataGridCellRole.default}"
@@ -1200,7 +1199,7 @@ const DataGridCellTemplate = (context) => {
 	`;
 };
 
-const dataGridCellDefinition = defineVividComponent.defineVividComponent(
+const dataGridCellDefinition = vividElement.defineVividComponent(
   "data-grid-cell",
   DataGridCell,
   DataGridCellTemplate,
@@ -1209,7 +1208,7 @@ const dataGridCellDefinition = defineVividComponent.defineVividComponent(
     styles: dataGridCellStyles
   }
 );
-const dataGridRowDefinition = defineVividComponent.defineVividComponent(
+const dataGridRowDefinition = vividElement.defineVividComponent(
   "data-grid-row",
   DataGridRow,
   DataGridRowTemplate,
@@ -1218,7 +1217,7 @@ const dataGridRowDefinition = defineVividComponent.defineVividComponent(
     styles: dataGridRowStyles
   }
 );
-const dataGridDefinition = defineVividComponent.defineVividComponent(
+const dataGridDefinition = vividElement.defineVividComponent(
   "data-grid",
   DataGrid,
   DataGridTemplate,
@@ -1227,7 +1226,7 @@ const dataGridDefinition = defineVividComponent.defineVividComponent(
     styles: dataGridStyles
   }
 );
-const registerDataGrid = defineVividComponent.createRegisterFunction(dataGridDefinition);
+const registerDataGrid = vividElement.createRegisterFunction(dataGridDefinition);
 
 exports.dataGridCellDefinition = dataGridCellDefinition;
 exports.dataGridDefinition = dataGridDefinition;

package/shared/definition17.js

@@ -1,6 +1,5 @@
 import { I as Icon, i as iconDefinition } from './definition27.js';
-import { a as attr, o as observable, D as DOM, O as Observable, h as html, d as defineVividComponent, f as createRegisterFunction } from './defineVividComponent.js';
-import { V as VividElement } from './vivid-element.js';
+import { a as attr, o as observable, V as VividElement, D as DOM, O as Observable, h as html, d as defineVividComponent, f as createRegisterFunction } from './vivid-element.js';
 import { d as keyEnd, g as keyHome, j as keyPageDown, l as keyPageUp, f as keyArrowDown, e as keyArrowUp, i as keyArrowRight, h as keyArrowLeft, b as keyEscape, m as keyFunction2, k as keyEnter, a as keySpace } from './key-codes.js';
 import { R as RepeatDirective } from './repeat.js';
 import { s as slotted, e as elements } from './slotted.js';

package/shared/definition18.cjs

@@ -5,7 +5,7 @@ const definition = require('./definition11.cjs');
 const definition$2 = require('./definition55.cjs');
 const definition$3 = require('./definition22.cjs');
 const presentationDate = require('./presentationDate.cjs');
-const defineVividComponent = require('./defineVividComponent.cjs');
+const vividElement = require('./vivid-element.cjs');
 const formElements = require('./form-elements.cjs');
 
 var __defProp = Object.defineProperty;
@@ -156,14 +156,14 @@ updateValueDueToUserInteraction_fn = function(newValue) {
   this.$emit("input");
 };
 __decorateClass([
-  defineVividComponent.volatile
+  vividElement.volatile
 ], DatePicker.prototype, "_calendarButtonLabel", 1);
 DatePicker = __decorateClass([
   formElements.errorText,
   formElements.formElements
 ], DatePicker);
 
-const datePickerDefinition = defineVividComponent.defineVividComponent(
+const datePickerDefinition = vividElement.defineVividComponent(
   "date-picker",
   DatePicker,
   presentationDate.DatePickerBaseTemplate,
@@ -175,7 +175,7 @@ const datePickerDefinition = defineVividComponent.defineVividComponent(
     }
   }
 );
-const registerDatePicker = defineVividComponent.createRegisterFunction(datePickerDefinition);
+const registerDatePicker = vividElement.createRegisterFunction(datePickerDefinition);
 
 exports.datePickerDefinition = datePickerDefinition;
 exports.registerDatePicker = registerDatePicker;

package/shared/definition18.js

@@ -3,7 +3,7 @@ import { b as buttonDefinition } from './definition11.js';
 import { t as textFieldDefinition } from './definition55.js';
 import { d as dividerDefinition } from './definition22.js';
 import { D as DatePickerBase, i as isValidDateStr, f as formatPresentationDate, p as parsePresentationDate, s as styles, a as DatePickerBaseTemplate } from './presentationDate.js';
-import { v as volatile, d as defineVividComponent, f as createRegisterFunction } from './defineVividComponent.js';
+import { v as volatile, d as defineVividComponent, f as createRegisterFunction } from './vivid-element.js';
 import { e as errorText, f as formElements } from './form-elements.js';
 
 var __defProp = Object.defineProperty;

package/shared/definition19.cjs

@@ -5,7 +5,7 @@ const definition$1 = require('./definition63.cjs');
 const definition$2 = require('./definition55.cjs');
 const definition$3 = require('./definition22.cjs');
 const presentationDate = require('./presentationDate.cjs');
-const defineVividComponent = require('./defineVividComponent.cjs');
+const vividElement = require('./vivid-element.cjs');
 const formElements = require('./form-elements.cjs');
 
 const formatRange = (from, to) => {
@@ -382,38 +382,38 @@ getVisibleRange_fn = function() {
   return { start, end };
 };
 __decorateClass([
-  defineVividComponent.attr({ mode: "fromView", attribute: "start" })
+  vividElement.attr({ mode: "fromView", attribute: "start" })
 ], DateRangePicker.prototype, "initialStart", 2);
 __decorateClass([
-  defineVividComponent.attr({ mode: "fromView", attribute: "end" })
+  vividElement.attr({ mode: "fromView", attribute: "end" })
 ], DateRangePicker.prototype, "initialEnd", 2);
 __decorateClass([
-  defineVividComponent.observable
+  vividElement.observable
 ], DateRangePicker.prototype, "start", 2);
 __decorateClass([
-  defineVividComponent.observable
+  vividElement.observable
 ], DateRangePicker.prototype, "end", 2);
 __decorateClass([
-  defineVividComponent.attr({ attribute: "current-start" })
+  vividElement.attr({ attribute: "current-start" })
 ], DateRangePicker.prototype, "currentStart", 2);
 __decorateClass([
-  defineVividComponent.attr({ attribute: "current-end" })
+  vividElement.attr({ attribute: "current-end" })
 ], DateRangePicker.prototype, "currentEnd", 2);
 __decorateClass([
-  defineVividComponent.observable
+  vividElement.observable
 ], DateRangePicker.prototype, "_numCalendars", 2);
 __decorateClass([
-  defineVividComponent.observable
+  vividElement.observable
 ], DateRangePicker.prototype, "_hoverDate", 2);
 __decorateClass([
-  defineVividComponent.volatile
+  vividElement.volatile
 ], DateRangePicker.prototype, "_calendarButtonLabel", 1);
 DateRangePicker = __decorateClass([
   formElements.errorText,
   formElements.formElements
 ], DateRangePicker);
 
-const dateRangePickerDefinition = defineVividComponent.defineVividComponent(
+const dateRangePickerDefinition = vividElement.defineVividComponent(
   "date-range-picker",
   DateRangePicker,
   presentationDate.DatePickerBaseTemplate,
@@ -425,7 +425,7 @@ const dateRangePickerDefinition = defineVividComponent.defineVividComponent(
     }
   }
 );
-const registerDateRangePicker = defineVividComponent.createRegisterFunction(
+const registerDateRangePicker = vividElement.createRegisterFunction(
   dateRangePickerDefinition
 );
 

package/shared/definition19.js

@@ -3,7 +3,7 @@ import { p as popupDefinition } from './definition63.js';
 import { t as textFieldDefinition } from './definition55.js';
 import { d as dividerDefinition } from './definition22.js';
 import { f as formatPresentationDate, p as parsePresentationDate, D as DatePickerBase, i as isValidDateStr, c as compareDateStr, s as styles, a as DatePickerBaseTemplate } from './presentationDate.js';
-import { a as attr, o as observable, v as volatile, d as defineVividComponent, f as createRegisterFunction } from './defineVividComponent.js';
+import { a as attr, o as observable, v as volatile, d as defineVividComponent, f as createRegisterFunction } from './vivid-element.js';
 import { e as errorText, f as formElements } from './form-elements.js';
 
 const formatRange = (from, to) => {

package/shared/definition2.cjs

@@ -1,8 +1,7 @@
 'use strict';
 
-const defineVividComponent = require('./defineVividComponent.cjs');
-const definition = require('./definition.cjs');
 const vividElement = require('./vivid-element.cjs');
+const definition = require('./definition.cjs');
 const keyCodes = require('./key-codes.cjs');
 const numbers = require('./numbers.cjs');
 const slotted = require('./slotted.cjs');
@@ -173,21 +172,21 @@ class Accordion extends vividElement.VividElement {
   }
 }
 __decorateClass([
-  defineVividComponent.attr({ attribute: "expand-mode" })
+  vividElement.attr({ attribute: "expand-mode" })
 ], Accordion.prototype, "expandmode");
 // @ts-expect-error Type is incorrectly non-optional
 __decorateClass([
-  defineVividComponent.observable
+  vividElement.observable
 ], Accordion.prototype, "accordionItems");
 
 const getClasses = (_) => classNames.classNames("base");
-const AccordionTemplate = defineVividComponent.html`
+const AccordionTemplate = vividElement.html`
 	<div class="${getClasses}">
 		<slot ${slotted.slotted({ property: "accordionItems", filter: slotted.elements() })}></slot>
 	</div>
 `;
 
-const accordionDefinition = defineVividComponent.defineVividComponent(
+const accordionDefinition = vividElement.defineVividComponent(
   "accordion",
   Accordion,
   AccordionTemplate,
@@ -196,7 +195,7 @@ const accordionDefinition = defineVividComponent.defineVividComponent(
     styles
   }
 );
-const registerAccordion = defineVividComponent.createRegisterFunction(accordionDefinition);
+const registerAccordion = vividElement.createRegisterFunction(accordionDefinition);
 
 exports.accordionDefinition = accordionDefinition;
 exports.registerAccordion = registerAccordion;

package/shared/definition2.js

@@ -1,6 +1,5 @@
-import { a as attr, o as observable, h as html, d as defineVividComponent, f as createRegisterFunction } from './defineVividComponent.js';
+import { V as VividElement, a as attr, o as observable, h as html, d as defineVividComponent, f as createRegisterFunction } from './vivid-element.js';
 import { A as AccordionItem, a as accordionItemDefinition } from './definition.js';
-import { V as VividElement } from './vivid-element.js';
 import { d as keyEnd, g as keyHome, f as keyArrowDown, e as keyArrowUp } from './key-codes.js';
 import { w as wrapInBounds } from './numbers.js';
 import { s as slotted, e as elements } from './slotted.js';