// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html

exports[`property.type > boolean > base 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r2g»"
            >
              bool (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r2h»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <button
            aria-checked="false"
            class="peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50"
            data-slot="switch"
            data-state="unchecked"
            id="«r2g»"
            role="switch"
            type="button"
            value="on"
          >
            <span
              class="bg-background dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0"
              data-slot="switch-thumb"
              data-state="unchecked"
            />
          </button>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > boolean > enum 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r2p»"
            >
              bool (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r2q»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <button
            aria-controls="radix-«r2s»"
            aria-expanded="false"
            aria-haspopup="listbox"
            aria-label="Select undefined"
            class="inline-flex items-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground h-9 px-4 py-2 w-full justify-between"
            data-slot="popover-trigger"
            data-state="closed"
            id="«r2p»"
            type="button"
          >
            Select
            <svg
              aria-hidden="true"
              class="lucide lucide-chevrons-up-down size-4 opacity-50"
              fill="none"
              height="24"
              stroke="currentColor"
              stroke-linecap="round"
              stroke-linejoin="round"
              stroke-width="2"
              viewBox="0 0 24 24"
              width="24"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                d="m7 15 5 5 5-5"
              />
              <path
                d="m7 9 5-5 5 5"
              />
            </svg>
          </button>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > boolean > with default 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r2m»"
            >
              bool (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r2n»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <button
            aria-checked="true"
            class="peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50"
            data-slot="switch"
            data-state="checked"
            id="«r2m»"
            role="switch"
            type="button"
            value="on"
          >
            <span
              class="bg-background dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0"
              data-slot="switch-thumb"
              data-state="checked"
            />
          </button>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > boolean > with value 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r2j»"
            >
              bool (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r2k»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <button
            aria-checked="true"
            class="peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50"
            data-slot="switch"
            data-state="checked"
            id="«r2j»"
            role="switch"
            type="button"
            value="on"
          >
            <span
              class="bg-background dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0"
              data-slot="switch-thumb"
              data-state="checked"
            />
          </button>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > integer > base 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r23»"
            >
              float (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r24»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <input
            class="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-xs transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50"
            id="«r23»"
            type="number"
            value=""
          />
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > integer > enum 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r2c»"
            >
              float (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r2d»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <button
            aria-controls="radix-«r2f»"
            aria-expanded="false"
            aria-haspopup="listbox"
            aria-label="Select undefined"
            class="inline-flex items-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground h-9 px-4 py-2 w-full justify-between"
            data-slot="popover-trigger"
            data-state="closed"
            id="«r2c»"
            type="button"
          >
            Select
            <svg
              aria-hidden="true"
              class="lucide lucide-chevrons-up-down size-4 opacity-50"
              fill="none"
              height="24"
              stroke="currentColor"
              stroke-linecap="round"
              stroke-linejoin="round"
              stroke-width="2"
              viewBox="0 0 24 24"
              width="24"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                d="m7 15 5 5 5-5"
              />
              <path
                d="m7 9 5-5 5 5"
              />
            </svg>
          </button>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > integer > with default 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r29»"
            >
              float (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r2a»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <input
            class="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-xs transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50"
            id="«r29»"
            type="number"
            value="123"
          />
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > integer > with value 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r26»"
            >
              float (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r27»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <input
            class="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-xs transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50"
            id="«r26»"
            type="number"
            value="123"
          />
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > null > base 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r2t»"
            >
              None (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r2u»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <p
            class="text-subdued text-sm"
          >
            Property is type "None"
          </p>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > number > base 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r1m»"
            >
              float (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r1n»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <input
            class="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-xs transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50"
            id="«r1m»"
            type="number"
            value=""
          />
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > number > enum 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r1v»"
            >
              float (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r20»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <button
            aria-controls="radix-«r22»"
            aria-expanded="false"
            aria-haspopup="listbox"
            aria-label="Select undefined"
            class="inline-flex items-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground h-9 px-4 py-2 w-full justify-between"
            data-slot="popover-trigger"
            data-state="closed"
            id="«r1v»"
            type="button"
          >
            Select
            <svg
              aria-hidden="true"
              class="lucide lucide-chevrons-up-down size-4 opacity-50"
              fill="none"
              height="24"
              stroke="currentColor"
              stroke-linecap="round"
              stroke-linejoin="round"
              stroke-width="2"
              viewBox="0 0 24 24"
              width="24"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                d="m7 15 5 5 5-5"
              />
              <path
                d="m7 9 5-5 5 5"
              />
            </svg>
          </button>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > number > with default 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r1s»"
            >
              float (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r1t»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <input
            class="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-xs transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50"
            id="«r1s»"
            type="number"
            value="123.45"
          />
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > number > with value 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r1p»"
            >
              float (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r1q»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <input
            class="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-xs transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50"
            id="«r1p»"
            type="number"
            value="123.45"
          />
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > string >  1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r0»"
            >
              str (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r1»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <textarea
            class="border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive flex field-sizing-content w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm min-h-min"
            data-slot="textarea"
            id="«r0»"
            rows="1"
          />
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > string > enum 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r1a»"
            >
              str (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r1b»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <button
            aria-controls="radix-«r1d»"
            aria-expanded="false"
            aria-haspopup="listbox"
            aria-label="Select undefined"
            class="inline-flex items-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground h-9 px-4 py-2 w-full justify-between"
            data-slot="popover-trigger"
            data-state="closed"
            id="«r1a»"
            type="button"
          >
            Select
            <svg
              aria-hidden="true"
              class="lucide lucide-chevrons-up-down size-4 opacity-50"
              fill="none"
              height="24"
              stroke="currentColor"
              stroke-linecap="round"
              stroke-linejoin="round"
              stroke-width="2"
              viewBox="0 0 24 24"
              width="24"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                d="m7 15 5 5 5-5"
              />
              <path
                d="m7 9 5-5 5 5"
              />
            </svg>
          </button>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > string > enum with default 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r1i»"
            >
              str (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r1j»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <button
            aria-controls="radix-«r1l»"
            aria-expanded="false"
            aria-haspopup="listbox"
            aria-label="Select undefined"
            class="inline-flex items-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground h-9 px-4 py-2 w-full justify-between text-muted-foreground"
            data-slot="popover-trigger"
            data-state="closed"
            id="«r1i»"
            type="button"
          >
            foo
            <svg
              aria-hidden="true"
              class="lucide lucide-chevrons-up-down size-4 opacity-50"
              fill="none"
              height="24"
              stroke="currentColor"
              stroke-linecap="round"
              stroke-linejoin="round"
              stroke-width="2"
              viewBox="0 0 24 24"
              width="24"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                d="m7 15 5 5 5-5"
              />
              <path
                d="m7 9 5-5 5 5"
              />
            </svg>
          </button>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > string > enum with value 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r1e»"
            >
              str (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r1f»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <button
            aria-controls="radix-«r1h»"
            aria-expanded="false"
            aria-haspopup="listbox"
            aria-label="Select undefined"
            class="inline-flex items-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground h-9 px-4 py-2 w-full justify-between text-muted-foreground"
            data-slot="popover-trigger"
            data-state="closed"
            id="«r1e»"
            type="button"
          >
            foo
            <svg
              aria-hidden="true"
              class="lucide lucide-chevrons-up-down size-4 opacity-50"
              fill="none"
              height="24"
              stroke="currentColor"
              stroke-linecap="round"
              stroke-linejoin="round"
              stroke-width="2"
              viewBox="0 0 24 24"
              width="24"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                d="m7 15 5 5 5-5"
              />
              <path
                d="m7 9 5-5 5 5"
              />
            </svg>
          </button>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > string > format:date 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r9»"
            >
              date (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«ra»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <button
            aria-controls="radix-«rc»"
            aria-expanded="false"
            aria-haspopup="dialog"
            class="inline-flex items-center whitespace-nowrap rounded-md text-sm transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground h-9 px-4 py-2 justify-start text-left font-normal w-full text-muted-foreground"
            data-slot="popover-trigger"
            data-state="closed"
            id="«r9»"
            type="button"
          >
            <svg
              aria-hidden="true"
              class="lucide lucide-calendar mr-2 h-4 w-4"
              fill="none"
              height="24"
              stroke="currentColor"
              stroke-linecap="round"
              stroke-linejoin="round"
              stroke-width="2"
              viewBox="0 0 24 24"
              width="24"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                d="M8 2v4"
              />
              <path
                d="M16 2v4"
              />
              <rect
                height="18"
                rx="2"
                width="18"
                x="3"
                y="4"
              />
              <path
                d="M3 10h18"
              />
            </svg>
            <span>
              Pick a date
            </span>
          </button>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > string > format:date with default 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«rh»"
            >
              date (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«ri»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <button
            aria-controls="radix-«rk»"
            aria-expanded="false"
            aria-haspopup="dialog"
            class="inline-flex items-center whitespace-nowrap rounded-md text-sm transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground h-9 px-4 py-2 justify-start text-left font-normal w-full"
            data-slot="popover-trigger"
            data-state="closed"
            id="«rh»"
            type="button"
          >
            <svg
              aria-hidden="true"
              class="lucide lucide-calendar mr-2 h-4 w-4"
              fill="none"
              height="24"
              stroke="currentColor"
              stroke-linecap="round"
              stroke-linejoin="round"
              stroke-width="2"
              viewBox="0 0 24 24"
              width="24"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                d="M8 2v4"
              />
              <path
                d="M16 2v4"
              />
              <rect
                height="18"
                rx="2"
                width="18"
                x="3"
                y="4"
              />
              <path
                d="M3 10h18"
              />
            </svg>
            January 1st, 2024
          </button>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > string > format:date with value 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«rd»"
            >
              date (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«re»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <button
            aria-controls="radix-«rg»"
            aria-expanded="false"
            aria-haspopup="dialog"
            class="inline-flex items-center whitespace-nowrap rounded-md text-sm transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground h-9 px-4 py-2 justify-start text-left font-normal w-full"
            data-slot="popover-trigger"
            data-state="closed"
            id="«rd»"
            type="button"
          >
            <svg
              aria-hidden="true"
              class="lucide lucide-calendar mr-2 h-4 w-4"
              fill="none"
              height="24"
              stroke="currentColor"
              stroke-linecap="round"
              stroke-linejoin="round"
              stroke-width="2"
              viewBox="0 0 24 24"
              width="24"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                d="M8 2v4"
              />
              <path
                d="M16 2v4"
              />
              <rect
                height="18"
                rx="2"
                width="18"
                x="3"
                y="4"
              />
              <path
                d="M3 10h18"
              />
            </svg>
            January 1st, 2024
          </button>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > string > format:date-time 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«rl»"
            >
              date-time (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«rm»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <button
            aria-controls="radix-«ro»"
            aria-expanded="false"
            aria-haspopup="dialog"
            class="inline-flex items-center whitespace-nowrap rounded-md text-sm transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground h-9 px-4 py-2 w-full justify-start text-left font-normal text-muted-foreground"
            data-slot="popover-trigger"
            data-state="closed"
            id="«rl»"
            type="button"
          >
            <svg
              class="mr-2 h-4 w-4"
              fill="none"
              height="15"
              viewBox="0 0 15 15"
              width="15"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                clip-rule="evenodd"
                d="M4.5 1C4.77614 1 5 1.22386 5 1.5V2H10V1.5C10 1.22386 10.2239 1 10.5 1C10.7761 1 11 1.22386 11 1.5V2H12.5C13.3284 2 14 2.67157 14 3.5V12.5C14 13.3284 13.3284 14 12.5 14H2.5C1.67157 14 1 13.3284 1 12.5V3.5C1 2.67157 1.67157 2 2.5 2H4V1.5C4 1.22386 4.22386 1 4.5 1ZM10 3V3.5C10 3.77614 10.2239 4 10.5 4C10.7761 4 11 3.77614 11 3.5V3H12.5C12.7761 3 13 3.22386 13 3.5V5H2V3.5C2 3.22386 2.22386 3 2.5 3H4V3.5C4 3.77614 4.22386 4 4.5 4C4.77614 4 5 3.77614 5 3.5V3H10ZM2 6V12.5C2 12.7761 2.22386 13 2.5 13H12.5C12.7761 13 13 12.7761 13 12.5V6H2ZM7 7.5C7 7.22386 7.22386 7 7.5 7C7.77614 7 8 7.22386 8 7.5C8 7.77614 7.77614 8 7.5 8C7.22386 8 7 7.77614 7 7.5ZM9.5 7C9.22386 7 9 7.22386 9 7.5C9 7.77614 9.22386 8 9.5 8C9.77614 8 10 7.77614 10 7.5C10 7.22386 9.77614 7 9.5 7ZM11 7.5C11 7.22386 11.2239 7 11.5 7C11.7761 7 12 7.22386 12 7.5C12 7.77614 11.7761 8 11.5 8C11.2239 8 11 7.77614 11 7.5ZM11.5 9C11.2239 9 11 9.22386 11 9.5C11 9.77614 11.2239 10 11.5 10C11.7761 10 12 9.77614 12 9.5C12 9.22386 11.7761 9 11.5 9ZM9 9.5C9 9.22386 9.22386 9 9.5 9C9.77614 9 10 9.22386 10 9.5C10 9.77614 9.77614 10 9.5 10C9.22386 10 9 9.77614 9 9.5ZM7.5 9C7.22386 9 7 9.22386 7 9.5C7 9.77614 7.22386 10 7.5 10C7.77614 10 8 9.77614 8 9.5C8 9.22386 7.77614 9 7.5 9ZM5 9.5C5 9.22386 5.22386 9 5.5 9C5.77614 9 6 9.22386 6 9.5C6 9.77614 5.77614 10 5.5 10C5.22386 10 5 9.77614 5 9.5ZM3.5 9C3.22386 9 3 9.22386 3 9.5C3 9.77614 3.22386 10 3.5 10C3.77614 10 4 9.77614 4 9.5C4 9.22386 3.77614 9 3.5 9ZM3 11.5C3 11.2239 3.22386 11 3.5 11C3.77614 11 4 11.2239 4 11.5C4 11.7761 3.77614 12 3.5 12C3.22386 12 3 11.7761 3 11.5ZM5.5 11C5.22386 11 5 11.2239 5 11.5C5 11.7761 5.22386 12 5.5 12C5.77614 12 6 11.7761 6 11.5C6 11.2239 5.77614 11 5.5 11ZM7 11.5C7 11.2239 7.22386 11 7.5 11C7.77614 11 8 11.2239 8 11.5C8 11.7761 7.77614 12 7.5 12C7.22386 12 7 11.7761 7 11.5ZM9.5 11C9.22386 11 9 11.2239 9 11.5C9 11.7761 9.22386 12 9.5 12C9.77614 12 10 11.7761 10 11.5C10 11.2239 9.77614 11 9.5 11Z"
                fill="currentColor"
                fill-rule="evenodd"
              />
            </svg>
            <span>
              MM/DD/YYYY hh:mm aa
            </span>
          </button>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > string > format:date-time with default 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«rt»"
            >
              date-time (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«ru»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <button
            aria-controls="radix-«r10»"
            aria-expanded="false"
            aria-haspopup="dialog"
            class="inline-flex items-center whitespace-nowrap rounded-md text-sm transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground h-9 px-4 py-2 w-full justify-start text-left font-normal"
            data-slot="popover-trigger"
            data-state="closed"
            id="«rt»"
            type="button"
          >
            <svg
              class="mr-2 h-4 w-4"
              fill="none"
              height="15"
              viewBox="0 0 15 15"
              width="15"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                clip-rule="evenodd"
                d="M4.5 1C4.77614 1 5 1.22386 5 1.5V2H10V1.5C10 1.22386 10.2239 1 10.5 1C10.7761 1 11 1.22386 11 1.5V2H12.5C13.3284 2 14 2.67157 14 3.5V12.5C14 13.3284 13.3284 14 12.5 14H2.5C1.67157 14 1 13.3284 1 12.5V3.5C1 2.67157 1.67157 2 2.5 2H4V1.5C4 1.22386 4.22386 1 4.5 1ZM10 3V3.5C10 3.77614 10.2239 4 10.5 4C10.7761 4 11 3.77614 11 3.5V3H12.5C12.7761 3 13 3.22386 13 3.5V5H2V3.5C2 3.22386 2.22386 3 2.5 3H4V3.5C4 3.77614 4.22386 4 4.5 4C4.77614 4 5 3.77614 5 3.5V3H10ZM2 6V12.5C2 12.7761 2.22386 13 2.5 13H12.5C12.7761 13 13 12.7761 13 12.5V6H2ZM7 7.5C7 7.22386 7.22386 7 7.5 7C7.77614 7 8 7.22386 8 7.5C8 7.77614 7.77614 8 7.5 8C7.22386 8 7 7.77614 7 7.5ZM9.5 7C9.22386 7 9 7.22386 9 7.5C9 7.77614 9.22386 8 9.5 8C9.77614 8 10 7.77614 10 7.5C10 7.22386 9.77614 7 9.5 7ZM11 7.5C11 7.22386 11.2239 7 11.5 7C11.7761 7 12 7.22386 12 7.5C12 7.77614 11.7761 8 11.5 8C11.2239 8 11 7.77614 11 7.5ZM11.5 9C11.2239 9 11 9.22386 11 9.5C11 9.77614 11.2239 10 11.5 10C11.7761 10 12 9.77614 12 9.5C12 9.22386 11.7761 9 11.5 9ZM9 9.5C9 9.22386 9.22386 9 9.5 9C9.77614 9 10 9.22386 10 9.5C10 9.77614 9.77614 10 9.5 10C9.22386 10 9 9.77614 9 9.5ZM7.5 9C7.22386 9 7 9.22386 7 9.5C7 9.77614 7.22386 10 7.5 10C7.77614 10 8 9.77614 8 9.5C8 9.22386 7.77614 9 7.5 9ZM5 9.5C5 9.22386 5.22386 9 5.5 9C5.77614 9 6 9.22386 6 9.5C6 9.77614 5.77614 10 5.5 10C5.22386 10 5 9.77614 5 9.5ZM3.5 9C3.22386 9 3 9.22386 3 9.5C3 9.77614 3.22386 10 3.5 10C3.77614 10 4 9.77614 4 9.5C4 9.22386 3.77614 9 3.5 9ZM3 11.5C3 11.2239 3.22386 11 3.5 11C3.77614 11 4 11.2239 4 11.5C4 11.7761 3.77614 12 3.5 12C3.22386 12 3 11.7761 3 11.5ZM5.5 11C5.22386 11 5 11.2239 5 11.5C5 11.7761 5.22386 12 5.5 12C5.77614 12 6 11.7761 6 11.5C6 11.2239 5.77614 11 5.5 11ZM7 11.5C7 11.2239 7.22386 11 7.5 11C7.77614 11 8 11.2239 8 11.5C8 11.7761 7.77614 12 7.5 12C7.22386 12 7 11.7761 7 11.5ZM9.5 11C9.22386 11 9 11.2239 9 11.5C9 11.7761 9.22386 12 9.5 12C9.77614 12 10 11.7761 10 11.5C10 11.2239 9.77614 11 9.5 11Z"
                fill="currentColor"
                fill-rule="evenodd"
              />
            </svg>
            01/01/2024 12:00 AM
          </button>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > string > format:date-time with value 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«rp»"
            >
              date-time (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«rq»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <button
            aria-controls="radix-«rs»"
            aria-expanded="false"
            aria-haspopup="dialog"
            class="inline-flex items-center whitespace-nowrap rounded-md text-sm transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground h-9 px-4 py-2 w-full justify-start text-left font-normal"
            data-slot="popover-trigger"
            data-state="closed"
            id="«rp»"
            type="button"
          >
            <svg
              class="mr-2 h-4 w-4"
              fill="none"
              height="15"
              viewBox="0 0 15 15"
              width="15"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                clip-rule="evenodd"
                d="M4.5 1C4.77614 1 5 1.22386 5 1.5V2H10V1.5C10 1.22386 10.2239 1 10.5 1C10.7761 1 11 1.22386 11 1.5V2H12.5C13.3284 2 14 2.67157 14 3.5V12.5C14 13.3284 13.3284 14 12.5 14H2.5C1.67157 14 1 13.3284 1 12.5V3.5C1 2.67157 1.67157 2 2.5 2H4V1.5C4 1.22386 4.22386 1 4.5 1ZM10 3V3.5C10 3.77614 10.2239 4 10.5 4C10.7761 4 11 3.77614 11 3.5V3H12.5C12.7761 3 13 3.22386 13 3.5V5H2V3.5C2 3.22386 2.22386 3 2.5 3H4V3.5C4 3.77614 4.22386 4 4.5 4C4.77614 4 5 3.77614 5 3.5V3H10ZM2 6V12.5C2 12.7761 2.22386 13 2.5 13H12.5C12.7761 13 13 12.7761 13 12.5V6H2ZM7 7.5C7 7.22386 7.22386 7 7.5 7C7.77614 7 8 7.22386 8 7.5C8 7.77614 7.77614 8 7.5 8C7.22386 8 7 7.77614 7 7.5ZM9.5 7C9.22386 7 9 7.22386 9 7.5C9 7.77614 9.22386 8 9.5 8C9.77614 8 10 7.77614 10 7.5C10 7.22386 9.77614 7 9.5 7ZM11 7.5C11 7.22386 11.2239 7 11.5 7C11.7761 7 12 7.22386 12 7.5C12 7.77614 11.7761 8 11.5 8C11.2239 8 11 7.77614 11 7.5ZM11.5 9C11.2239 9 11 9.22386 11 9.5C11 9.77614 11.2239 10 11.5 10C11.7761 10 12 9.77614 12 9.5C12 9.22386 11.7761 9 11.5 9ZM9 9.5C9 9.22386 9.22386 9 9.5 9C9.77614 9 10 9.22386 10 9.5C10 9.77614 9.77614 10 9.5 10C9.22386 10 9 9.77614 9 9.5ZM7.5 9C7.22386 9 7 9.22386 7 9.5C7 9.77614 7.22386 10 7.5 10C7.77614 10 8 9.77614 8 9.5C8 9.22386 7.77614 9 7.5 9ZM5 9.5C5 9.22386 5.22386 9 5.5 9C5.77614 9 6 9.22386 6 9.5C6 9.77614 5.77614 10 5.5 10C5.22386 10 5 9.77614 5 9.5ZM3.5 9C3.22386 9 3 9.22386 3 9.5C3 9.77614 3.22386 10 3.5 10C3.77614 10 4 9.77614 4 9.5C4 9.22386 3.77614 9 3.5 9ZM3 11.5C3 11.2239 3.22386 11 3.5 11C3.77614 11 4 11.2239 4 11.5C4 11.7761 3.77614 12 3.5 12C3.22386 12 3 11.7761 3 11.5ZM5.5 11C5.22386 11 5 11.2239 5 11.5C5 11.7761 5.22386 12 5.5 12C5.77614 12 6 11.7761 6 11.5C6 11.2239 5.77614 11 5.5 11ZM7 11.5C7 11.2239 7.22386 11 7.5 11C7.77614 11 8 11.2239 8 11.5C8 11.7761 7.77614 12 7.5 12C7.22386 12 7 11.7761 7 11.5ZM9.5 11C9.22386 11 9 11.2239 9 11.5C9 11.7761 9.22386 12 9.5 12C9.77614 12 10 11.7761 10 11.5C10 11.2239 9.77614 11 9.5 11Z"
                fill="currentColor"
                fill-rule="evenodd"
              />
            </svg>
            01/01/2024 12:00 AM
          </button>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > string > format:json-string 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r11»"
            >
              json-string (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r12»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <div
            class="rounded-md border shadow-xs overflow-hidden focus-within:outline-hidden focus-within:ring-1 focus-within:ring-ring relative"
            id="«r11»"
          >
            <div
              class="cm-editor ͼ1 ͼ2 ͼ4 ͼ17 ͼ15"
            >
              <div
                aria-live="polite"
                class="cm-announced"
              />
              <div
                class="cm-scroller"
                tabindex="-1"
              >
                <div
                  aria-hidden="true"
                  class="cm-gutters"
                  style="min-height: 14px; position: sticky;"
                >
                  <div
                    class="cm-gutter cm-lineNumbers"
                  >
                    <div
                      class="cm-gutterElement"
                      style="height: 0px; visibility: hidden; pointer-events: none;"
                    >
                      9
                    </div>
                    <div
                      class="cm-gutterElement cm-activeLineGutter"
                      style="height: 14px;"
                    >
                      1
                    </div>
                  </div>
                  <div
                    class="cm-gutter cm-foldGutter"
                  >
                    <div
                      class="cm-gutterElement"
                      style="height: 0px; visibility: hidden; pointer-events: none;"
                    >
                      <span
                        title="Unfold line"
                      >
                        ›
                      </span>
                    </div>
                    <div
                      class="cm-gutterElement cm-activeLineGutter"
                      style="height: 14px;"
                    />
                  </div>
                </div>
                <div
                  aria-multiline="true"
                  autocapitalize="off"
                  autocorrect="off"
                  class="cm-content cm-lineWrapping"
                  contenteditable="true"
                  data-language="json"
                  role="textbox"
                  spellcheck="false"
                  style="tab-size: 4;"
                  translate="no"
                >
                  <div
                    class="cm-activeLine cm-line"
                  >
                    <br />
                  </div>
                </div>
                <div
                  aria-hidden="true"
                  class="cm-layer cm-layer-above cm-cursorLayer"
                  style="z-index: 150; animation-duration: 1200ms;"
                />
                <div
                  aria-hidden="true"
                  class="cm-layer cm-selectionLayer"
                  style="z-index: -2;"
                />
              </div>
            </div>
          </div>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > string > format:json-string with default 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r17»"
            >
              json-string (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r18»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <div
            class="rounded-md border shadow-xs overflow-hidden focus-within:outline-hidden focus-within:ring-1 focus-within:ring-ring relative"
            id="«r17»"
          >
            <div
              class="cm-editor ͼ1 ͼ2 ͼ4 ͼ1d ͼ15"
            >
              <div
                aria-live="polite"
                class="cm-announced"
              />
              <div
                class="cm-scroller"
                tabindex="-1"
              >
                <div
                  aria-hidden="true"
                  class="cm-gutters"
                  style="min-height: 14px; position: sticky;"
                >
                  <div
                    class="cm-gutter cm-lineNumbers"
                  >
                    <div
                      class="cm-gutterElement"
                      style="height: 0px; visibility: hidden; pointer-events: none;"
                    >
                      9
                    </div>
                    <div
                      class="cm-gutterElement cm-activeLineGutter"
                      style="height: 14px;"
                    >
                      1
                    </div>
                  </div>
                  <div
                    class="cm-gutter cm-foldGutter"
                  >
                    <div
                      class="cm-gutterElement"
                      style="height: 0px; visibility: hidden; pointer-events: none;"
                    >
                      <span
                        title="Unfold line"
                      >
                        ›
                      </span>
                    </div>
                    <div
                      class="cm-gutterElement cm-activeLineGutter"
                      style="height: 14px;"
                    />
                  </div>
                </div>
                <div
                  aria-multiline="true"
                  autocapitalize="off"
                  autocorrect="off"
                  class="cm-content cm-lineWrapping"
                  contenteditable="true"
                  data-language="json"
                  role="textbox"
                  spellcheck="false"
                  style="tab-size: 4;"
                  translate="no"
                >
                  <div
                    class="cm-activeLine cm-line"
                  >
                    {"foo": 
                    <span
                      class="ͼe"
                    >
                      "bar"
                    </span>
                    }
                  </div>
                </div>
                <div
                  aria-hidden="true"
                  class="cm-layer cm-layer-above cm-cursorLayer"
                  style="z-index: 150; animation-duration: 1200ms;"
                />
                <div
                  aria-hidden="true"
                  class="cm-layer cm-selectionLayer"
                  style="z-index: -2;"
                />
              </div>
            </div>
          </div>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > string > format:json-string with value 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r14»"
            >
              json-string (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r15»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <div
            class="rounded-md border shadow-xs overflow-hidden focus-within:outline-hidden focus-within:ring-1 focus-within:ring-ring relative"
            id="«r14»"
          >
            <div
              class="cm-editor ͼ1 ͼ2 ͼ4 ͼ1a ͼ15"
            >
              <div
                aria-live="polite"
                class="cm-announced"
              />
              <div
                class="cm-scroller"
                tabindex="-1"
              >
                <div
                  aria-hidden="true"
                  class="cm-gutters"
                  style="min-height: 14px; position: sticky;"
                >
                  <div
                    class="cm-gutter cm-lineNumbers"
                  >
                    <div
                      class="cm-gutterElement"
                      style="height: 0px; visibility: hidden; pointer-events: none;"
                    >
                      9
                    </div>
                    <div
                      class="cm-gutterElement cm-activeLineGutter"
                      style="height: 14px;"
                    >
                      1
                    </div>
                  </div>
                  <div
                    class="cm-gutter cm-foldGutter"
                  >
                    <div
                      class="cm-gutterElement"
                      style="height: 0px; visibility: hidden; pointer-events: none;"
                    >
                      <span
                        title="Unfold line"
                      >
                        ›
                      </span>
                    </div>
                    <div
                      class="cm-gutterElement cm-activeLineGutter"
                      style="height: 14px;"
                    />
                  </div>
                </div>
                <div
                  aria-multiline="true"
                  autocapitalize="off"
                  autocorrect="off"
                  class="cm-content cm-lineWrapping"
                  contenteditable="true"
                  data-language="json"
                  role="textbox"
                  spellcheck="false"
                  style="tab-size: 4;"
                  translate="no"
                >
                  <div
                    class="cm-activeLine cm-line"
                  >
                    {"foo": 
                    <span
                      class="ͼe"
                    >
                      "bar"
                    </span>
                    }
                  </div>
                </div>
                <div
                  aria-hidden="true"
                  class="cm-layer cm-layer-above cm-cursorLayer"
                  style="z-index: 150; animation-duration: 1200ms;"
                />
                <div
                  aria-hidden="true"
                  class="cm-layer cm-selectionLayer"
                  style="z-index: -2;"
                />
              </div>
            </div>
          </div>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > string > with default 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r6»"
            >
              str (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r7»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <textarea
            class="border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive flex field-sizing-content w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm min-h-min"
            data-slot="textarea"
            id="«r6»"
            rows="1"
          >
            foo
          </textarea>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > string > with value 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r3»"
            >
              str (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r4»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <textarea
            class="border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive flex field-sizing-content w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm min-h-min"
            data-slot="textarea"
            id="«r3»"
            rows="1"
          >
            foo
          </textarea>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > unknown > base 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r30»"
            >
              Field (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r31»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <div
            class="rounded-md border shadow-xs overflow-hidden focus-within:outline-hidden focus-within:ring-1 focus-within:ring-ring relative"
            id="«r30»"
          >
            <div
              class="cm-editor ͼ1 ͼ2 ͼ4 ͼ1g ͼ15"
            >
              <div
                aria-live="polite"
                class="cm-announced"
              />
              <div
                class="cm-scroller"
                tabindex="-1"
              >
                <div
                  aria-hidden="true"
                  class="cm-gutters"
                  style="min-height: 14px; position: sticky;"
                >
                  <div
                    class="cm-gutter cm-lineNumbers"
                  >
                    <div
                      class="cm-gutterElement"
                      style="height: 0px; visibility: hidden; pointer-events: none;"
                    >
                      9
                    </div>
                    <div
                      class="cm-gutterElement cm-activeLineGutter"
                      style="height: 14px;"
                    >
                      1
                    </div>
                  </div>
                  <div
                    class="cm-gutter cm-foldGutter"
                  >
                    <div
                      class="cm-gutterElement"
                      style="height: 0px; visibility: hidden; pointer-events: none;"
                    >
                      <span
                        title="Unfold line"
                      >
                        ›
                      </span>
                    </div>
                    <div
                      class="cm-gutterElement cm-activeLineGutter"
                      style="height: 14px;"
                    />
                  </div>
                </div>
                <div
                  aria-multiline="true"
                  autocapitalize="off"
                  autocorrect="off"
                  class="cm-content cm-lineWrapping"
                  contenteditable="true"
                  data-language="json"
                  role="textbox"
                  spellcheck="false"
                  style="tab-size: 4;"
                  translate="no"
                >
                  <div
                    class="cm-activeLine cm-line"
                  >
                    <br />
                  </div>
                </div>
                <div
                  aria-hidden="true"
                  class="cm-layer cm-layer-above cm-cursorLayer"
                  style="z-index: 150; animation-duration: 1200ms;"
                />
                <div
                  aria-hidden="true"
                  class="cm-layer cm-selectionLayer"
                  style="z-index: -2;"
                />
              </div>
            </div>
          </div>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > unknown > with default 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r37»"
            >
              Field (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r38»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <div
            class="rounded-md border shadow-xs overflow-hidden focus-within:outline-hidden focus-within:ring-1 focus-within:ring-ring relative"
            id="«r37»"
          >
            <div
              class="cm-editor ͼ1 ͼ2 ͼ4 ͼ1j ͼ15"
            >
              <div
                aria-live="polite"
                class="cm-announced"
              />
              <div
                class="cm-scroller"
                tabindex="-1"
              >
                <div
                  aria-hidden="true"
                  class="cm-gutters"
                  style="min-height: 14px; position: sticky;"
                >
                  <div
                    class="cm-gutter cm-lineNumbers"
                  >
                    <div
                      class="cm-gutterElement"
                      style="height: 0px; visibility: hidden; pointer-events: none;"
                    >
                      9
                    </div>
                    <div
                      class="cm-gutterElement cm-activeLineGutter"
                      style="height: 14px;"
                    >
                      1
                    </div>
                  </div>
                  <div
                    class="cm-gutter cm-foldGutter"
                  >
                    <div
                      class="cm-gutterElement"
                      style="height: 0px; visibility: hidden; pointer-events: none;"
                    >
                      <span
                        title="Unfold line"
                      >
                        ›
                      </span>
                    </div>
                    <div
                      class="cm-gutterElement cm-activeLineGutter"
                      style="height: 14px;"
                    />
                  </div>
                </div>
                <div
                  aria-multiline="true"
                  autocapitalize="off"
                  autocorrect="off"
                  class="cm-content cm-lineWrapping"
                  contenteditable="true"
                  data-language="json"
                  role="textbox"
                  spellcheck="false"
                  style="tab-size: 4;"
                  translate="no"
                >
                  <div
                    class="cm-activeLine cm-line"
                  >
                    <br />
                  </div>
                </div>
                <div
                  aria-hidden="true"
                  class="cm-layer cm-layer-above cm-cursorLayer"
                  style="z-index: 150; animation-duration: 1200ms;"
                />
                <div
                  aria-hidden="true"
                  class="cm-layer cm-selectionLayer"
                  style="z-index: -2;"
                />
              </div>
            </div>
          </div>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;

exports[`property.type > unknown > with value 1`] = `
<div>
  <div
    class="flex flex-col gap-4"
  >
    <div
      class="flex flex-col gap-4"
    >
      <div
        class="flex flex-col gap-2 group"
      >
        <div
          class="grid grid-cols-[1fr_auto] items-center gap-2"
        >
          <div
            class="flex flex-col gap-1"
          >
            <label
              class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
              data-slot="label"
              for="«r33»"
            >
              Field (Optional)
            </label>
          </div>
          <div
            class="ml-auto"
          >
            <button
              aria-expanded="false"
              aria-haspopup="menu"
              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-8 w-8 p-0 opacity-0 transition-opacity disabled:!opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 data-[open=true]:opacity-100"
              data-open="false"
              data-slot="dropdown-menu-trigger"
              data-state="closed"
              id="radix-«r34»"
              type="button"
            >
              <span
                class="sr-only"
              >
                Open menu
              </span>
              <svg
                aria-hidden="true"
                class="lucide lucide-ellipsis-vertical size-4"
                fill="none"
                height="24"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="24"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="12"
                  cy="12"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="5"
                  r="1"
                />
                <circle
                  cx="12"
                  cy="19"
                  r="1"
                />
              </svg>
            </button>
          </div>
        </div>
        <fieldset>
          <button
            aria-controls="radix-«r36»"
            aria-expanded="false"
            aria-haspopup="listbox"
            aria-label="Select undefined"
            class="inline-flex items-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground h-9 px-4 py-2 w-full justify-between text-muted-foreground"
            data-slot="popover-trigger"
            data-state="closed"
            id="«r33»"
            type="button"
          >
            foo
            <svg
              aria-hidden="true"
              class="lucide lucide-chevrons-up-down size-4 opacity-50"
              fill="none"
              height="24"
              stroke="currentColor"
              stroke-linecap="round"
              stroke-linejoin="round"
              stroke-width="2"
              viewBox="0 0 24 24"
              width="24"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                d="m7 15 5 5 5-5"
              />
              <path
                d="m7 9 5-5 5 5"
              />
            </svg>
          </button>
        </fieldset>
      </div>
    </div>
  </div>
</div>
`;
