@noxlovette/material 0.3.3 → 0.4.0

package/dist/components/containers/panes/index.d.ts

@@ -1,5 +0,0 @@
-export * from './theme.js';
-export * from './types.js';
-export { default as SinglePane } from './SinglePane.svelte';
-export { default as SplitPane } from './SplitPane.svelte';
-export { default as SupportingPane } from './SupportingPane.svelte';

package/dist/components/containers/panes/theme.d.ts

@@ -1,490 +0,0 @@
-import { type VariantProps } from 'tailwind-variants';
-export type SplitPaneVariants = VariantProps<typeof splitPane>;
-export type SinglePaneVariants = VariantProps<typeof singlePane>;
-export type SupportingPaneVariants = VariantProps<typeof supportingPane>;
-export declare const splitPane: import("tailwind-variants").TVReturnType<{
-    anchor: {
-        viewport: {
-            left: string;
-            handle: string;
-        };
-        parent: {
-            base: string;
-            left: string;
-            handle: string;
-        };
-        sticky: {
-            base: string;
-            left: string;
-            handle: string;
-            right: string;
-        };
-    };
-    full: {
-        true: {
-            left: string;
-            right: string;
-        };
-        false: string;
-    };
-    rounded: {
-        true: {
-            left: string;
-            right: string;
-        };
-        false: {
-            left: string;
-            right: string;
-        };
-    };
-}, {
-    left: string;
-    right: string;
-    handle: string;
-    handleGrip: string;
-    handlePip: string;
-    base: string;
-}, undefined, {
-    anchor: {
-        viewport: {
-            left: string;
-            handle: string;
-        };
-        parent: {
-            base: string;
-            left: string;
-            handle: string;
-        };
-        sticky: {
-            base: string;
-            left: string;
-            handle: string;
-            right: string;
-        };
-    };
-    full: {
-        true: {
-            left: string;
-            right: string;
-        };
-        false: string;
-    };
-    rounded: {
-        true: {
-            left: string;
-            right: string;
-        };
-        false: {
-            left: string;
-            right: string;
-        };
-    };
-}, {
-    left: string;
-    right: string;
-    handle: string;
-    handleGrip: string;
-    handlePip: string;
-    base: string;
-}, import("tailwind-variants").TVReturnType<{
-    anchor: {
-        viewport: {
-            left: string;
-            handle: string;
-        };
-        parent: {
-            base: string;
-            left: string;
-            handle: string;
-        };
-        sticky: {
-            base: string;
-            left: string;
-            handle: string;
-            right: string;
-        };
-    };
-    full: {
-        true: {
-            left: string;
-            right: string;
-        };
-        false: string;
-    };
-    rounded: {
-        true: {
-            left: string;
-            right: string;
-        };
-        false: {
-            left: string;
-            right: string;
-        };
-    };
-}, {
-    left: string;
-    right: string;
-    handle: string;
-    handleGrip: string;
-    handlePip: string;
-    base: string;
-}, undefined, unknown, unknown, undefined>>;
-export declare const singlePane: import("tailwind-variants").TVReturnType<{
-    background: {
-        true: string;
-        false: string;
-    };
-    centered: {
-        narrow: {
-            content: string;
-        };
-        medium: {
-            content: string;
-        };
-        none: string;
-    };
-    full: {
-        true: string;
-        false: string;
-    };
-    rounded: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-    padding: {
-        none: {
-            content: string;
-        };
-        sm: {
-            content: string;
-        };
-        md: {
-            content: string;
-        };
-        lg: {
-            content: string;
-        };
-    };
-    gap: {
-        none: {
-            content: string;
-        };
-        sm: {
-            content: string;
-        };
-        md: {
-            content: string;
-        };
-        lg: {
-            content: string;
-        };
-        xl: {
-            content: string;
-        };
-    };
-}, {
-    base: string;
-    content: string;
-}, undefined, {
-    background: {
-        true: string;
-        false: string;
-    };
-    centered: {
-        narrow: {
-            content: string;
-        };
-        medium: {
-            content: string;
-        };
-        none: string;
-    };
-    full: {
-        true: string;
-        false: string;
-    };
-    rounded: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-    padding: {
-        none: {
-            content: string;
-        };
-        sm: {
-            content: string;
-        };
-        md: {
-            content: string;
-        };
-        lg: {
-            content: string;
-        };
-    };
-    gap: {
-        none: {
-            content: string;
-        };
-        sm: {
-            content: string;
-        };
-        md: {
-            content: string;
-        };
-        lg: {
-            content: string;
-        };
-        xl: {
-            content: string;
-        };
-    };
-}, {
-    base: string;
-    content: string;
-}, import("tailwind-variants").TVReturnType<{
-    background: {
-        true: string;
-        false: string;
-    };
-    centered: {
-        narrow: {
-            content: string;
-        };
-        medium: {
-            content: string;
-        };
-        none: string;
-    };
-    full: {
-        true: string;
-        false: string;
-    };
-    rounded: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-    padding: {
-        none: {
-            content: string;
-        };
-        sm: {
-            content: string;
-        };
-        md: {
-            content: string;
-        };
-        lg: {
-            content: string;
-        };
-    };
-    gap: {
-        none: {
-            content: string;
-        };
-        sm: {
-            content: string;
-        };
-        md: {
-            content: string;
-        };
-        lg: {
-            content: string;
-        };
-        xl: {
-            content: string;
-        };
-    };
-}, {
-    base: string;
-    content: string;
-}, undefined, unknown, unknown, undefined>>;
-export declare const supportingPane: import("tailwind-variants").TVReturnType<{
-    anchor: {
-        viewport: {
-            supporting: string;
-        };
-        parent: {
-            supporting: string;
-        };
-    };
-    position: {
-        right: {
-            base: string;
-            supporting: string;
-        };
-        left: {
-            base: string;
-            supporting: string;
-        };
-    };
-    centered: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-    gap: {
-        none: {
-            main: string;
-        };
-        sm: {
-            main: string;
-        };
-        md: {
-            main: string;
-        };
-        lg: {
-            main: string;
-        };
-    };
-    full: {
-        true: {
-            base: string;
-        };
-        false: string;
-    };
-    rounded: {
-        true: {
-            main: string;
-        };
-        false: {
-            main: string;
-        };
-    };
-}, {
-    base: string;
-    main: string;
-    supporting: string;
-}, undefined, {
-    anchor: {
-        viewport: {
-            supporting: string;
-        };
-        parent: {
-            supporting: string;
-        };
-    };
-    position: {
-        right: {
-            base: string;
-            supporting: string;
-        };
-        left: {
-            base: string;
-            supporting: string;
-        };
-    };
-    centered: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-    gap: {
-        none: {
-            main: string;
-        };
-        sm: {
-            main: string;
-        };
-        md: {
-            main: string;
-        };
-        lg: {
-            main: string;
-        };
-    };
-    full: {
-        true: {
-            base: string;
-        };
-        false: string;
-    };
-    rounded: {
-        true: {
-            main: string;
-        };
-        false: {
-            main: string;
-        };
-    };
-}, {
-    base: string;
-    main: string;
-    supporting: string;
-}, import("tailwind-variants").TVReturnType<{
-    anchor: {
-        viewport: {
-            supporting: string;
-        };
-        parent: {
-            supporting: string;
-        };
-    };
-    position: {
-        right: {
-            base: string;
-            supporting: string;
-        };
-        left: {
-            base: string;
-            supporting: string;
-        };
-    };
-    centered: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-    gap: {
-        none: {
-            main: string;
-        };
-        sm: {
-            main: string;
-        };
-        md: {
-            main: string;
-        };
-        lg: {
-            main: string;
-        };
-    };
-    full: {
-        true: {
-            base: string;
-        };
-        false: string;
-    };
-    rounded: {
-        true: {
-            main: string;
-        };
-        false: {
-            main: string;
-        };
-    };
-}, {
-    base: string;
-    main: string;
-    supporting: string;
-}, undefined, unknown, unknown, undefined>>;

package/dist/components/containers/panes/theme.js

@@ -1,185 +0,0 @@
-import { tv } from 'tailwind-variants';
-export const splitPane = tv({
-    slots: {
-        left: 'top-0 bottom-0 z-20 overflow-y-scroll overflow-x-visible bg-md-sys-color-surface-container scrollbar-none hidden md:block',
-        right: 'flex flex-col box-border ml-0 md:ml-[var(--splitpane-left-width)]',
-        handle: 'handle group hidden md:block top-0 bottom-0 z-30 w-3 -ml-1 cursor-col-resize touch-none bg-transparent hover:bg-md-sys-color-outline/20 translate-x-1.5',
-        handleGrip: 'absolute left-1/2 top-1/2 flex h-12 w-1 -translate-x-1/2 -translate-y-1/2 flex-col items-center justify-center gap-1 rounded-full bg-md-sys-color-secondary group-hover:w-0.5',
-        handlePip: 'h-0.5 w-0.5 rounded-full bg-md-sys-color-on-primary/80',
-        base: ''
-    },
-    variants: {
-        anchor: {
-            viewport: {
-                left: 'md:fixed',
-                handle: 'fixed'
-            },
-            parent: {
-                base: 'relative',
-                left: 'md:absolute',
-                handle: 'absolute'
-            },
-            // In-flow flex row: left/right sit side by side and the left pane sticks
-            // as the page scrolls, instead of being fixed/absolute. Use for nested
-            // sidebars (e.g. a secondary docs nav) that live inside an already
-            // width-offset content column, where "viewport" would fix to the true
-            // left edge and "parent" would lose sticky-while-scrolling behaviour.
-            sticky: {
-                base: 'md:flex md:flex-row',
-                left: 'shrink-0 md:sticky md:top-0 md:self-start md:max-h-dvh',
-                handle: 'md:sticky md:top-0 md:ml-0 md:h-dvh md:translate-x-0 md:self-start',
-                right: 'md:ml-0 md:grow md:min-w-0'
-            }
-        },
-        full: {
-            true: {
-                left: 'md:bottom-[30px]',
-                right: 'md:min-h-[calc(100dvh-30px)]'
-            },
-            false: ''
-        },
-        rounded: {
-            true: {
-                left: 'md:rounded-t-lg md:rounded-b-lg',
-                right: 'md:rounded-b-lg'
-            },
-            false: {
-                left: '',
-                right: ''
-            }
-        }
-    },
-    defaultVariants: {
-        anchor: 'viewport',
-        rounded: true
-    }
-});
-export const singlePane = tv({
-    slots: {
-        base: 'flex flex-col box-border overflow-clip items-center',
-        content: 'flex flex-1 flex-col w-full max-w-7xl mx-auto'
-    },
-    variants: {
-        background: {
-            true: 'bg-md-sys-color-surface',
-            false: ''
-        },
-        centered: {
-            narrow: {
-                content: 'max-w-2xl'
-            },
-            medium: {
-                content: 'max-w-5xl'
-            },
-            none: ''
-        },
-        full: {
-            true: 'min-h-dvh',
-            false: ''
-        },
-        rounded: {
-            true: {
-                base: 'md:rounded-t-lg'
-            },
-            false: {
-                base: ''
-            }
-        },
-        padding: {
-            none: { content: 'p-0' },
-            sm: { content: 'p-3 md:p-4' },
-            md: { content: 'p-4 md:p-6 lg:p-8' },
-            lg: { content: 'p-6 md:p-8 lg:p-12' }
-        },
-        gap: {
-            none: { content: 'gap-0' },
-            sm: { content: 'gap-2' },
-            md: { content: 'gap-3' },
-            lg: { content: 'gap-4' },
-            xl: { content: 'gap-6' }
-        }
-    },
-    defaultVariants: {
-        rounded: true
-    }
-});
-export const supportingPane = tv({
-    slots: {
-        base: 'flex w-full flex-col lg:flex-row',
-        main: 'bg-md-sys-color-surface box-border grow order-2 lg:order-1',
-        supporting: 'text-md-sys-color-on-surface-container box-border order-1 lg:order-2 min-w-0 lg:w-80'
-    },
-    variants: {
-        anchor: {
-            // supporting scrolls independently; main scrolls the page
-            viewport: {
-                supporting: 'lg:fixed lg:top-[var(--supporting-pane-top,0px)] lg:bottom-0 lg:w-[var(--supporting-pane-width,320px)] lg:overflow-y-auto scrollbar-none'
-            },
-            // supporting sticks as user scrolls the page (classic sticky)
-            parent: {
-                supporting: 'lg:sticky lg:top-4 overflow-y-scroll'
-            }
-        },
-        position: {
-            right: {
-                base: 'lg:flex-row',
-                supporting: ''
-            },
-            left: {
-                base: 'lg:flex-row-reverse',
-                supporting: ''
-            }
-        },
-        centered: {
-            true: {
-                base: 'max-w-5xl mx-auto'
-            },
-            false: {
-                base: 'justify-between'
-            }
-        },
-        gap: {
-            none: { main: 'gap-0' },
-            sm: { main: 'gap-4' },
-            md: { main: 'gap-6' },
-            lg: { main: 'gap-8' }
-        },
-        full: {
-            true: { base: 'min-h-dvh' },
-            false: ''
-        },
-        rounded: {
-            true: {
-                main: 'rounded-t-lg'
-            },
-            false: {
-                main: ''
-            }
-        }
-    },
-    compoundVariants: [
-        {
-            anchor: 'viewport',
-            position: 'right',
-            class: {
-                supporting: 'lg:right-0',
-                main: 'lg:mr-[var(--supporting-pane-width,320px)]'
-            }
-        },
-        {
-            anchor: 'viewport',
-            position: 'left',
-            class: {
-                supporting: 'lg:left-0',
-                main: 'lg:ml-[var(--supporting-pane-width,320px)]'
-            }
-        }
-    ],
-    defaultVariants: {
-        anchor: 'parent',
-        position: 'right',
-        centered: true,
-        rounded: true,
-        gap: 'md'
-    }
-});