@dolanske/vui 1.11.6 → 1.11.7

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

@@ -19,7 +19,7 @@ interface Props {
     /**
      * By default, elements with transition already use a default fade transition. This can be replaced by a custom vue transition class name.
      *
-     * Setting the value to `none` will not apply any transition
+     * Setting the value to `none` will not apply any transition. This is useful when using the View Transitions API to prevent conflicts between the default animation and the view transition.
      */
     transitionName?: string | 'none';
 }

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

@@ -21,6 +21,12 @@ export interface Props {
      * Disable mobile drawer behavior, always use the floating dropdown.
      */
     noMobileDrawer?: boolean;
+    /**
+     * By default, elements with transition already use a default fade transition. This can be replaced by a custom vue transition class name.
+     *
+     * Setting the value to `none` will not apply any transition. This is useful when using viewTransitions to prevent conflicts between default animation and the view transition
+     */
+    transitionName?: string | 'none';
 }
 declare function open(): void;
 declare function close(): void;

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

@@ -33,7 +33,7 @@ export interface ModalProps {
     /**
      * By default, elements with transition already use a default fade transition. This can be replaced by a custom vue transition class name.
      *
-     * Setting the value to `none` will not apply any transition
+     * Setting the value to `none` will not apply any transition. This is useful when using the View Transitions API to prevent conflicts between the default animation and the view transition.
      */
     transitionName?: string | 'none';
     /**

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

@@ -19,7 +19,7 @@ export interface Props {
     /**
      * By default, elements with transition already use a default fade transition. This can be replaced by a custom vue transition class name.
      *
-     * Setting the value to `none` will not apply any transition
+     * Setting the value to `none` will not apply any transition. This is useful when using viewTransitions to prevent conflicts between default animation and the view transition
      */
     transitionName?: string | 'none';
     /**

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

@@ -23,7 +23,20 @@ declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>
         disabled?: boolean;
         errors?: string[];
         size?: Sizes;
+        /**
+         * 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;
+        /**
+         * By default, elements with transition already use a default fade transition. This can be replaced by a custom vue transition class name.
+         *
+         * Setting the value to `none` will not apply any transition. This is useful when using viewTransitions to prevent conflicts between default animation and the view transition
+         */
+        transitionName?: string | "none";
     }) & Partial<{}>> & import('vue').PublicProps;
     expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
     attrs: any;

package/dist/src/components/Sheet/Sheet.vue.d.ts

@@ -28,7 +28,7 @@ interface Props {
     /**
      * By default, elements with transition already use a default fade transition. This can be replaced by a custom vue transition class name.
      *
-     * Setting the value to `none` will not apply any transition
+     * Setting the value to `none` will not apply any transition. This is useful when using the View Transitions API to prevent conflicts between the default animation and the view transition.
      */
     transitionName?: string | 'none';
 }

package/dist/src/components/Tabs/Tabs.vue.d.ts

@@ -2,6 +2,12 @@ interface Props {
     variant?: 'default' | 'filled';
     expand?: boolean;
     disabled?: boolean;
+    /**
+     * By default, elements with transition already use a default fade transition. This can be replaced by a custom vue transition class name.
+     *
+     * Setting the value to `none` will not apply any transition. This is useful when using the View Transitions API to prevent conflicts between the default animation and the view transition.
+     */
+    transitionName?: string | 'none';
 }
 type __VLS_Props = Props;
 type __VLS_PublicProps = {

package/dist/src/index.d.ts

@@ -53,8 +53,9 @@ 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 { useBreakpoint, vuiBreakpoints } from './shared/breakpoints';
 import { searchString } from './shared/helpers';
 import { setColorTheme, theme } from './shared/theme';
+import { useViewTransition } from './shared/viewTransition';
 import * as Table from './components/Table';
-export { Accordion, AccordionGroup, Alert, Avatar, Backdrop, Badge, BreadcrumbItem, Breadcrumbs, Button, ButtonGroup, Calendar, Card, Carousel, 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 Spaces as Space, type SpaceSize, Spinner, Switch, Tab, Table, Tabs, Textarea, theme, Toasts, Tooltip, vuiBreakpoints, };
+export { Accordion, AccordionGroup, Alert, Avatar, Backdrop, Badge, BreadcrumbItem, Breadcrumbs, Button, ButtonGroup, Calendar, Card, Carousel, 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 Spaces as Space, type SpaceSize, Spinner, Switch, Tab, Table, Tabs, Textarea, theme, Toasts, Tooltip, useBreakpoint, useViewTransition, vuiBreakpoints, };

package/dist/src/shared/viewTransition.d.ts

@@ -0,0 +1,25 @@
+import { Ref } from 'vue';
+interface ViewTransitionComposable {
+    /**
+     * Indicates if transition is currently in progress
+     */
+    isRunning: Ref<boolean>;
+    /**
+     * Starts a view transition. The provided `update` function will be called during the transition.
+     */
+    startTransition: (update: () => void | Promise<void>) => Promise<void>;
+}
+/**
+ * A generic composable for running View Transitions.
+ *
+ * In order to setup view transitions, we need to provide `transition-name` in
+ * CSS to the components we want to transition and then apply before & after
+ * styles to them via the selector
+ *
+ * ```css
+ * ::view-transition-old(<transition-name>) {}
+ * ::view-transition-new(<transition-name>) {}
+ * ```
+ */
+export declare function useViewTransition(): ViewTransitionComposable;
+export {};