entasis 0.4.1 → 0.6.0

package/dist/components/Dialog/dialog.mcp.js

@@ -60,6 +60,7 @@ The Dialog component (also known as Modal) displays content in a layer above the
 - **closable**: boolean (default: true) - Whether dialog can be closed
 - **swipeToDismiss**: boolean (default: true for drawer types) - Drag the drawer toward its edge to dismiss. Direction-aware (drawerRight drags right, drawerBottom drags down, etc.) and never hijacks inner scrolling; opt elements out with \`data-no-swipe\`
 - **thumb**: boolean (default: true) - Drag thumb bar shown on swipe-dismissable drawers (inner edge, orientation follows the drawer side, oversized hitbox); set false to hide. Themeable via the \`thumb\` theme part
+- **inset**: a spacing step or \`'none'\` — how far a drawer stands off the screen edge for this dialog. Defaults to the theme's \`designTokens.drawerInset\` (\`'layout-md'\`). At \`'none'\` the drawer is edge to edge, its edge corners square off and only the corners facing the page stay rounded
 - **swipeFrom**: 'panel' | 'handle' (default: 'panel') - Where a swipe can start: anywhere on the panel, or only the drag handles (thumb and header)
 
 ### Visual Props
@@ -340,7 +341,7 @@ const customTheme: DialogThemeProps = {
     },
     type: {
       fullScreen: 'h-full w-full max-w-full',
-      drawerRight: 'rounded-l-none h-full',
+      drawerRight: 'rounded-r-[var(--drawer-edge-radius)] h-full',
       modal: ''
     }
   },

package/dist/components/Dialog/dialog.props.d.ts

@@ -1,3 +1,4 @@
+import type { SpacingStep } from '../../tailwind/spacing.js';
 import type { Snippet } from 'svelte';
 import type { WithSlot } from '../Slot/slot.js';
 import type { DialogState } from './dialog.state.svelte.js';
@@ -53,6 +54,10 @@ export type DialogProps = WithSlot<{
     /** Where a swipe can start: the whole panel (`panel`, default) or only the drag handles
      *  (`handle` — the thumb and the header). */
     swipeFrom?: 'panel' | 'handle';
+    /** How far a drawer stands off the screen edge: a spacing step or `'none'` for edge to edge.
+     *  Defaults to the theme's `designTokens.drawerInset` (`'layout-md'`). At `'none'` the edge
+     *  corners square off and only the corners facing the page keep their radius. */
+    inset?: SpacingStep | 'none';
     /** Additional CSS classes merged onto the portaled dialog root element. */
     class?: string;
     /** Per-instance theme overrides for dialog layout and styling class names. */

package/dist/components/Dialog/dialog.theme.d.ts

@@ -407,7 +407,7 @@ export declare const setDialogTheme: (theme: InferComponentTheme<{
         };
     }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
 }>) => void;
-export declare const useDialogTheme: (theme?: InferComponentTheme<{
+export declare const useDialogTheme: import("../../utils/cva/theme.js").UseComponentTheme<{
     motion: import("../../utils/motion/index.js").MotionResolver<{
         readonly type: {
             readonly modal: {};
@@ -542,142 +542,7 @@ export declare const useDialogTheme: (theme?: InferComponentTheme<{
             large: string;
         };
     }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-}> | undefined) => {
-    motion: import("../../utils/motion/index.js").MotionResolver<{
-        readonly type: {
-            readonly modal: {};
-            readonly fullScreen: {};
-            readonly drawerRight: {
-                readonly in: {
-                    readonly x: "100%";
-                };
-                readonly out: {
-                    readonly x: "100%";
-                };
-            };
-            readonly drawerLeft: {
-                readonly in: {
-                    readonly x: "-100%";
-                };
-                readonly out: {
-                    readonly x: "-100%";
-                };
-            };
-            readonly drawerBottom: {
-                readonly in: {
-                    readonly y: "100%";
-                };
-                readonly out: {
-                    readonly y: "100%";
-                };
-            };
-            readonly drawerTop: {
-                readonly in: {
-                    readonly y: "-100%";
-                };
-                readonly out: {
-                    readonly y: "-100%";
-                };
-            };
-            readonly alert: {
-                readonly in: {
-                    readonly y: -100;
-                };
-                readonly out: {
-                    readonly y: -100;
-                };
-            };
-        };
-    }>;
-    root: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        scroll: {
-            inner: string;
-            outer: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    align: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        type: {
-            fullScreen: string;
-            drawerRight: string;
-            drawerLeft: string;
-            drawerBottom: string;
-            drawerTop: string;
-            modal: string;
-            alert: string;
-        };
-        scroll: {
-            inner: string;
-            outer: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    backdrop: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    content: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-        type: {
-            fullScreen: string;
-            drawerRight: string;
-            drawerLeft: string;
-            drawerBottom: string;
-            drawerTop: string;
-            modal: string;
-            alert: string;
-        };
-        scroll: {
-            inner: string;
-            outer: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    thumb: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        type: {
-            fullScreen: string;
-            drawerRight: string;
-            drawerLeft: string;
-            drawerBottom: string;
-            drawerTop: string;
-            modal: string;
-            alert: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    header: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    footer: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    closeButton: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    title: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    description: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-};
+}>;
 export declare const useDialogMotion: () => import("../../utils/motion/index.js").ComponentMotion<{
     readonly type: {
         readonly modal: {};

package/dist/components/Dialog/dialog.theme.js

@@ -18,10 +18,12 @@ export const defaultDialogAlign = cva({
     variants: {
         type: {
             fullScreen: 'justify-center items-center',
-            drawerRight: 'justify-end',
-            drawerLeft: 'justify-start',
-            drawerBottom: 'justify-center items-end',
-            drawerTop: 'justify-center items-start',
+            // Drawers stand off the screen edge by `--drawer-inset` (the `drawerInset` design token),
+            // modals keep the fixed gutter.
+            drawerRight: 'justify-end p-(--drawer-inset)',
+            drawerLeft: 'justify-start p-(--drawer-inset)',
+            drawerBottom: 'justify-center items-end p-(--drawer-inset)',
+            drawerTop: 'justify-center items-start p-(--drawer-inset)',
             modal: 'justify-center items-center',
             alert: 'justify-center items-center'
         },
@@ -49,10 +51,12 @@ export const defaultDialogContent = cva({
         },
         type: {
             fullScreen: 'h-full w-full max-w-full origin-center',
-            drawerRight: 'rounded-l-none h-full origin-right',
-            drawerLeft: 'rounded-r-none h-full origin-left',
-            drawerBottom: 'rounded-b-none max-w-full origin-bottom',
-            drawerTop: 'rounded-t-none max-w-full origin-top',
+            // The side that meets the screen edge takes `--drawer-edge-radius` (see Dialog.svelte):
+            // the panel's own radius while the drawer is inset, square once `drawerInset` is `none`.
+            drawerRight: 'rounded-r-[var(--drawer-edge-radius)] h-full origin-right',
+            drawerLeft: 'rounded-l-[var(--drawer-edge-radius)] h-full origin-left',
+            drawerBottom: 'rounded-b-[var(--drawer-edge-radius)] max-w-full origin-bottom',
+            drawerTop: 'rounded-t-[var(--drawer-edge-radius)] max-w-full origin-top',
             modal: 'origin-center',
             alert: 'origin-center'
         },

package/dist/components/Diff/diff.theme.d.ts

@@ -11,12 +11,8 @@ export declare const setDiffTheme: (theme: InferComponentTheme<{
     file: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
     error: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
 }>) => void;
-export declare const useDiffTheme: (theme?: InferComponentTheme<{
+export declare const useDiffTheme: import("../../utils/cva/theme.js").UseComponentTheme<{
     root: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
     file: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
     error: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-}> | undefined) => {
-    root: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    file: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    error: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-};
+}>;

package/dist/components/DocumentViewer/documentViewer.theme.d.ts

@@ -178,7 +178,7 @@ export declare const setDocumentViewerTheme: (theme: InferComponentTheme<{
     ooxmlCanvas: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
     ooxmlTextLayer: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
 }>) => void;
-export declare const useDocumentViewerTheme: (theme?: InferComponentTheme<{
+export declare const useDocumentViewerTheme: import("../../utils/cva/theme.js").UseComponentTheme<{
     root: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
         size: {
             small: string;
@@ -263,89 +263,4 @@ export declare const useDocumentViewerTheme: (theme?: InferComponentTheme<{
     ooxmlPage: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
     ooxmlCanvas: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
     ooxmlTextLayer: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-}> | undefined) => {
-    root: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-        position: {
-            top: string;
-            bottom: string;
-            left: string;
-            right: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    toolbar: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-        position: {
-            top: string;
-            bottom: string;
-            left: string;
-            right: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    pageInfo: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    viewer: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        position: {
-            top: string;
-            bottom: string;
-            left: string;
-            right: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    workspace: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    content: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    warning: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    sidebar: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    thumbnails: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    thumbnail: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    thumbnailActive: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    thumbnailPreview: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    thumbnailCanvas: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    surface: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    pages: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        orientation: {
-            vertical: string;
-            horizontal: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    single: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    singlePage: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    scroller: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    page: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    canvas: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    pageError: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    error: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    skeleton: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    search: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    searchInput: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    searchCount: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    sheetTabs: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    sheetTab: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    sheetTabActive: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    grid: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    gridCell: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    gridHeader: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    legacyPage: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    ooxmlPage: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    ooxmlCanvas: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-    ooxmlTextLayer: (props?: import("../../utils/cva/types.js").CVAClassProp | undefined) => string;
-};
+}>;

package/dist/components/Empty/empty.theme.d.ts

@@ -141,7 +141,7 @@ export declare const setEmptyTheme: (theme: InferComponentTheme<{
         };
     }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
 }>) => void;
-export declare const useEmptyTheme: (theme?: InferComponentTheme<{
+export declare const useEmptyTheme: import("../../utils/cva/theme.js").UseComponentTheme<{
     root: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
         size: {
             small: string;
@@ -210,73 +210,4 @@ export declare const useEmptyTheme: (theme?: InferComponentTheme<{
             large: string;
         };
     }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-}> | undefined) => {
-    root: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-        mode: {
-            normal: string;
-            card: string;
-        };
-        bordered: {
-            true: string;
-            false: null;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    header: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    media: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-        mediaVariant: {
-            default: string;
-            icon: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    title: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    description: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    content: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    actions: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-    footer: (props?: (import("../../utils/cva/types.js").CVAVariantSchema<{
-        size: {
-            small: string;
-            normal: string;
-            large: string;
-        };
-    }> & import("../../utils/cva/types.js").CVAClassProp) | undefined) => string;
-};
+}>;