@nhtio/common-vue

Provides the helper interfaces, types, variables and functions needed to create custom components.

Components

Class	Description
BaseField	The BaseField component provides a base input field with support for Vue Composition API hooks, custom event handlers, and both VInput and VField functionality from Vuetify. Features include focus management, model value binding, and flexible slot support.

Composables

Function	Description
useBaseHooks	Composable that creates passthrough hooks for all BaseField events. Integrates with component props (onX handlers) and hook arrays (callOnX) to handle events.
useBaseProps	Composable that extracts and filters BaseField props into typed computed references. Provides both all defined props and a filtered set with undefined values removed.
useBaseSlots	Composable that extracts and provides typed slot renderer functions for all BaseField slots. Returns an object with individual slot renderer functions that safely invoke slots with proper typing. Each renderer function accepts slot parameters and returns the slot's render result or undefined.
useComputedObjectFromProps	Creates a computed object by picking specific props and merging them with overrides. This composable is designed for cases where you need to transform a subset of component props into a specific target type, combining selected reactive prop values with static overrides.
useLocalizedModelValue	Composable for managing localized/transformed model values with bidirectional synchronization.
usePassthroughHook	Builds an event invoker that respects component-bound handlers and hook arrays before calling a fallback.
usePropsProxy	Creates a computed proxy that unwraps reactive props and merges them with override values. Useful for creating a reactive object that combines component props with custom values, while optionally excluding specific prop keys.

Constants

Name	Description
baseEmits	Emit definitions for the BaseField component. Contains all standard emit validators for field component events.
baseFieldBaseRawEmits	Base emit validators for the BaseField component. Defines all standard emit events that can be emitted by field components, including clicks, focus updates, and model value changes.
version	The current version of the package.
iconClose	Pre-configured close icon using Material Design Icons. Can be used as the clear icon or any other close icon action.

Factories

Name	Description
makeBaseProps	Factory function that creates props for the BaseField component. Returns a function that accepts optional defaults and returns fully typed prop definitions.
emitsFactory	Creates emit functions from emit validators. Simply type-casts validators to emit functions; the actual validation happens elsewhere.
propsAndEmitsFactory	Factory that combines props and emits definitions into a unified system. Automatically adds handler props (onX) for each emit, supporting both camelCase and kebab-case.

Types

Name	Description
EmitValidators	Interface for emit event validators. Each validator is a function that takes event arguments and returns a boolean indicating validity.
AppendDefault	Applies default values to component prop definitions. For each prop, if a default is provided, it updates the prop's default and type accordingly.
BaseClickAppendInnerHookHandler	Hook handler type for the 'click:appendInner' event
BaseClickClearHookHandler	Hook handler type for the 'click:clear' event
BaseClickControlHookHandler	Hook handler type for the 'click:control' event
BaseClickPrependInnerHookHandler	Hook handler type for the 'click:prependInner' event
BaseHookableEvents	Type for the hookable events of BaseField
BaseHookableRawEvents	Type for the raw emit validators of BaseField
BaseHookHandlers	Generic hook handler type for BaseField events. Creates a typed hook handler for a specific event from the BaseField's hookable events. Can be either a direct handler function or a provider that returns a handler.
BaseHooks	Type for the hooks system for BaseField
BaseMousedownControlHookHandler	Hook handler type for the 'mousedown:control' event
BaseProps	The public prop types of the BaseField component
BaseSetupProps	The complete prop types (including setup) of the BaseField component
BaseSlots	The slot types of the BaseField component, combining VInput and VField slots
BaseUpdateFocusedHookHandler	Hook handler type for the 'update:focused' event
BaseUpdateModelValueHookHandler	Hook handler type for the 'update:modelValue' event
CastToEmitValidators	Converts emit functions back into emit validators. Maps emit functions (args => void) to validator signatures (args => boolean).
ComponentPublicInstanceType	Utility type that merges a component constructor's instance type with Vue's ComponentPublicInstance. Provides proper typing for component instances that includes both the component's own properties/methods and Vue's public instance API (e.g., $el, $emit, $props, etc.).
EmitFunctions	Converts emit validators into emit functions. Maps validator signatures (args => boolean) to emit functions (args => void).
EmitHandlerProps	Type helper that generates emit handler prop types from emit validators. Creates both camelCase and kebab-case variants for each emit.
ExtractEmitsFromArray	Extracts emit validators from array format emits definition.
ExtractEmitsFromObject	Extracts emit validators from object format emits definition.
ExtractEmitsFromProps	Extracts emit validators from a component's props (event handlers). Maps event handler props like 'onUpdate:modelValue' to validator format.
ExtractEmitValidatorsFromComponent	Extracts emit validators from a Vue component definition. This type utility examines both: 1. The component's .emits property (array or object format) 2. The component's prop types for event handlers (onEventName props)
ExtractEventArgsFromProp	Helper to extract event arguments from emit handler prop type.
ExtractEventNamesFromProps	Helper to extract event names from emit handler props (onEventName format). Converts prop names like 'onUpdate:modelValue' or 'onUpdateModelValue' to event names. Filters out Vue internal events (vnode*, $*).
ExtractPrivatePropTypesFromFactory	Extracts the complete (including private) prop types from a prop factory function.
ExtractPublicPropTypesFromFactory	Extracts the public prop types from a prop factory function. Useful for obtaining the public prop interface from a factory that returns prop definitions.
ExtractSlotDefinitions	Extracts the slot definitions from a component with a slots property. Works with both components that have a slots property and direct SlotsType definitions.
FieldHookHandler	Handler type for field hooks that can be either a direct handler or a provider.
GetComponentInstance	Helper to get component instance type from constructor or component definition.
GetComponentProps	Helper to get component props from instance.
HookableEvents	Converts emit validators/functions into hookable events with cleanup support. Each event gets a tuple of [callbackArgs, cleanupCallbackArgs] to support hook lifecycle.
IconValue	Type representing an icon value that can be used in Vuetify components. Can be a string (icon name), component, or function that returns a component.
IconValue	Type representing an icon value that can be used in Vuetify components. Can be a string (icon name), component, or function that returns a component.
IfAny	Conditional type that returns Y if T is any, otherwise returns N.
InferPropType	Infers the actual prop type from a Vue prop definition. Handles string/number/boolean constructors, prop objects with type, defaults, and more.
MergeDefault	Merges a prop type with a default value, making the prop type non-nullable.
MergeTypeDefault	Merges a prop type with a default value type. If no default is provided, returns just the prop type; otherwise returns the union.
NamedSlotParameters	Extracts the parameter types from a named slot by name.
ObjectStrippedOfUndefinedValues	Type utility that removes all keys with undefined values from an object type.
PartialKeys	Creates a type where all keys are optional and values are unknown. Useful for partial key matching in conditional types.
PropFactory	A factory function type that creates prop definitions with optional defaults. Returns a function that takes optional defaults and returns props with those defaults applied.
RemoveIndexSignature	Helper to remove index signatures from a type, keeping only explicit keys.
ResolvedBaseProps	Resolved prop types with proper type inference from the BaseField props factory
SlotParameters	Extracts the parameter types from a slot function.
UsePassthroughHookOptions	Options for usePassthroughHook that control when and how a fallback is executed and how the produced handler is scheduled.
VFieldDefaultSlotProps	The prop types for the default slot of Vuetify's VField component. Provides typed access to the props passed to VField's default slot, including field state, focus handlers, and validation status.
VFieldSlots	Slot definitions for Vuetify's VField component. Includes slots for field elements like prepend-inner, append-inner, clear, label, and loader.
VInputSlots	Slot definitions for Vuetify's VInput component. Includes slots for input wrapper elements like prepend, append, details, and message.

Utilities

Function	Description
extractEmitsFromComponentCtor	Extracts emit validators from a Vue component's emits definition. Supports both array format (event names only) and object format (with validators).
getCamelAndMaybeKebabPropKeysFor	Converts an event name to both camelCase and kebab-case handler prop names. Handles events with colons by treating the first part specially (prepending 'on').
isHTMLElement	Type guard that checks if a value is an HTMLElement. Safe to use in SSR environments.
isObject	Type guard that checks if a value is a plain object (not null, not an array).
omit	Utility function that creates a new object with specified keys removed. Useful for filtering out unwanted properties from an object.
pick	Utility function that creates a new object with only specified keys included. Useful for extracting a subset of properties from an object.
stripUndefinedValuesFromObject	Removes all properties with undefined values from an object. This is useful for cleaning up objects before passing them to APIs or components that should not receive undefined values.
svgPathToIconValue	Converts an SVG path string to an IconValue that can be used in Vuetify components.
useSlot	Retrieves a slot from the slots object with proper typing.
useSlotRenderer	Creates a slot renderer function that safely invokes a slot with proper typing. Returns a function that will render the slot if provided, or return undefined if not.