feat(VCalendar): add support for object categories

[nquinn721]

Description

Updated the category view to handle styles within each interval based off of category. I also added the ability to take an object in the category list and you can specify which prop to display as the text for category through 'category-text'. 'category-text' can be a string or a function where you can run logic to determine what to show.

Motivation and Context

Our app needed to color each interval in the calendar based off of category as well as we wanted meta data in the category.

How Has This Been Tested?

I've updated the unit tests to include my changes

Markup:

<template>
  <v-container>
    <v-calendar
      color="primary"
      type="category"
      :categories="[{ name: 'Jeff' }, { name: 'Nate' }]"
      category-text="name"
      category-show-all
      :events="events"
    />
  </v-container>
</template>

<script>
export default {
  data: () => ({
    events: [
      {
        name: "Nate",
        category: "Nate",
        start: new Date(),
        end: new Date()
      }
    ]
  })
};
</script>

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• Improvement/refactoring (non-breaking change that doesn't add any features but makes things better)

Checklist:

• The PR title is no longer than 64 characters.
• The PR is submitted to the correct branch (master for bug fixes and documentation updates, dev for new features and backwards compatible changes and next for non-backwards compatible changes).
• My code follows the code style of this project.
• I've added relevant changes to the documentation (applies to new features and breaking changes in core library)

[nekosaur]

You should add at least one new unit test for this functionality

[nquinn721]

@nekosaur Let me know if there's anything else you need from me

[nekosaur]

There are still two unresolved comments

[nquinn721]

@nekosaur sorry those comments were hidden

[ravdeepsingh22]

TypeError: categoryMap_1.hasOwnProperty is not a function

[gregveres]

I think this should have been flagged as a breaking change.
I am using an array of strings for categories (it is a computed array) and in the @click.event ="" handler, the event that is being passed has category that is an object that contains a single variable called categoryName that now contains the string name of the category.

Is that expected or was that supposed to be passed back as a string so that there was no breaking change?

[MajesticPotatoe]

@gregveres

Is that expected or was that supposed to be passed back as a string so that there was no breaking change?

Its not intended to be breaking, however its possible that there was an unforeseen regression in the click:event event when handling stings vs objects, Please created an issue with a minimal reproduction.

[gregveres]

Yup looks like it. I tracked it down in my code and then created an reproduction. Issue #12922 has been filed.

[gregveres]

@nquinn721 Hi Nathan. Thanks for adding this feature. However, it really needs to also update the docs. Beside the breaking change, I decided that I would embrace the category as an object approach only to waste an hour or because I figured that if the categories were objects, then the categories in the events must be objects too.
It was only after reading through the code that you committed and looking at one of the unit tests that I realized the category stays the same old string in the event and that it is only the category array that can contain objects. This is fine, it just needs to be documented.

Thanks for listening....