@dolanske/vui 1.7.8 → 1.8.0

package/README.md

@@ -1,19 +1,19 @@
-# VUI
-
-1. `npm i @dolanske/vui`
-2. In your main app entry,`import "@dolanske/vui/style` to import the global CSS
-3. Build your thing bro
-
----
-
-## TODO
-
-- [ ] Bump target from ES2022 whenever vite-plugin-dts is fixed
-- [ ] Carousel (slider)
-- [ ] CodeBlock
-  - [ ] Code highlighting
-  - [ ] Copy code
-  - [ ] Type, padding, etc
-  - [ ] Use this https://shiki.style/guide/install
-- [ ] Command menu
-- [ ] Documentation site using my own template
+# VUI
+
+1. `npm i @dolanske/vui`
+2. In your main app entry,`import "@dolanske/vui/style` to import the global CSS
+3. Build your thing bro
+
+---
+
+## TODO
+
+- [ ] Bump target from ES2022 whenever vite-plugin-dts is fixed
+- [ ] Carousel (slider)
+- [ ] CodeBlock
+  - [ ] Code highlighting
+  - [ ] Copy code
+  - [ ] Type, padding, etc
+  - [ ] Use this https://shiki.style/guide/install
+- [ ] Command menu
+- [ ] Documentation site using my own template

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

@@ -1,5 +1,5 @@
-import { VueDatePickerProps } from '@vuepic/vue-datepicker';
-type __VLS_Props = VueDatePickerProps & {
+import { RootProps } from '@vuepic/vue-datepicker';
+type __VLS_Props = RootProps & {
     expand?: boolean;
 };
 declare function __VLS_template(): {
@@ -13,10 +13,8 @@ declare function __VLS_template(): {
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 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";
+    formats: Partial<import('@vuepic/vue-datepicker').FormatsConfig> | null;
 }, {}, {}, {}, 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

@@ -16,6 +16,10 @@ export interface Props {
      * Set he max height of the dropdown element before it starts scrolling
      */
     maxHeight?: number | string;
+    /**
+     * Disable mobile drawer behavior, always use the floating dropdown.
+     */
+    noMobileDrawer?: boolean;
 }
 declare function open(): void;
 declare function close(): void;
@@ -35,6 +39,12 @@ declare function __VLS_template(): {
             toggle: typeof toggle;
             isOpen: boolean;
         }): any;
+        default?(_: {
+            open: typeof open;
+            close: typeof close;
+            toggle: typeof toggle;
+            isOpen: boolean;
+        }): any;
     };
     refs: {
         anchor: HTMLDivElement;

package/dist/components/Modal/Confirm.vue.d.ts

@@ -26,13 +26,13 @@ declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {},
     onClose?: (() => any) | undefined;
     onConfirm?: (() => any) | undefined;
 }>, {
-    size: import('../../shared/types').Sizes | "screen";
+    size: import('../..').Sizes | "screen";
     open: boolean;
     canDismiss: boolean;
-    cancelText: string;
+    showCancel: boolean;
     confirmText: string;
     confirmVariant: Variants;
-    showCancel: boolean;
+    cancelText: string;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

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

@@ -36,6 +36,12 @@ export interface ModalProps {
      * Setting the value to `none` will not apply any transition
      */
     transitionName?: string | 'none';
+    /**
+     * On mobile, the modal automatically becomes fullscreen. You can configure this
+     * breakpoint by setting a custom `vuiBreakpoints` mobile variable. This
+     * setting disables the default behavior.
+     */
+    disableMobileFs?: boolean;
 }
 declare function __VLS_template(): {
     attrs: Partial<{}>;

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

@@ -28,6 +28,14 @@ export interface Props {
      * @default true
      */
     teleport?: boolean;
+    /**
+     * Delay in milliseconds before the popout becomes visible after `visible` turns true
+     */
+    enterDelay?: number;
+    /**
+     * Delay in milliseconds before the popout hides after `visible` turns false
+     */
+    leaveDelay?: number;
 }
 declare function __VLS_template(): {
     attrs: Partial<{}>;
@@ -45,8 +53,8 @@ declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {},
 }, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
     onClickOutside?: (() => any) | undefined;
 }>, {
-    offset: number;
     teleport: boolean;
+    offset: number;
     placement: Placement;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     popout: HTMLDivElement;

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

@@ -1,3 +1,4 @@
+import { Sizes } from '../../shared/types';
 export type SelectOption = {
     value: any;
     label: string;
@@ -21,6 +22,8 @@ declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>
         showClear?: boolean;
         disabled?: boolean;
         errors?: string[];
+        size?: Sizes;
+        noMobileDrawer?: boolean;
     }) & Partial<{}>> & import('vue').PublicProps;
     expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
     attrs: any;

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

@@ -2,6 +2,8 @@ interface Props {
     label?: string;
     disabled?: boolean;
     accent?: boolean;
+    reversed?: boolean;
+    hint?: string;
 }
 type __VLS_Props = Props;
 type __VLS_PublicProps = {

package/dist/components/Toast/toast.d.ts

@@ -52,7 +52,7 @@ export declare const toasts: import('vue').Ref<Map<number, {
         template?: string | object | undefined;
         render?: Function | undefined;
         components?: Record<string, Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions, {}, any>> | undefined;
-        directives?: Record<string, import('vue').Directive<any, any, string, string>> | undefined;
+        directives?: Record<string, import('vue').Directive<any, any, string, any>> | undefined;
         inheritAttrs?: boolean | undefined;
         emits?: any;
         slots?: {} | undefined;
@@ -129,18 +129,18 @@ export declare const toasts: import('vue').Ref<Map<number, {
         filters?: Record<string, Function> | undefined;
         mixins?: any[] | undefined;
         extends?: any;
-        beforeCreate?: (() => void) | undefined;
-        created?: (() => void) | undefined;
-        beforeMount?: (() => void) | undefined;
-        mounted?: (() => void) | undefined;
-        beforeUpdate?: (() => void) | undefined;
-        updated?: (() => void) | undefined;
-        activated?: (() => void) | undefined;
-        deactivated?: (() => void) | undefined;
-        beforeDestroy?: (() => void) | undefined;
-        beforeUnmount?: (() => void) | undefined;
-        destroyed?: (() => void) | undefined;
-        unmounted?: (() => void) | undefined;
+        beforeCreate?: (() => any) | undefined;
+        created?: (() => any) | undefined;
+        beforeMount?: (() => any) | undefined;
+        mounted?: (() => any) | undefined;
+        beforeUpdate?: (() => any) | undefined;
+        updated?: (() => any) | undefined;
+        activated?: (() => any) | undefined;
+        deactivated?: (() => any) | undefined;
+        beforeDestroy?: (() => any) | undefined;
+        beforeUnmount?: (() => any) | undefined;
+        destroyed?: (() => any) | undefined;
+        unmounted?: (() => any) | undefined;
         renderTracked?: ((e: import('vue').DebuggerEvent) => void) | undefined;
         renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | undefined;
         errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | undefined;
@@ -182,7 +182,7 @@ export declare const toasts: import('vue').Ref<Map<number, {
         template?: string | object | undefined;
         render?: Function | undefined;
         components?: Record<string, Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions, {}, any>> | undefined;
-        directives?: Record<string, import('vue').Directive<any, any, string, string>> | undefined;
+        directives?: Record<string, import('vue').Directive<any, any, string, any>> | undefined;
         inheritAttrs?: boolean | undefined;
         emits?: any;
         slots?: {} | undefined;
@@ -259,18 +259,18 @@ export declare const toasts: import('vue').Ref<Map<number, {
         filters?: Record<string, Function> | undefined;
         mixins?: any[] | undefined;
         extends?: any;
-        beforeCreate?: (() => void) | undefined;
-        created?: (() => void) | undefined;
-        beforeMount?: (() => void) | undefined;
-        mounted?: (() => void) | undefined;
-        beforeUpdate?: (() => void) | undefined;
-        updated?: (() => void) | undefined;
-        activated?: (() => void) | undefined;
-        deactivated?: (() => void) | undefined;
-        beforeDestroy?: (() => void) | undefined;
-        beforeUnmount?: (() => void) | undefined;
-        destroyed?: (() => void) | undefined;
-        unmounted?: (() => void) | undefined;
+        beforeCreate?: (() => any) | undefined;
+        created?: (() => any) | undefined;
+        beforeMount?: (() => any) | undefined;
+        mounted?: (() => any) | undefined;
+        beforeUpdate?: (() => any) | undefined;
+        updated?: (() => any) | undefined;
+        activated?: (() => any) | undefined;
+        deactivated?: (() => any) | undefined;
+        beforeDestroy?: (() => any) | undefined;
+        beforeUnmount?: (() => any) | undefined;
+        destroyed?: (() => any) | undefined;
+        unmounted?: (() => any) | undefined;
         renderTracked?: ((e: import('vue').DebuggerEvent) => void) | undefined;
         renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | undefined;
         errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | undefined;

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

@@ -7,7 +7,11 @@ interface Props {
     /**
      * Amount of time user should hover the anchor until the tooltip shows up
      */
-    delay?: number;
+    enterDelay?: number;
+    /**
+     * Amount of time after the cursor leaves before the tooltip is hidden
+     */
+    leaveDelay?: number;
     /**
      * If set to true, tooltip will not be rendered
      */

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 import { Command, default as Commands } from './components/Commands/Commands.vue';
+import { Sizes, Space, SpaceSize } from './shared/types';
 import { default as Accordion } from './components/Accordion/Accordion.vue';
 import { default as AccordionGroup } from './components/Accordion/AccordionGroup.vue';
 import { default as Alert } from './components/Alert/Alert.vue';
@@ -51,7 +52,8 @@ import { pushToast, removeToast } from './components/Toast/toast';
 import { default as Toasts } from './components/Toast/Toasts.vue';
 import { default as Tooltip } from './components/Tooltip/Tooltip.vue';
 import { default as Backdrop } from './internal/Backdrop/Backdrop.vue';
+import { vuiBreakpoints } from './shared/breakpoints';
 import { searchString } from './shared/helpers';
 import { setColorTheme, theme } from './shared/theme';
 import * as Table from './components/Table';
-export { Accordion, AccordionGroup, Alert, Avatar, Backdrop, Badge, BreadcrumbItem, Breadcrumbs, Button, ButtonGroup, Calendar, Card, Checkbox, Color, type Command, Commands, Confirm, CopyClipboard, Counter, defineTable, Divider, Drawer, Dropdown, DropdownItem, DropdownTitle, Dropzone, File, Flex, Grid, Input, Kbd, KbdGroup, Modal, OTP, OTPItem, paginate, Pagination, Password, Popout, Progress, pushToast, Radio, RadioGroup, removeToast, searchString, Select, setColorTheme, Sheet, Sidebar, Skeleton, Spinner, Switch, Tab, Table, Tabs, Textarea, theme, Toasts, Tooltip, };
+export { Accordion, AccordionGroup, Alert, Avatar, Backdrop, Badge, BreadcrumbItem, Breadcrumbs, Button, ButtonGroup, Calendar, Card, Checkbox, Color, type Command, Commands, Confirm, CopyClipboard, Counter, defineTable, Divider, Drawer, Dropdown, DropdownItem, DropdownTitle, Dropzone, File, Flex, Grid, Input, Kbd, KbdGroup, Modal, OTP, OTPItem, paginate, Pagination, Password, Popout, Progress, pushToast, Radio, RadioGroup, removeToast, searchString, Select, setColorTheme, Sheet, Sidebar, type Sizes, Skeleton, type Space, type SpaceSize, Spinner, Switch, Tab, Table, Tabs, Textarea, theme, Toasts, Tooltip, vuiBreakpoints, };

package/dist/shared/breakpoints.d.ts

@@ -0,0 +1,13 @@
+import { Ref } from 'vue';
+export declare enum Breakpoints {
+    Mobile = "mobile"
+}
+export declare const vuiBreakpoints: Ref<{
+    mobile: number;
+}, Record<Breakpoints, number> | {
+    mobile: number;
+}>;
+/**
+ * Returns a reactive boolean indicating if the current window width is less than or equal to the specified breakpoint.
+ */
+export declare function useBreakpoint(breakpoint: Breakpoints): Ref<boolean>;

package/dist/shared/layerManager.d.ts

@@ -0,0 +1,14 @@
+import { ref } from 'vue';
+interface UseLayer {
+    layerIndex: ReturnType<typeof ref<number>>;
+    openLayer: () => void;
+    closeLayer: () => void;
+}
+/**
+ * Provides a reactive z-index that participates in the global layer stack.
+ * Each floating element (Modal, Sheet, Popout, Tooltip, …) should call this
+ * composable and invoke `open()` when it becomes visible and `close()` when
+ * it hides.  The layer is automatically released when the component unmounts.
+ */
+export declare function useLayer(): UseLayer;
+export {};