shishirraven

add_action( 'rest_api_init', 'rest_api_filter_add_filters' );

 /**
  * Add the necessary filter to each post type
  **/
function rest_api_filter_add_filters() {
	foreach ( get_post_types( array( 'show_in_rest' => true ), 'objects' ) as $post_type ) {
		add_filter( 'rest_' . $post_type->name . '_query', 'rest_api_filter_add_filter_param', 10, 2 );
	}
}

shishirraven

add_action( 'rest_api_init', 'addOrderbySupportRest' );

function addOrderbySupportRest(){

	$post_type ="wf_account";
	// Add meta your meta field to the allowed values of the REST API orderby parameter
	add_filter(
		'rest_' . $post_type . '_collection_params',
		function( $params ) {
			$fields = ["first_name","last_name","address","email"];

shishirraven

add_filter(
    'rest_' . $post_type . '_query',
    function ( $args, $request ) {
		 $fields = ["first_name","last_name","address","email"];
        $order_by = $request->get_param( 'orderby' );
        if ( isset( $order_by ) && in_array($order_by, $fields)) {
            $args['meta_key'] = $order_by;
            $args['orderby']  = 'meta_value'; // user 'meta_value_num' for numerical fields
        }
        return $args;

shishirraven

$post_type ="wf_account";
// Add meta your meta field to the allowed values of the REST API orderby parameter
add_filter(
    'rest_' . $post_type . '_collection_params',
    function( $params ) {
		 $fields = ["first_name","last_name","address","email"];
		foreach ($fields as $key => $value) {
			$params['orderby']['enum'][] = $value;
		}
        return $params;

shishirraven

<template>
 <div>
    <BraveSelect class="me-3" v-model="selectValue" :options="options" dropdown-class="shadow rounded border list-group bg-white">
      <template v-slot:button="{ selectedValue }">
        <div  role="button" class="btn btn-primary text-white px-3 d-flex ">
           <div v-if="selectedValue!=null">
            <strong>{{ selectedValue.name }} </strong>  is written in <strong>  {{ selectedValue.language }}</strong> 
           </div>
           <div v-else>
             Select a Value

shishirraven

    <BraveDropMenu class="me-3">
      <template #button>
        <div role="button" class="btn btn-primary text-white px-3 "> <i class="bi bi-plus-lg"></i> Button <i class="bi bi-chevron-down"></i></div>
      </template>
      <template #menu>
        <div class="list-group bg-white shadow" style="min-width:200px;" >
          <div role="button" class="list-group-item list-group-item-action"><i class="bi me-1 bi-person-plus"></i> A second link item</div>
          <div role="button" class="list-group-item list-group-item-action"><i class="bi me-1 bi-envelope-plus"></i> A second link item</div>
        </div>
      </template> 

shishirraven

 <BraveDropMenu>
  <template #button>
    <div role="button" class="btn btn-light  px-3 "> <i class="bi bi-plus-lg"></i> Button <i class="bi bi-chevron-down"></i></div>
  </template>
</BraveDropMenu>

shishirraven

 <BraveDropMenu>
 ...
 </BraveDropMenu>

shishirraven

<template>
  <div>
    <BraveDropMenu class="me-3">
      <template #button>
        <div role="button" class="btn btn-primary text-white px-3 "> <i class="bi bi-plus-lg"></i> Button <i class="bi bi-chevron-down"></i></div>
      </template>
      <template #menu>
        <div class="list-group bg-white shadow" style="min-width:200px;" >
          <div role="button" class="list-group-item list-group-item-action"><i class="bi me-1 bi-person-plus"></i> A second link item</div>
          <div role="button" class="list-group-item list-group-item-action"><i class="bi me-1 bi-envelope-plus"></i> A second link item</div>

shishirraven

<template>
  <div>
    <BraveGistEmbed url="https://gist.github.com/shishirraven/de437adec76659671c4b6d2d45630375"/>
  </div>
</template>
<script>
// @ is an alias to /src
import BraveGistEmbed from "@/components/BraveGistEmbed"
export default {
  name: 'Home',