vueless 0.0.459 → 0.0.460

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vueless",
-  "version": "0.0.459",
+  "version": "0.0.460",
   "license": "MIT",
   "description": "Vue Styleless UI Component Library, powered by Tailwind CSS.",
   "keywords": [

package/ui.button/UButton.vue

@@ -256,8 +256,6 @@ const { buttonAttrs, loaderAttrs, leftIconAttrs, rightIconAttrs, centerIconAttrs
 
 const buttonRef = ref(null);
 
-defineExpose({ buttonRef });
-
 const loaderSize = computed(() => {
   const sizes = {
     "2xs": "sm",
@@ -291,4 +289,12 @@ const iconColor = computed(() => {
 watchEffect(() => {
   props.loading && buttonRef.value.blur();
 });
+
+defineExpose({
+  /**
+   * A reference to the button element for direct DOM manipulation.
+   * @property {HTMLElement}
+   */
+  buttonRef,
+});
 </script>

package/ui.button-link/ULink.vue

@@ -272,8 +272,6 @@ const { route, isActive, isExactActive } = useLink({
 
 const wrapperRef = ref(null);
 
-defineExpose({ wrapperRef });
-
 const { wrapperAttrs, linkAttrs } = useAttrs(props, { isActive, isExactActive });
 
 const targetValue = computed(() => {
@@ -309,4 +307,12 @@ function onKeydown(event) {
 function onBlur(event) {
   emit("blur", event);
 }
+
+defineExpose({
+  /**
+   * A reference to the link wrapper element for direct DOM manipulation.
+   * @property {HTMLElement}
+   */
+  wrapperRef,
+});
 </script>

package/ui.data-table/UTable.vue

@@ -409,8 +409,6 @@ const emit = defineEmits([
   "update:rows",
 ]);
 
-defineExpose({ clearSelectedItems });
-
 const slots = useSlots();
 const { tm } = useLocale();
 
@@ -723,4 +721,12 @@ function onToggleRowVisibility(rowId) {
   // TODO: Use map instead of forEach to get rid of implicit array mutation.
   tableRows.value.forEach((row) => toggleRowVisibility(row, rowId));
 }
+
+defineExpose({
+  /**
+   * Allows to clear selected rows.
+   * @property {Function}
+   */
+  clearSelectedItems,
+});
 </script>

package/ui.dropdown-list/UDropdownList.vue

@@ -231,16 +231,6 @@ const {
 
 const { tm } = useLocale();
 
-defineExpose({
-  pointerSet,
-  pointerBackward,
-  pointerForward,
-  pointerReset,
-  addPointerElement,
-  optionsRef,
-  wrapperRef,
-});
-
 const i18nGlobal = tm(UDropdownList);
 const currentLocale = computed(() => merge(defaultConfig.i18n, i18nGlobal, props.config.i18n));
 
@@ -314,4 +304,48 @@ function onClickOption(rawOption) {
 
   emit("clickOption", option);
 }
+
+defineExpose({
+  /**
+   * Allows setting the pointer to a specific index.
+   * @property {Function}
+   */
+  pointerSet,
+
+  /**
+   * Moves the pointer to the previous option in the list.
+   * @property {Function}
+   */
+  pointerBackward,
+
+  /**
+   * Advances the pointer to the next option.
+   * @property {Function}
+   */
+  pointerForward,
+
+  /**
+   * Resets the pointer to the first option.
+   * @property {Function}
+   */
+  pointerReset,
+
+  /**
+   * Adds the current pointer element to the model value.
+   * @property {Function}
+   */
+  addPointerElement,
+
+  /**
+   * A reference to the list of elements representing the available options.
+   * @property {HTMLElement}
+   */
+  optionsRef,
+
+  /**
+   * A reference to the wrapper element containing the entire list of options.
+   * @property {HTMLElement}
+   */
+  wrapperRef,
+});
 </script>

package/ui.form-calendar/UCalendar.vue

@@ -339,8 +339,6 @@ const secondsRef = ref(null);
 const activeDate = ref(null);
 const activeMonth = ref(null);
 
-defineExpose({ wrapperRef });
-
 const currentView = ref(props.view);
 
 watch(
@@ -839,4 +837,12 @@ function onTimeInput(event, type, maxValue, minValue) {
 
   input.value = String(numericValue).padStart(2, "0");
 }
+
+defineExpose({
+  /**
+   * A reference to the calendar element for direct DOM manipulation.
+   * @property {HTMLElement}
+   */
+  wrapperRef,
+});
 </script>

package/ui.form-date-picker/UDatePicker.vue

@@ -312,12 +312,6 @@ const { isTop, isRight, adjustPositionY, adjustPositionX } = useAutoPosition(
   { x: "left", y: "bottom" },
 );
 
-defineExpose({
-  calendarRef,
-  userFormatDate,
-  formattedDate,
-});
-
 const localValue = computed({
   get: () => props.modelValue,
   set: (value) => emit("update:modelValue", value),
@@ -401,4 +395,24 @@ function onInput() {
     });
   });
 }
+
+defineExpose({
+  /**
+   * Reference to the UCalendar component instance.
+   * @property {HTMLElement}
+   */
+  calendarRef,
+
+  /**
+   * The user-friendly formatted date string displayed in the input.
+   * @property {String}
+   */
+  userFormatDate,
+
+  /**
+   * The internal formatted date string.
+   * @property {String}
+   */
+  formattedDate,
+});
 </script>

package/ui.form-input-money/UInputMoney.vue

@@ -264,8 +264,6 @@ watch(
   () => String(localValue.value) !== String(rawValue.value) && setValue(localValue.value),
 );
 
-defineExpose({ input, rawValue, formattedValue });
-
 onMounted(() => {
   setValue(localValue.value);
 });
@@ -283,4 +281,24 @@ function onBlur() {
 function onInput(value) {
   nextTick(() => emit("input", value));
 }
+
+defineExpose({
+  /**
+   * Reference to the underlying input element inside UInput.
+   * @property {HTMLInputElement}
+   */
+  input,
+
+  /**
+   * The raw, unformatted value of the input.
+   * @property {String | Number}
+   */
+  rawValue,
+
+  /**
+   * The formatted value displayed in the input.
+   * @property {String}
+   */
+  formattedValue,
+});
 </script>

package/ui.form-input-search/UInputSearch.vue

@@ -259,8 +259,6 @@ let updateValueWithDebounce = createDebounce((value) => {
 const localValue = ref("");
 const inputRef = ref(null);
 
-defineExpose({ inputRef });
-
 const elementId = props.id || useId();
 
 const { config, searchInputAttrs, searchIconAttrs, clearIconAttrs, searchButtonAttrs } =
@@ -326,4 +324,12 @@ function onClickClear() {
   emit("update:modelValue", "");
   emit("clear");
 }
+
+defineExpose({
+  /**
+   * A reference to the input element for direct DOM manipulation.
+   * @property {HTMLElement}
+   */
+  inputRef,
+});
 </script>

package/ui.form-label/ULabel.vue

@@ -190,5 +190,17 @@ function onClick(event) {
   emit("click", event);
 }
 
-defineExpose({ labelElement, wrapperElement });
+defineExpose({
+  /**
+   * Reference to the label element.
+   * @property {HTMLElement}
+   */
+  labelElement,
+
+  /**
+   * Reference to the wrapper element containing the label and content.
+   * @property {HTMLElement}
+   */
+  wrapperElement,
+});
 </script>

package/ui.form-select/USelect.vue

@@ -593,15 +593,6 @@ const labelComponentRef = ref(null);
 const leftSlotWrapperRef = ref(null);
 const innerWrapperRef = ref(null);
 
-defineExpose({
-  dropdownListRef,
-  wrapperRef,
-  searchInputRef,
-  labelComponentRef,
-  leftSlotWrapperRef,
-  innerWrapperRef,
-});
-
 const isTop = computed(() => {
   if (props.openDirection === DIRECTION.top) return true;
   if (props.openDirection === DIRECTION.bottom) return false;
@@ -878,4 +869,42 @@ function setLabelPosition() {
     labelComponentRef.value.labelElement.style.left = `${leftSlotWidth + innerWrapperPaddingLeft}px`;
   }
 }
+
+defineExpose({
+  /**
+   * A reference to the dropdown list element for direct DOM manipulation.
+   * @property {HTMLElement}
+   */
+  dropdownListRef,
+
+  /**
+   * A reference to the wrapper element for direct DOM manipulation.
+   * @property {HTMLElement}
+   */
+  wrapperRef,
+
+  /**
+   * A reference to the search input element for direct DOM manipulation.
+   * @property {HTMLElement}
+   */
+  searchInputRef,
+
+  /**
+   * A reference to the label component for direct DOM manipulation.
+   * @property {HTMLElement}
+   */
+  labelComponentRef,
+
+  /**
+   * A reference to the left slot wrapper element for direct DOM manipulation.
+   * @property {HTMLElement}
+   */
+  leftSlotWrapperRef,
+
+  /**
+   * A reference to the inner wrapper element for direct DOM manipulation.
+   * @property {HTMLElement}
+   */
+  innerWrapperRef,
+});
 </script>

package/ui.form-textarea/UTextarea.vue

@@ -282,8 +282,6 @@ const localValue = computed({
   },
 });
 
-defineExpose({ textareaRef });
-
 onMounted(() => toggleReadonly(true));
 
 function onChange() {
@@ -339,4 +337,12 @@ function setLabelPosition() {
 }
 
 onMounted(() => setLabelPosition());
+
+defineExpose({
+  /**
+   * A reference to the textarea element for direct DOM manipulation.
+   * @property {HTMLElement}
+   */
+  textareaRef,
+});
 </script>

package/ui.text-badge/UBadge.vue

@@ -213,8 +213,6 @@ const { badgeAttrs, bodyAttrs, leftIconAttrs, centerIconAttrs, rightIconAttrs }
 
 const wrapperRef = ref(null);
 
-defineExpose({ wrapperRef });
-
 const iconSize = computed(() => {
   const sizes = {
     sm: "3xs",
@@ -244,4 +242,12 @@ function onKeydown(event) {
 function onClick(event) {
   emit("click", event);
 }
+
+defineExpose({
+  /**
+   * A reference to the component's wrapper element for direct DOM manipulation.
+   * @property {HTMLElement}
+   */
+  wrapperRef,
+});
 </script>

package/web-types.json

@@ -1,7 +1,7 @@
 {
   "framework": "vue",
   "name": "vueless",
-  "version": "0.0.459",
+  "version": "0.0.460",
   "contributions": {
     "html": {
       "description-markup": "markdown",
@@ -636,7 +636,13 @@
           ],
           "exposes": [
             {
-              "name": "wrapperRef"
+              "name": "wrapperRef",
+              "description": "A reference to the component's wrapper element for direct DOM manipulation.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
             }
           ],
           "source": {
@@ -885,7 +891,13 @@
           ],
           "exposes": [
             {
-              "name": "buttonRef"
+              "name": "buttonRef",
+              "description": "A reference to the button element for direct DOM manipulation.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
             }
           ],
           "source": {
@@ -1062,7 +1074,13 @@
           ],
           "exposes": [
             {
-              "name": "wrapperRef"
+              "name": "wrapperRef",
+              "description": "A reference to the calendar element for direct DOM manipulation.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
             }
           ],
           "source": {
@@ -2584,13 +2602,31 @@
           ],
           "exposes": [
             {
-              "name": "calendarRef"
+              "name": "calendarRef",
+              "description": "Reference to the UCalendar component instance.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
             },
             {
-              "name": "userFormatDate"
+              "name": "userFormatDate",
+              "description": "The user-friendly formatted date string displayed in the input.",
+              "properties": [
+                {
+                  "type": "String"
+                }
+              ]
             },
             {
-              "name": "formattedDate"
+              "name": "formattedDate",
+              "description": "The internal formatted date string.",
+              "properties": [
+                {
+                  "type": "String"
+                }
+              ]
             }
           ],
           "source": {
@@ -3848,25 +3884,67 @@
           ],
           "exposes": [
             {
-              "name": "pointerSet"
+              "name": "pointerSet",
+              "description": "Allows setting the pointer to a specific index.",
+              "properties": [
+                {
+                  "type": "Function"
+                }
+              ]
             },
             {
-              "name": "pointerBackward"
+              "name": "pointerBackward",
+              "description": "Moves the pointer to the previous option in the list.",
+              "properties": [
+                {
+                  "type": "Function"
+                }
+              ]
             },
             {
-              "name": "pointerForward"
+              "name": "pointerForward",
+              "description": "Advances the pointer to the next option.",
+              "properties": [
+                {
+                  "type": "Function"
+                }
+              ]
             },
             {
-              "name": "pointerReset"
+              "name": "pointerReset",
+              "description": "Resets the pointer to the first option.",
+              "properties": [
+                {
+                  "type": "Function"
+                }
+              ]
             },
             {
-              "name": "addPointerElement"
+              "name": "addPointerElement",
+              "description": "Adds the current pointer element to the model value.",
+              "properties": [
+                {
+                  "type": "Function"
+                }
+              ]
             },
             {
-              "name": "optionsRef"
+              "name": "optionsRef",
+              "description": "A reference to the list of elements representing the available options.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
             },
             {
-              "name": "wrapperRef"
+              "name": "wrapperRef",
+              "description": "A reference to the wrapper element containing the entire list of options.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
             }
           ],
           "source": {
@@ -5127,13 +5205,31 @@
           ],
           "exposes": [
             {
-              "name": "input"
+              "name": "input",
+              "description": "Reference to the underlying input element inside UInput.",
+              "properties": [
+                {
+                  "type": "HTMLInputElement"
+                }
+              ]
             },
             {
-              "name": "rawValue"
+              "name": "rawValue",
+              "description": "The raw, unformatted value of the input.",
+              "properties": [
+                {
+                  "type": "String | Number"
+                }
+              ]
             },
             {
-              "name": "formattedValue"
+              "name": "formattedValue",
+              "description": "The formatted value displayed in the input.",
+              "properties": [
+                {
+                  "type": "String"
+                }
+              ]
             }
           ],
           "source": {
@@ -5657,7 +5753,13 @@
           ],
           "exposes": [
             {
-              "name": "inputRef"
+              "name": "inputRef",
+              "description": "A reference to the input element for direct DOM manipulation.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
             }
           ],
           "source": {
@@ -5778,10 +5880,22 @@
           ],
           "exposes": [
             {
-              "name": "labelElement"
+              "name": "labelElement",
+              "description": "Reference to the label element.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
             },
             {
-              "name": "wrapperElement"
+              "name": "wrapperElement",
+              "description": "Reference to the wrapper element containing the label and content.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
             }
           ],
           "source": {
@@ -6020,7 +6134,13 @@
           ],
           "exposes": [
             {
-              "name": "wrapperRef"
+              "name": "wrapperRef",
+              "description": "A reference to the link wrapper element for direct DOM manipulation.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
             }
           ],
           "source": {
@@ -8084,22 +8204,58 @@
           ],
           "exposes": [
             {
-              "name": "dropdownListRef"
+              "name": "dropdownListRef",
+              "description": "A reference to the dropdown list element for direct DOM manipulation.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
             },
             {
-              "name": "wrapperRef"
+              "name": "wrapperRef",
+              "description": "A reference to the wrapper element for direct DOM manipulation.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
             },
             {
-              "name": "searchInputRef"
+              "name": "searchInputRef",
+              "description": "A reference to the search input element for direct DOM manipulation.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
             },
             {
-              "name": "labelComponentRef"
+              "name": "labelComponentRef",
+              "description": "A reference to the label component for direct DOM manipulation.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
             },
             {
-              "name": "leftSlotWrapperRef"
+              "name": "leftSlotWrapperRef",
+              "description": "A reference to the left slot wrapper element for direct DOM manipulation.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
             },
             {
-              "name": "innerWrapperRef"
+              "name": "innerWrapperRef",
+              "description": "A reference to the inner wrapper element for direct DOM manipulation.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
             }
           ],
           "source": {
@@ -8551,7 +8707,13 @@
           ],
           "exposes": [
             {
-              "name": "clearSelectedItems"
+              "name": "clearSelectedItems",
+              "description": "Allows to clear selected rows.",
+              "properties": [
+                {
+                  "type": "Function"
+                }
+              ]
             }
           ],
           "source": {
@@ -9022,7 +9184,13 @@
           ],
           "exposes": [
             {
-              "name": "textareaRef"
+              "name": "textareaRef",
+              "description": "A reference to the textarea element for direct DOM manipulation.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
             }
           ],
           "source": {