I have a LWC component (parent) where there is a variable like
firstfieldAPIname , secondField API name in the LWC and this LWC components picks all the values of picklist fields using data.picklistfieldValues. and passes into some variables which are like  optionValuesFirstSet = {controlling:[], dependent:[]}; to store the controlling field values , dependent values of the fields basing on record type.

I have another LWC Component(Child) - which uses the parent LWC component LWC and some picklist fields are being passed into the child HTML.

Something like this:
<c-parent-lwc
  first-picklist-field-api-name ="Type"
  second-picklist-field-api-name = "Area"
  third-picklist-field-api-name = "SubArea"
> <c-parent-lwc/>


Now i get the values on the component, please see screenshot. 

I even got the current values of the fields Type,Area and sub Area on the record in the child JS, however - how do i show on the UI.