@fewangsit/wangsvue-presets 1.0.80

package/wangsvue/paginator/index.d.ts

@@ -0,0 +1,210 @@
+declare namespace _default {
+    namespace root {
+        let _class: string[];
+        export { _class as class };
+    }
+    namespace paginatorwrapper {
+        let _class_1: string;
+        export { _class_1 as class };
+    }
+    namespace pages {
+        let _class_2: string;
+        export { _class_2 as class };
+    }
+    function firstpagebutton({ context }: {
+        context: any;
+    }): {
+        class: (string | {
+            'cursor-default pointer-events-none opacity-60': any;
+        })[];
+    };
+    function previouspagebutton({ context }: {
+        context: any;
+    }): {
+        class: (string | {
+            'cursor-default pointer-events-none opacity-60': any;
+        })[];
+    };
+    function nextpagebutton({ context }: {
+        context: any;
+    }): {
+        class: (string | {
+            'cursor-default pointer-events-none opacity-60': any;
+        })[];
+    };
+    function lastpagebutton({ context }: {
+        context: any;
+    }): {
+        class: (string | {
+            'cursor-default pointer-events-none opacity-60': any;
+        })[];
+    };
+    function pagebutton({ context }: {
+        context: any;
+    }): {
+        class: (string | {
+            'text-general-300 border-none hover:bg-grayscale-50': boolean;
+            'text-white bg-grayscale-900': any;
+            'hover:border-surface-300'?: undefined;
+            'focus-visible:outline-none focus-visible:outline-offset-0 focus-visible:ring-2 focus-visible:ring-primary-500'?: undefined;
+            'cursor-default pointer-events-none opacity-60'?: undefined;
+        } | {
+            'hover:border-surface-300': boolean;
+            'focus-visible:outline-none focus-visible:outline-offset-0 focus-visible:ring-2 focus-visible:ring-primary-500': boolean;
+            'text-general-300 border-none hover:bg-grayscale-50'?: undefined;
+            'text-white bg-grayscale-900'?: undefined;
+            'cursor-default pointer-events-none opacity-60'?: undefined;
+        } | {
+            'cursor-default pointer-events-none opacity-60': any;
+            'text-general-300 border-none hover:bg-grayscale-50'?: undefined;
+            'text-white bg-grayscale-900'?: undefined;
+            'hover:border-surface-300'?: undefined;
+            'focus-visible:outline-none focus-visible:outline-offset-0 focus-visible:ring-2 focus-visible:ring-primary-500'?: undefined;
+        })[];
+    };
+    namespace rowperpagedropdown {
+        export function root_1({ props, state }: {
+            props: any;
+            state: any;
+        }): {
+            class: (string | {
+                'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-600': boolean;
+                'opacity-60'?: undefined;
+                'pointer-events-none'?: undefined;
+                'cursor-default'?: undefined;
+            } | {
+                'opacity-60': any;
+                'pointer-events-none': any;
+                'cursor-default': any;
+                'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-600'?: undefined;
+            })[];
+        };
+        export { root_1 as root };
+        export namespace input {
+            let _class_3: string[];
+            export { _class_3 as class };
+        }
+        export namespace trigger {
+            let _class_4: string[];
+            export { _class_4 as class };
+        }
+        export namespace dropdownicon {
+            let _class_5: string;
+            export { _class_5 as class };
+        }
+        export namespace panel {
+            let _class_6: string[];
+            export { _class_6 as class };
+        }
+        export namespace wrapper {
+            let _class_7: string[];
+            export { _class_7 as class };
+        }
+        export namespace list {
+            let _class_8: string;
+            export { _class_8 as class };
+        }
+        export function item({ context }: {
+            context: any;
+        }): {
+            class: (string | {
+                'font-normal': boolean;
+                'font-bold': any;
+            })[];
+        };
+    }
+    namespace jumptopageinput {
+        export namespace root_2 {
+            let _class_9: string;
+            export { _class_9 as class };
+        }
+        export { root_2 as root };
+        export namespace input_1 {
+            export namespace root_3 {
+                let _class_10: string[];
+                export { _class_10 as class };
+            }
+            export { root_3 as root };
+        }
+        export { input_1 as input };
+    }
+    namespace jumptopagedropdown {
+        export function root_4({ props, state }: {
+            props: any;
+            state: any;
+        }): {
+            class: (string | {
+                'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-600': boolean;
+                'opacity-60'?: undefined;
+                'pointer-events-none'?: undefined;
+                'cursor-default'?: undefined;
+            } | {
+                'opacity-60': any;
+                'pointer-events-none': any;
+                'cursor-default': any;
+                'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-600'?: undefined;
+            })[];
+        };
+        export { root_4 as root };
+        export namespace input_2 {
+            let _class_11: string[];
+            export { _class_11 as class };
+        }
+        export { input_2 as input };
+        export namespace trigger_1 {
+            let _class_12: string[];
+            export { _class_12 as class };
+        }
+        export { trigger_1 as trigger };
+        export namespace panel_1 {
+            let _class_13: string[];
+            export { _class_13 as class };
+        }
+        export { panel_1 as panel };
+        export namespace wrapper_1 {
+            let _class_14: string[];
+            export { _class_14 as class };
+        }
+        export { wrapper_1 as wrapper };
+        export namespace list_1 {
+            let _class_15: string;
+            export { _class_15 as class };
+        }
+        export { list_1 as list };
+        export function item_1({ context }: {
+            context: any;
+        }): {
+            class: (string | {
+                'font-normal': boolean;
+                'font-bold': any;
+                'text-surface-700/80'?: undefined;
+                'bg-primary-500 text-white'?: undefined;
+                'bg-transparent text-surface-700/80'?: undefined;
+            } | {
+                'text-surface-700/80': boolean;
+                'font-normal'?: undefined;
+                'font-bold'?: undefined;
+                'bg-primary-500 text-white'?: undefined;
+                'bg-transparent text-surface-700/80'?: undefined;
+            } | {
+                'bg-primary-500 text-white': any;
+                'font-normal'?: undefined;
+                'font-bold'?: undefined;
+                'text-surface-700/80'?: undefined;
+                'bg-transparent text-surface-700/80'?: undefined;
+            } | {
+                'bg-transparent text-surface-700/80': any;
+                'font-normal'?: undefined;
+                'font-bold'?: undefined;
+                'text-surface-700/80'?: undefined;
+                'bg-primary-500 text-white'?: undefined;
+            })[];
+        };
+        export { item_1 as item };
+    }
+    namespace current {
+        let _class_16: string[];
+        export { _class_16 as class };
+    }
+}
+export default _default;

package/wangsvue/paginator/index.js

@@ -0,0 +1,474 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = {
+    root: {
+        class: [
+            // Flex & Alignment
+            'flex items-center justify-start flex-wrap gap-0.5',
+            'bg-white',
+            'text-grayscale-900',
+        ],
+    },
+    paginatorwrapper: {
+        class: 'mt-[11px]',
+    },
+    pages: {
+        class: 'flex gap-0.5',
+    },
+    firstpagebutton: function (_a) {
+        var context = _a.context;
+        return ({
+            class: [
+                'relative',
+                // Font
+                'text-2xl font-medium',
+                // Flex & Alignment
+                'inline-flex items-center justify-center',
+                // Shape
+                'border-t-2 border-transparent',
+                // Size
+                'w-6 h-6',
+                // Color
+                'text-general-300',
+                // Transition
+                'transition duration-200',
+                // Misc
+                'user-none overflow-hidden',
+                { 'cursor-default pointer-events-none opacity-60': context.disabled },
+            ],
+        });
+    },
+    previouspagebutton: function (_a) {
+        var context = _a.context;
+        return ({
+            class: [
+                'relative',
+                // Font
+                'text-2xl font-medium',
+                // Flex & Alignment
+                'inline-flex items-center justify-center',
+                // Shape
+                'border-t-2 border-transparent',
+                // Size
+                'w-6 h-6',
+                // Color
+                'text-general-300',
+                // Transition
+                'transition duration-200',
+                // Misc
+                'user-none overflow-hidden',
+                { 'cursor-default pointer-events-none opacity-60': context.disabled },
+            ],
+        });
+    },
+    nextpagebutton: function (_a) {
+        var context = _a.context;
+        return ({
+            class: [
+                'relative',
+                // Font
+                'text-2xl font-medium',
+                // Flex & Alignment
+                'inline-flex items-center justify-center',
+                // Shape
+                'border-t-2 border-transparent',
+                // Size
+                'w-6 h-6',
+                // Color
+                'text-general-300',
+                // Transition
+                'transition duration-200',
+                // Misc
+                'user-none overflow-hidden',
+                { 'cursor-default pointer-events-none opacity-60': context.disabled },
+            ],
+        });
+    },
+    lastpagebutton: function (_a) {
+        var context = _a.context;
+        return ({
+            class: [
+                'relative',
+                // Font
+                'text-2xl font-medium',
+                // Flex & Alignment
+                'inline-flex items-center justify-center',
+                // Shape
+                'border-t-2 border-transparent',
+                // Size
+                'w-6 h-6',
+                // Color
+                'text-general-300',
+                // Transition
+                'transition duration-200',
+                // Misc
+                'user-none overflow-hidden',
+                { 'cursor-default pointer-events-none opacity-60': context.disabled },
+            ],
+        });
+    },
+    pagebutton: function (_a) {
+        var context = _a.context;
+        return ({
+            class: [
+                'relative',
+                // Font
+                'text-xs font-normal',
+                // Shape
+                'rounded-full',
+                // Size
+                'w-6 h-6',
+                // Color
+                {
+                    'text-general-300 border-none hover:bg-grayscale-50': !context.active,
+                    'text-white bg-grayscale-900': context.active,
+                },
+                // State
+                {
+                    'hover:border-surface-300': !context.disabled && !context.active,
+                    'focus-visible:outline-none focus-visible:outline-offset-0 focus-visible:ring-2 focus-visible:ring-primary-500': !context.disabled,
+                },
+                // Transition
+                'transition duration-200',
+                // Misc
+                'user-none overflow-hidden',
+                { 'cursor-default pointer-events-none opacity-60': context.disabled },
+            ],
+        });
+    },
+    rowperpagedropdown: {
+        root: function (_a) {
+            var props = _a.props, state = _a.state;
+            return ({
+                class: [
+                    // Display and Position
+                    'inline-flex items-center justify-center',
+                    'relative',
+                    // Size
+                    'w-max',
+                    'px-3 py-1',
+                    // Shape
+                    'rounded-[50px]',
+                    // Color and Background
+                    'bg-transparent',
+                    'border-[0.5px] border-primary-100',
+                    // Transitions
+                    'transition-all',
+                    'duration-200',
+                    // States
+                    {
+                        'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-600': !state.focused,
+                    },
+                    // Misc
+                    'cursor-pointer',
+                    'select-none',
+                    {
+                        'opacity-60': props.disabled,
+                        'pointer-events-none': props.disabled,
+                        'cursor-default': props.disabled,
+                    },
+                ],
+            });
+        },
+        input: {
+            class: [
+                //Font
+                'text-xs',
+                // Display
+                // 'block',
+                // 'flex-auto',
+                'flex items-center',
+                // Color and Background
+                'bg-transparent',
+                'text-general-800',
+                // Sizing and Spacing
+                'w-max',
+                // 'py-1.5 px-3 pr-0',
+                //Shape
+                'rounded-none',
+                // Transitions
+                'transition',
+                'duration-200',
+                // States
+                'focus-visible:outline-none focus-visible:shadow-none',
+                // Misc
+                // 'relative',
+                'cursor-pointer',
+                'overflow-hidden overflow-ellipsis',
+                'whitespace-nowrap',
+                'appearance-none',
+            ],
+        },
+        trigger: {
+            class: [
+                //Font
+                'text-xs',
+                // Flexbox
+                'flex items-center justify-center',
+                'shrink-0',
+                // Size
+                'w-2',
+                'h-2',
+                'ml-0.5',
+                // Shape
+                'rounded-tr-md',
+                'rounded-br-md',
+            ],
+        },
+        dropdownicon: {
+            class: 'w-2 h-2',
+        },
+        panel: {
+            class: [
+                // Position
+                'absolute top-0 left-0',
+                'mt-1',
+                // Shape
+                'border-0',
+                'rounded-md',
+                // 'shadow-md',
+                // Color
+                'bg-white',
+                'text-general-800',
+                'ring-1 ring-inset ring-primary-100',
+            ],
+        },
+        wrapper: {
+            class: [
+                // Sizing
+                'max-h-[15rem]',
+                // Misc
+                'overflow-auto',
+            ],
+        },
+        list: {
+            class: 'py-0.5 list-none m-0',
+        },
+        item: function (_a) {
+            var context = _a.context;
+            return ({
+                class: [
+                    // Font
+                    'text-xs',
+                    'leading-none',
+                    { 'font-normal': !context.selected, 'font-bold': context.selected },
+                    // Position
+                    'relative',
+                    // Shape
+                    'border-0',
+                    'rounded-none',
+                    // Spacing
+                    'm-0',
+                    'py-2 px-4',
+                    // Color
+                    // {
+                    //   'text-surface-700/80':
+                    //     !context.focused && !context.selected,
+                    // },
+                    // {
+                    //   'bg-white text-general-800':
+                    //     context.focused && context.selected,
+                    // },
+                    // {
+                    //   'bg-transparent text-general-800':
+                    //     !context.focused && context.selected,
+                    // },
+                    //States
+                    'hover:bg-primary-50',
+                    // Misc
+                    'cursor-pointer',
+                    'overflow-hidden',
+                    'whitespace-nowrap',
+                ],
+            });
+        },
+    },
+    jumptopageinput: {
+        root: {
+            class: 'inline-flex mx-2',
+        },
+        input: {
+            root: {
+                class: [
+                    'relative',
+                    //Font
+                    'leading-6',
+                    'text-xs',
+                    'text-center',
+                    // Display
+                    'block',
+                    'flex-auto',
+                    // Color and Background
+                    'bg-transparent',
+                    'border-primary-100 border-[0.5px]',
+                    'text-general-800',
+                    // Sizing and Spacing
+                    'max-w-[3rem] w-fit',
+                    'px-3 py-1',
+                    //Shape
+                    'rounded-[50px] h-6',
+                    // Transitions
+                    'transition',
+                    'duration-200',
+                    // States
+                    'hover:ring-general-200',
+                    'focus-visible:outline-none focus-visible:shadow-none',
+                    // 'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-body',
+                    // Misc
+                    'cursor-pointer',
+                    'overflow-hidden overflow-ellipsis',
+                    'whitespace-nowrap',
+                    'appearance-none',
+                ],
+            },
+        },
+    },
+    jumptopagedropdown: {
+        root: function (_a) {
+            var props = _a.props, state = _a.state;
+            return ({
+                class: [
+                    // Display and Position
+                    'inline-flex',
+                    'relative',
+                    // Shape
+                    'h-8',
+                    'rounded-md',
+                    // Spacing
+                    'mx-2',
+                    // Color and Background
+                    'bg-transparent',
+                    // Transitions
+                    'transition-all',
+                    'duration-200',
+                    // States
+                    {
+                        'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-600': !state.focused,
+                    },
+                    // Misc
+                    'cursor-pointer',
+                    'select-none',
+                    {
+                        'opacity-60': props.disabled,
+                        'pointer-events-none': props.disabled,
+                        'cursor-default': props.disabled,
+                    },
+                ],
+            });
+        },
+        input: {
+            class: [
+                //Font
+                'font-sans',
+                'leading-6',
+                'text-xs',
+                // Display
+                'block',
+                'flex-auto',
+                'flex items-center',
+                // Color and Background
+                'bg-transparent',
+                'border-0',
+                'text-surface-800/80',
+                // Sizing and Spacing
+                'w-[1%]',
+                'py-1.5 px-3 pr-0',
+                //Shape
+                'rounded-none',
+                // Transitions
+                'transition',
+                'duration-200',
+                // States
+                'focus-visible:outline-none focus-visible:shadow-none',
+                // Misc
+                'relative',
+                'cursor-pointer',
+                'overflow-hidden overflow-ellipsis',
+                'whitespace-nowrap',
+                'appearance-none',
+            ],
+        },
+        trigger: {
+            class: [
+                //Font
+                'text-xs',
+                // Flexbox
+                'flex items-center justify-center',
+                'shrink-0',
+                // Color and Background
+                'bg-transparent',
+                'text-surface-500',
+                // Size
+                'w-12',
+                'h-8',
+                // Shape
+                'rounded-tr-md',
+                'rounded-br-md',
+            ],
+        },
+        panel: {
+            class: [
+                // Position
+                'absolute top-0 left-0',
+                'mt-1',
+                // Shape
+                'border-0',
+                'rounded-md',
+                'shadow-md',
+                // Color
+                'bg-surface-0',
+                'text-surface-800/80',
+                'ring-1 ring-inset ring-surface-300',
+            ],
+        },
+        wrapper: {
+            class: [
+                // Sizing
+                'max-h-[15rem]',
+                // Misc
+                'overflow-auto',
+            ],
+        },
+        list: {
+            class: 'py-1 list-none m-0',
+        },
+        item: function (_a) {
+            var context = _a.context;
+            return ({
+                class: [
+                    // Font
+                    'text-xs',
+                    'leading-none',
+                    { 'font-normal': !context.selected, 'font-bold': context.selected },
+                    // Position
+                    'relative',
+                    // Shape
+                    'border-0',
+                    'rounded-none',
+                    // Spacing
+                    'm-0',
+                    'py-2 px-4',
+                    // Color
+                    {
+                        'text-surface-700/80': !context.focused && !context.selected,
+                    },
+                    {
+                        'bg-primary-500 text-white': context.focused && context.selected,
+                    },
+                    {
+                        'bg-transparent text-surface-700/80': !context.focused && context.selected,
+                    },
+                    //States
+                    'hover:bg-primary-500 hover:text-white',
+                    // Misc
+                    'cursor-pointer',
+                    'overflow-hidden',
+                    'whitespace-nowrap',
+                ],
+            });
+        },
+    },
+    current: {
+        class: ['text-xs font-normal leading-6 px-3'],
+    },
+};