@vuetify/nightly 4.0.0-dev-20230422.0 → 4.0.0-dev-20230427.0

package/lib/components/VDivider/VDivider.mjs

@@ -3,6 +3,7 @@ import { createVNode as _createVNode } from "vue";
 import "./VDivider.css";
 
 // Composables
+import { makeComponentProps } from "../../composables/component.mjs";
 import { makeThemeProps, provideTheme } from "../../composables/theme.mjs";
 import { useTextColor } from "../../composables/color.mjs"; // Utilities
 import { computed, toRef } from 'vue';
@@ -15,6 +16,7 @@ export const VDivider = genericComponent()({
     length: [Number, String],
     thickness: [Number, String],
     vertical: Boolean,
+    ...makeComponentProps(),
     ...makeThemeProps()
   },
   setup(props, _ref) {
@@ -43,8 +45,8 @@ export const VDivider = genericComponent()({
         'v-divider': true,
         'v-divider--inset': props.inset,
         'v-divider--vertical': props.vertical
-      }, themeClasses.value, textColorClasses.value],
-      "style": [dividerStyles.value, textColorStyles.value],
+      }, themeClasses.value, textColorClasses.value, props.class],
+      "style": [dividerStyles.value, textColorStyles.value, props.style],
       "aria-orientation": !attrs.role || attrs.role === 'separator' ? props.vertical ? 'vertical' : 'horizontal' : undefined,
       "role": `${attrs.role || 'separator'}`
     }, null));

package/lib/components/VDivider/VDivider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VDivider.mjs","names":["makeThemeProps","provideTheme","useTextColor","computed","toRef","convertToUnit","genericComponent","useRender","VDivider","name","props","color","String","inset","Boolean","length","Number","thickness","vertical","setup","_ref","attrs","themeClasses","textColorClasses","textColorStyles","dividerStyles","styles","_createVNode","value","role","undefined"],"sources":["../../../src/components/VDivider/VDivider.tsx"],"sourcesContent":["// Styles\nimport './VDivider.sass'\n\n// Composables\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { useTextColor } from '@/composables/color'\n\n// Utilities\nimport { computed, toRef } from 'vue'\nimport { convertToUnit, genericComponent, useRender } from '@/util'\n\ntype DividerKey = 'borderRightWidth' | 'borderTopWidth' | 'maxHeight' | 'maxWidth'\ntype DividerStyles = Partial<Record<DividerKey, string>>\n\nexport const VDivider = genericComponent()({\n  name: 'VDivider',\n\n  props: {\n    color: String,\n    inset: Boolean,\n    length: [Number, String],\n    thickness: [Number, String],\n    vertical: Boolean,\n\n    ...makeThemeProps(),\n  },\n\n  setup (props, { attrs }) {\n    const { themeClasses } = provideTheme(props)\n    const { textColorClasses, textColorStyles } = useTextColor(toRef(props, 'color'))\n    const dividerStyles = computed(() => {\n      const styles: DividerStyles = {}\n\n      if (props.length) {\n        styles[props.vertical ? 'maxHeight' : 'maxWidth'] = convertToUnit(props.length)\n      }\n\n      if (props.thickness) {\n        styles[props.vertical ? 'borderRightWidth' : 'borderTopWidth'] = convertToUnit(props.thickness)\n      }\n\n      return styles\n    })\n\n    useRender(() => (\n      <hr\n        class={[\n          {\n            'v-divider': true,\n            'v-divider--inset': props.inset,\n            'v-divider--vertical': props.vertical,\n          },\n          themeClasses.value,\n          textColorClasses.value,\n        ]}\n        style={[\n          dividerStyles.value,\n          textColorStyles.value,\n        ]}\n        aria-orientation={\n          !attrs.role || attrs.role === 'separator'\n            ? props.vertical ? 'vertical' : 'horizontal'\n            : undefined\n        }\n        role={ `${attrs.role || 'separator'}` }\n      />\n    ))\n\n    return {}\n  },\n})\n\nexport type VDivider = InstanceType<typeof VDivider>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,cAAc,EAAEC,YAAY;AAAA,SAC5BC,YAAY,uCAErB;AACA,SAASC,QAAQ,EAAEC,KAAK,QAAQ,KAAK;AAAA,SAC5BC,aAAa,EAAEC,gBAAgB,EAAEC,SAAS;AAKnD,OAAO,MAAMC,QAAQ,GAAGF,gBAAgB,EAAE,CAAC;EACzCG,IAAI,EAAE,UAAU;EAEhBC,KAAK,EAAE;IACLC,KAAK,EAAEC,MAAM;IACbC,KAAK,EAAEC,OAAO;IACdC,MAAM,EAAE,CAACC,MAAM,EAAEJ,MAAM,CAAC;IACxBK,SAAS,EAAE,CAACD,MAAM,EAAEJ,MAAM,CAAC;IAC3BM,QAAQ,EAAEJ,OAAO;IAEjB,GAAGd,cAAc;EACnB,CAAC;EAEDmB,KAAKA,CAAET,KAAK,EAAAU,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB,MAAM;MAAEE;IAAa,CAAC,GAAGrB,YAAY,CAACS,KAAK,CAAC;IAC5C,MAAM;MAAEa,gBAAgB;MAAEC;IAAgB,CAAC,GAAGtB,YAAY,CAACE,KAAK,CAACM,KAAK,EAAE,OAAO,CAAC,CAAC;IACjF,MAAMe,aAAa,GAAGtB,QAAQ,CAAC,MAAM;MACnC,MAAMuB,MAAqB,GAAG,CAAC,CAAC;MAEhC,IAAIhB,KAAK,CAACK,MAAM,EAAE;QAChBW,MAAM,CAAChB,KAAK,CAACQ,QAAQ,GAAG,WAAW,GAAG,UAAU,CAAC,GAAGb,aAAa,CAACK,KAAK,CAACK,MAAM,CAAC;MACjF;MAEA,IAAIL,KAAK,CAACO,SAAS,EAAE;QACnBS,MAAM,CAAChB,KAAK,CAACQ,QAAQ,GAAG,kBAAkB,GAAG,gBAAgB,CAAC,GAAGb,aAAa,CAACK,KAAK,CAACO,SAAS,CAAC;MACjG;MAEA,OAAOS,MAAM;IACf,CAAC,CAAC;IAEFnB,SAAS,CAAC,MAAAoB,YAAA;MAAA,SAEC,CACL;QACE,WAAW,EAAE,IAAI;QACjB,kBAAkB,EAAEjB,KAAK,CAACG,KAAK;QAC/B,qBAAqB,EAAEH,KAAK,CAACQ;MAC/B,CAAC,EACDI,YAAY,CAACM,KAAK,EAClBL,gBAAgB,CAACK,KAAK,CACvB;MAAA,SACM,CACLH,aAAa,CAACG,KAAK,EACnBJ,eAAe,CAACI,KAAK,CACtB;MAAA,oBAEC,CAACP,KAAK,CAACQ,IAAI,IAAIR,KAAK,CAACQ,IAAI,KAAK,WAAW,GACrCnB,KAAK,CAACQ,QAAQ,GAAG,UAAU,GAAG,YAAY,GAC1CY,SAAS;MAAA,QAEP,GAAET,KAAK,CAACQ,IAAI,IAAI,WAAY;IAAC,QAExC,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}
+{"version":3,"file":"VDivider.mjs","names":["makeComponentProps","makeThemeProps","provideTheme","useTextColor","computed","toRef","convertToUnit","genericComponent","useRender","VDivider","name","props","color","String","inset","Boolean","length","Number","thickness","vertical","setup","_ref","attrs","themeClasses","textColorClasses","textColorStyles","dividerStyles","styles","_createVNode","value","class","style","role","undefined"],"sources":["../../../src/components/VDivider/VDivider.tsx"],"sourcesContent":["// Styles\nimport './VDivider.sass'\n\n// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { useTextColor } from '@/composables/color'\n\n// Utilities\nimport { computed, toRef } from 'vue'\nimport { convertToUnit, genericComponent, useRender } from '@/util'\n\ntype DividerKey = 'borderRightWidth' | 'borderTopWidth' | 'maxHeight' | 'maxWidth'\ntype DividerStyles = Partial<Record<DividerKey, string>>\n\nexport const VDivider = genericComponent()({\n  name: 'VDivider',\n\n  props: {\n    color: String,\n    inset: Boolean,\n    length: [Number, String],\n    thickness: [Number, String],\n    vertical: Boolean,\n\n    ...makeComponentProps(),\n    ...makeThemeProps(),\n  },\n\n  setup (props, { attrs }) {\n    const { themeClasses } = provideTheme(props)\n    const { textColorClasses, textColorStyles } = useTextColor(toRef(props, 'color'))\n    const dividerStyles = computed(() => {\n      const styles: DividerStyles = {}\n\n      if (props.length) {\n        styles[props.vertical ? 'maxHeight' : 'maxWidth'] = convertToUnit(props.length)\n      }\n\n      if (props.thickness) {\n        styles[props.vertical ? 'borderRightWidth' : 'borderTopWidth'] = convertToUnit(props.thickness)\n      }\n\n      return styles\n    })\n\n    useRender(() => (\n      <hr\n        class={[\n          {\n            'v-divider': true,\n            'v-divider--inset': props.inset,\n            'v-divider--vertical': props.vertical,\n          },\n          themeClasses.value,\n          textColorClasses.value,\n          props.class,\n        ]}\n        style={[\n          dividerStyles.value,\n          textColorStyles.value,\n          props.style,\n        ]}\n        aria-orientation={\n          !attrs.role || attrs.role === 'separator'\n            ? props.vertical ? 'vertical' : 'horizontal'\n            : undefined\n        }\n        role={ `${attrs.role || 'separator'}` }\n      />\n    ))\n\n    return {}\n  },\n})\n\nexport type VDivider = InstanceType<typeof VDivider>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,kBAAkB;AAAA,SAClBC,cAAc,EAAEC,YAAY;AAAA,SAC5BC,YAAY,uCAErB;AACA,SAASC,QAAQ,EAAEC,KAAK,QAAQ,KAAK;AAAA,SAC5BC,aAAa,EAAEC,gBAAgB,EAAEC,SAAS;AAKnD,OAAO,MAAMC,QAAQ,GAAGF,gBAAgB,EAAE,CAAC;EACzCG,IAAI,EAAE,UAAU;EAEhBC,KAAK,EAAE;IACLC,KAAK,EAAEC,MAAM;IACbC,KAAK,EAAEC,OAAO;IACdC,MAAM,EAAE,CAACC,MAAM,EAAEJ,MAAM,CAAC;IACxBK,SAAS,EAAE,CAACD,MAAM,EAAEJ,MAAM,CAAC;IAC3BM,QAAQ,EAAEJ,OAAO;IAEjB,GAAGf,kBAAkB,EAAE;IACvB,GAAGC,cAAc;EACnB,CAAC;EAEDmB,KAAKA,CAAET,KAAK,EAAAU,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB,MAAM;MAAEE;IAAa,CAAC,GAAGrB,YAAY,CAACS,KAAK,CAAC;IAC5C,MAAM;MAAEa,gBAAgB;MAAEC;IAAgB,CAAC,GAAGtB,YAAY,CAACE,KAAK,CAACM,KAAK,EAAE,OAAO,CAAC,CAAC;IACjF,MAAMe,aAAa,GAAGtB,QAAQ,CAAC,MAAM;MACnC,MAAMuB,MAAqB,GAAG,CAAC,CAAC;MAEhC,IAAIhB,KAAK,CAACK,MAAM,EAAE;QAChBW,MAAM,CAAChB,KAAK,CAACQ,QAAQ,GAAG,WAAW,GAAG,UAAU,CAAC,GAAGb,aAAa,CAACK,KAAK,CAACK,MAAM,CAAC;MACjF;MAEA,IAAIL,KAAK,CAACO,SAAS,EAAE;QACnBS,MAAM,CAAChB,KAAK,CAACQ,QAAQ,GAAG,kBAAkB,GAAG,gBAAgB,CAAC,GAAGb,aAAa,CAACK,KAAK,CAACO,SAAS,CAAC;MACjG;MAEA,OAAOS,MAAM;IACf,CAAC,CAAC;IAEFnB,SAAS,CAAC,MAAAoB,YAAA;MAAA,SAEC,CACL;QACE,WAAW,EAAE,IAAI;QACjB,kBAAkB,EAAEjB,KAAK,CAACG,KAAK;QAC/B,qBAAqB,EAAEH,KAAK,CAACQ;MAC/B,CAAC,EACDI,YAAY,CAACM,KAAK,EAClBL,gBAAgB,CAACK,KAAK,EACtBlB,KAAK,CAACmB,KAAK,CACZ;MAAA,SACM,CACLJ,aAAa,CAACG,KAAK,EACnBJ,eAAe,CAACI,KAAK,EACrBlB,KAAK,CAACoB,KAAK,CACZ;MAAA,oBAEC,CAACT,KAAK,CAACU,IAAI,IAAIV,KAAK,CAACU,IAAI,KAAK,WAAW,GACrCrB,KAAK,CAACQ,QAAQ,GAAG,UAAU,GAAG,YAAY,GAC1Cc,SAAS;MAAA,QAEP,GAAEX,KAAK,CAACU,IAAI,IAAI,WAAY;IAAC,QAExC,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}

package/lib/components/VDivider/index.d.ts

@@ -11,28 +11,28 @@ declare const VDivider: {
         $data: {};
         $props: Partial<{
             inset: boolean;
+            style: vue.StyleValue;
             vertical: boolean;
         }> & Omit<{
             inset: boolean;
+            style: vue.StyleValue;
             vertical: boolean;
         } & {
             length?: string | number | undefined;
             color?: string | undefined;
+            class?: any;
             theme?: string | undefined;
             thickness?: string | number | undefined;
         } & {
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
                 default?: (() => vue.VNodeChild) | undefined;
             };
-            $slots?: {
-                default?: (() => vue.VNodeChild) | undefined;
-            } | undefined;
             'v-slots'?: {
                 default?: false | (() => vue.VNodeChild) | undefined;
             } | undefined;
         } & {
             "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
-        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "inset" | "vertical">;
+        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "inset" | "style" | "vertical">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -48,19 +48,18 @@ declare const VDivider: {
         $el: any;
         $options: vue.ComponentOptionsBase<{
             inset: boolean;
+            style: vue.StyleValue;
             vertical: boolean;
         } & {
             length?: string | number | undefined;
             color?: string | undefined;
+            class?: any;
             theme?: string | undefined;
             thickness?: string | number | undefined;
         } & {
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
                 default?: (() => vue.VNodeChild) | undefined;
             };
-            $slots?: {
-                default?: (() => vue.VNodeChild) | undefined;
-            } | undefined;
             'v-slots'?: {
                 default?: false | (() => vue.VNodeChild) | undefined;
             } | undefined;
@@ -68,6 +67,7 @@ declare const VDivider: {
             "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
         }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, {
             inset: boolean;
+            style: vue.StyleValue;
             vertical: boolean;
         }, {}, string> & {
             beforeCreate?: ((() => void) | (() => void)[]) | undefined;
@@ -91,19 +91,18 @@ declare const VDivider: {
         $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: vue.WatchOptions<boolean> | undefined): vue.WatchStopHandle;
     } & {
         inset: boolean;
+        style: vue.StyleValue;
         vertical: boolean;
     } & {
         length?: string | number | undefined;
         color?: string | undefined;
+        class?: any;
         theme?: string | undefined;
         thickness?: string | number | undefined;
     } & {
         $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
             default?: (() => vue.VNodeChild) | undefined;
         };
-        $slots?: {
-            default?: (() => vue.VNodeChild) | undefined;
-        } | undefined;
         'v-slots'?: {
             default?: false | (() => vue.VNodeChild) | undefined;
         } | undefined;
@@ -115,19 +114,18 @@ declare const VDivider: {
     __isSuspense?: undefined;
 } & vue.ComponentOptionsBase<{
     inset: boolean;
+    style: vue.StyleValue;
     vertical: boolean;
 } & {
     length?: string | number | undefined;
     color?: string | undefined;
+    class?: any;
     theme?: string | undefined;
     thickness?: string | number | undefined;
 } & {
     $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
         default?: (() => vue.VNodeChild) | undefined;
     };
-    $slots?: {
-        default?: (() => vue.VNodeChild) | undefined;
-    } | undefined;
     'v-slots'?: {
         default?: false | (() => vue.VNodeChild) | undefined;
     } | undefined;
@@ -135,9 +133,15 @@ declare const VDivider: {
     "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
 }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, {
     inset: boolean;
+    style: vue.StyleValue;
     vertical: boolean;
 }, {}, string> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
     theme: StringConstructor;
+    class: vue.PropType<any>;
+    style: {
+        type: vue.PropType<vue.StyleValue>;
+        default: null;
+    };
     color: StringConstructor;
     inset: BooleanConstructor;
     length: (StringConstructor | NumberConstructor)[];
@@ -145,6 +149,11 @@ declare const VDivider: {
     vertical: BooleanConstructor;
 }, vue.ExtractPropTypes<{
     theme: StringConstructor;
+    class: vue.PropType<any>;
+    style: {
+        type: vue.PropType<vue.StyleValue>;
+        default: null;
+    };
     color: StringConstructor;
     inset: BooleanConstructor;
     length: (StringConstructor | NumberConstructor)[];

package/lib/components/VExpansionPanel/VExpansionPanel.mjs

@@ -3,6 +3,7 @@ import { createVNode as _createVNode } from "vue";
 import { makeVExpansionPanelTitleProps, VExpansionPanelTitle } from "./VExpansionPanelTitle.mjs";
 import { VExpansionPanelSymbol } from "./VExpansionPanels.mjs";
 import { VExpansionPanelText } from "./VExpansionPanelText.mjs"; // Composables
+import { makeComponentProps } from "../../composables/component.mjs";
 import { makeElevationProps, useElevation } from "../../composables/elevation.mjs";
 import { makeGroupItemProps, useGroupItem } from "../../composables/group.mjs";
 import { makeLazyProps } from "../../composables/lazy.mjs";
@@ -17,6 +18,7 @@ export const VExpansionPanel = genericComponent()({
     title: String,
     text: String,
     bgColor: String,
+    ...makeComponentProps(),
     ...makeElevationProps(),
     ...makeGroupItemProps(),
     ...makeLazyProps(),
@@ -65,8 +67,8 @@ export const VExpansionPanel = genericComponent()({
           'v-expansion-panel--before-active': isBeforeSelected.value,
           'v-expansion-panel--after-active': isAfterSelected.value,
           'v-expansion-panel--disabled': isDisabled.value
-        }, roundedClasses.value, backgroundColorClasses.value],
-        "style": backgroundColorStyles.value,
+        }, roundedClasses.value, backgroundColorClasses.value, props.class],
+        "style": [backgroundColorStyles.value, props.style],
         "aria-expanded": groupItem.isSelected.value
       }, {
         default: () => [_createVNode("div", {

package/lib/components/VExpansionPanel/VExpansionPanel.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VExpansionPanel.mjs","names":["makeVExpansionPanelTitleProps","VExpansionPanelTitle","VExpansionPanelSymbol","VExpansionPanelText","makeElevationProps","useElevation","makeGroupItemProps","useGroupItem","makeLazyProps","makeRoundedProps","useRounded","makeTagProps","useBackgroundColor","computed","provide","genericComponent","useRender","VExpansionPanel","name","props","title","String","text","bgColor","emits","val","setup","_ref","slots","groupItem","backgroundColorClasses","backgroundColorStyles","elevationClasses","roundedClasses","isDisabled","disabled","value","selectedIndices","group","items","reduce","arr","item","index","selected","includes","id","push","isBeforeSelected","findIndex","isSelected","some","selectedIndex","isAfterSelected","hasText","hasTitle","_createVNode","tag","default","collapseIcon","color","expandIcon","hideActions","ripple","eager"],"sources":["../../../src/components/VExpansionPanel/VExpansionPanel.tsx"],"sourcesContent":["// Components\nimport { makeVExpansionPanelTitleProps, VExpansionPanelTitle } from './VExpansionPanelTitle'\nimport { VExpansionPanelSymbol } from './VExpansionPanels'\nimport { VExpansionPanelText } from './VExpansionPanelText'\n\n// Composables\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeGroupItemProps, useGroupItem } from '@/composables/group'\nimport { makeLazyProps } from '@/composables/lazy'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { useBackgroundColor } from '@/composables/color'\n\n// Utilities\nimport { computed, provide } from 'vue'\nimport { genericComponent, useRender } from '@/util'\n\nexport type VExpansionPanelSlots = {\n  default: []\n  title: []\n  text: []\n}\n\nexport const VExpansionPanel = genericComponent<VExpansionPanelSlots>()({\n  name: 'VExpansionPanel',\n\n  props: {\n    title: String,\n    text: String,\n    bgColor: String,\n\n    ...makeElevationProps(),\n    ...makeGroupItemProps(),\n    ...makeLazyProps(),\n    ...makeRoundedProps(),\n    ...makeTagProps(),\n    ...makeVExpansionPanelTitleProps(),\n  },\n\n  emits: {\n    'group:selected': (val: { value: boolean }) => true,\n  },\n\n  setup (props, { slots }) {\n    const groupItem = useGroupItem(props, VExpansionPanelSymbol)\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(props, 'bgColor')\n    const { elevationClasses } = useElevation(props)\n    const { roundedClasses } = useRounded(props)\n    const isDisabled = computed(() => groupItem?.disabled.value || props.disabled)\n\n    const selectedIndices = computed(() => groupItem.group.items.value.reduce<number[]>((arr, item, index) => {\n      if (groupItem.group.selected.value.includes(item.id)) arr.push(index)\n      return arr\n    }, []))\n\n    const isBeforeSelected = computed(() => {\n      const index = groupItem.group.items.value.findIndex(item => item.id === groupItem.id)\n      return !groupItem.isSelected.value &&\n        selectedIndices.value.some(selectedIndex => selectedIndex - index === 1)\n    })\n\n    const isAfterSelected = computed(() => {\n      const index = groupItem.group.items.value.findIndex(item => item.id === groupItem.id)\n      return !groupItem.isSelected.value &&\n        selectedIndices.value.some(selectedIndex => selectedIndex - index === -1)\n    })\n\n    provide(VExpansionPanelSymbol, groupItem)\n\n    useRender(() => {\n      const hasText = !!(slots.text || props.text)\n      const hasTitle = !!(slots.title || props.title)\n\n      return (\n        <props.tag\n          class={[\n            'v-expansion-panel',\n            {\n              'v-expansion-panel--active': groupItem.isSelected.value,\n              'v-expansion-panel--before-active': isBeforeSelected.value,\n              'v-expansion-panel--after-active': isAfterSelected.value,\n              'v-expansion-panel--disabled': isDisabled.value,\n            },\n            roundedClasses.value,\n            backgroundColorClasses.value,\n          ]}\n          style={ backgroundColorStyles.value }\n          aria-expanded={ groupItem.isSelected.value }\n        >\n          <div\n            class={[\n              'v-expansion-panel__shadow',\n              ...elevationClasses.value,\n            ]}\n          />\n\n          { hasTitle && (\n            <VExpansionPanelTitle\n              key=\"title\"\n              collapseIcon={ props.collapseIcon }\n              color={ props.color }\n              expandIcon={ props.expandIcon }\n              hideActions={ props.hideActions }\n              ripple={ props.ripple }\n            >\n              { slots.title ? slots.title() : props.title }\n            </VExpansionPanelTitle>\n          )}\n\n          { hasText && (\n            <VExpansionPanelText key=\"text\" eager={ props.eager }>\n              { slots.text ? slots.text() : props.text }\n            </VExpansionPanelText>\n          )}\n\n          { slots.default?.() }\n        </props.tag>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VExpansionPanel = InstanceType<typeof VExpansionPanel>\n"],"mappings":"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"}
+{"version":3,"file":"VExpansionPanel.mjs","names":["makeVExpansionPanelTitleProps","VExpansionPanelTitle","VExpansionPanelSymbol","VExpansionPanelText","makeComponentProps","makeElevationProps","useElevation","makeGroupItemProps","useGroupItem","makeLazyProps","makeRoundedProps","useRounded","makeTagProps","useBackgroundColor","computed","provide","genericComponent","useRender","VExpansionPanel","name","props","title","String","text","bgColor","emits","val","setup","_ref","slots","groupItem","backgroundColorClasses","backgroundColorStyles","elevationClasses","roundedClasses","isDisabled","disabled","value","selectedIndices","group","items","reduce","arr","item","index","selected","includes","id","push","isBeforeSelected","findIndex","isSelected","some","selectedIndex","isAfterSelected","hasText","hasTitle","_createVNode","tag","class","style","default","collapseIcon","color","expandIcon","hideActions","ripple","eager"],"sources":["../../../src/components/VExpansionPanel/VExpansionPanel.tsx"],"sourcesContent":["// Components\nimport { makeVExpansionPanelTitleProps, VExpansionPanelTitle } from './VExpansionPanelTitle'\nimport { VExpansionPanelSymbol } from './VExpansionPanels'\nimport { VExpansionPanelText } from './VExpansionPanelText'\n\n// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeGroupItemProps, useGroupItem } from '@/composables/group'\nimport { makeLazyProps } from '@/composables/lazy'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { useBackgroundColor } from '@/composables/color'\n\n// Utilities\nimport { computed, provide } from 'vue'\nimport { genericComponent, useRender } from '@/util'\n\nexport type VExpansionPanelSlots = {\n  default: []\n  title: []\n  text: []\n}\n\nexport const VExpansionPanel = genericComponent<VExpansionPanelSlots>()({\n  name: 'VExpansionPanel',\n\n  props: {\n    title: String,\n    text: String,\n    bgColor: String,\n\n    ...makeComponentProps(),\n    ...makeElevationProps(),\n    ...makeGroupItemProps(),\n    ...makeLazyProps(),\n    ...makeRoundedProps(),\n    ...makeTagProps(),\n    ...makeVExpansionPanelTitleProps(),\n  },\n\n  emits: {\n    'group:selected': (val: { value: boolean }) => true,\n  },\n\n  setup (props, { slots }) {\n    const groupItem = useGroupItem(props, VExpansionPanelSymbol)\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(props, 'bgColor')\n    const { elevationClasses } = useElevation(props)\n    const { roundedClasses } = useRounded(props)\n    const isDisabled = computed(() => groupItem?.disabled.value || props.disabled)\n\n    const selectedIndices = computed(() => groupItem.group.items.value.reduce<number[]>((arr, item, index) => {\n      if (groupItem.group.selected.value.includes(item.id)) arr.push(index)\n      return arr\n    }, []))\n\n    const isBeforeSelected = computed(() => {\n      const index = groupItem.group.items.value.findIndex(item => item.id === groupItem.id)\n      return !groupItem.isSelected.value &&\n        selectedIndices.value.some(selectedIndex => selectedIndex - index === 1)\n    })\n\n    const isAfterSelected = computed(() => {\n      const index = groupItem.group.items.value.findIndex(item => item.id === groupItem.id)\n      return !groupItem.isSelected.value &&\n        selectedIndices.value.some(selectedIndex => selectedIndex - index === -1)\n    })\n\n    provide(VExpansionPanelSymbol, groupItem)\n\n    useRender(() => {\n      const hasText = !!(slots.text || props.text)\n      const hasTitle = !!(slots.title || props.title)\n\n      return (\n        <props.tag\n          class={[\n            'v-expansion-panel',\n            {\n              'v-expansion-panel--active': groupItem.isSelected.value,\n              'v-expansion-panel--before-active': isBeforeSelected.value,\n              'v-expansion-panel--after-active': isAfterSelected.value,\n              'v-expansion-panel--disabled': isDisabled.value,\n            },\n            roundedClasses.value,\n            backgroundColorClasses.value,\n            props.class,\n          ]}\n          style={[\n            backgroundColorStyles.value,\n            props.style,\n          ]}\n          aria-expanded={ groupItem.isSelected.value }\n        >\n          <div\n            class={[\n              'v-expansion-panel__shadow',\n              ...elevationClasses.value,\n            ]}\n          />\n\n          { hasTitle && (\n            <VExpansionPanelTitle\n              key=\"title\"\n              collapseIcon={ props.collapseIcon }\n              color={ props.color }\n              expandIcon={ props.expandIcon }\n              hideActions={ props.hideActions }\n              ripple={ props.ripple }\n            >\n              { slots.title ? slots.title() : props.title }\n            </VExpansionPanelTitle>\n          )}\n\n          { hasText && (\n            <VExpansionPanelText key=\"text\" eager={ props.eager }>\n              { slots.text ? slots.text() : props.text }\n            </VExpansionPanelText>\n          )}\n\n          { slots.default?.() }\n        </props.tag>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VExpansionPanel = InstanceType<typeof VExpansionPanel>\n"],"mappings":"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"}

package/lib/components/VExpansionPanel/VExpansionPanelText.mjs

@@ -2,12 +2,14 @@ import { withDirectives as _withDirectives, vShow as _vShow, createVNode as _cre
 // Components
 import { VExpandTransition } from "../transitions/index.mjs";
 import { VExpansionPanelSymbol } from "./VExpansionPanels.mjs"; // Composables
+import { makeComponentProps } from "../../composables/component.mjs";
 import { makeLazyProps, useLazy } from "../../composables/lazy.mjs"; // Utilities
 import { inject } from 'vue';
 import { genericComponent, useRender } from "../../util/index.mjs";
 export const VExpansionPanelText = genericComponent()({
   name: 'VExpansionPanelText',
   props: {
+    ...makeComponentProps(),
     ...makeLazyProps()
   },
   setup(props, _ref) {
@@ -24,7 +26,8 @@ export const VExpansionPanelText = genericComponent()({
       "onAfterLeave": onAfterLeave
     }, {
       default: () => [_withDirectives(_createVNode("div", {
-        "class": "v-expansion-panel-text"
+        "class": ['v-expansion-panel-text', props.class],
+        "style": props.style
       }, [slots.default && hasContent.value && _createVNode("div", {
         "class": "v-expansion-panel-text__wrapper"
       }, [slots.default?.()])]), [[_vShow, expansionPanel.isSelected.value]])]

package/lib/components/VExpansionPanel/VExpansionPanelText.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VExpansionPanelText.mjs","names":["VExpandTransition","VExpansionPanelSymbol","makeLazyProps","useLazy","inject","genericComponent","useRender","VExpansionPanelText","name","props","setup","_ref","slots","expansionPanel","Error","hasContent","onAfterLeave","isSelected","_createVNode","default","_withDirectives","value","_vShow"],"sources":["../../../src/components/VExpansionPanel/VExpansionPanelText.tsx"],"sourcesContent":["// Components\nimport { VExpandTransition } from '@/components/transitions'\nimport { VExpansionPanelSymbol } from './VExpansionPanels'\n\n// Composables\nimport { makeLazyProps, useLazy } from '@/composables/lazy'\n\n// Utilities\nimport { inject } from 'vue'\nimport { genericComponent, useRender } from '@/util'\n\nexport const VExpansionPanelText = genericComponent()({\n  name: 'VExpansionPanelText',\n\n  props: {\n    ...makeLazyProps(),\n  },\n\n  setup (props, { slots }) {\n    const expansionPanel = inject(VExpansionPanelSymbol)\n\n    if (!expansionPanel) throw new Error('[Vuetify] v-expansion-panel-text needs to be placed inside v-expansion-panel')\n\n    const { hasContent, onAfterLeave } = useLazy(props, expansionPanel.isSelected)\n\n    useRender(() => (\n      <VExpandTransition onAfterLeave={ onAfterLeave }>\n        <div\n          class=\"v-expansion-panel-text\"\n          v-show={ expansionPanel.isSelected.value }\n        >\n          { slots.default && hasContent.value && (\n            <div class=\"v-expansion-panel-text__wrapper\">\n              { slots.default?.() }\n            </div>\n          )}\n        </div>\n      </VExpandTransition>\n    ))\n\n    return {}\n  },\n})\n\nexport type VExpansionPanelText = InstanceType<typeof VExpansionPanelText>\n"],"mappings":";AAAA;AAAA,SACSA,iBAAiB;AAAA,SACjBC,qBAAqB,kCAE9B;AAAA,SACSC,aAAa,EAAEC,OAAO,sCAE/B;AACA,SAASC,MAAM,QAAQ,KAAK;AAAA,SACnBC,gBAAgB,EAAEC,SAAS;AAEpC,OAAO,MAAMC,mBAAmB,GAAGF,gBAAgB,EAAE,CAAC;EACpDG,IAAI,EAAE,qBAAqB;EAE3BC,KAAK,EAAE;IACL,GAAGP,aAAa;EAClB,CAAC;EAEDQ,KAAKA,CAAED,KAAK,EAAAE,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB,MAAME,cAAc,GAAGT,MAAM,CAACH,qBAAqB,CAAC;IAEpD,IAAI,CAACY,cAAc,EAAE,MAAM,IAAIC,KAAK,CAAC,8EAA8E,CAAC;IAEpH,MAAM;MAAEC,UAAU;MAAEC;IAAa,CAAC,GAAGb,OAAO,CAACM,KAAK,EAAEI,cAAc,CAACI,UAAU,CAAC;IAE9EX,SAAS,CAAC,MAAAY,YAAA,CAAAlB,iBAAA;MAAA,gBAC0BgB;IAAY;MAAAG,OAAA,EAAAA,CAAA,MAAAC,eAAA,CAAAF,YAAA;QAAA,SAEpC;MAAwB,IAG5BN,KAAK,CAACO,OAAO,IAAIJ,UAAU,CAACM,KAAK,IAAAH,YAAA;QAAA,SACtB;MAAiC,IACxCN,KAAK,CAACO,OAAO,IAAI,EAEtB,MAAAG,MAAA,EANQT,cAAc,CAACI,UAAU,CAACI,KAAK;IAAA,EAS7C,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}
+{"version":3,"file":"VExpansionPanelText.mjs","names":["VExpandTransition","VExpansionPanelSymbol","makeComponentProps","makeLazyProps","useLazy","inject","genericComponent","useRender","VExpansionPanelText","name","props","setup","_ref","slots","expansionPanel","Error","hasContent","onAfterLeave","isSelected","_createVNode","default","_withDirectives","class","style","value","_vShow"],"sources":["../../../src/components/VExpansionPanel/VExpansionPanelText.tsx"],"sourcesContent":["// Components\nimport { VExpandTransition } from '@/components/transitions'\nimport { VExpansionPanelSymbol } from './VExpansionPanels'\n\n// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { makeLazyProps, useLazy } from '@/composables/lazy'\n\n// Utilities\nimport { inject } from 'vue'\nimport { genericComponent, useRender } from '@/util'\n\nexport const VExpansionPanelText = genericComponent()({\n  name: 'VExpansionPanelText',\n\n  props: {\n    ...makeComponentProps(),\n    ...makeLazyProps(),\n  },\n\n  setup (props, { slots }) {\n    const expansionPanel = inject(VExpansionPanelSymbol)\n\n    if (!expansionPanel) throw new Error('[Vuetify] v-expansion-panel-text needs to be placed inside v-expansion-panel')\n\n    const { hasContent, onAfterLeave } = useLazy(props, expansionPanel.isSelected)\n\n    useRender(() => (\n      <VExpandTransition onAfterLeave={ onAfterLeave }>\n        <div\n          class={[\n            'v-expansion-panel-text',\n            props.class,\n          ]}\n          style={ props.style }\n          v-show={ expansionPanel.isSelected.value }\n        >\n          { slots.default && hasContent.value && (\n            <div class=\"v-expansion-panel-text__wrapper\">\n              { slots.default?.() }\n            </div>\n          )}\n        </div>\n      </VExpandTransition>\n    ))\n\n    return {}\n  },\n})\n\nexport type VExpansionPanelText = InstanceType<typeof VExpansionPanelText>\n"],"mappings":";AAAA;AAAA,SACSA,iBAAiB;AAAA,SACjBC,qBAAqB,kCAE9B;AAAA,SACSC,kBAAkB;AAAA,SAClBC,aAAa,EAAEC,OAAO,sCAE/B;AACA,SAASC,MAAM,QAAQ,KAAK;AAAA,SACnBC,gBAAgB,EAAEC,SAAS;AAEpC,OAAO,MAAMC,mBAAmB,GAAGF,gBAAgB,EAAE,CAAC;EACpDG,IAAI,EAAE,qBAAqB;EAE3BC,KAAK,EAAE;IACL,GAAGR,kBAAkB,EAAE;IACvB,GAAGC,aAAa;EAClB,CAAC;EAEDQ,KAAKA,CAAED,KAAK,EAAAE,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB,MAAME,cAAc,GAAGT,MAAM,CAACJ,qBAAqB,CAAC;IAEpD,IAAI,CAACa,cAAc,EAAE,MAAM,IAAIC,KAAK,CAAC,8EAA8E,CAAC;IAEpH,MAAM;MAAEC,UAAU;MAAEC;IAAa,CAAC,GAAGb,OAAO,CAACM,KAAK,EAAEI,cAAc,CAACI,UAAU,CAAC;IAE9EX,SAAS,CAAC,MAAAY,YAAA,CAAAnB,iBAAA;MAAA,gBAC0BiB;IAAY;MAAAG,OAAA,EAAAA,CAAA,MAAAC,eAAA,CAAAF,YAAA;QAAA,SAEnC,CACL,wBAAwB,EACxBT,KAAK,CAACY,KAAK,CACZ;QAAA,SACOZ,KAAK,CAACa;MAAK,IAGjBV,KAAK,CAACO,OAAO,IAAIJ,UAAU,CAACQ,KAAK,IAAAL,YAAA;QAAA,SACtB;MAAiC,IACxCN,KAAK,CAACO,OAAO,IAAI,EAEtB,MAAAK,MAAA,EANQX,cAAc,CAACI,UAAU,CAACM,KAAK;IAAA,EAS7C,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}

package/lib/components/VExpansionPanel/VExpansionPanelTitle.mjs

@@ -3,6 +3,7 @@ import { withDirectives as _withDirectives, resolveDirective as _resolveDirectiv
 import { VExpansionPanelSymbol } from "./VExpansionPanels.mjs";
 import { VIcon } from "../VIcon/index.mjs"; // Directives
 import { Ripple } from "../../directives/ripple/index.mjs"; // Composables
+import { makeComponentProps } from "../../composables/component.mjs";
 import { IconValue } from "../../composables/icons.mjs";
 import { useBackgroundColor } from "../../composables/color.mjs"; // Utilities
 import { computed, inject } from 'vue';
@@ -30,6 +31,7 @@ export const VExpansionPanelTitle = genericComponent()({
     Ripple
   },
   props: {
+    ...makeComponentProps(),
     ...makeVExpansionPanelTitleProps()
   },
   setup(props, _ref) {
@@ -52,8 +54,8 @@ export const VExpansionPanelTitle = genericComponent()({
     useRender(() => _withDirectives(_createVNode("button", {
       "class": ['v-expansion-panel-title', {
         'v-expansion-panel-title--active': expansionPanel.isSelected.value
-      }, backgroundColorClasses.value],
-      "style": backgroundColorStyles.value,
+      }, backgroundColorClasses.value, props.class],
+      "style": [backgroundColorStyles.value, props.style],
       "type": "button",
       "tabindex": expansionPanel.disabled.value ? -1 : undefined,
       "disabled": expansionPanel.disabled.value,

package/lib/components/VExpansionPanel/VExpansionPanelTitle.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VExpansionPanelTitle.mjs","names":["VExpansionPanelSymbol","VIcon","Ripple","IconValue","useBackgroundColor","computed","inject","genericComponent","propsFactory","useRender","makeVExpansionPanelTitleProps","color","String","expandIcon","type","default","collapseIcon","hideActions","Boolean","ripple","Object","readonly","VExpansionPanelTitle","name","directives","props","setup","_ref","slots","expansionPanel","Error","backgroundColorClasses","backgroundColorStyles","slotProps","disabled","value","expanded","isSelected","_withDirectives","_createVNode","undefined","toggle","actions","_resolveDirective"],"sources":["../../../src/components/VExpansionPanel/VExpansionPanelTitle.tsx"],"sourcesContent":["// Components\nimport { VExpansionPanelSymbol } from './VExpansionPanels'\nimport { VIcon } from '@/components/VIcon'\n\n// Directives\nimport { Ripple } from '@/directives/ripple'\n\n// Composables\nimport { IconValue } from '@/composables/icons'\nimport { useBackgroundColor } from '@/composables/color'\n\n// Utilities\nimport { computed, inject } from 'vue'\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\ninterface ExpansionPanelTitleSlot {\n  collapseIcon: IconValue\n  disabled: boolean | undefined\n  expanded: boolean\n  expandIcon: IconValue\n  readonly: boolean\n}\n\nexport type VExpansionPanelTitleSlots = {\n  default: [ExpansionPanelTitleSlot]\n  actions: [ExpansionPanelTitleSlot]\n}\n\nexport const makeVExpansionPanelTitleProps = propsFactory({\n  color: String,\n  expandIcon: {\n    type: IconValue,\n    default: '$expand',\n  },\n  collapseIcon: {\n    type: IconValue,\n    default: '$collapse',\n  },\n  hideActions: Boolean,\n  ripple: {\n    type: [Boolean, Object],\n    default: false,\n  },\n  readonly: Boolean,\n}, 'v-expansion-panel-title')\n\nexport const VExpansionPanelTitle = genericComponent<VExpansionPanelTitleSlots>()({\n  name: 'VExpansionPanelTitle',\n\n  directives: { Ripple },\n\n  props: {\n    ...makeVExpansionPanelTitleProps(),\n  },\n\n  setup (props, { slots }) {\n    const expansionPanel = inject(VExpansionPanelSymbol)\n\n    if (!expansionPanel) throw new Error('[Vuetify] v-expansion-panel-title needs to be placed inside v-expansion-panel')\n\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(props, 'color')\n\n    const slotProps = computed(() => ({\n      collapseIcon: props.collapseIcon,\n      disabled: expansionPanel.disabled.value,\n      expanded: expansionPanel.isSelected.value,\n      expandIcon: props.expandIcon,\n      readonly: props.readonly,\n    }))\n\n    useRender(() => (\n      <button\n        class={[\n          'v-expansion-panel-title',\n          {\n            'v-expansion-panel-title--active': expansionPanel.isSelected.value,\n          },\n          backgroundColorClasses.value,\n        ]}\n        style={ backgroundColorStyles.value }\n        type=\"button\"\n        tabindex={ expansionPanel.disabled.value ? -1 : undefined }\n        disabled={ expansionPanel.disabled.value }\n        aria-expanded={ expansionPanel.isSelected.value }\n        onClick={ !props.readonly ? expansionPanel.toggle : undefined }\n        v-ripple={ props.ripple }\n      >\n        <span class=\"v-expansion-panel-title__overlay\" />\n\n        { slots.default?.(slotProps.value) }\n\n        { !props.hideActions && (\n          <span class=\"v-expansion-panel-title__icon\">\n            {\n              slots.actions ? slots.actions(slotProps.value)\n              : <VIcon icon={ expansionPanel.isSelected.value ? props.collapseIcon : props.expandIcon } />\n            }\n          </span>\n        )}\n      </button>\n    ))\n\n    return {}\n  },\n})\n\nexport type VExpansionPanelTitle = InstanceType<typeof VExpansionPanelTitle>\n"],"mappings":"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"}
+{"version":3,"file":"VExpansionPanelTitle.mjs","names":["VExpansionPanelSymbol","VIcon","Ripple","makeComponentProps","IconValue","useBackgroundColor","computed","inject","genericComponent","propsFactory","useRender","makeVExpansionPanelTitleProps","color","String","expandIcon","type","default","collapseIcon","hideActions","Boolean","ripple","Object","readonly","VExpansionPanelTitle","name","directives","props","setup","_ref","slots","expansionPanel","Error","backgroundColorClasses","backgroundColorStyles","slotProps","disabled","value","expanded","isSelected","_withDirectives","_createVNode","class","style","undefined","toggle","actions","_resolveDirective"],"sources":["../../../src/components/VExpansionPanel/VExpansionPanelTitle.tsx"],"sourcesContent":["// Components\nimport { VExpansionPanelSymbol } from './VExpansionPanels'\nimport { VIcon } from '@/components/VIcon'\n\n// Directives\nimport { Ripple } from '@/directives/ripple'\n\n// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { IconValue } from '@/composables/icons'\nimport { useBackgroundColor } from '@/composables/color'\n\n// Utilities\nimport { computed, inject } from 'vue'\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\ninterface ExpansionPanelTitleSlot {\n  collapseIcon: IconValue\n  disabled: boolean | undefined\n  expanded: boolean\n  expandIcon: IconValue\n  readonly: boolean\n}\n\nexport type VExpansionPanelTitleSlots = {\n  default: [ExpansionPanelTitleSlot]\n  actions: [ExpansionPanelTitleSlot]\n}\n\nexport const makeVExpansionPanelTitleProps = propsFactory({\n  color: String,\n  expandIcon: {\n    type: IconValue,\n    default: '$expand',\n  },\n  collapseIcon: {\n    type: IconValue,\n    default: '$collapse',\n  },\n  hideActions: Boolean,\n  ripple: {\n    type: [Boolean, Object],\n    default: false,\n  },\n  readonly: Boolean,\n}, 'v-expansion-panel-title')\n\nexport const VExpansionPanelTitle = genericComponent<VExpansionPanelTitleSlots>()({\n  name: 'VExpansionPanelTitle',\n\n  directives: { Ripple },\n\n  props: {\n    ...makeComponentProps(),\n    ...makeVExpansionPanelTitleProps(),\n  },\n\n  setup (props, { slots }) {\n    const expansionPanel = inject(VExpansionPanelSymbol)\n\n    if (!expansionPanel) throw new Error('[Vuetify] v-expansion-panel-title needs to be placed inside v-expansion-panel')\n\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(props, 'color')\n\n    const slotProps = computed(() => ({\n      collapseIcon: props.collapseIcon,\n      disabled: expansionPanel.disabled.value,\n      expanded: expansionPanel.isSelected.value,\n      expandIcon: props.expandIcon,\n      readonly: props.readonly,\n    }))\n\n    useRender(() => (\n      <button\n        class={[\n          'v-expansion-panel-title',\n          {\n            'v-expansion-panel-title--active': expansionPanel.isSelected.value,\n          },\n          backgroundColorClasses.value,\n          props.class,\n        ]}\n        style={[\n          backgroundColorStyles.value,\n          props.style,\n        ]}\n        type=\"button\"\n        tabindex={ expansionPanel.disabled.value ? -1 : undefined }\n        disabled={ expansionPanel.disabled.value }\n        aria-expanded={ expansionPanel.isSelected.value }\n        onClick={ !props.readonly ? expansionPanel.toggle : undefined }\n        v-ripple={ props.ripple }\n      >\n        <span class=\"v-expansion-panel-title__overlay\" />\n\n        { slots.default?.(slotProps.value) }\n\n        { !props.hideActions && (\n          <span class=\"v-expansion-panel-title__icon\">\n            {\n              slots.actions ? slots.actions(slotProps.value)\n              : <VIcon icon={ expansionPanel.isSelected.value ? props.collapseIcon : props.expandIcon } />\n            }\n          </span>\n        )}\n      </button>\n    ))\n\n    return {}\n  },\n})\n\nexport type VExpansionPanelTitle = InstanceType<typeof VExpansionPanelTitle>\n"],"mappings":"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"}

package/lib/components/VExpansionPanel/VExpansionPanels.mjs

@@ -3,6 +3,7 @@ import { createVNode as _createVNode, resolveDirective as _resolveDirective } fr
 import "./VExpansionPanel.css";
 
 // Composables
+import { makeComponentProps } from "../../composables/component.mjs";
 import { makeGroupProps, useGroup } from "../../composables/group.mjs";
 import { makeTagProps } from "../../composables/tag.mjs";
 import { makeThemeProps, provideTheme } from "../../composables/theme.mjs";
@@ -21,6 +22,7 @@ export const VExpansionPanels = genericComponent()({
       validator: v => allowedVariants.includes(v)
     },
     readonly: Boolean,
+    ...makeComponentProps(),
     ...makeGroupProps(),
     ...makeTagProps(),
     ...makeThemeProps()
@@ -46,7 +48,8 @@ export const VExpansionPanels = genericComponent()({
       }
     });
     useRender(() => _createVNode(props.tag, {
-      "class": ['v-expansion-panels', themeClasses.value, variantClass.value]
+      "class": ['v-expansion-panels', themeClasses.value, variantClass.value, props.class],
+      "style": props.style
     }, slots));
     return {};
   }

package/lib/components/VExpansionPanel/VExpansionPanels.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VExpansionPanels.mjs","names":["makeGroupProps","useGroup","makeTagProps","makeThemeProps","provideTheme","provideDefaults","computed","toRef","genericComponent","useRender","VExpansionPanelSymbol","Symbol","for","allowedVariants","VExpansionPanels","name","props","color","String","variant","type","default","validator","v","includes","readonly","Boolean","emits","val","setup","_ref","slots","themeClasses","variantClass","VExpansionPanel","VExpansionPanelTitle","_createVNode","tag","value"],"sources":["../../../src/components/VExpansionPanel/VExpansionPanels.tsx"],"sourcesContent":["// Styles\nimport './VExpansionPanel.sass'\n\n// Composables\nimport { makeGroupProps, useGroup } from '@/composables/group'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { provideDefaults } from '@/composables/defaults'\n\n// Utilities\nimport { computed, toRef } from 'vue'\nimport { genericComponent, useRender } from '@/util'\n\n// Types\nimport type { InjectionKey, PropType } from 'vue'\nimport type { GroupItemProvide } from '@/composables/group'\n\nexport const VExpansionPanelSymbol: InjectionKey<GroupItemProvide> = Symbol.for('vuetify:v-expansion-panel')\n\nconst allowedVariants = ['default', 'accordion', 'inset', 'popout'] as const\n\ntype Variant = typeof allowedVariants[number]\n\nexport const VExpansionPanels = genericComponent()({\n  name: 'VExpansionPanels',\n\n  props: {\n    color: String,\n    variant: {\n      type: String as PropType<Variant>,\n      default: 'default',\n      validator: (v: any) => allowedVariants.includes(v),\n    },\n    readonly: Boolean,\n\n    ...makeGroupProps(),\n    ...makeTagProps(),\n    ...makeThemeProps(),\n  },\n\n  emits: {\n    'update:modelValue': (val: unknown) => true,\n  },\n\n  setup (props, { slots }) {\n    useGroup(props, VExpansionPanelSymbol)\n\n    const { themeClasses } = provideTheme(props)\n\n    const variantClass = computed(() => props.variant && `v-expansion-panels--variant-${props.variant}`)\n\n    provideDefaults({\n      VExpansionPanel: {\n        color: toRef(props, 'color'),\n      },\n      VExpansionPanelTitle: {\n        readonly: toRef(props, 'readonly'),\n      },\n    })\n\n    useRender(() => (\n      <props.tag\n        class={[\n          'v-expansion-panels',\n          themeClasses.value,\n          variantClass.value,\n        ]}\n        v-slots={ slots }\n      />\n    ))\n\n    return {}\n  },\n})\n\nexport type VExpansionPanels = InstanceType<typeof VExpansionPanels>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,cAAc,EAAEC,QAAQ;AAAA,SACxBC,YAAY;AAAA,SACZC,cAAc,EAAEC,YAAY;AAAA,SAC5BC,eAAe,0CAExB;AACA,SAASC,QAAQ,EAAEC,KAAK,QAAQ,KAAK;AAAA,SAC5BC,gBAAgB,EAAEC,SAAS,gCAEpC;AAIA,OAAO,MAAMC,qBAAqD,GAAGC,MAAM,CAACC,GAAG,CAAC,2BAA2B,CAAC;AAE5G,MAAMC,eAAe,GAAG,CAAC,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,CAAU;AAI5E,OAAO,MAAMC,gBAAgB,GAAGN,gBAAgB,EAAE,CAAC;EACjDO,IAAI,EAAE,kBAAkB;EAExBC,KAAK,EAAE;IACLC,KAAK,EAAEC,MAAM;IACbC,OAAO,EAAE;MACPC,IAAI,EAAEF,MAA2B;MACjCG,OAAO,EAAE,SAAS;MAClBC,SAAS,EAAGC,CAAM,IAAKV,eAAe,CAACW,QAAQ,CAACD,CAAC;IACnD,CAAC;IACDE,QAAQ,EAAEC,OAAO;IAEjB,GAAG1B,cAAc,EAAE;IACnB,GAAGE,YAAY,EAAE;IACjB,GAAGC,cAAc;EACnB,CAAC;EAEDwB,KAAK,EAAE;IACL,mBAAmB,EAAGC,GAAY,IAAK;EACzC,CAAC;EAEDC,KAAKA,CAAEb,KAAK,EAAAc,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB7B,QAAQ,CAACe,KAAK,EAAEN,qBAAqB,CAAC;IAEtC,MAAM;MAAEsB;IAAa,CAAC,GAAG5B,YAAY,CAACY,KAAK,CAAC;IAE5C,MAAMiB,YAAY,GAAG3B,QAAQ,CAAC,MAAMU,KAAK,CAACG,OAAO,IAAK,+BAA8BH,KAAK,CAACG,OAAQ,EAAC,CAAC;IAEpGd,eAAe,CAAC;MACd6B,eAAe,EAAE;QACfjB,KAAK,EAAEV,KAAK,CAACS,KAAK,EAAE,OAAO;MAC7B,CAAC;MACDmB,oBAAoB,EAAE;QACpBV,QAAQ,EAAElB,KAAK,CAACS,KAAK,EAAE,UAAU;MACnC;IACF,CAAC,CAAC;IAEFP,SAAS,CAAC,MAAA2B,YAAA,CAAApB,KAAA,CAAAqB,GAAA;MAAA,SAEC,CACL,oBAAoB,EACpBL,YAAY,CAACM,KAAK,EAClBL,YAAY,CAACK,KAAK;IACnB,GACSP,KAAK,CAElB,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}
+{"version":3,"file":"VExpansionPanels.mjs","names":["makeComponentProps","makeGroupProps","useGroup","makeTagProps","makeThemeProps","provideTheme","provideDefaults","computed","toRef","genericComponent","useRender","VExpansionPanelSymbol","Symbol","for","allowedVariants","VExpansionPanels","name","props","color","String","variant","type","default","validator","v","includes","readonly","Boolean","emits","val","setup","_ref","slots","themeClasses","variantClass","VExpansionPanel","VExpansionPanelTitle","_createVNode","tag","value","class","style"],"sources":["../../../src/components/VExpansionPanel/VExpansionPanels.tsx"],"sourcesContent":["// Styles\nimport './VExpansionPanel.sass'\n\n// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { makeGroupProps, useGroup } from '@/composables/group'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { provideDefaults } from '@/composables/defaults'\n\n// Utilities\nimport { computed, toRef } from 'vue'\nimport { genericComponent, useRender } from '@/util'\n\n// Types\nimport type { InjectionKey, PropType } from 'vue'\nimport type { GroupItemProvide } from '@/composables/group'\n\nexport const VExpansionPanelSymbol: InjectionKey<GroupItemProvide> = Symbol.for('vuetify:v-expansion-panel')\n\nconst allowedVariants = ['default', 'accordion', 'inset', 'popout'] as const\n\ntype Variant = typeof allowedVariants[number]\n\nexport const VExpansionPanels = genericComponent()({\n  name: 'VExpansionPanels',\n\n  props: {\n    color: String,\n    variant: {\n      type: String as PropType<Variant>,\n      default: 'default',\n      validator: (v: any) => allowedVariants.includes(v),\n    },\n    readonly: Boolean,\n\n    ...makeComponentProps(),\n    ...makeGroupProps(),\n    ...makeTagProps(),\n    ...makeThemeProps(),\n  },\n\n  emits: {\n    'update:modelValue': (val: unknown) => true,\n  },\n\n  setup (props, { slots }) {\n    useGroup(props, VExpansionPanelSymbol)\n\n    const { themeClasses } = provideTheme(props)\n\n    const variantClass = computed(() => props.variant && `v-expansion-panels--variant-${props.variant}`)\n\n    provideDefaults({\n      VExpansionPanel: {\n        color: toRef(props, 'color'),\n      },\n      VExpansionPanelTitle: {\n        readonly: toRef(props, 'readonly'),\n      },\n    })\n\n    useRender(() => (\n      <props.tag\n        class={[\n          'v-expansion-panels',\n          themeClasses.value,\n          variantClass.value,\n          props.class,\n        ]}\n        style={ props.style }\n        v-slots={ slots }\n      />\n    ))\n\n    return {}\n  },\n})\n\nexport type VExpansionPanels = InstanceType<typeof VExpansionPanels>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,kBAAkB;AAAA,SAClBC,cAAc,EAAEC,QAAQ;AAAA,SACxBC,YAAY;AAAA,SACZC,cAAc,EAAEC,YAAY;AAAA,SAC5BC,eAAe,0CAExB;AACA,SAASC,QAAQ,EAAEC,KAAK,QAAQ,KAAK;AAAA,SAC5BC,gBAAgB,EAAEC,SAAS,gCAEpC;AAIA,OAAO,MAAMC,qBAAqD,GAAGC,MAAM,CAACC,GAAG,CAAC,2BAA2B,CAAC;AAE5G,MAAMC,eAAe,GAAG,CAAC,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,CAAU;AAI5E,OAAO,MAAMC,gBAAgB,GAAGN,gBAAgB,EAAE,CAAC;EACjDO,IAAI,EAAE,kBAAkB;EAExBC,KAAK,EAAE;IACLC,KAAK,EAAEC,MAAM;IACbC,OAAO,EAAE;MACPC,IAAI,EAAEF,MAA2B;MACjCG,OAAO,EAAE,SAAS;MAClBC,SAAS,EAAGC,CAAM,IAAKV,eAAe,CAACW,QAAQ,CAACD,CAAC;IACnD,CAAC;IACDE,QAAQ,EAAEC,OAAO;IAEjB,GAAG3B,kBAAkB,EAAE;IACvB,GAAGC,cAAc,EAAE;IACnB,GAAGE,YAAY,EAAE;IACjB,GAAGC,cAAc;EACnB,CAAC;EAEDwB,KAAK,EAAE;IACL,mBAAmB,EAAGC,GAAY,IAAK;EACzC,CAAC;EAEDC,KAAKA,CAAEb,KAAK,EAAAc,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB7B,QAAQ,CAACe,KAAK,EAAEN,qBAAqB,CAAC;IAEtC,MAAM;MAAEsB;IAAa,CAAC,GAAG5B,YAAY,CAACY,KAAK,CAAC;IAE5C,MAAMiB,YAAY,GAAG3B,QAAQ,CAAC,MAAMU,KAAK,CAACG,OAAO,IAAK,+BAA8BH,KAAK,CAACG,OAAQ,EAAC,CAAC;IAEpGd,eAAe,CAAC;MACd6B,eAAe,EAAE;QACfjB,KAAK,EAAEV,KAAK,CAACS,KAAK,EAAE,OAAO;MAC7B,CAAC;MACDmB,oBAAoB,EAAE;QACpBV,QAAQ,EAAElB,KAAK,CAACS,KAAK,EAAE,UAAU;MACnC;IACF,CAAC,CAAC;IAEFP,SAAS,CAAC,MAAA2B,YAAA,CAAApB,KAAA,CAAAqB,GAAA;MAAA,SAEC,CACL,oBAAoB,EACpBL,YAAY,CAACM,KAAK,EAClBL,YAAY,CAACK,KAAK,EAClBtB,KAAK,CAACuB,KAAK,CACZ;MAAA,SACOvB,KAAK,CAACwB;IAAK,GACTT,KAAK,CAElB,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}