@prefecthq/prefect-ui-library/src/schemas/compositions/useSchemaProperty.ts

This library is the Vue and Typescript component library for [Prefect 2](https://github.com/PrefectHQ/prefect) and [Prefect Cloud 2](https://www.prefect.io/cloud/). _The components and utilities in this project are not meant to be used independently_.

import { ComputedRef, MaybeRefOrGetter, computed, toValue } from 'vue'
import { useSchemaFormSettings } from '@/schemas/compositions/useSchemaFormSettings'
import { SchemaProperty } from '@/schemas/types/schema'
import { mergeSchemaPropertyDefinition } from '@/schemas/utilities/definitions'

type UseSchemaProperty = {
  property: ComputedRef<SchemaProperty>,
  label: ComputedRef<string>,
  description: ComputedRef<string>,
  disabled: ComputedRef<boolean>,
}

export function useSchemaProperty(source: MaybeRefOrGetter<SchemaProperty>, required?: MaybeRefOrGetter<boolean>): UseSchemaProperty {
  const { schema } = useSchemaFormSettings()

  const property = computed(() => {
    const value = toValue(source)

    return mergeSchemaPropertyDefinition(value, schema)
  })


  const label = computed(() => {
    const title = property.value.title ?? ''

    if (!toValue(required)) {
      return `${title} (Optional)`.trim()
    }

    return title
  })

  const description = computed(() => {
    const { description = '' } = property.value
    const descriptionWithNewlinesRemoved = description.replace(/\n(?!\n)/g, ' ')

    return descriptionWithNewlinesRemoved
  })

  const disabled = computed(() => Boolean(property.value.const))

  return {
    property,
    label,
    description,
    disabled,
  }
}