@maltjoy/core-vue 3.27.2 → 3.28.0

package/dist/components/JoyHighlight/VJoyHighlight.vue.d.ts

@@ -9,13 +9,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    /** Based on maltjoy/icons availabilities. Works in pair with displayIcon boolean prop. */
     icon: {
         type: PropType<import("@maltjoy/icons").JoyIconsId>;
     };
+    /** import `TJoyHighlightLevels` */
     level: {
-        type: PropType<"neutral" | "success" | "info" | "warning" | "error">;
+        type: PropType<import("../../types/index.js").TLevels>;
         default: string;
-        validator(level: "neutral" | "success" | "info" | "warning" | "error"): boolean;
     };
     /** Please note that 'default' variant has no effect. This property is meant to completely override "level" prop style */
     variant: {
@@ -33,13 +34,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    /** Based on maltjoy/icons availabilities. Works in pair with displayIcon boolean prop. */
     icon: {
         type: PropType<import("@maltjoy/icons").JoyIconsId>;
     };
+    /** import `TJoyHighlightLevels` */
     level: {
-        type: PropType<"neutral" | "success" | "info" | "warning" | "error">;
+        type: PropType<import("../../types/index.js").TLevels>;
         default: string;
-        validator(level: "neutral" | "success" | "info" | "warning" | "error"): boolean;
     };
     /** Please note that 'default' variant has no effect. This property is meant to completely override "level" prop style */
     variant: {
@@ -48,13 +50,23 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     };
 }>>, {
     variant: TJoyHighlightVariants;
-    level: "neutral" | "success" | "info" | "warning" | "error";
+    level: import("../../types/index.js").TLevels;
     accent: boolean;
     displayIcon: boolean;
-}, {}>, {
-    "highlight-decorator"?(_: {}): any;
-    "highlight-title"?(_: {}): any;
-    default?(_: {}): any;
+}, {}>, Readonly<{
+    /** Main content of the highlight */
+    default(): any;
+    /** Use it if you want to customize the default icon associated with the highlight. You can inject whatever you want here */
+    'highlight-decorator': () => any;
+    /** Not mandatory, renders a bold title above the main content */
+    'highlight-title': () => any;
+}> & {
+    /** Main content of the highlight */
+    default(): any;
+    /** Use it if you want to customize the default icon associated with the highlight. You can inject whatever you want here */
+    'highlight-decorator': () => any;
+    /** Not mandatory, renders a bold title above the main content */
+    'highlight-title': () => any;
 }>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/JoyIcon/JoyIcon.types.d.ts

@@ -1,6 +1,5 @@
 import type { JoyIconsId } from '@maltjoy/icons';
-export declare const JOY_ICONS_COLORS: readonly [...("neutral" | "success" | "info" | "warning" | "error")[], "primary", "secondary", "tertiary", "quaternary", "brand-primary", "brand-secondary", "white"];
-export type TJoyIconsColors = (typeof JOY_ICONS_COLORS)[number];
-export declare const JOY_ICONS_SIZES: readonly ["xlarge", "large", "medium", "small", "xsmall", "xxsmall"];
-export type TJoyIconSizes = (typeof JOY_ICONS_SIZES)[number];
+import { TSizes, TLevels } from '../../types';
+export type TJoyIconsColors = TLevels | 'primary' | 'secondary' | 'tertiary' | 'quaternary' | 'brand-primary' | 'brand-secondary' | 'white';
+export type TJoyIconSizes = TSizes;
 export type TJoyIconsNames = JoyIconsId;

package/dist/components/JoyIcon/VJoyIcon.vue.d.ts

@@ -1,4 +1,5 @@
 import { PropType } from 'vue';
+import { TJoyIconsColors } from './JoyIcon.types';
 declare const _default: import("vue").DefineComponent<{
     ariaLabel: {
         type: StringConstructor;
@@ -18,11 +19,12 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
     };
     color: {
-        type: PropType<"primary" | "secondary" | "neutral" | "success" | "info" | "warning" | "error" | "tertiary" | "quaternary" | "white" | "brand-primary" | "brand-secondary">;
+        type: PropType<TJoyIconsColors>;
         default: string;
     };
+    /** Use `TJoyIconSizes` */
     size: {
-        type: PropType<"small" | "xlarge" | "large" | "medium" | "xsmall" | "xxsmall">;
+        type: PropType<import("../../types").TSizes>;
         default: string;
     };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
@@ -44,16 +46,17 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
     };
     color: {
-        type: PropType<"primary" | "secondary" | "neutral" | "success" | "info" | "warning" | "error" | "tertiary" | "quaternary" | "white" | "brand-primary" | "brand-secondary">;
+        type: PropType<TJoyIconsColors>;
         default: string;
     };
+    /** Use `TJoyIconSizes` */
     size: {
-        type: PropType<"small" | "xlarge" | "large" | "medium" | "xsmall" | "xxsmall">;
+        type: PropType<import("../../types").TSizes>;
         default: string;
     };
 }>>, {
-    size: "small" | "xlarge" | "large" | "medium" | "xsmall" | "xxsmall";
-    color: "primary" | "secondary" | "neutral" | "success" | "info" | "warning" | "error" | "tertiary" | "quaternary" | "white" | "brand-primary" | "brand-secondary";
+    size: import("../../types").TSizes;
+    color: TJoyIconsColors;
     tabIndex: number;
 }, {}>;
 export default _default;

package/dist/components/JoyIndicator/VJoyIndicator.vue.d.ts

@@ -1,4 +1,5 @@
 import { PropType } from 'vue';
+import { TJoyIndicatorsVariants } from '../JoyIndicators/JoyIndicators.types';
 declare const _default: import("vue").DefineComponent<{
     /** Value is used for the parent v-model. Mandatory */
     value: {
@@ -11,7 +12,7 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
     variant: {
-        type: PropType<"default" | "light">;
+        type: PropType<TJoyIndicatorsVariants>;
         default: string;
     };
     /** Indicators are text-less buttons by design. To make the more accessible, you can pass them an aria-label that will describe more their action. */
@@ -30,7 +31,7 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
     variant: {
-        type: PropType<"default" | "light">;
+        type: PropType<TJoyIndicatorsVariants>;
         default: string;
     };
     /** Indicators are text-less buttons by design. To make the more accessible, you can pass them an aria-label that will describe more their action. */
@@ -38,7 +39,7 @@ declare const _default: import("vue").DefineComponent<{
         type: StringConstructor;
     };
 }>>, {
-    variant: "default" | "light";
+    variant: TJoyIndicatorsVariants;
     selected: boolean;
 }, {}>;
 export default _default;

package/dist/components/JoyIndicators/JoyIndicators.types.d.ts

@@ -1,2 +1 @@
-export declare const JOY_INDICATORS_VARIANT: readonly ["default", "light"];
-export type TJoyIndicatorsVariants = (typeof JOY_INDICATORS_VARIANT)[number];
+export type TJoyIndicatorsVariants = 'default' | 'light';

package/dist/components/JoyIndicators/VJoyIndicators.vue.d.ts

@@ -1,9 +1,10 @@
 import { PropType } from 'vue';
-import { VJoyIndicator } from '..';
+import VJoyIndicator from '../JoyIndicator/VJoyIndicator.vue';
+import { TJoyIndicatorsVariants } from './JoyIndicators.types';
 declare function isSelected(indicator: typeof VJoyIndicator): boolean;
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     variant: {
-        type: PropType<"default" | "light">;
+        type: PropType<TJoyIndicatorsVariants>;
     };
     /** Use the component with a v-model to easily handle selected items */
     modelValue: {
@@ -20,7 +21,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
             default: boolean;
         };
         variant: {
-            type: PropType<"default" | "light">;
+            type: PropType<TJoyIndicatorsVariants>;
             default: string;
         };
         ariaLabel: {
@@ -36,14 +37,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
             default: boolean;
         };
         variant: {
-            type: PropType<"default" | "light">;
+            type: PropType<TJoyIndicatorsVariants>;
             default: string;
         };
         ariaLabel: {
             type: StringConstructor;
         };
     }>>, {
-        variant: "default" | "light";
+        variant: TJoyIndicatorsVariants;
         selected: boolean;
     }, {}>[]>;
     isSelected: typeof isSelected;
@@ -51,7 +52,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     "update:modelValue": (value: string | number) => void;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     variant: {
-        type: PropType<"default" | "light">;
+        type: PropType<TJoyIndicatorsVariants>;
     };
     /** Use the component with a v-model to easily handle selected items */
     modelValue: {
@@ -60,8 +61,10 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
 }>> & {
     "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
 }, {}, {}>, Readonly<{
+    /** Use VJoyIndicator children here */
     default(): any;
 }> & {
+    /** Use VJoyIndicator children here */
     default(): any;
 }>;
 export default _default;

package/dist/components/JoyInput/JoyInput.types.d.ts

@@ -1,3 +1,2 @@
-import { SIZES } from '../../types';
-export type TJoyInputSizes = Extract<(typeof SIZES)[number], 'small' | 'medium' | 'large'>;
-export declare const INPUT_SIZES: TJoyInputSizes[];
+import { TSizes } from '../../types';
+export type TJoyInputSizes = Extract<TSizes, 'small' | 'medium' | 'large'>;

package/dist/components/JoyInput/VJoyInput.vue.d.ts

@@ -1,5 +1,6 @@
 import { PropType } from 'vue';
 import { TJoyInputSizes } from './JoyInput.types';
+import { TJoyLabelSizes } from '../JoyLabel/JoyLabel.types';
 declare function focus(): void;
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     autofocus: {
@@ -32,7 +33,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     label: StringConstructor;
     /** Overrides the default label size. See JoyLabel stories */
     labelSize: {
-        type: PropType<"small" | "large" | "medium">;
+        type: PropType<TJoyLabelSizes>;
         default: string;
     };
     /** If your component is not required, we can add a label to explicitely tell that it's not mandatory */
@@ -59,7 +60,6 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     size: {
         type: PropType<TJoyInputSizes>;
         default: string;
-        validator(size: TJoyInputSizes): boolean;
     };
     type: {
         type: StringConstructor;
@@ -107,7 +107,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     label: StringConstructor;
     /** Overrides the default label size. See JoyLabel stories */
     labelSize: {
-        type: PropType<"small" | "large" | "medium">;
+        type: PropType<TJoyLabelSizes>;
         default: string;
     };
     /** If your component is not required, we can add a label to explicitely tell that it's not mandatory */
@@ -134,7 +134,6 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     size: {
         type: PropType<TJoyInputSizes>;
         default: string;
-        validator(size: TJoyInputSizes): boolean;
     };
     type: {
         type: StringConstructor;
@@ -151,20 +150,24 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     "onUpdate:modelValue"?: ((value: string) => any) | undefined;
 }, {
     type: string;
-    size: TJoyInputSizes;
-    required: boolean;
+    readonly: boolean;
     disabled: boolean;
+    required: boolean;
+    size: TJoyInputSizes;
     invalid: boolean;
     autofocus: boolean;
-    labelSize: "small" | "large" | "medium";
+    labelSize: TJoyLabelSizes;
     requiredMark: boolean;
     modelModifiers: {
         lazy: boolean;
     };
     clearable: boolean;
-    readonly: boolean;
-}, {}>, {
-    default?(_: {}): any;
+}, {}>, Readonly<{
+    /** Default slot to display a label on top of the element. You can use label property as well  */
+    default?: (() => any) | undefined;
+}> & {
+    /** Default slot to display a label on top of the element. You can use label property as well  */
+    default?: (() => any) | undefined;
 }>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/JoyLabel/JoyLabel.types.d.ts

@@ -1,3 +1,2 @@
-/** LABEL SIZES */
-export declare const LABEL_SIZES: readonly ["small", "medium", "large"];
-export type TJoyLabelSizes = (typeof LABEL_SIZES)[number];
+import { TSizes } from '@/types';
+export type TJoyLabelSizes = Extract<TSizes, 'small' | 'medium' | 'large'>;

package/dist/components/JoyLabel/VJoyLabel.vue.d.ts

@@ -1,9 +1,9 @@
 import { PropType } from 'vue';
+import { TJoyLabelSizes } from './JoyLabel.types';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     size: {
-        type: PropType<"small" | "large" | "medium">;
+        type: PropType<TJoyLabelSizes>;
         default: string;
-        validator(size: "small" | "large" | "medium"): boolean;
     };
     tagName: {
         type: PropType<"label" | "legend">;
@@ -19,9 +19,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     text: StringConstructor;
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     size: {
-        type: PropType<"small" | "large" | "medium">;
+        type: PropType<TJoyLabelSizes>;
         default: string;
-        validator(size: "small" | "large" | "medium"): boolean;
     };
     tagName: {
         type: PropType<"label" | "legend">;
@@ -36,11 +35,15 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     };
     text: StringConstructor;
 }>>, {
-    size: "small" | "large" | "medium";
     required: boolean;
+    size: TJoyLabelSizes;
     tagName: "label" | "legend";
-}, {}>, {
-    default?(_: {}): any;
+}, {}>, Readonly<{
+    /** Label text here */
+    default: () => any;
+}> & {
+    /** Label text here */
+    default: () => any;
 }>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/JoyLink/JoyLink.types.d.ts

@@ -1,2 +1 @@
-export declare const LINK_COLORS: readonly ["teal", "white"];
-export type LinkColors = (typeof LINK_COLORS)[number];
+export type TJoyLinkColors = 'teal' | 'white';

package/dist/components/JoyLink/VJoyLink.vue.d.ts

@@ -1,13 +1,13 @@
 import { PropType } from 'vue';
+import { TJoyLinkColors } from './JoyLink.types';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     href: {
         type: StringConstructor;
         required: true;
     };
     color: {
-        type: PropType<"white" | "teal">;
+        type: PropType<TJoyLinkColors>;
         default: string;
-        validator(color: "white" | "teal"): boolean;
     };
     icon: PropType<import("@maltjoy/icons").JoyIconsId>;
     text: PropType<string | null>;
@@ -17,16 +17,17 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         required: true;
     };
     color: {
-        type: PropType<"white" | "teal">;
+        type: PropType<TJoyLinkColors>;
         default: string;
-        validator(color: "white" | "teal"): boolean;
     };
     icon: PropType<import("@maltjoy/icons").JoyIconsId>;
     text: PropType<string | null>;
 }>>, {
-    color: "white" | "teal";
-}, {}>, {
-    default?(_: {}): any;
+    color: TJoyLinkColors;
+}, {}>, Readonly<{
+    default(): any;
+}> & {
+    default(): any;
 }>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/JoyMenu/VJoyMenu.vue.d.ts

@@ -42,16 +42,12 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     onSelectItem?: ((value: IJoyMenuItem) => any) | undefined;
 }, {
     items: IJoyMenuItem[];
-}, {}>, {
-    "menu-item"?(_: {
-        [x: string]: any;
-        id?: string | undefined;
-        label: string;
-        href?: string | undefined;
-        icon?: import("@maltjoy/icons").JoyIconsId | undefined;
-        current?: boolean | undefined;
-        disabled?: boolean | undefined;
-    }): any;
+}, {}>, Readonly<{
+    /** Customize the inner content of each menu item */
+    'menu-item': () => any;
+}> & {
+    /** Customize the inner content of each menu item */
+    'menu-item': () => any;
 }>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/JoyMultiCheckbox/VJoyMultiCheckbox.vue.d.ts

@@ -1,4 +1,5 @@
 import { PropType } from 'vue';
+import { TJoyLabelSizes } from '../JoyLabel/JoyLabel.types';
 export interface Option {
     id: string;
     name?: string;
@@ -15,12 +16,14 @@ export interface Option {
     required?: boolean;
 }
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
+    /** To render the list of checkboxes you have to use this property. See "Controls" for object model */
     options: {
         type: PropType<Option[]>;
         required: true;
         validator(value: Option[]): boolean;
     };
     id: StringConstructor;
+    /** Use it with `v-model:value` */
     value: {
         type: PropType<any[]>;
         default(): never[];
@@ -31,10 +34,11 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     };
     label: StringConstructor;
     labelSize: {
-        type: PropType<"small" | "large" | "medium">;
+        type: PropType<TJoyLabelSizes>;
         default: string;
     };
     optionalLabel: StringConstructor;
+    /** Display the "*" next to the label */
     requiredMark: {
         type: BooleanConstructor;
         default: boolean;
@@ -42,12 +46,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:value": (value: any[]) => void;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /** To render the list of checkboxes you have to use this property. See "Controls" for object model */
     options: {
         type: PropType<Option[]>;
         required: true;
         validator(value: Option[]): boolean;
     };
     id: StringConstructor;
+    /** Use it with `v-model:value` */
     value: {
         type: PropType<any[]>;
         default(): never[];
@@ -58,10 +64,11 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     };
     label: StringConstructor;
     labelSize: {
-        type: PropType<"small" | "large" | "medium">;
+        type: PropType<TJoyLabelSizes>;
         default: string;
     };
     optionalLabel: StringConstructor;
+    /** Display the "*" next to the label */
     requiredMark: {
         type: BooleanConstructor;
         default: boolean;
@@ -71,24 +78,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
 }, {
     required: boolean;
     value: any[];
-    labelSize: "small" | "large" | "medium";
+    labelSize: TJoyLabelSizes;
     requiredMark: boolean;
-}, {}>, {
-    checkbox?(_: {
-        id: string;
-        name?: string | undefined;
-        value: string;
-        label: string;
-        subLabel?: string | undefined;
-        /**
-         * @default false
-         */
-        disabled?: boolean | undefined;
-        /**
-         * @default false
-         */
-        required?: boolean | undefined;
-    }): any;
+}, {}>, Readonly<{
+    /** Customize the inner content of each checkboxes */
+    checkbox?: (() => any) | undefined;
+}> & {
+    /** Customize the inner content of each checkboxes */
+    checkbox?: (() => any) | undefined;
 }>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/JoyPagination/VJoyPagination.vue.d.ts

@@ -57,12 +57,20 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
 }, {
     currentPage: number;
     totalPages: number;
-}, {}>, {
-    "pagination-prev"?(_: {}): any;
-    page?(_: {
-        page: number;
-    }): any;
-    "pagination-next"?(_: {}): any;
+}, {}>, Readonly<{
+    /** Customize the content of the left arrow */
+    'pagination-prev'?: (() => any) | undefined;
+    /** Customize the content of the right arrow */
+    'pagination-next'?: (() => any) | undefined;
+    /** Customize the content of each pagination item */
+    page?: (() => any) | undefined;
+}> & {
+    /** Customize the content of the left arrow */
+    'pagination-prev'?: (() => any) | undefined;
+    /** Customize the content of the right arrow */
+    'pagination-next'?: (() => any) | undefined;
+    /** Customize the content of each pagination item */
+    page?: (() => any) | undefined;
 }>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/JoyPanel/JoyPanel.types.d.ts

@@ -1,5 +1,3 @@
-import { SIZES } from '../../types';
-export type TJoyPanelSizes = Extract<(typeof SIZES)[number], 'small' | 'medium' | 'large'>;
-export declare const PANEL_SIZES: TJoyPanelSizes[];
-export type TJoyPanelTitleSizes = Extract<(typeof SIZES)[number], 'small' | 'large'>;
-export declare const PANEL_TITLE_SIZES: TJoyPanelTitleSizes[];
+import { TSizes } from '../../types';
+export type TJoyPanelSizes = Extract<TSizes, 'small' | 'medium' | 'large'>;
+export type TJoyPanelTitleSizes = Extract<TSizes, 'small' | 'large'>;

package/dist/components/JoyPanel/VJoyPanel.vue.d.ts

@@ -1,5 +1,6 @@
 import { PropType } from 'vue';
 import { TJoyPanelSizes, TJoyPanelTitleSizes } from './JoyPanel.types';
+import { TJoyScreenLoaderColors } from '../JoyScreenLoader/VJoyScreenLoader.types';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     flex: {
         type: StringConstructor;
@@ -11,19 +12,17 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     padding: {
         type: PropType<TJoyPanelSizes>;
         default: string;
-        validator(size: TJoyPanelSizes): boolean;
     };
     titleSize: {
         type: PropType<TJoyPanelTitleSizes>;
         default: string;
-        validator(size: TJoyPanelTitleSizes): boolean;
     };
     loading: {
         type: BooleanConstructor;
         default: boolean;
     };
     loadingColor: {
-        type: PropType<"light" | "dark">;
+        type: PropType<TJoyScreenLoaderColors>;
         default: string;
     };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
@@ -37,19 +36,17 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     padding: {
         type: PropType<TJoyPanelSizes>;
         default: string;
-        validator(size: TJoyPanelSizes): boolean;
     };
     titleSize: {
         type: PropType<TJoyPanelTitleSizes>;
         default: string;
-        validator(size: TJoyPanelTitleSizes): boolean;
     };
     loading: {
         type: BooleanConstructor;
         default: boolean;
     };
     loadingColor: {
-        type: PropType<"light" | "dark">;
+        type: PropType<TJoyScreenLoaderColors>;
         default: string;
     };
 }>>, {
@@ -57,14 +54,33 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     noMargin: boolean;
     padding: TJoyPanelSizes;
     titleSize: TJoyPanelTitleSizes;
-    loadingColor: "light" | "dark";
-}, {}>, {
-    "panel-title"?(_: {}): any;
-    "panel-title-action"?(_: {}): any;
-    "panel-subtitle"?(_: {}): any;
-    "panel-body"?(_: {}): any;
-    "panel-action"?(_: {}): any;
-    "panel-loader-content"?(_: {}): any;
+    loadingColor: TJoyScreenLoaderColors;
+}, {}>, Readonly<{
+    /** Main title of the panel */
+    'panel-title'(): any;
+    /** Subtitle, not mandatory */
+    'panel-subtitle'?(): any;
+    /** Top right corner actions. Put whatever you want */
+    'panel-title-action'?(): any;
+    /** Main content */
+    'panel-body'?(): any;
+    /** Mostly for CTA */
+    'panel-action'?(): any;
+    /** Customize the loading state content */
+    'panel-loader-content'?(): any;
+}> & {
+    /** Main title of the panel */
+    'panel-title'(): any;
+    /** Subtitle, not mandatory */
+    'panel-subtitle'?(): any;
+    /** Top right corner actions. Put whatever you want */
+    'panel-title-action'?(): any;
+    /** Main content */
+    'panel-body'?(): any;
+    /** Mostly for CTA */
+    'panel-action'?(): any;
+    /** Customize the loading state content */
+    'panel-loader-content'?(): any;
 }>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {