Two properties

// apps/docs/examples/ui/property-list.tsximport {Code} from '@workspace/active-ui/components/composed/code';import {  DescriptionItem,  DescriptionList,} from '@workspace/active-ui/components/composed/description-list';import {  PropertyList,  PropertyListItem,} from '@workspace/active-ui/components/composed/property-list';import {Badge} from '@workspace/active-ui/components/primitives/badge';
/** * A reference list of two properties, each with labels, its type and * default, and its meaning. With an `id` the name links to the property. * The API sections of this site are built from it. */export default function PropertyListExample() {  return (    <PropertyList className="w-full max-w-2xl">      <PropertyListItem        id="example-value"        name="value"        badges={<Badge variant="outline">required</Badge>}        meta={          <DescriptionList orientation="inline" columns={1}>            <DescriptionItem label="Type">              <Code>string</Code>            </DescriptionItem>          </DescriptionList>        }      >        The chosen calendar day as <Code>YYYY-MM-DD</Code>, or an empty string.      </PropertyListItem>      <PropertyListItem        id="example-placeholder"        name="placeholder"        meta={          <DescriptionList orientation="inline" columns={1}>            <DescriptionItem label="Type">              <Code>string</Code>            </DescriptionItem>            <DescriptionItem label="Default">              <Code>the input pattern</Code>            </DescriptionItem>          </DescriptionList>        }      >        Text in the empty field.      </PropertyListItem>    </PropertyList>  );}