@dolanske/vui 0.5.0 → 1.0.1

package/README.md

@@ -9,10 +9,10 @@
 ## 1.0 Checklist
 
 - [ ] Real life test
-  - [ ] Might be useful to build this in the hivecom project
-  - [ ] Build an example page with 100% of the components
-  - [ ] Run accessibility tools on it
-  - [ ] Run color contrast test
+  - [x] Might be useful to build this in the hivecom project
+  - [x] Build an example page with 100% of the components
+  - [x] Run accessibility tools on it
+  - [x] Run color contrast test
   - [ ] Make sure it works on mobile down to 340px
     - [ ] Components
     - [ ] Scale down Typography
@@ -27,6 +27,7 @@
   - [ ] Code highlighting
   - [ ] Copy code
   - [ ] Type, padding, etc
+  - [ ] Use this https://shiki.style/guide/install
 - [ ] Command dropdown
 - [ ] Documentation
   - [ ] Design my own documentation site (GENERIC?!)

package/dist/components/Accordion/Accordion.vue.d.ts

@@ -7,6 +7,7 @@ declare function open(): void;
 declare function close(): void;
 declare function toggle(): void;
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         trigger?(_: {
             open: typeof open;
@@ -20,7 +21,7 @@ declare function __VLS_template(): {
     refs: {
         content: HTMLDivElement;
     };
-    attrs: Partial<{}>;
+    rootEl: HTMLDivElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<AccordionProps, {
@@ -36,7 +37,7 @@ declare const __VLS_component: import('vue').DefineComponent<AccordionProps, {
     onClose?: (() => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     content: HTMLDivElement;
-}, any>;
+}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/Accordion/AccordionGroup.vue.d.ts

@@ -7,6 +7,7 @@ interface Props {
     single?: boolean;
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: Readonly<{
         default: () => Array<VNode & {
             props: AccordionProps;
@@ -19,10 +20,12 @@ declare function __VLS_template(): {
     refs: {
         accordion: unknown[];
     };
-    attrs: Partial<{}>;
+    rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    accordion: unknown[];
+}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/Alert/Alert.vue.d.ts

@@ -5,21 +5,28 @@ interface Props {
      */
     icon?: string;
     /**
-     * Setting a title and description will use slightly different styling other than slots.
+     * Setting a title and description will use slightly different styling other
+     * than slots.
      */
     title?: string;
+    /**
+     * Use strong color
+     */
+    filled?: boolean;
     description?: string;
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
+        default?(_: {}): any;
         default?(_: {}): any;
         end?(_: {}): any;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: HTMLDivElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/Avatar/Avatar.vue.d.ts

@@ -6,5 +6,20 @@ interface Props {
     icon?: string;
     alt?: string;
 }
-declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Badge/Badge.vue.d.ts

@@ -1,17 +1,18 @@
 interface Props {
-    variant?: 'neutral' | 'danger' | 'warning' | 'success' | 'info';
+    variant?: 'neutral' | 'danger' | 'warning' | 'success' | 'info' | 'accent';
     outline?: boolean;
     filled?: boolean;
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         default?(_: {}): any;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: HTMLDivElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/Breadcrumbs/BreadcrumbItem.vue.d.ts

@@ -1,17 +1,18 @@
 export interface BreadcrumbItemProps {
     label?: string;
-    path?: string;
+    href?: string;
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         default?(_: {}): any;
         default?(_: {}): any;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: HTMLLIElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<BreadcrumbItemProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<BreadcrumbItemProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import('vue').DefineComponent<BreadcrumbItemProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<BreadcrumbItemProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLLIElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/Breadcrumbs/Breadcrumbs.vue.d.ts

@@ -4,6 +4,7 @@ interface Props {
     separator?: string;
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: Readonly<{
         default: () => Array<VNode & {
             props: BreadcrumbItemProps;
@@ -14,10 +15,10 @@ declare function __VLS_template(): {
         }>;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: HTMLUListElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLUListElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/Button/Button.vue.d.ts

@@ -1,37 +1,28 @@
 import { Sizes } from '../../shared/types';
-export type Variants = 'default' | 'danger' | 'success' | 'link' | 'blue' | 'accent';
+export type Variants = 'fill' | 'danger' | 'success' | 'link' | 'accent' | 'gray';
 interface Props {
     loading?: boolean;
+    size?: Sizes;
     expand?: boolean;
     square?: boolean;
-    dashed?: boolean;
+    icon?: string;
+    variant?: Variants;
+    outline?: boolean;
     disabled?: boolean;
-    size?: Sizes;
-    /**
-     * Sets the hover styling property
-     */
-    active?: boolean;
-    /**
-     * No styling applied to the button unless hovered
-     */
     plain?: boolean;
-    variant?: Variants;
-    /**
-     * The children will be set to an icon and the icon will become a square
-     */
-    icon?: string;
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         start?(_: {}): any;
         default?(_: {}): any;
         end?(_: {}): any;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: HTMLButtonElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLButtonElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/ButtonGroup/ButtonGroup.vue.d.ts

@@ -1,15 +1,18 @@
+import { Space } from '../../shared/types';
 interface Props {
     vertical?: boolean;
+    gap?: Space | number;
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         default?(_: {}): any;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: HTMLDivElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/Calendar/Calendar.vue.d.ts

@@ -1,22 +1,22 @@
 import { VueDatePickerProps } from '@vuepic/vue-datepicker';
+type __VLS_Props = VueDatePickerProps & {
+    expand?: boolean;
+};
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         trigger?(_: {}): any;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<VueDatePickerProps & {
-    expand?: boolean;
-}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<VueDatePickerProps & {
-    expand?: boolean;
-}> & Readonly<{}>, {
-    dark: boolean;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     expand: boolean;
     format: string | ((date: Date) => string) | ((dates: Date[]) => string);
     autoApply: boolean;
     autoPosition: boolean | "top" | "bottom";
+    monthNameFormat: "long" | "short";
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/components/Card/Card.vue.d.ts

@@ -5,17 +5,18 @@ export interface Props {
     padding?: boolean;
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         header?(_: {}): any;
-        "header-end"?(_: {}): any;
+        'header-end'?(_: {}): any;
         default?(_: {}): any;
         footer?(_: {}): any;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: HTMLDivElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/Checkbox/Checkbox.vue.d.ts

@@ -4,24 +4,26 @@ interface Props {
     iconOff?: string;
     disabled?: boolean;
     checked?: boolean;
+    accent?: boolean;
 }
-declare let __VLS_typeProps: Props;
+type __VLS_Props = Props;
 type __VLS_PublicProps = {
     modelValue?: boolean;
-} & typeof __VLS_typeProps;
+} & __VLS_Props;
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: Readonly<Record<string, any>> & Record<string, any>;
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: HTMLDivElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     change: (checked: boolean) => any;
-    "update:modelValue": (modelValue: boolean) => any;
+    "update:modelValue": (value: boolean) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     onChange?: ((checked: boolean) => any) | undefined;
-    "onUpdate:modelValue"?: ((modelValue: boolean) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+    "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/CopyClipboard/CopyClipboard.vue.d.ts

@@ -13,6 +13,7 @@ interface Props {
     confirmTime?: number;
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         default?(_: {
             copy: (text: string) => Promise<void>;
@@ -24,7 +25,7 @@ declare function __VLS_template(): {
         anchor: HTMLDivElement;
         tooltip: HTMLDivElement;
     };
-    attrs: Partial<{}>;
+    rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {

package/dist/components/Divider/Divider.vue.d.ts

@@ -5,14 +5,15 @@ interface Props {
     margin?: string | number;
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         default?(_: {}): any;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: HTMLDivElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/Drawer/Drawer.vue.d.ts

@@ -26,22 +26,23 @@ interface Props {
     rootProps?: DrawerRootProps;
     portalProps?: DrawerPortalProps;
 }
-declare let __VLS_typeProps: Props;
+type __VLS_Props = Props;
 type __VLS_PublicProps = {
     modelValue?: boolean;
-} & typeof __VLS_typeProps;
+} & __VLS_Props;
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         default?(_: {}): any;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:modelValue": (modelValue: boolean) => any;
+    "update:modelValue": (value: boolean) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:modelValue"?: ((modelValue: boolean) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/components/Dropdown/Dropdown.vue.d.ts

@@ -12,11 +12,16 @@ export interface Props {
      * Sets the width of the dropdown to the width of its anchor
      */
     expand?: boolean;
+    /**
+     * Set he max height of the dropdown element before it starts scrolling
+     */
+    maxHeight?: number | string;
 }
 declare function open(): void;
 declare function close(): void;
 declare function toggle(): void;
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         trigger?(_: {
             open: typeof open;
@@ -40,6 +45,7 @@ declare function __VLS_template(): {
                 readonly anchor: import('../../shared/types').PopoutMaybeElement<HTMLElement>;
                 readonly placement?: Placement | undefined;
                 readonly offset?: number | undefined;
+                readonly onClickOutside?: (() => any) | undefined;
             } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
             $attrs: {
                 [x: string]: unknown;
@@ -55,9 +61,13 @@ declare function __VLS_template(): {
             $root: import('vue').ComponentPublicInstance | null;
             $parent: import('vue').ComponentPublicInstance | null;
             $host: Element | null;
-            $emit: (event: string, ...args: any[]) => void;
-            $el: any;
-            $options: import('vue').ComponentOptionsBase<Readonly<import('../Popout/Popout.vue').Props> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+            $emit: (event: "clickOutside") => void;
+            $el: HTMLDivElement;
+            $options: import('vue').ComponentOptionsBase<Readonly<import('../Popout/Popout.vue').Props> & Readonly<{
+                onClickOutside?: (() => any) | undefined;
+            }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+                clickOutside: () => any;
+            }, string, {
                 offset: number;
             }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
                 beforeCreate?: (() => void) | (() => void)[];
@@ -81,13 +91,15 @@ declare function __VLS_template(): {
             $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
         } & Readonly<{
             offset: number;
-        }> & Omit<Readonly<import('../Popout/Popout.vue').Props> & Readonly<{}>, "offset"> & import('vue').ShallowUnwrapRef<{}> & {} & import('vue').ComponentCustomProperties & {} & {
+        }> & Omit<Readonly<import('../Popout/Popout.vue').Props> & Readonly<{
+            onClickOutside?: (() => any) | undefined;
+        }>, "offset"> & import('vue').ShallowUnwrapRef<{}> & {} & import('vue').ComponentCustomProperties & {} & {
             $slots: {
                 default?(_: {}): any;
             };
         }) | null;
     };
-    attrs: Partial<{}>;
+    rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<Props, {
@@ -95,7 +107,73 @@ declare const __VLS_component: import('vue').DefineComponent<Props, {
     close: typeof close;
     toggle: typeof toggle;
     isOpen: import('vue').Ref<boolean, boolean>;
-}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    close: () => any;
+}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
+    onClose?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    anchor: HTMLDivElement;
+    dropdown: ({
+        $: import('vue').ComponentInternalInstance;
+        $data: {};
+        $props: {
+            readonly anchor: import('../../shared/types').PopoutMaybeElement<HTMLElement>;
+            readonly placement?: Placement | undefined;
+            readonly offset?: number | undefined;
+            readonly onClickOutside?: (() => any) | undefined;
+        } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        } & {
+            popout: HTMLDivElement;
+        };
+        $slots: Readonly<{
+            [name: string]: import('vue').Slot<any> | undefined;
+        }>;
+        $root: import('vue').ComponentPublicInstance | null;
+        $parent: import('vue').ComponentPublicInstance | null;
+        $host: Element | null;
+        $emit: (event: "clickOutside") => void;
+        $el: HTMLDivElement;
+        $options: import('vue').ComponentOptionsBase<Readonly<import('../Popout/Popout.vue').Props> & Readonly<{
+            onClickOutside?: (() => any) | undefined;
+        }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+            clickOutside: () => any;
+        }, string, {
+            offset: number;
+        }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
+            beforeCreate?: (() => void) | (() => void)[];
+            created?: (() => void) | (() => void)[];
+            beforeMount?: (() => void) | (() => void)[];
+            mounted?: (() => void) | (() => void)[];
+            beforeUpdate?: (() => void) | (() => void)[];
+            updated?: (() => void) | (() => void)[];
+            activated?: (() => void) | (() => void)[];
+            deactivated?: (() => void) | (() => void)[];
+            beforeDestroy?: (() => void) | (() => void)[];
+            beforeUnmount?: (() => void) | (() => void)[];
+            destroyed?: (() => void) | (() => void)[];
+            unmounted?: (() => void) | (() => void)[];
+            renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+            renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+            errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof import('vue').nextTick;
+        $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
+    } & Readonly<{
+        offset: number;
+    }> & Omit<Readonly<import('../Popout/Popout.vue').Props> & Readonly<{
+        onClickOutside?: (() => any) | undefined;
+    }>, "offset"> & import('vue').ShallowUnwrapRef<{}> & {} & import('vue').ComponentCustomProperties & {} & {
+        $slots: {
+            default?(_: {}): any;
+        };
+    }) | null;
+}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/Dropdown/DropdownItem.vue.d.ts

@@ -4,15 +4,16 @@ interface Props {
     iconEnd?: string;
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         default?(_: {}): any;
         hint?(_: {}): any;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: HTMLButtonElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLButtonElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/Dropdown/DropdownTitle.vue.d.ts

@@ -1,13 +1,17 @@
+type __VLS_Props = {
+    sticky?: boolean;
+};
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         default?(_: {}): any;
         end?(_: {}): any;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: HTMLDivElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/Flex/Flex.vue.d.ts

@@ -21,16 +21,17 @@ export interface FlexProps {
     expand?: boolean;
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         default?(_: {}): any;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: HTMLDivElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<FlexProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<FlexProps> & Readonly<{}>, {
     gap: Space | number;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {