diff --git a/packages/vue/src/components/editable/editable.types.ts b/packages/vue/src/components/editable/editable.types.ts index cc09625a7c..06ee690ad4 100644 --- a/packages/vue/src/components/editable/editable.types.ts +++ b/packages/vue/src/components/editable/editable.types.ts @@ -4,9 +4,9 @@ export interface RootProps { /** * The activation mode for the preview element. * - * - "focus" - Enter edit mode when the preview element is focused - * - "dblclick" - Enter edit mode when the preview element is double-clicked - * - "none" - No interaction with the preview element will trigger edit mode. + * - "focus" - Enter edit mode when the preview is focused + * - "dblclick" - Enter edit mode when the preview is double-clicked + * - "click" - Enter edit mode when the preview is clicked * * @default "focus" */ @@ -107,16 +107,11 @@ export interface RootProps { translations?: editable.IntlTranslations } -// TODO: remove when Zag is fixed -export interface EditChangeDetails { - edit: boolean -} - export type RootEmits = { /** - * The callback that is called when in the edit mode. + * The callback that is called when the edit mode is changed */ - editChange: [event: EditChangeDetails] + editChange: [details: editable.EditChangeDetails] /** * Function called when the focus is moved outside the component */ diff --git a/packages/vue/src/components/field/field.types.ts b/packages/vue/src/components/field/field.types.ts index 6ccd55eb2d..027c12b203 100644 --- a/packages/vue/src/components/field/field.types.ts +++ b/packages/vue/src/components/field/field.types.ts @@ -7,6 +7,10 @@ export interface ElementIds { } export interface RootProps { + /** + * Indicates whether the field is disabled. + */ + disabled?: boolean /** * The id of the field. */ @@ -15,14 +19,6 @@ export interface RootProps { * The ids of the field parts. */ ids?: ElementIds - /** - * Indicates whether the field is required. - */ - required?: boolean - /** - * Indicates whether the field is disabled. - */ - disabled?: boolean /** * Indicates whether the field is invalid. */ @@ -31,4 +27,8 @@ export interface RootProps { * Indicates whether the field is read-only. */ readOnly?: boolean + /** + * Indicates whether the field is required. + */ + required?: boolean } diff --git a/packages/vue/src/components/fieldset/fieldset.types.ts b/packages/vue/src/components/fieldset/fieldset.types.ts index 71993d0aa5..f272090eb8 100644 --- a/packages/vue/src/components/fieldset/fieldset.types.ts +++ b/packages/vue/src/components/fieldset/fieldset.types.ts @@ -1,12 +1,12 @@ export interface RootProps { - /** - * The id of the fieldset. - */ - id?: string /** * Indicates whether the fieldset is disabled. */ disabled?: boolean | 'true' | 'false' + /** + * The id of the fieldset. + */ + id?: string /** * Indicates whether the fieldset is invalid. */ diff --git a/packages/vue/src/components/file-upload/file-upload.types.ts b/packages/vue/src/components/file-upload/file-upload.types.ts index 338ecfcdd4..c5f2791e8a 100644 --- a/packages/vue/src/components/file-upload/file-upload.types.ts +++ b/packages/vue/src/components/file-upload/file-upload.types.ts @@ -40,6 +40,10 @@ export interface RootProps { itemSizeText(id: string): string itemPreview(id: string): string }> + /** + * Whether the file input is invalid + */ + invalid?: boolean /** * The current locale. Based on the BCP 47 definition. * @default "en-US" @@ -77,11 +81,7 @@ export interface RootProps { /** * Function to validate a file */ - validate?: (file: File) => fileUpload.FileError[] - /** - * Whether the file input is invalid - */ - invalid?: boolean + validate?: (file: File) => fileUpload.FileError[] | null } export type RootEmits = { diff --git a/packages/vue/src/components/steps/steps.types.ts b/packages/vue/src/components/steps/steps.types.ts index bc9f7eed0b..f55534cb66 100644 --- a/packages/vue/src/components/steps/steps.types.ts +++ b/packages/vue/src/components/steps/steps.types.ts @@ -2,7 +2,7 @@ import type * as steps from '@zag-js/steps' export interface RootProps { /** - * The number of steps in the component. + * The total number of steps */ count?: number /** @@ -14,49 +14,34 @@ export interface RootProps { */ id?: string /** - * The ids of the elements. Useful for composition. + * The custom ids for the stepper elements */ - ids?: Partial<{ - root: string - list: string - progress: string - trigger(index: number): string - separator(index: number): string - item(index: number): string - itemContent(index: number): string - }> + ids?: steps.ElementIds /** - * Whether the step transitions should be linear and require the user - * to go through each step one by one. - * - * @default false + * If `true`, the stepper requires the user to complete the steps in order */ linear?: boolean /** - * The orientation of the steps. - * - * @default "horizontal" + * The v-model value of the step */ - orientation?: 'horizontal' | 'vertical' + modelValue?: number /** - * The v-model value of the component. + * The orientation of the stepper */ - modelValue?: number + orientation?: 'horizontal' | 'vertical' } export type RootEmits = { /** - * Event triggered when a step is changed, either by clicking on a step, - * clicking on the next/previous triggers, or by calling `setStep`. + * Callback to be called when the value changes */ stepChange: [details: steps.StepChangeDetails] /** - * Event triggered when a step is completed by clicking on the next/previous - * triggers or by calling `setStep`. + * Callback to be called when a step is completed */ stepComplete: [] /** - * Event triggered when the model value changes. + * The callback fired when the model value changes. */ - 'update:modelValue': [step: number] + 'update:modelValue': [value: number] } diff --git a/scripts/src/generate-vue-props.ts b/scripts/src/generate-vue-props.ts index c5f639bd12..28b805cc25 100644 --- a/scripts/src/generate-vue-props.ts +++ b/scripts/src/generate-vue-props.ts @@ -122,7 +122,7 @@ const main = async () => { Promise.all( components .map((component) => parse(component).base) - .filter((x) => !['format', 'toast'].includes(x)) + .filter((x) => !['format', 'toast', 'highlight', 'frame'].includes(x)) .map(extractTypes), ) } diff --git a/website/src/content/types/vue/editable.types.json b/website/src/content/types/vue/editable.types.json index fc226147a0..66dea5002b 100644 --- a/website/src/content/types/vue/editable.types.json +++ b/website/src/content/types/vue/editable.types.json @@ -65,9 +65,9 @@ "Root": { "emits": { "editChange": { - "type": "[event: EditChangeDetails]", + "type": "[details: EditChangeDetails]", "isRequired": true, - "description": "The callback that is called when in the edit mode." + "description": "The callback that is called when the edit mode is changed" }, "focusOutside": { "type": "[event: FocusOutsideEvent]", @@ -115,7 +115,7 @@ "type": "ActivationMode", "defaultValue": "\"focus\"", "isRequired": false, - "description": "The activation mode for the preview element.\n\n- \"focus\" - Enter edit mode when the preview element is focused\n- \"dblclick\" - Enter edit mode when the preview element is double-clicked\n- \"none\" - No interaction with the preview element will trigger edit mode." + "description": "The activation mode for the preview element.\n\n- \"focus\" - Enter edit mode when the preview is focused\n- \"dblclick\" - Enter edit mode when the preview is double-clicked\n- \"click\" - Enter edit mode when the preview is clicked" }, "asChild": { "type": "boolean", diff --git a/website/src/content/types/vue/file-upload.types.json b/website/src/content/types/vue/file-upload.types.json index ec2ff3c6bb..68df9d1777 100644 --- a/website/src/content/types/vue/file-upload.types.json +++ b/website/src/content/types/vue/file-upload.types.json @@ -210,7 +210,7 @@ "description": "The localized messages to use." }, "validate": { - "type": "(file: File) => FileError[]", + "type": "(file: File) => FileError[] | null", "isRequired": false, "description": "Function to validate a file" } diff --git a/website/src/content/types/vue/steps.types.json b/website/src/content/types/vue/steps.types.json index cab16855df..6a7ba0c8da 100644 --- a/website/src/content/types/vue/steps.types.json +++ b/website/src/content/types/vue/steps.types.json @@ -83,7 +83,7 @@ "count": { "type": "number", "isRequired": false, - "description": "The number of steps in the component." + "description": "The total number of steps" }, "defaultStep": { "type": "number", @@ -96,26 +96,24 @@ "description": "The unique identifier of the machine." }, "ids": { - "type": "Partial<{\n root: string\n list: string\n progress: string\n trigger(index: number): string\n separator(index: number): string\n item(index: number): string\n itemContent(index: number): string\n}>", + "type": "ElementIds", "isRequired": false, - "description": "The ids of the elements. Useful for composition." + "description": "The custom ids for the stepper elements" }, "linear": { "type": "boolean", - "defaultValue": "false", "isRequired": false, - "description": "Whether the step transitions should be linear and require the user\nto go through each step one by one." + "description": "If `true`, the stepper requires the user to complete the steps in order" }, "modelValue": { "type": "number", "isRequired": false, - "description": "The v-model value of the component." + "description": "The v-model value of the step" }, "orientation": { "type": "'horizontal' | 'vertical'", - "defaultValue": "\"horizontal\"", "isRequired": false, - "description": "The orientation of the steps." + "description": "The orientation of the stepper" } } },