fix(primevue4): remove TriStateCheckBox and add direct import of components

Author: sfxcode

dev/modules/primevue.ts

@@ -4,11 +4,9 @@ import Card from 'primevue/card'
 import CascadeSelect from 'primevue/cascadeselect'
 import Checkbox from 'primevue/checkbox'
 import Chip from 'primevue/chip'
-import Chips from 'primevue/chips'
 import ColorPicker from 'primevue/colorpicker'
 import DatePicker from 'primevue/datepicker'
 import Editor from 'primevue/editor'
-import Dropdown from 'primevue/dropdown'
 import Fieldset from 'primevue/fieldset'
 import IconField from 'primevue/iconfield'
 import InputIcon from 'primevue/inputicon'
@@ -21,7 +19,6 @@ import Listbox from 'primevue/listbox'
 import MegaMenu from 'primevue/megamenu'
 import Message from 'primevue/message'
 import MultiSelect from 'primevue/multiselect'
-import OverlayPanel from 'primevue/overlaypanel'
 import Password from 'primevue/password'
 import Rating from 'primevue/rating'
 import RadioButton from 'primevue/radiobutton'
@@ -64,7 +61,7 @@ export const install: UserModule = ({ app }) => {
   app.directive('badge', BadgeDirective)
   app.directive('ripple', Ripple)
   app.directive('tooltip', Tooltip)
-  app.directive('styleclass', StyleClass)
+  app.directive('style-class', StyleClass)
 
   // components
   app.component('AutoComplete', AutoComplete)
@@ -73,11 +70,9 @@ export const install: UserModule = ({ app }) => {
   app.component('CascadeSelect', CascadeSelect)
   app.component('Checkbox', Checkbox)
   app.component('Chip', Chip)
-  app.component('Chips', Chips)
   app.component('ColorPicker', ColorPicker)
   app.component('DataView', DataView)
   app.component('DatePicker', DatePicker)
-  app.component('Dropdown', Dropdown)
   app.component('Editor', Editor)
   app.component('Fieldset', Fieldset)
   app.component('IconField', IconField)
@@ -91,7 +86,6 @@ export const install: UserModule = ({ app }) => {
   app.component('MegaMenu', MegaMenu)
   app.component('Message', Message)
   app.component('MultiSelect', MultiSelect)
-  app.component('OverlayPanel', OverlayPanel)
   app.component('Password', Password)
   app.component('RadioButton', RadioButton)
   app.component('Rating', Rating)

dev/pages/inputs/Password.vue

@@ -1,5 +1,5 @@
 <script setup lang='ts'>
-const primeAttributes = 'placeholder, feedback, mediumRegex, strongRegex, promptLabel, weakLabel, mediumLabel, strongLabel, hideIcon, showIcon, toggleMask'
+const primeAttributes = 'placeholder, feedback, mediumRegex, strongRegex, promptLabel, weakLabel, mediumLabel, strongLabel, toggleMask'
 const schema
   = [
     {

src/definitions/index.ts

@@ -5,7 +5,6 @@ import PrimeAutoComplete from '../components/PrimeAutoComplete.vue'
 import PrimeDatePicker from '../components/PrimeDatePicker.vue'
 import PrimeCascadeSelect from '../components/PrimeCascadeSelect.vue'
 import PrimeCheckbox from '../components/PrimeCheckbox.vue'
-import PrimeChips from '../components/PrimeChips.vue'
 import PrimeColorPicker from '../components/PrimeColorPicker.vue'
 import PrimeSelect from '../components/PrimeSelect.vue'
 import PrimeEditor from '../components/PrimeEditor.vue'
@@ -25,7 +24,6 @@ import PrimeSlider from '../components/PrimeSlider.vue'
 import PrimeToggleButton from '../components/PrimeToggleButton.vue'
 import PrimeTreeSelect from '../components/PrimeTreeSelect.vue'
 import PrimeSelectButton from '../components/PrimeSelectButton.vue'
-import PrimeTriStateCheckbox from '../components/PrimeTriStateCheckbox.vue'
 
 export const primeAutoCompleteDefinition: FormKitTypeDefinition = createInput(PrimeAutoComplete, {
   props: ['pt', 'ptOptions', 'unstyled', 'Select', 'multiple'],
@@ -340,19 +338,6 @@ export const primeRadioButtonDefinition: FormKitTypeDefinition = createInput(Pri
   ],
 })
 
-export const primeChipsDefinition: FormKitTypeDefinition = createInput(PrimeChips, {
-  props: [
-    'allowDuplicate',
-    'addOnBlur',
-    'max',
-    'placeholder',
-    'seperator',
-    'pt',
-    'ptOptions',
-    'unstyled',
-  ],
-})
-
 export const primeKnobDefinition: FormKitTypeDefinition = createInput(PrimeKnob, {
   props: [
     'pt',
@@ -409,16 +394,7 @@ export const primeSelectButtonDefinition: FormKitTypeDefinition = createInput(Pr
     'options',
   ],
 })
-export const primeTriStateCheckboxDefinition: FormKitTypeDefinition = createInput(PrimeTriStateCheckbox, {
-  props: [
-    'pt',
-    'ptOptions',
-    'unstyled',
-    'variant',
-    'labelRight',
-    'labelLeft',
-  ],
-})
+
 export const primeCascadeSelectDefinition: FormKitTypeDefinition = createInput(PrimeCascadeSelect, {
   props: [
     'options',
@@ -464,7 +440,6 @@ export const primeInputs = {
   primeMultiSelect: primeMultiSelectDefinition,
   primeDatePicker: primeDatePickerDefinition,
   primeSlider: primeSliderDefinition,
-  primeChips: primeChipsDefinition,
   primeKnob: primeKnobDefinition,
   primeRating: primeRatingDefinition,
   primeRadioButton: primeRadioButtonDefinition,