vuetify 3.5.5 → 3.5.7

package/lib/labs/VEmptyState/VEmptyState.mjs

@@ -0,0 +1,145 @@
+import { createVNode as _createVNode, Fragment as _Fragment } from "vue";
+// Styles
+import "./VEmptyState.css";
+
+// Components
+import { VBtn } from "../../components/VBtn/index.mjs";
+import { VDefaultsProvider } from "../../components/VDefaultsProvider/index.mjs";
+import { VIcon } from "../../components/VIcon/index.mjs";
+import { VImg } from "../../components/VImg/index.mjs"; // Composables
+import { useBackgroundColor } from "../../composables/color.mjs";
+import { makeComponentProps } from "../../composables/component.mjs";
+import { makeDimensionProps, useDimension } from "../../composables/dimensions.mjs";
+import { IconValue } from "../../composables/icons.mjs";
+import { makeSizeProps } from "../../composables/size.mjs";
+import { makeThemeProps, provideTheme } from "../../composables/theme.mjs"; // Utilities
+import { toRef } from 'vue';
+import { convertToUnit, genericComponent, propsFactory, useRender } from "../../util/index.mjs"; // Types
+// Types
+export const makeVEmptyStateProps = propsFactory({
+  actionText: String,
+  bgColor: String,
+  color: String,
+  icon: IconValue,
+  image: String,
+  justify: {
+    type: String,
+    default: 'center'
+  },
+  headline: String,
+  title: String,
+  text: String,
+  textWidth: {
+    type: [Number, String],
+    default: 500
+  },
+  href: String,
+  to: String,
+  ...makeComponentProps(),
+  ...makeDimensionProps(),
+  ...makeSizeProps({
+    size: undefined
+  }),
+  ...makeThemeProps()
+}, 'VEmptyState');
+export const VEmptyState = genericComponent()({
+  name: 'VEmptyState',
+  props: makeVEmptyStateProps(),
+  emits: {
+    'click:action': e => true
+  },
+  setup(props, _ref) {
+    let {
+      emit,
+      slots
+    } = _ref;
+    const {
+      themeClasses
+    } = provideTheme(props);
+    const {
+      backgroundColorClasses,
+      backgroundColorStyles
+    } = useBackgroundColor(toRef(props, 'bgColor'));
+    const {
+      dimensionStyles
+    } = useDimension(props);
+    function onClickAction(e) {
+      emit('click:action', e);
+    }
+    useRender(() => {
+      const hasActions = !!(slots.actions || props.actionText);
+      const hasHeadline = !!(slots.headline || props.headline);
+      const hasTitle = !!(slots.title || props.title);
+      const hasText = !!(slots.text || props.text);
+      const hasMedia = !!(slots.media || props.image || props.icon);
+      const size = props.size || (props.image ? 200 : 96);
+      return _createVNode("div", {
+        "class": ['v-empty-state', {
+          [`v-empty-state--${props.justify}`]: true
+        }, themeClasses.value, backgroundColorClasses.value, props.class],
+        "style": [backgroundColorStyles.value, dimensionStyles.value, props.style]
+      }, [hasMedia && _createVNode("div", {
+        "key": "media",
+        "class": "v-empty-state__media"
+      }, [!slots.media ? _createVNode(_Fragment, null, [props.image ? _createVNode(VImg, {
+        "key": "image",
+        "src": props.image,
+        "height": size
+      }, null) : props.icon ? _createVNode(VIcon, {
+        "key": "icon",
+        "size": size,
+        "icon": props.icon
+      }, null) : undefined]) : _createVNode(VDefaultsProvider, {
+        "key": "media-defaults",
+        "defaults": {
+          VImg: {
+            src: props.image,
+            height: size
+          },
+          VIcon: {
+            size,
+            icon: props.icon
+          }
+        }
+      }, {
+        default: () => [slots.media()]
+      })]), hasHeadline && _createVNode("div", {
+        "key": "headline",
+        "class": "v-empty-state__headline"
+      }, [slots.headline?.() ?? props.headline]), hasTitle && _createVNode("div", {
+        "key": "title",
+        "class": "v-empty-state__title"
+      }, [slots.title?.() ?? props.title]), hasText && _createVNode("div", {
+        "key": "text",
+        "class": "v-empty-state__text",
+        "style": {
+          maxWidth: convertToUnit(props.textWidth)
+        }
+      }, [slots.text?.() ?? props.text]), slots.default && _createVNode("div", {
+        "key": "content",
+        "class": "v-empty-state__content"
+      }, [slots.default()]), hasActions && _createVNode("div", {
+        "key": "actions",
+        "class": "v-empty-state__actions"
+      }, [_createVNode(VDefaultsProvider, {
+        "defaults": {
+          VBtn: {
+            class: 'v-empty-state__action-btn',
+            color: props.color,
+            text: props.actionText
+          }
+        }
+      }, {
+        default: () => [slots.actions?.({
+          props: {
+            onClick: onClickAction
+          }
+        }) ?? _createVNode(VBtn, {
+          "onClick": onClickAction
+        }, null)]
+      })])]);
+    });
+    return {};
+  }
+});
+//# sourceMappingURL=VEmptyState.mjs.map

package/lib/labs/VEmptyState/VEmptyState.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"VEmptyState.mjs","names":["VBtn","VDefaultsProvider","VIcon","VImg","useBackgroundColor","makeComponentProps","makeDimensionProps","useDimension","IconValue","makeSizeProps","makeThemeProps","provideTheme","toRef","convertToUnit","genericComponent","propsFactory","useRender","makeVEmptyStateProps","actionText","String","bgColor","color","icon","image","justify","type","default","headline","title","text","textWidth","Number","href","to","size","undefined","VEmptyState","name","props","emits","e","setup","_ref","emit","slots","themeClasses","backgroundColorClasses","backgroundColorStyles","dimensionStyles","onClickAction","hasActions","actions","hasHeadline","hasTitle","hasText","hasMedia","media","_createVNode","value","class","style","_Fragment","src","height","maxWidth","onClick"],"sources":["../../../src/labs/VEmptyState/VEmptyState.tsx"],"sourcesContent":["// Styles\nimport './VEmptyState.sass'\n\n// Components\nimport { VBtn } from '@/components/VBtn'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VIcon } from '@/components/VIcon'\nimport { VImg } from '@/components/VImg'\n\n// Composables\nimport { useBackgroundColor } from '@/composables/color'\nimport { makeComponentProps } from '@/composables/component'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { IconValue } from '@/composables/icons'\nimport { makeSizeProps } from '@/composables/size'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\n\n// Utilities\nimport { toRef } from 'vue'\nimport { convertToUnit, genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\n// Types\n\nexport type VEmptyStateSlots = {\n  actions: {\n    props: {\n      onClick: (e: Event) => void\n    }\n  }\n  default: never\n  headline: never\n  title: never\n  media: never\n  text: never\n}\n\nexport const makeVEmptyStateProps = propsFactory({\n  actionText: String,\n  bgColor: String,\n  color: String,\n  icon: IconValue,\n  image: String,\n  justify: {\n    type: String as PropType<'start' | 'center' | 'end'>,\n    default: 'center',\n  },\n  headline: String,\n  title: String,\n  text: String,\n  textWidth: {\n    type: [Number, String],\n    default: 500,\n  },\n  href: String,\n  to: String,\n\n  ...makeComponentProps(),\n  ...makeDimensionProps(),\n  ...makeSizeProps({ size: undefined }),\n  ...makeThemeProps(),\n}, 'VEmptyState')\n\nexport const VEmptyState = genericComponent<VEmptyStateSlots>()({\n  name: 'VEmptyState',\n\n  props: makeVEmptyStateProps(),\n\n  emits: {\n    'click:action': (e: Event) => true,\n  },\n\n  setup (props, { emit, slots }) {\n    const { themeClasses } = provideTheme(props)\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'bgColor'))\n    const { dimensionStyles } = useDimension(props)\n\n    function onClickAction (e: Event) {\n      emit('click:action', e)\n    }\n\n    useRender(() => {\n      const hasActions = !!(slots.actions || props.actionText)\n      const hasHeadline = !!(slots.headline || props.headline)\n      const hasTitle = !!(slots.title || props.title)\n      const hasText = !!(slots.text || props.text)\n      const hasMedia = !!(slots.media || props.image || props.icon)\n      const size = props.size || (props.image ? 200 : 96)\n\n      return (\n        <div\n          class={[\n            'v-empty-state',\n            {\n              [`v-empty-state--${props.justify}`]: true,\n            },\n            themeClasses.value,\n            backgroundColorClasses.value,\n            props.class,\n          ]}\n          style={[\n            backgroundColorStyles.value,\n            dimensionStyles.value,\n            props.style,\n          ]}\n        >\n          { hasMedia && (\n            <div key=\"media\" class=\"v-empty-state__media\">\n              { !slots.media ? (\n                <>\n                  { props.image ? (\n                    <VImg\n                      key=\"image\"\n                      src={ props.image }\n                      height={ size }\n                    />\n                  ) : props.icon ? (\n                    <VIcon\n                      key=\"icon\"\n                      size={ size }\n                      icon={ props.icon }\n                    />\n                  ) : undefined }\n                </>\n              ) : (\n                <VDefaultsProvider\n                  key=\"media-defaults\"\n                  defaults={{\n                    VImg: {\n                      src: props.image,\n                      height: size,\n                    },\n                    VIcon: {\n                      size,\n                      icon: props.icon,\n                    },\n                  }}\n                >\n                  { slots.media() }\n                </VDefaultsProvider>\n              )}\n            </div>\n          )}\n\n          { hasHeadline && (\n            <div key=\"headline\" class=\"v-empty-state__headline\">\n              { slots.headline?.() ?? props.headline }\n            </div>\n          )}\n\n          { hasTitle && (\n            <div key=\"title\" class=\"v-empty-state__title\">\n              { slots.title?.() ?? props.title }\n            </div>\n          )}\n\n          { hasText && (\n            <div\n              key=\"text\"\n              class=\"v-empty-state__text\"\n              style={{\n                maxWidth: convertToUnit(props.textWidth),\n              }}\n            >\n              { slots.text?.() ?? props.text }\n            </div>\n          )}\n\n          { slots.default && (\n            <div key=\"content\" class=\"v-empty-state__content\">\n              { slots.default() }\n            </div>\n          )}\n\n          { hasActions && (\n            <div key=\"actions\" class=\"v-empty-state__actions\">\n              <VDefaultsProvider\n                defaults={{\n                  VBtn: {\n                    class: 'v-empty-state__action-btn',\n                    color: props.color,\n                    text: props.actionText,\n                  },\n                }}\n              >\n                {\n                  slots.actions?.({ props: { onClick: onClickAction } }) ?? (\n                    <VBtn onClick={ onClickAction } />\n                  )\n                }\n              </VDefaultsProvider>\n            </div>\n          )}\n        </div>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VEmptyState = InstanceType<typeof VEmptyState>\n"],"mappings":"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"}

package/lib/labs/VEmptyState/VEmptyState.sass

@@ -0,0 +1,53 @@
+@use './variables' as *
+
+.v-empty-state
+  align-items: center
+  display: flex
+  flex-direction: column
+  justify-content: center
+  min-height: $empty-state-min-height
+  padding: $empty-state-padding
+
+  &--start
+    align-items: flex-start
+
+  &--center
+    align-items: center
+
+  &--end
+    align-items: flex-end
+
+.v-empty-state__media
+  text-align: center
+  width: 100%
+
+.v-empty-state__headline
+  color: $empty-state-headline-color
+  font-size: $empty-state-headline-font-size
+  font-weight: $empty-state-headline-font-weight
+  line-height: $empty-state-headline-line-height
+
+.v-empty-state__title
+  font-size: $empty-state-title-font-size
+  font-weight: $empty-state-title-font-weight
+  line-height: $empty-state-title-line-height
+  text-align: center
+
+.v-empty-state__text
+  font-size: $empty-state-text-font-size
+  font-weight: $empty-state-text-font-weight
+  line-height: $empty-state-text-line-height
+  padding: $empty-state-text-padding
+  text-align: center
+
+.v-empty-state__content
+  padding: $empty-state-content-padding
+
+.v-empty-state__actions
+  display: flex
+  gap: $empty-state-actions-gap
+  padding: $empty-state-actions-padding
+
+.v-empty-state__action-btn.v-btn
+  background-color: $empty-state-actions-btn-background-color
+  color: $empty-state-actions-btn-color

package/lib/labs/VEmptyState/_variables.scss

@@ -0,0 +1,22 @@
+@use '../../styles/settings';
+@use "../../styles/tools/functions";
+
+$empty-state-actions-btn-background-color: rgb(var(--v-theme-surface-variant)) !default;
+$empty-state-actions-btn-color: rgb(var(--v-theme-on-surface-variant)) !default;
+$empty-state-actions-gap: 8px !default;
+$empty-state-actions-padding: 16px !default;
+$empty-state-content-padding: 24px 0 !default;
+$empty-state-headline-color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity)) !default;
+$empty-state-headline-font-size: functions.map-deep-get(settings.$typography, 'h2', 'size') !default;
+$empty-state-headline-line-height: functions.map-deep-get(settings.$typography, 'h2', 'line-height') !default;
+$empty-state-headline-font-weight: functions.map-deep-get(settings.$typography, 'h2', 'weight') !default;
+$empty-state-image-padding: 16px !default;
+$empty-state-min-height: 100% !default;
+$empty-state-padding: 16px !default;
+$empty-state-text-font-size: functions.map-deep-get(settings.$typography, 'body-1', 'size') !default;
+$empty-state-text-font-weight: functions.map-deep-get(settings.$typography, 'body-1', 'weight') !default;
+$empty-state-text-line-height: functions.map-deep-get(settings.$typography, 'body-1', 'line-height') !default;
+$empty-state-text-padding: 0 16px !default;
+$empty-state-title-font-size: functions.map-deep-get(settings.$typography, 'h6', 'size') !default;
+$empty-state-title-line-height: functions.map-deep-get(settings.$typography, 'h6', 'line-height') !default;
+$empty-state-title-font-weight: functions.map-deep-get(settings.$typography, 'h6', 'weight') !default;

package/lib/labs/VEmptyState/index.d.mts

@@ -0,0 +1,415 @@
+import * as vue from 'vue';
+import { ComponentPropsOptions, ExtractPropTypes, JSXComponent, PropType } from 'vue';
+
+interface FilterPropsOptions<PropsOptions extends Readonly<ComponentPropsOptions>, Props = ExtractPropTypes<PropsOptions>> {
+    filterProps<T extends Partial<Props>, U extends Exclude<keyof Props, Exclude<keyof Props, keyof T>>>(props: T): Partial<Pick<T, U>>;
+}
+
+type IconValue = string | (string | [path: string, opacity: number])[] | JSXComponent;
+declare const IconValue: PropType<IconValue>;
+
+declare const VEmptyState: {
+    new (...args: any[]): vue.CreateComponentPublicInstance<{
+        style: vue.StyleValue;
+        size: NonNullable<string | number> | undefined;
+        justify: "center" | "end" | "start";
+        textWidth: string | number;
+    } & {
+        height?: string | number | undefined;
+        width?: string | number | undefined;
+        color?: string | undefined;
+        maxHeight?: string | number | undefined;
+        maxWidth?: string | number | undefined;
+        minHeight?: string | number | undefined;
+        minWidth?: string | number | undefined;
+        title?: string | undefined;
+        image?: string | undefined;
+        text?: string | undefined;
+        class?: any;
+        icon?: IconValue | undefined;
+        href?: string | undefined;
+        to?: string | undefined;
+        theme?: string | undefined;
+        bgColor?: string | undefined;
+        actionText?: string | undefined;
+        headline?: string | undefined;
+    } & {
+        $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
+            actions?: ((arg: {
+                props: {
+                    onClick: (e: Event) => void;
+                };
+            }) => vue.VNodeChild) | undefined;
+            default?: (() => vue.VNodeChild) | undefined;
+            headline?: (() => vue.VNodeChild) | undefined;
+            title?: (() => vue.VNodeChild) | undefined;
+            media?: (() => vue.VNodeChild) | undefined;
+            text?: (() => vue.VNodeChild) | undefined;
+        };
+        'v-slots'?: {
+            actions?: false | ((arg: {
+                props: {
+                    onClick: (e: Event) => void;
+                };
+            }) => vue.VNodeChild) | undefined;
+            default?: false | (() => vue.VNodeChild) | undefined;
+            headline?: false | (() => vue.VNodeChild) | undefined;
+            title?: false | (() => vue.VNodeChild) | undefined;
+            media?: false | (() => vue.VNodeChild) | undefined;
+            text?: false | (() => vue.VNodeChild) | undefined;
+        } | undefined;
+    } & {
+        "v-slot:actions"?: false | ((arg: {
+            props: {
+                onClick: (e: Event) => void;
+            };
+        }) => vue.VNodeChild) | undefined;
+        "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
+        "v-slot:headline"?: false | (() => vue.VNodeChild) | undefined;
+        "v-slot:title"?: false | (() => vue.VNodeChild) | undefined;
+        "v-slot:media"?: false | (() => vue.VNodeChild) | undefined;
+        "v-slot:text"?: false | (() => vue.VNodeChild) | undefined;
+    } & {
+        "onClick:action"?: ((e: Event) => any) | undefined;
+    }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
+        'click:action': (e: Event) => true;
+    }, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
+        style: vue.StyleValue;
+        size: NonNullable<string | number> | undefined;
+        justify: "center" | "end" | "start";
+        textWidth: string | number;
+    } & {
+        height?: string | number | undefined;
+        width?: string | number | undefined;
+        color?: string | undefined;
+        maxHeight?: string | number | undefined;
+        maxWidth?: string | number | undefined;
+        minHeight?: string | number | undefined;
+        minWidth?: string | number | undefined;
+        title?: string | undefined;
+        image?: string | undefined;
+        text?: string | undefined;
+        class?: any;
+        icon?: IconValue | undefined;
+        href?: string | undefined;
+        to?: string | undefined;
+        theme?: string | undefined;
+        bgColor?: string | undefined;
+        actionText?: string | undefined;
+        headline?: string | undefined;
+    } & {
+        $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
+            actions?: ((arg: {
+                props: {
+                    onClick: (e: Event) => void;
+                };
+            }) => vue.VNodeChild) | undefined;
+            default?: (() => vue.VNodeChild) | undefined;
+            headline?: (() => vue.VNodeChild) | undefined;
+            title?: (() => vue.VNodeChild) | undefined;
+            media?: (() => vue.VNodeChild) | undefined;
+            text?: (() => vue.VNodeChild) | undefined;
+        };
+        'v-slots'?: {
+            actions?: false | ((arg: {
+                props: {
+                    onClick: (e: Event) => void;
+                };
+            }) => vue.VNodeChild) | undefined;
+            default?: false | (() => vue.VNodeChild) | undefined;
+            headline?: false | (() => vue.VNodeChild) | undefined;
+            title?: false | (() => vue.VNodeChild) | undefined;
+            media?: false | (() => vue.VNodeChild) | undefined;
+            text?: false | (() => vue.VNodeChild) | undefined;
+        } | undefined;
+    } & {
+        "v-slot:actions"?: false | ((arg: {
+            props: {
+                onClick: (e: Event) => void;
+            };
+        }) => vue.VNodeChild) | undefined;
+        "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
+        "v-slot:headline"?: false | (() => vue.VNodeChild) | undefined;
+        "v-slot:title"?: false | (() => vue.VNodeChild) | undefined;
+        "v-slot:media"?: false | (() => vue.VNodeChild) | undefined;
+        "v-slot:text"?: false | (() => vue.VNodeChild) | undefined;
+    } & {
+        "onClick:action"?: ((e: Event) => any) | undefined;
+    }, {
+        style: vue.StyleValue;
+        size: NonNullable<string | number> | undefined;
+        justify: "center" | "end" | "start";
+        textWidth: string | number;
+    }, true, {}, vue.SlotsType<Partial<{
+        actions: (arg: {
+            props: {
+                onClick: (e: Event) => void;
+            };
+        }) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            [key: string]: any;
+        }>[];
+        default: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            [key: string]: any;
+        }>[];
+        headline: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            [key: string]: any;
+        }>[];
+        title: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            [key: string]: any;
+        }>[];
+        media: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            [key: string]: any;
+        }>[];
+        text: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            [key: string]: any;
+        }>[];
+    }>>, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, {
+        style: vue.StyleValue;
+        size: NonNullable<string | number> | undefined;
+        justify: "center" | "end" | "start";
+        textWidth: string | number;
+    } & {
+        height?: string | number | undefined;
+        width?: string | number | undefined;
+        color?: string | undefined;
+        maxHeight?: string | number | undefined;
+        maxWidth?: string | number | undefined;
+        minHeight?: string | number | undefined;
+        minWidth?: string | number | undefined;
+        title?: string | undefined;
+        image?: string | undefined;
+        text?: string | undefined;
+        class?: any;
+        icon?: IconValue | undefined;
+        href?: string | undefined;
+        to?: string | undefined;
+        theme?: string | undefined;
+        bgColor?: string | undefined;
+        actionText?: string | undefined;
+        headline?: string | undefined;
+    } & {
+        $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
+            actions?: ((arg: {
+                props: {
+                    onClick: (e: Event) => void;
+                };
+            }) => vue.VNodeChild) | undefined;
+            default?: (() => vue.VNodeChild) | undefined;
+            headline?: (() => vue.VNodeChild) | undefined;
+            title?: (() => vue.VNodeChild) | undefined;
+            media?: (() => vue.VNodeChild) | undefined;
+            text?: (() => vue.VNodeChild) | undefined;
+        };
+        'v-slots'?: {
+            actions?: false | ((arg: {
+                props: {
+                    onClick: (e: Event) => void;
+                };
+            }) => vue.VNodeChild) | undefined;
+            default?: false | (() => vue.VNodeChild) | undefined;
+            headline?: false | (() => vue.VNodeChild) | undefined;
+            title?: false | (() => vue.VNodeChild) | undefined;
+            media?: false | (() => vue.VNodeChild) | undefined;
+            text?: false | (() => vue.VNodeChild) | undefined;
+        } | undefined;
+    } & {
+        "v-slot:actions"?: false | ((arg: {
+            props: {
+                onClick: (e: Event) => void;
+            };
+        }) => vue.VNodeChild) | undefined;
+        "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
+        "v-slot:headline"?: false | (() => vue.VNodeChild) | undefined;
+        "v-slot:title"?: false | (() => vue.VNodeChild) | undefined;
+        "v-slot:media"?: false | (() => vue.VNodeChild) | undefined;
+        "v-slot:text"?: false | (() => vue.VNodeChild) | undefined;
+    } & {
+        "onClick:action"?: ((e: Event) => any) | undefined;
+    }, {}, {}, {}, {}, {
+        style: vue.StyleValue;
+        size: NonNullable<string | number> | undefined;
+        justify: "center" | "end" | "start";
+        textWidth: string | number;
+    }>;
+    __isFragment?: undefined;
+    __isTeleport?: undefined;
+    __isSuspense?: undefined;
+} & vue.ComponentOptionsBase<{
+    style: vue.StyleValue;
+    size: NonNullable<string | number> | undefined;
+    justify: "center" | "end" | "start";
+    textWidth: string | number;
+} & {
+    height?: string | number | undefined;
+    width?: string | number | undefined;
+    color?: string | undefined;
+    maxHeight?: string | number | undefined;
+    maxWidth?: string | number | undefined;
+    minHeight?: string | number | undefined;
+    minWidth?: string | number | undefined;
+    title?: string | undefined;
+    image?: string | undefined;
+    text?: string | undefined;
+    class?: any;
+    icon?: IconValue | undefined;
+    href?: string | undefined;
+    to?: string | undefined;
+    theme?: string | undefined;
+    bgColor?: string | undefined;
+    actionText?: string | undefined;
+    headline?: string | undefined;
+} & {
+    $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
+        actions?: ((arg: {
+            props: {
+                onClick: (e: Event) => void;
+            };
+        }) => vue.VNodeChild) | undefined;
+        default?: (() => vue.VNodeChild) | undefined;
+        headline?: (() => vue.VNodeChild) | undefined;
+        title?: (() => vue.VNodeChild) | undefined;
+        media?: (() => vue.VNodeChild) | undefined;
+        text?: (() => vue.VNodeChild) | undefined;
+    };
+    'v-slots'?: {
+        actions?: false | ((arg: {
+            props: {
+                onClick: (e: Event) => void;
+            };
+        }) => vue.VNodeChild) | undefined;
+        default?: false | (() => vue.VNodeChild) | undefined;
+        headline?: false | (() => vue.VNodeChild) | undefined;
+        title?: false | (() => vue.VNodeChild) | undefined;
+        media?: false | (() => vue.VNodeChild) | undefined;
+        text?: false | (() => vue.VNodeChild) | undefined;
+    } | undefined;
+} & {
+    "v-slot:actions"?: false | ((arg: {
+        props: {
+            onClick: (e: Event) => void;
+        };
+    }) => vue.VNodeChild) | undefined;
+    "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
+    "v-slot:headline"?: false | (() => vue.VNodeChild) | undefined;
+    "v-slot:title"?: false | (() => vue.VNodeChild) | undefined;
+    "v-slot:media"?: false | (() => vue.VNodeChild) | undefined;
+    "v-slot:text"?: false | (() => vue.VNodeChild) | undefined;
+} & {
+    "onClick:action"?: ((e: Event) => any) | undefined;
+}, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
+    'click:action': (e: Event) => true;
+}, string, {
+    style: vue.StyleValue;
+    size: NonNullable<string | number> | undefined;
+    justify: "center" | "end" | "start";
+    textWidth: string | number;
+}, {}, string, vue.SlotsType<Partial<{
+    actions: (arg: {
+        props: {
+            onClick: (e: Event) => void;
+        };
+    }) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        [key: string]: any;
+    }>[];
+    default: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        [key: string]: any;
+    }>[];
+    headline: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        [key: string]: any;
+    }>[];
+    title: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        [key: string]: any;
+    }>[];
+    media: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        [key: string]: any;
+    }>[];
+    text: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        [key: string]: any;
+    }>[];
+}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
+    theme: StringConstructor;
+    size: Omit<{
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    }, "type" | "default"> & {
+        type: PropType<NonNullable<string | number> | undefined>;
+        default: NonNullable<string | number> | undefined;
+    };
+    height: (StringConstructor | NumberConstructor)[];
+    maxHeight: (StringConstructor | NumberConstructor)[];
+    maxWidth: (StringConstructor | NumberConstructor)[];
+    minHeight: (StringConstructor | NumberConstructor)[];
+    minWidth: (StringConstructor | NumberConstructor)[];
+    width: (StringConstructor | NumberConstructor)[];
+    class: PropType<any>;
+    style: {
+        type: PropType<vue.StyleValue>;
+        default: null;
+    };
+    actionText: StringConstructor;
+    bgColor: StringConstructor;
+    color: StringConstructor;
+    icon: PropType<IconValue>;
+    image: StringConstructor;
+    justify: {
+        type: PropType<"center" | "end" | "start">;
+        default: string;
+    };
+    headline: StringConstructor;
+    title: StringConstructor;
+    text: StringConstructor;
+    textWidth: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: number;
+    };
+    href: StringConstructor;
+    to: StringConstructor;
+}, vue.ExtractPropTypes<{
+    theme: StringConstructor;
+    size: Omit<{
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    }, "type" | "default"> & {
+        type: PropType<NonNullable<string | number> | undefined>;
+        default: NonNullable<string | number> | undefined;
+    };
+    height: (StringConstructor | NumberConstructor)[];
+    maxHeight: (StringConstructor | NumberConstructor)[];
+    maxWidth: (StringConstructor | NumberConstructor)[];
+    minHeight: (StringConstructor | NumberConstructor)[];
+    minWidth: (StringConstructor | NumberConstructor)[];
+    width: (StringConstructor | NumberConstructor)[];
+    class: PropType<any>;
+    style: {
+        type: PropType<vue.StyleValue>;
+        default: null;
+    };
+    actionText: StringConstructor;
+    bgColor: StringConstructor;
+    color: StringConstructor;
+    icon: PropType<IconValue>;
+    image: StringConstructor;
+    justify: {
+        type: PropType<"center" | "end" | "start">;
+        default: string;
+    };
+    headline: StringConstructor;
+    title: StringConstructor;
+    text: StringConstructor;
+    textWidth: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: number;
+    };
+    href: StringConstructor;
+    to: StringConstructor;
+}>>;
+type VEmptyState = InstanceType<typeof VEmptyState>;
+
+export { VEmptyState };

package/lib/labs/VEmptyState/index.mjs

@@ -0,0 +1,2 @@
+export { VEmptyState } from "./VEmptyState.mjs";
+//# sourceMappingURL=index.mjs.map

package/lib/labs/VEmptyState/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":["VEmptyState"],"sources":["../../../src/labs/VEmptyState/index.ts"],"sourcesContent":["export { VEmptyState } from './VEmptyState'\n"],"mappings":"SAASA,WAAW"}