vue-component-type-helpers

Helper utilities for extracting types such as props, slots, attrs, emit, and exposed from Vue component types. No runtime dependencies; provides TypeScript type definitions only.

Installation

npm install vue-component-type-helpers

Type Helpers

`ComponentProps<T>`

Extracts the props type of a component.

import type { ComponentProps } from 'vue-component-type-helpers';
import MyComponent from './MyComponent.vue';

type Props = ComponentProps<typeof MyComponent>;

`ComponentSlots<T>`

Extracts the slots type of a component.

import type { ComponentSlots } from 'vue-component-type-helpers';
import MyComponent from './MyComponent.vue';

type Slots = ComponentSlots<typeof MyComponent>;

`ComponentAttrs<T>`

Extracts the attrs type of a component.

import type { ComponentAttrs } from 'vue-component-type-helpers';
import MyComponent from './MyComponent.vue';

type Attrs = ComponentAttrs<typeof MyComponent>;

`ComponentEmit<T>`

Extracts the emit function type of a component.

import type { ComponentEmit } from 'vue-component-type-helpers';
import MyComponent from './MyComponent.vue';

type Emit = ComponentEmit<typeof MyComponent>;

`ComponentExposed<T>`

Extracts the instance type exposed via defineExpose.

import type { ComponentExposed } from 'vue-component-type-helpers';
import MyComponent from './MyComponent.vue';

type Exposed = ComponentExposed<typeof MyComponent>;

Example

Given the following component:

<!-- MyComponent.vue -->
<script setup lang="ts">
defineProps<{
  title: string;
  count?: number;
}>();

defineEmits<{
  update: [value: string];
  close: [];
}>();

defineSlots<{
  default(props: { item: string }): any;
  header(): any;
}>();

const internalState = ref(0);
defineExpose({
  reset: () => { internalState.value = 0; },
});
</script>

Using type helpers:

import type { ComponentProps, ComponentSlots, ComponentEmit, ComponentExposed } from 'vue-component-type-helpers';
import MyComponent from './MyComponent.vue';

type Props = ComponentProps<typeof MyComponent>;
// { title: string; count?: number }

type Slots = ComponentSlots<typeof MyComponent>;
// { default(props: { item: string }): any; header(): any }

type Emit = ComponentEmit<typeof MyComponent>;
// { (e: 'update', value: string): void; (e: 'close'): void }

type Exposed = ComponentExposed<typeof MyComponent>;
// { reset: () => void }

License

MIT License

Current Tags

3.0.6 ... latest (8 months ago)

134 Versions

3.0.6 ... 8 months ago
3.0.5 ... 8 months ago
3.0.4 ... 9 months ago
3.0.3 ... 9 months ago
3.0.2 ... 9 months ago
3.0.1 ... 9 months ago
2.2.12 ... 9 months ago
3.0.0 ... 9 months ago
3.0.0-beta.5 ... 10 months ago
3.0.0-beta.4 ... 10 months ago
3.0.0-beta.3 ... 10 months ago
3.0.0-beta.2 ... 10 months ago
3.0.0-beta.1 ... 10 months ago
3.0.0-alpha.10 ... 10 months ago
3.0.0-alpha.8 ... a year ago
3.0.0-alpha.6 ... a year ago
2.2.10 ... a year ago
3.0.0-alpha.4 ... a year ago
3.0.0-alpha.2 ... a year ago
3.0.0-alpha.0 ... a year ago
2.2.8 ... a year ago
2.2.6 ... a year ago
2.2.4 ... a year ago
2.2.2 ... a year ago
2.2.0 ... a year ago
2.1.10 ... a year ago
2.1.8 ... a year ago
2.1.6 ... 2 years ago
2.1.5 [deprecated] ... 2 years ago
2.1.4 ... 2 years ago
2.1.2 ... 2 years ago
2.1.0 ... 2 years ago
2.0.29 ... 2 years ago
2.0.28 ... 2 years ago
2.0.26 ... 2 years ago
2.0.26-alpha.2 ... 2 years ago
2.0.26-alpha.1 ... 2 years ago
2.0.26-alpha.0 ... 2 years ago
2.0.24 ... 2 years ago
2.0.23-alpha.1 ... 2 years ago
2.0.23-alpha.0 ... 2 years ago
2.0.22 ... 2 years ago
2.0.21 ... 2 years ago
2.0.20 ... 2 years ago
2.0.19 ... 2 years ago
2.0.18 ... 2 years ago
2.0.17 ... 2 years ago
2.0.16 ... 2 years ago
2.0.15 ... 2 years ago
2.0.14 ... 2 years ago
2.0.13 ... 2 years ago
2.0.12 ... 2 years ago
2.0.11 ... 2 years ago
2.0.10 ... 2 years ago
2.0.7 ... 2 years ago
2.0.6 ... 2 years ago
2.0.5 ... 2 years ago
2.0.4 ... 2 years ago
2.0.3 ... 2 years ago
2.0.2 ... 2 years ago
2.0.1 ... 2 years ago
2.0.0 ... 2 years ago
1.8.27 ... 2 years ago
1.8.26 ... 2 years ago
1.8.25 ... 2 years ago
1.8.24 ... 2 years ago
1.9.0-alpha.3 ... 2 years ago
1.9.0-alpha.2 ... 2 years ago
1.9.0-alpha.1 ... 2 years ago
1.9.0-alpha.0 ... 2 years ago
1.8.22 ... 2 years ago
1.8.21 ... 2 years ago
1.8.20 ... 2 years ago
1.8.19 ... 3 years ago
1.8.18 ... 3 years ago
1.8.17 ... 3 years ago
1.8.16 ... 3 years ago
1.8.15 ... 3 years ago
1.8.14 ... 3 years ago
1.8.13 ... 3 years ago
1.8.12 ... 3 years ago
1.8.11 ... 3 years ago
1.8.10 ... 3 years ago
1.8.8 ... 3 years ago
1.8.7 ... 3 years ago
1.8.6 ... 3 years ago
1.8.5 ... 3 years ago
1.8.4 ... 3 years ago
1.8.3 ... 3 years ago
1.8.2 ... 3 years ago
1.8.1 ... 3 years ago
1.8.0-patch.1 ... 3 years ago
1.8.0 ... 3 years ago
1.7.14 ... 3 years ago
1.7.13 ... 3 years ago
1.7.12 ... 3 years ago
1.7.11 ... 3 years ago
1.7.10 ... 3 years ago
1.7.9 ... 3 years ago
1.7.8 ... 3 years ago
1.7.7 ... 3 years ago
1.7.6 ... 3 years ago
1.7.5 ... 3 years ago
1.7.4 ... 3 years ago
1.7.3 ... 3 years ago
1.6.5 ... 3 years ago
1.7.1 ... 3 years ago
1.7.0 ... 3 years ago
1.7.0-alpha.0 ... 3 years ago
1.6.4 ... 3 years ago
1.6.3 ... 3 years ago
1.6.2 ... 3 years ago
1.6.1 ... 3 years ago
1.6.0 ... 3 years ago
1.5.4 ... 3 years ago
1.5.3 ... 3 years ago
1.5.2 ... 3 years ago
1.5.1 ... 3 years ago
1.5.0 ... 3 years ago
1.4.4 ... 3 years ago
1.4.3 ... 3 years ago
1.4.2 ... 3 years ago
1.4.1 ... 3 years ago
1.4.0 ... 3 years ago
1.3.19 ... 3 years ago
1.3.18 ... 3 years ago
1.3.17 ... 3 years ago
1.3.16 ... 3 years ago
1.3.15 ... 3 years ago
1.3.14-patch.2 ... 3 years ago
1.3.14-patch.1 ... 3 years ago
1.3.14 ... 3 years ago
1.3.13 ... 3 years ago
1.3.12 ... 3 years ago