vueless 1.1.1-beta.6 → 1.1.1-beta.61

package/ui.dropdown-button/config.ts

@@ -1,5 +1,12 @@
 export default /*tw*/ {
-  wrapper: "relative inline-block h-max",
+  wrapper: {
+    base: "relative inline-block h-max",
+    variants: {
+      block: {
+        true: "w-full",
+      },
+    },
+  },
   dropdownButton: "{UButton} justify-between",
   toggleIcon: {
     base: "{UIcon} transition duration-300 -mr-1",
@@ -48,6 +55,7 @@ export default /*tw*/ {
     xPosition: "left",
     searchable: false,
     round: false,
+    block: false,
     square: false,
     disabled: false,
     multiple: false,

package/ui.dropdown-button/storybook/docs.mdx

@@ -1,8 +1,8 @@
 import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Source } from "@storybook/addon-docs/blocks";
-import { getSource } from "../../utils/storybook.ts";
+import { getSource } from "../../utils/storybook";
 
-import * as stories from "./stories.ts";
-import defaultConfig from "../config.ts?raw"
+import * as stories from "./stories";
+import defaultConfig from "../config?raw"
 
 <Meta of={stories} />
 <Title of={stories} />

package/ui.dropdown-button/storybook/stories.ts

@@ -4,7 +4,7 @@ import {
   getSlotNames,
   getSlotsFragment,
   getDocsDescription,
-} from "../../utils/storybook.ts";
+} from "../../utils/storybook";
 
 import UDropdownButton from "../../ui.dropdown-button/UDropdownButton.vue";
 import URow from "../../ui.container-row/URow.vue";
@@ -14,7 +14,7 @@ import ULink from "../../ui.button-link/ULink.vue";
 import UAvatar from "../../ui.image-avatar/UAvatar.vue";
 
 import type { Meta, StoryFn } from "@storybook/vue3-vite";
-import type { Props } from "../types.ts";
+import type { Props } from "../types";
 
 interface DefaultUDropdownButtonArgs extends Props {
   slotTemplate?: string;
@@ -167,7 +167,7 @@ export const ListboxXPosition = EnumTemplate.bind({});
 ListboxXPosition.args = {
   enum: "xPosition",
   label: "{enumValue}",
-  class: "w-40",
+  block: true,
 };
 
 export const ListboxYPosition = EnumTemplate.bind({});

package/ui.dropdown-button/tests/UDropdownButton.test.ts

@@ -6,7 +6,7 @@ import UButton from "../../ui.button/UButton.vue";
 import UIcon from "../../ui.image-icon/UIcon.vue";
 import UListbox from "../../ui.form-listbox/UListbox.vue";
 
-import type { Props } from "../types.ts";
+import type { Props } from "../types";
 
 describe("UDropdownButton.vue", () => {
   const defaultOptions = [
@@ -207,6 +207,22 @@ describe("UDropdownButton.vue", () => {
       expect(component.findComponent(UButton).props("disabled")).toBe(disabled);
     });
 
+    // Block prop
+    it("applies class when prop is true", () => {
+      const block = true;
+      const expectedClass = "w-full";
+
+      const component = mount(UDropdownButton, {
+        props: {
+          block,
+          options: defaultOptions,
+        },
+      });
+
+      expect(component.attributes("class")).toContain(expectedClass);
+      expect(component.findComponent(UButton).attributes("class")).toContain(expectedClass);
+    });
+
     // ToggleIcon prop (boolean: true)
     it("shows default toggle icon when toggleIcon is true", () => {
       const toggleIcon = true;

package/ui.dropdown-button/types.ts

@@ -1,7 +1,7 @@
-import defaultConfig from "./config.ts";
+import defaultConfig from "./config";
 
-import type { Option } from "../ui.form-listbox/types.ts";
-import type { ComponentConfig, UnknownObject } from "../types.ts";
+import type { Option } from "../ui.form-listbox/types";
+import type { ComponentConfig, UnknownObject } from "../types";
 
 export type Config = typeof defaultConfig;
 
@@ -75,6 +75,11 @@ export interface Props {
    */
   multiple?: boolean;
 
+  /**
+   * Make the dropdown button expand to fill the entire width of its container.
+   */
+  block?: boolean;
+
   /**
    * Set button corners rounded.
    */

package/ui.dropdown-link/UDropdownLink.vue

@@ -2,20 +2,20 @@
 import { nextTick, computed, provide, ref, useId, useTemplateRef } from "vue";
 import { isEqual } from "lodash-es";
 
-import useUI from "../composables/useUI.ts";
-import { getDefaults } from "../utils/ui.ts";
+import useUI from "../composables/useUI";
+import { getDefaults } from "../utils/ui";
 
 import UIcon from "../ui.image-icon/UIcon.vue";
 import ULink from "../ui.button-link/ULink.vue";
 import ULisbox from "../ui.form-listbox/UListbox.vue";
 
-import { vClickOutside } from "../directives";
+import vClickOutside from "../v.click-outside/vClickOutside";
 
-import { COMPONENT_NAME } from "./constants.ts";
-import defaultConfig from "./config.ts";
+import { COMPONENT_NAME } from "./constants";
+import defaultConfig from "./config";
 
-import type { Props, Config } from "./types.ts";
-import type { Option, SelectedValue } from "../ui.form-listbox/types.ts";
+import type { Props, Config } from "./types";
+import type { Option, SelectedValue } from "../ui.form-listbox/types";
 
 defineOptions({ inheritAttrs: false });
 

package/ui.dropdown-link/config.ts

@@ -36,7 +36,7 @@ export default /*tw*/ {
     yPosition: "bottom",
     xPosition: "left",
     underlined: undefined,
-    dashed: true,
+    dashed: false,
     disabled: false,
     searchable: false,
     multiple: false,

package/ui.dropdown-link/storybook/docs.mdx

@@ -1,8 +1,8 @@
 import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Source } from "@storybook/addon-docs/blocks";
-import { getSource } from "../../utils/storybook.ts";
+import { getSource } from "../../utils/storybook";
 
-import * as stories from "./stories.ts";
-import defaultConfig from "../config.ts?raw"
+import * as stories from "./stories";
+import defaultConfig from "../config?raw"
 
 <Meta of={stories} />
 <Title of={stories} />

package/ui.dropdown-link/storybook/stories.ts

@@ -4,7 +4,7 @@ import {
   getSlotNames,
   getSlotsFragment,
   getDocsDescription,
-} from "../../utils/storybook.ts";
+} from "../../utils/storybook";
 
 import UDropdownLink from "../../ui.dropdown-link/UDropdownLink.vue";
 import URow from "../../ui.container-row/URow.vue";
@@ -14,7 +14,7 @@ import ULink from "../../ui.button-link/ULink.vue";
 import UAvatar from "../../ui.image-avatar/UAvatar.vue";
 
 import type { Meta, StoryFn } from "@storybook/vue3-vite";
-import type { Props } from "../types.ts";
+import type { Props } from "../types";
 
 interface DefaultUDropdownLinkArgs extends Props {
   slotTemplate?: string;

package/ui.dropdown-link/tests/UDropdownLink.test.ts

@@ -6,7 +6,7 @@ import ULink from "../../ui.button-link/ULink.vue";
 import UIcon from "../../ui.image-icon/UIcon.vue";
 import UListbox from "../../ui.form-listbox/UListbox.vue";
 
-import type { Props } from "../types.ts";
+import type { Props } from "../types";
 
 describe("UDropdownLink.vue", () => {
   const defaultOptions = [

package/ui.dropdown-link/types.ts

@@ -1,7 +1,7 @@
-import defaultConfig from "./config.ts";
+import defaultConfig from "./config";
 
-import type { Option } from "../ui.form-listbox/types.ts";
-import type { ComponentConfig, UnknownObject } from "../types.ts";
+import type { Option } from "../ui.form-listbox/types";
+import type { ComponentConfig, UnknownObject } from "../types";
 
 export type Config = typeof defaultConfig;
 

package/ui.form-calendar/UCalendar.vue

@@ -1,9 +1,9 @@
 <script setup lang="ts" generic="TModelValue extends DateValue">
 import { computed, ref, watch, useTemplateRef, nextTick, onMounted } from "vue";
 
-import useUI from "../composables/useUI.ts";
-import { getDefaults } from "../utils/ui.ts";
-import { isRangeDate } from "./types.ts";
+import useUI from "../composables/useUI";
+import { getDefaults } from "../utils/ui";
+import { isRangeDate } from "./types";
 
 import UButton from "../ui.button/UButton.vue";
 
@@ -13,11 +13,11 @@ import {
   dateIsOutOfRange,
   isNumeric,
   getYearsRangeLabel,
-} from "./utilCalendar.ts";
+} from "./utilCalendar";
 
-import { getDateWithoutTime, addMonths, addDays, addYears, getSortedLocale } from "./utilDate.ts";
+import { getDateWithoutTime, addMonths, addDays, addYears, getSortedLocale } from "./utilDate";
 
-import { useComponentLocaleMessages } from "../composables/useComponentLocaleMassages.ts";
+import { useComponentLocaleMessages } from "../composables/useComponentLocaleMassages";
 
 import {
   COMPONENT_NAME,
@@ -34,13 +34,13 @@ import {
   LocaleType,
   View,
   InputType,
-} from "./constants.ts";
+} from "./constants";
 
-import defaultConfig from "./config.ts";
+import defaultConfig from "./config";
 
-import type { Props, DateValue, RangeDate, Locale, Config } from "./types.ts";
-import type { DateLocale } from "./utilFormatting.ts";
-import type { ComponentExposed } from "../types.ts";
+import type { Props, DateValue, RangeDate, Locale, Config } from "./types";
+import type { DateLocale } from "./utilFormatting";
+import type { ComponentExposed } from "../types";
 
 import DayView from "./UCalendarDayView.vue";
 import MonthView from "./UCalendarMonthView.vue";

package/ui.form-calendar/UCalendarDayView.vue

@@ -1,21 +1,21 @@
 <script setup lang="ts">
 import { computed, ref } from "vue";
 
-import useUI from "../composables/useUI.ts";
+import useUI from "../composables/useUI";
 
-import { formatDate, dateIsOutOfRange } from "./utilCalendar.ts";
+import { formatDate, dateIsOutOfRange } from "./utilCalendar";
 import {
   isToday,
   getDateWithoutTime,
   getLastDayOfMonth,
   isSameDay,
   isAnotherMothDay,
-} from "./utilDate.ts";
+} from "./utilDate";
 
-import defaultConfig from "./config.ts";
-import { DAYS_IN_WEEK, START_WEEK, DATE_CLICK_STEP } from "./constants.ts";
+import defaultConfig from "./config";
+import { DAYS_IN_WEEK, START_WEEK, DATE_CLICK_STEP } from "./constants";
 
-import type { UCalendarViewProps, Config } from "./types.ts";
+import type { UCalendarViewProps, Config } from "./types";
 
 import UButton from "../ui.button/UButton.vue";
 

package/ui.form-calendar/UCalendarMonthView.vue

@@ -1,15 +1,15 @@
 <script setup lang="ts">
 import { computed } from "vue";
 
-import useUI from "../composables/useUI.ts";
+import useUI from "../composables/useUI";
 
-import { formatDate, dateIsOutOfRange } from "./utilCalendar.ts";
-import { isSameMonth, isCurrentMonth } from "./utilDate.ts";
+import { formatDate, dateIsOutOfRange } from "./utilCalendar";
+import { isSameMonth, isCurrentMonth } from "./utilDate";
 
-import defaultConfig from "./config.ts";
-import { MONTHS_PER_VIEW } from "./constants.ts";
+import defaultConfig from "./config";
+import { MONTHS_PER_VIEW } from "./constants";
 
-import type { UCalendarViewProps, Config } from "./types.ts";
+import type { UCalendarViewProps, Config } from "./types";
 
 import UButton from "../ui.button/UButton.vue";
 

package/ui.form-calendar/UCalendarYearView.vue

@@ -1,15 +1,15 @@
 <script setup lang="ts">
 import { ref, watch } from "vue";
 
-import useUI from "../composables/useUI.ts";
+import useUI from "../composables/useUI";
 
-import { formatDate, dateIsOutOfRange } from "./utilCalendar.ts";
-import { isSameMonth, isCurrentYear } from "./utilDate.ts";
+import { formatDate, dateIsOutOfRange } from "./utilCalendar";
+import { isSameMonth, isCurrentYear } from "./utilDate";
 
-import defaultConfig from "./config.ts";
-import { YEARS_PER_VIEW } from "./constants.ts";
+import defaultConfig from "./config";
+import { YEARS_PER_VIEW } from "./constants";
 
-import type { UCalendarViewProps, Config } from "./types.ts";
+import type { UCalendarViewProps, Config } from "./types";
 
 import UButton from "../ui.button/UButton.vue";
 

package/ui.form-calendar/storybook/docs.mdx

@@ -1,8 +1,8 @@
 import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Source } from "@storybook/addon-docs/blocks";
-import { getSource } from "../../utils/storybook.ts";
+import { getSource } from "../../utils/storybook";
 
-import * as stories from "./stories.ts";
-import defaultConfig from "../config.ts?raw"
+import * as stories from "./stories";
+import defaultConfig from "../config?raw"
 import DateTokensTable from "./dateTokensTable.mdx"
 
 <Meta of={stories} />

package/ui.form-calendar/storybook/stories.ts

@@ -5,15 +5,15 @@ import {
   getSlotNames,
   getSlotsFragment,
   getDocsDescription,
-} from "../../utils/storybook.ts";
+} from "../../utils/storybook";
 
 import UCalendar from "../../ui.form-calendar/UCalendar.vue";
 import URow from "../../ui.container-row/URow.vue";
 import UText from "../../ui.text-block/UText.vue";
 
-import { COMPONENT_NAME } from "../constants.ts";
+import { COMPONENT_NAME } from "../constants";
 
-import type { DateValue, Props } from "../types.ts";
+import type { DateValue, Props } from "../types";
 
 interface UCalendarArgs extends Props<DateValue> {
   slotTemplate?: string;

package/ui.form-calendar/tests/UCalendar.test.ts

@@ -7,9 +7,9 @@ import DayView from "../UCalendarDayView.vue";
 import MonthView from "../UCalendarMonthView.vue";
 import YearView from "../UCalendarYearView.vue";
 
-import { View } from "../constants.ts";
+import { View } from "../constants";
 
-import type { Props, RangeDate } from "../types.ts";
+import type { Props, RangeDate } from "../types";
 
 describe("UCalendar.vue", () => {
   describe("Props", () => {

package/ui.form-calendar/tests/UCalendarDayView.test.ts

@@ -2,9 +2,9 @@ import { mount } from "@vue/test-utils";
 import { describe, it, expect } from "vitest";
 
 import UCalendarDayView from "../UCalendarDayView.vue";
-import defaultConfig from "../config.ts";
+import defaultConfig from "../config";
 
-import type { UCalendarViewProps } from "../types.ts";
+import type { UCalendarViewProps } from "../types";
 import UButton from "../../ui.button/UButton.vue";
 
 describe("UCalendarDayView.vue", () => {

package/ui.form-calendar/tests/UCalendarMonthView.test.ts

@@ -2,9 +2,9 @@ import { mount } from "@vue/test-utils";
 import { describe, it, expect } from "vitest";
 
 import UCalendarMonthView from "../UCalendarMonthView.vue";
-import defaultConfig from "../config.ts";
+import defaultConfig from "../config";
 
-import type { UCalendarViewProps } from "../types.ts";
+import type { UCalendarViewProps } from "../types";
 import UButton from "../../ui.button/UButton.vue";
 
 describe("UCalendarMonthView.vue", () => {

package/ui.form-calendar/tests/UCalendarYearView.test.ts

@@ -2,9 +2,9 @@ import { mount } from "@vue/test-utils";
 import { describe, it, expect } from "vitest";
 
 import UCalendarYearView from "../UCalendarYearView.vue";
-import defaultConfig from "../config.ts";
+import defaultConfig from "../config";
 
-import type { UCalendarViewProps } from "../types.ts";
+import type { UCalendarViewProps } from "../types";
 import UButton from "../../ui.button/UButton.vue";
 
 describe("UCalendarYearView.vue", () => {

package/ui.form-calendar/types.ts

@@ -1,7 +1,7 @@
-import defaultConfig from "./config.ts";
+import defaultConfig from "./config";
 
-import type { ComponentConfig } from "../types.ts";
-import type { DateLocale } from "./utilFormatting.ts";
+import type { ComponentConfig } from "../types";
+import type { DateLocale } from "./utilFormatting";
 
 export type RangeDate =
   | { from: string | null; to: string | null }

package/ui.form-calendar/utilCalendar.ts

@@ -1,9 +1,9 @@
-import { revFormat, formats } from "./utilFormatting.ts";
-import { getDateFromUnixTimestamp } from "./utilDate.ts";
+import { revFormat, formats } from "./utilFormatting";
+import { getDateFromUnixTimestamp } from "./utilDate";
 
-import { SEPARATOR, TOKEN_REG_EXP } from "./constants.ts";
+import { SEPARATOR, TOKEN_REG_EXP } from "./constants";
 
-import type { DateLocale } from "./utilFormatting.ts";
+import type { DateLocale } from "./utilFormatting";
 
 type UnknownFunction = (...args: unknown[]) => unknown;
 

package/ui.form-calendar/utilDate.ts

@@ -1,4 +1,4 @@
-import { LocaleType, DAYS_IN_WEEK, SECONDS_IN_MINUTES } from "./constants.ts";
+import { LocaleType, DAYS_IN_WEEK, SECONDS_IN_MINUTES } from "./constants";
 
 export type dateSettings = { weekStartsOn?: number };
 

package/ui.form-calendar/utilFormatting.ts

@@ -1,4 +1,4 @@
-import { addDays, isSameDay } from "./utilDate.ts";
+import { addDays, isSameDay } from "./utilDate";
 
 export interface DateLocale {
   weekdays: {

package/ui.form-checkbox/UCheckbox.vue

@@ -2,17 +2,17 @@
 import { inject, ref, onMounted, computed, watchEffect, toValue, useId } from "vue";
 import { isEqual } from "lodash-es";
 
-import useUI from "../composables/useUI.ts";
-import { getDefaults } from "../utils/ui.ts";
+import useUI from "../composables/useUI";
+import { getDefaults } from "../utils/ui";
 
 import UIcon from "../ui.image-icon/UIcon.vue";
 import ULabel from "../ui.form-label/ULabel.vue";
 
-import defaultConfig from "./config.ts";
-import { COMPONENT_NAME } from "./constants.ts";
+import defaultConfig from "./config";
+import { COMPONENT_NAME } from "./constants";
 
-import type { UnknownObject } from "../types.ts";
-import type { Props, Config } from "./types.ts";
+import type { UnknownObject } from "../types";
+import type { Props, Config } from "./types";
 
 defineOptions({ inheritAttrs: false });
 

package/ui.form-checkbox/storybook/docs.mdx

@@ -1,8 +1,8 @@
 import { Markdown, Meta, Title, Subtitle, Description, Primary, Controls, Stories, Source } from "@storybook/addon-docs/blocks";
-import { getSource } from "../../utils/storybook.ts";
+import { getSource } from "../../utils/storybook";
 
-import * as stories from "./stories.ts";
-import defaultConfig from "../config.ts?raw"
+import * as stories from "./stories";
+import defaultConfig from "../config?raw"
 
 <Meta of={stories} />
 <Title of={stories} />

package/ui.form-checkbox/storybook/stories.ts

@@ -4,7 +4,7 @@ import {
   getSlotNames,
   getSlotsFragment,
   getDocsDescription,
-} from "../../utils/storybook.ts";
+} from "../../utils/storybook";
 
 import UCheckbox from "../../ui.form-checkbox/UCheckbox.vue";
 import UCheckboxGroup from "../../ui.form-checkbox-group/UCheckboxGroup.vue";
@@ -16,7 +16,7 @@ import URow from "../../ui.container-row/URow.vue";
 import UChip from "../../ui.other-chip/UChip.vue";
 
 import type { Meta, StoryFn } from "@storybook/vue3-vite";
-import type { Props } from "../types.ts";
+import type { Props } from "../types";
 
 interface UCheckboxArgs extends Props {
   slotTemplate?: string;

package/ui.form-checkbox/tests/UCheckbox.test.ts

@@ -5,7 +5,7 @@ import UCheckbox from "../UCheckbox.vue";
 import UIcon from "../../ui.image-icon/UIcon.vue";
 import ULabel from "../../ui.form-label/ULabel.vue";
 
-import type { Props } from "../types.ts";
+import type { Props } from "../types";
 
 describe("UCheckbox.vue", () => {
   describe("Props", () => {

package/ui.form-checkbox/types.ts

@@ -1,6 +1,6 @@
-import defaultConfig from "./config.ts";
+import defaultConfig from "./config";
 
-import type { ComponentConfig, UnknownObject, UnknownArray } from "../types.ts";
+import type { ComponentConfig, UnknownObject, UnknownArray } from "../types";
 
 export type Config = typeof defaultConfig;
 

package/ui.form-checkbox-group/UCheckboxGroup.vue

@@ -2,17 +2,17 @@
 import { provide, ref, watch, useTemplateRef } from "vue";
 import { isEqual } from "lodash-es";
 
-import useUI from "../composables/useUI.ts";
-import { getDefaults } from "../utils/ui.ts";
+import useUI from "../composables/useUI";
+import { getDefaults } from "../utils/ui";
 
 import ULabel from "../ui.form-label/ULabel.vue";
 import UCheckbox from "../ui.form-checkbox/UCheckbox.vue";
 
-import { COMPONENT_NAME } from "./constants.ts";
-import defaultConfig from "./config.ts";
+import { COMPONENT_NAME } from "./constants";
+import defaultConfig from "./config";
 
-import type { UnknownObject } from "../types.ts";
-import type { Props, Config } from "./types.ts";
+import type { UnknownObject } from "../types";
+import type { Props, Config } from "./types";
 
 defineOptions({ inheritAttrs: false });
 

package/ui.form-checkbox-group/storybook/docs.mdx

@@ -1,8 +1,8 @@
 import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Source } from "@storybook/addon-docs/blocks";
-import { getSource } from "../../utils/storybook.ts";
+import { getSource } from "../../utils/storybook";
 
-import * as stories from "./stories.ts";
-import defaultConfig from "../config.ts?raw"
+import * as stories from "./stories";
+import defaultConfig from "../config?raw"
 
 <Meta of={stories} />
 <Title of={stories} />

package/ui.form-checkbox-group/storybook/stories.ts

@@ -6,7 +6,7 @@ import {
   getSlotNames,
   getSlotsFragment,
   getDocsDescription,
-} from "../../utils/storybook.ts";
+} from "../../utils/storybook";
 
 import UCheckboxGroup from "../../ui.form-checkbox-group/UCheckboxGroup.vue";
 import UCheckbox from "../../ui.form-checkbox/UCheckbox.vue";
@@ -19,7 +19,7 @@ import ULink from "../../ui.button-link/ULink.vue";
 import UIcon from "../../ui.image-icon/UIcon.vue";
 
 import type { Meta, StoryFn } from "@storybook/vue3-vite";
-import type { Props } from "../types.ts";
+import type { Props } from "../types";
 
 interface UCheckboxGroupArgs extends Props {
   slotTemplate?: string;

package/ui.form-checkbox-group/tests/UCheckboxGroup.test.ts

@@ -6,7 +6,7 @@ import UCheckboxGroup from "../UCheckboxGroup.vue";
 import UCheckbox from "../../ui.form-checkbox/UCheckbox.vue";
 import ULabel from "../../ui.form-label/ULabel.vue";
 
-import type { Props } from "../types.ts";
+import type { Props } from "../types";
 
 describe("UCheckboxGroup.vue", () => {
   const defaultOptions = [

package/ui.form-checkbox-group/types.ts

@@ -1,7 +1,7 @@
-import defaultConfig from "./config.ts";
+import defaultConfig from "./config";
 
-import type { UnknownObject, ComponentConfig } from "../types.ts";
-import type { UCheckboxOption } from "../ui.form-checkbox/types.ts";
+import type { UnknownObject, ComponentConfig } from "../types";
+import type { UCheckboxOption } from "../ui.form-checkbox/types";
 
 export type Config = typeof defaultConfig;