@dynect/base 0.5.0 → 0.7.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dynect/base",
-  "version": "0.5.0",
+  "version": "0.7.1",
   "description": "Reusable Nuxt base module — components, composables, utils, plugins and i18n from the Dynect design system.",
   "type": "module",
   "license": "MIT",

package/src/module.ts

@@ -71,21 +71,40 @@ export default defineNuxtModule<DynectBaseOptions>({
 
 		// ── Path aliases for intra-package imports ───────────────────────────────
 		// Dynect components use @/components/ui/* and @/lib/utils.
-		// In standalone mode, @/ resolves to the consuming app's srcDir which won't
-		// have those paths — redirect them to the bundled runtime copies.
+		// nuxt.options.alias cannot intercept these because Vite first expands @→srcDir
+		// and stops alias processing. We must hook into vite:extendConfig and prepend
+		// regex aliases so they match *before* the @ alias fires.
 
 		const srcDir = nuxt.options.srcDir;
 
 		// @/lib/utils → runtime/lib/utils (when not present in consuming app)
+		// This one works via nuxt.options.alias because lib/utils is not prefixed with @
 		if (!existsSync(join(srcDir, 'lib', 'utils.ts'))) {
 			nuxt.options.alias[join(srcDir, 'lib', 'utils')] =
 				resolver.resolve('./runtime/lib/utils');
 		}
 
-		// @/components/ui/* → runtime/components/ui/* (when not present in consuming app)
+		// @/components/ui/* → runtime/components/ui/*
+		// Must run BEFORE @ is resolved, so we use a regex alias in vite:extendConfig.
+		// Only applied when the consuming app has no own components/ui directory.
 		if (isStandalone && !existsSync(join(srcDir, 'components', 'ui'))) {
-			nuxt.options.alias[join(srcDir, 'components', 'ui')] =
-				join(runtimeComponentsDir, 'ui');
+			const uiRuntimePath = join(runtimeComponentsDir, 'ui');
+
+			nuxt.hook('vite:extendConfig', (config) => {
+				config.resolve ??= {};
+
+				const entry = { find: /^[@~]\/components\/ui/, replacement: uiRuntimePath };
+
+				if (Array.isArray(config.resolve.alias)) {
+					(config.resolve.alias as any[]).unshift(entry);
+				} else {
+					const existing = config.resolve.alias ?? {};
+					config.resolve.alias = [
+						entry,
+						...Object.entries(existing).map(([find, replacement]) => ({ find, replacement })),
+					];
+				}
+			});
 		}
 
 		// ── Install required Nuxt modules ────────────────────────────────────────

package/src/runtime/components/base/event-calendar/EventModal.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { useId } from 'nuxt/app';
 import { onKeyStroke } from '@vueuse/core';
 import { toDate } from 'reka-ui/date';
 import { fromDate, CalendarDate, type DateValue, today, getLocalTimeZone } from '@internationalized/date';

package/src/runtime/components/base/event-calendar/composables/useAdvancedValidation.ts

@@ -1,3 +1,4 @@
+import { readonly, ref } from 'vue';
 import type { CalendarEvent, RecurringPattern } from '../types';
 
 interface ValidationRule<T = any> {

package/src/runtime/components/base/event-calendar/composables/useColorManager.ts

@@ -1,3 +1,4 @@
+import { type Ref, computed, ref } from 'vue';
 import type { CalendarEvent, EventColor } from '../types';
 
 export interface ColorConfig {

package/src/runtime/components/base/event-calendar/composables/useCompatibility.ts

@@ -1,3 +1,4 @@
+import { readonly, ref } from 'vue';
 interface BrowserCapabilities {
 	hasNativeUUID: boolean;
 	hasResizeObserver: boolean;

package/src/runtime/components/base/event-calendar/composables/useDragAndDrop.ts

@@ -1,3 +1,4 @@
+import { computed, reactive, ref } from 'vue';
 import { makeDraggable, makeDroppable, type IDragEvent } from '@vue-dnd-kit/core';
 import type { CalendarEvent } from '../types';
 import { useCalendarUtils } from './useCalendarUtils';

package/src/runtime/components/base/event-calendar/composables/useEventFiltering.ts

@@ -1,3 +1,4 @@
+import { type ComputedRef, computed } from 'vue';
 import type { CalendarEvent } from '../types';
 
 /**

package/src/runtime/components/base/event-calendar/composables/useEventStatus.ts

@@ -1,3 +1,4 @@
+import { type ComputedRef, computed } from 'vue';
 import type { CalendarEvent, EventStatus } from '../types';
 
 export function useEventStatus(events: ComputedRef<CalendarEvent[]>) {

package/src/runtime/components/base/event-calendar/composables/useEventStore.ts

@@ -1,3 +1,4 @@
+import { computed, reactive, readonly, ref } from 'vue';
 import type { CalendarEvent } from '../types';
 import { usePerformanceCache } from './usePerformanceCache';
 

package/src/runtime/components/base/event-calendar/composables/useExternalCalendar.ts

@@ -1,3 +1,4 @@
+import { type ComputedRef, computed, readonly, ref } from 'vue';
 import type { CalendarEvent } from '../types';
 
 export interface ExternalCalendarProvider {

package/src/runtime/components/base/event-calendar/composables/useKeyboardNavigation.ts

@@ -1,3 +1,4 @@
+import { type Ref, ref } from 'vue';
 import { onKeyStroke } from '@vueuse/core';
 import type { ViewMode } from '../types';
 

package/src/runtime/components/base/event-calendar/composables/useMonitoring.ts

@@ -1,3 +1,4 @@
+import { onMounted, readonly, ref } from 'vue';
 interface PerformanceMetric {
 	name: string;
 	value: number;

package/src/runtime/components/base/event-calendar/composables/useMultiDayLayout.ts

@@ -1,3 +1,4 @@
+import { type ComputedRef, computed } from 'vue';
 import type { CalendarEvent, MonthViewDay } from '../types';
 
 export interface LayoutEvent extends CalendarEvent {

package/src/runtime/components/base/event-calendar/composables/usePerformanceCache.ts

@@ -1,3 +1,4 @@
+import { computed, readonly, ref } from 'vue';
 interface CacheEntry<T> {
 	value: T;
 	timestamp: number;

package/src/runtime/components/base/event-calendar/composables/useRecurringEvents.ts

@@ -1,3 +1,4 @@
+import { type ComputedRef, computed } from 'vue';
 import type { CalendarEvent, RecurringPattern } from '../types';
 
 export function useRecurringEvents(events: ComputedRef<CalendarEvent[]>) {

package/src/runtime/components/base/event-calendar/composables/useSecurity.ts

@@ -1,3 +1,4 @@
+import { readonly, ref } from 'vue';
 import type { CalendarEvent } from '../types';
 
 interface SecurityConfig {

package/src/runtime/components/base/event-calendar/composables/useTimezone.ts

@@ -1,3 +1,4 @@
+import { type ComputedRef, computed, ref } from 'vue';
 import type { CalendarEvent } from '../types';
 import { getLocalTimeZone } from '@internationalized/date';
 

package/src/runtime/components/base/signature/index.vue

@@ -5,6 +5,7 @@
 </template>
 
 <script setup lang="ts">
+import { useId } from 'nuxt/app';
 import SignaturePad from 'signature_pad';
 
 interface SigOption {

package/src/runtime/components/dynect/Autocomplete.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { useId } from 'nuxt/app';
 import type { HTMLAttributes } from 'vue';
 import { cva } from 'class-variance-authority';
 import { cn } from '@/lib/utils';

package/src/runtime/components/dynect/Checkbox.vue

@@ -41,6 +41,7 @@
 </template>
 
 <script setup lang="ts">
+import { useId } from 'nuxt/app';
 import { cn } from '@/lib/utils';
 
 export interface AppCheckboxProps {

package/src/runtime/components/dynect/DatePicker.vue

@@ -50,6 +50,7 @@
 </template>
 
 <script setup lang="ts">
+import { useId } from 'nuxt/app';
 import type { DateValue } from '@internationalized/date';
 import { DateFormatter, getLocalTimeZone, parseDate, today } from '@internationalized/date';
 import { cn } from '@/lib/utils';

package/src/runtime/components/dynect/DateRange.vue

@@ -53,6 +53,7 @@
 </template>
 
 <script setup lang="ts">
+import { useId } from 'nuxt/app';
 import type { DateValue } from '@internationalized/date';
 import { DateFormatter, getLocalTimeZone, today, parseDate } from '@internationalized/date';
 import { cn } from '@/lib/utils';

package/src/runtime/components/dynect/Dropzone.vue

@@ -95,6 +95,7 @@
 </template>
 
 <script setup lang="ts">
+import { useId } from 'nuxt/app';
 import type { HTMLAttributes } from 'vue';
 
 defineOptions({

package/src/runtime/components/dynect/Input.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { useId } from 'nuxt/app';
 import type { HTMLAttributes } from 'vue';
 import { cva } from 'class-variance-authority';
 import { cn, inputSizeClasses } from '@/lib/utils';

package/src/runtime/components/dynect/OtpInput.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { useId } from 'nuxt/app';
 import type { HTMLAttributes } from 'vue';
 import type { OTPInputEmits, OTPInputProps } from 'vue-input-otp';
 import { useForwardPropsEmits } from 'reka-ui';

package/src/runtime/components/dynect/Radio.vue

@@ -37,6 +37,7 @@
 </template>
 
 <script setup lang="ts">
+import { useId } from 'nuxt/app';
 import { cn } from '@/lib/utils';
 
 defineOptions({

package/src/runtime/components/dynect/Select.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { useId } from 'nuxt/app';
 import type { HTMLAttributes } from 'vue';
 import { cva } from 'class-variance-authority';
 import { cn, inputSizeClasses } from '@/lib/utils';

package/src/runtime/components/dynect/SelectMultiple.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { useId } from 'nuxt/app';
 import type { HTMLAttributes } from 'vue';
 import { cva } from 'class-variance-authority';
 import { cn, inputSizeClasses } from '@/lib/utils';

package/src/runtime/components/dynect/Signature.vue

@@ -20,6 +20,7 @@
 </template>
 
 <script setup lang="ts">
+import { useId } from 'nuxt/app';
 interface BaseSignatureInstance {
 	save: (format?: string) => string;
 	clear: () => void;

package/src/runtime/components/dynect/TagsInput.vue

@@ -101,6 +101,7 @@
 </template>
 
 <script setup lang="ts">
+import { useId } from 'nuxt/app';
 import { onClickOutside } from '@vueuse/core';
 import { cva } from 'class-variance-authority';
 import { cn, inputSizeClasses } from '@/lib/utils';

package/src/runtime/components/dynect/Textarea.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { useId } from 'nuxt/app';
 import type { HTMLAttributes } from 'vue';
 import { cva } from 'class-variance-authority';
 import { cn, inputSizeClasses } from '@/lib/utils';

package/src/runtime/components/dynect/TimePicker.vue

@@ -87,6 +87,7 @@
 </template>
 
 <script setup lang="ts">
+import { useId } from 'nuxt/app';
 import { cn } from '@/lib/utils';
 
 defineOptions({

package/src/runtime/components/dynect/Toggle.vue

@@ -60,6 +60,7 @@
 </template>
 
 <script setup lang="ts">
+import { useId } from 'nuxt/app';
 import { cn } from '@/lib/utils';
 
 export interface ToggleProps {

package/src/runtime/utils/function.ts

@@ -1,5 +1,6 @@
 import country from '@/assets/files/country.json';
 import { isValidPhoneNumber, parsePhoneNumberFromString, type CountryCode } from 'libphonenumber-js/max';
+import { useState } from 'nuxt/app';
 
 interface CountryData {
 	name: string;