@fewangsit/wangsvue-presets 1.0.80

package/wangsvue/tree/index.d.ts

@@ -0,0 +1,117 @@
+declare namespace _default {
+    export namespace root {
+        let _class: string[];
+        export { _class as class };
+    }
+    export namespace wrapper {
+        let _class_1: string[];
+        export { _class_1 as class };
+    }
+    export namespace container {
+        let _class_2: string[];
+        export { _class_2 as class };
+    }
+    export namespace node {
+        let _class_3: string[];
+        export { _class_3 as class };
+    }
+    export function content({ context, props }: {
+        context: any;
+        props: any;
+    }): {
+        class: (string | {
+            'bg-primary-50 !text-primary-500 [&_*]:text-primary-500': any;
+            'hover:bg-primary-50'?: undefined;
+            'cursor-pointer select-none'?: undefined;
+        } | {
+            'hover:bg-primary-50': boolean;
+            'bg-primary-50 !text-primary-500 [&_*]:text-primary-500'?: undefined;
+            'cursor-pointer select-none'?: undefined;
+        } | {
+            'cursor-pointer select-none': boolean;
+            'bg-primary-50 !text-primary-500 [&_*]:text-primary-500'?: undefined;
+            'hover:bg-primary-50'?: undefined;
+        })[];
+    };
+    export function toggler({ context }: {
+        context: any;
+    }): {
+        class: (string | {
+            invisible: any;
+        })[];
+    };
+    export namespace togglericon {
+        let _class_4: string[];
+        export { _class_4 as class };
+    }
+    export namespace nodeCheckbox {
+        export namespace root_1 {
+            let _class_5: string[];
+            export { _class_5 as class };
+        }
+        export { root_1 as root };
+        export function box({ props, context }: {
+            props: any;
+            context: any;
+        }): {
+            class: (string | {
+                'border-surface-300 bg-surface-0': boolean;
+                'border-primary-500 bg-primary-500': any;
+                'ring-2 ring-primary-500'?: undefined;
+                'cursor-default opacity-60'?: undefined;
+                'peer-focus-visible:ring-2 peer-focus-visible:ring-primary-500'?: undefined;
+            } | {
+                'ring-2 ring-primary-500': any;
+                'cursor-default opacity-60': any;
+                'border-surface-300 bg-surface-0'?: undefined;
+                'border-primary-500 bg-primary-500'?: undefined;
+                'peer-focus-visible:ring-2 peer-focus-visible:ring-primary-500'?: undefined;
+            } | {
+                'peer-focus-visible:ring-2 peer-focus-visible:ring-primary-500': boolean;
+                'cursor-default opacity-60': any;
+                'border-surface-300 bg-surface-0'?: undefined;
+                'border-primary-500 bg-primary-500'?: undefined;
+                'ring-2 ring-primary-500'?: undefined;
+            })[];
+        };
+        export namespace input {
+            let _class_6: string[];
+            export { _class_6 as class };
+        }
+        export namespace icon {
+            let _class_7: string[];
+            export { _class_7 as class };
+        }
+    }
+    export namespace nodeicon {
+        let _class_8: string[];
+        export { _class_8 as class };
+    }
+    export namespace subgroup {
+        let _class_9: string[];
+        export { _class_9 as class };
+    }
+    export namespace filtercontainer {
+        let _class_10: string[];
+        export { _class_10 as class };
+    }
+    export namespace input_1 {
+        let _class_11: string[];
+        export { _class_11 as class };
+    }
+    export { input_1 as input };
+    export namespace loadingicon {
+        let _class_12: string[];
+        export { _class_12 as class };
+    }
+    export namespace searchicon {
+        let _class_13: string[];
+        export { _class_13 as class };
+    }
+    export function label({ props }: {
+        props: any;
+    }): {
+        class: string[];
+    };
+}
+export default _default;

package/wangsvue/tree/index.js

@@ -0,0 +1,256 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = {
+    root: {
+        class: [
+            'relative',
+            // Space
+            // Shape
+            'rounded-md',
+            'min-h-8',
+            // Color
+        ],
+    },
+    wrapper: {
+        class: ['overflow-auto'],
+    },
+    container: {
+        class: [
+            // Spacing
+            'm-0 p-0',
+            // Misc
+            'list-none overflow-auto',
+        ],
+    },
+    node: {
+        class: [
+            'p-[2px]',
+            'rounded-md',
+            'focus:outline-none focus:outline-offset-0',
+        ],
+    },
+    content: function (_a) {
+        var context = _a.context, props = _a.props;
+        return ({
+            class: [
+                // Flex and Alignment
+                'flex items-center',
+                // Shape
+                'rounded-md',
+                // Spacing
+                'p-1',
+                // Colors
+                'text-surface-700',
+                {
+                    'bg-primary-50 !text-primary-500 [&_*]:text-primary-500': context.selected,
+                },
+                // States
+                {
+                    'hover:bg-primary-50': props.selectionMode == 'single' || props.selectionMode == 'multiple',
+                },
+                // Transition
+                'transition-shadow duration-200',
+                {
+                    'cursor-pointer select-none': props.selectionMode == 'single' || props.selectionMode == 'multiple',
+                },
+                // Miscelanous
+                'cursor-pointer',
+            ],
+        });
+    },
+    toggler: function (_a) {
+        var context = _a.context;
+        return ({
+            class: [
+                // Flex and Alignment
+                'inline-flex items-center justify-center',
+                'shrink-0',
+                // Shape
+                'border-0 rounded-full',
+                // Size and Spacing
+                'w-4 h-4',
+                // Spacing
+                'mr-0.5',
+                // Colors
+                'text-general-800',
+                'bg-transparent',
+                {
+                    invisible: context.leaf,
+                },
+                // States
+                'hover:bg-surface-100',
+                // Transition
+                'transition duration-200',
+                // Misc
+                'cursor-pointer select-none',
+            ],
+        });
+    },
+    togglericon: {
+        class: [
+            // Size
+            'w-4 h-4',
+            // Color
+        ],
+    },
+    nodeCheckbox: {
+        root: {
+            class: [
+                'relative',
+                // Alignment
+                'inline-flex',
+                'align-bottom',
+                // Size
+                'w-4',
+                'h-4',
+                // Spacing
+                'mr-2',
+                // Misc
+                'cursor-default',
+                'select-none',
+            ],
+        },
+        box: function (_a) {
+            var props = _a.props, context = _a.context;
+            return ({
+                class: [
+                    // Alignment
+                    'flex',
+                    'items-center',
+                    'justify-center',
+                    // Size
+                    'w-4',
+                    'h-4',
+                    // Shape
+                    'rounded',
+                    'border',
+                    // Colors
+                    'text-surface-600',
+                    {
+                        'border-surface-300 bg-surface-0': !context.checked,
+                        'border-primary-500 bg-primary-500': context.checked,
+                    },
+                    {
+                        'ring-2 ring-primary-500': !props.disabled && context.focused,
+                        'cursor-default opacity-60': props.disabled,
+                    },
+                    // States
+                    {
+                        'peer-focus-visible:ring-2 peer-focus-visible:ring-primary-500': !props.disabled,
+                        'cursor-default opacity-60': props.disabled,
+                    },
+                    // Transitions
+                    'transition-colors',
+                    'duration-200',
+                ],
+            });
+        },
+        input: {
+            class: [
+                'peer',
+                // Size
+                'w-full ',
+                'h-full',
+                // Position
+                'absolute',
+                'top-0 left-0',
+                'z-10',
+                // Spacing
+                'p-0',
+                'm-0',
+                // Shape
+                'rounded',
+                'border',
+                // Shape
+                'opacity-0',
+                'rounded-md',
+                'outline-none',
+                'border-2 border-surface-300',
+                // Misc
+                'appareance-none',
+            ],
+        },
+        icon: {
+            class: [
+                // Font
+                'text-normal',
+                // Size
+                'w-3',
+                'h-3',
+                // Colors
+                'text-white',
+                // Transitions
+                'transition-all',
+                'duration-200',
+            ],
+        },
+    },
+    nodeicon: {
+        class: [
+            // Space
+            'hidden',
+        ],
+    },
+    subgroup: {
+        class: ['!m-0 list-none p-0 !pl-1'],
+    },
+    filtercontainer: {
+        class: [
+            'relative block',
+            // Space
+            'mb-2',
+            // Size
+            'w-full',
+        ],
+    },
+    input: {
+        class: [
+            'relative',
+            // Font
+            'font-sans leading-6',
+            'sm:text-sm',
+            // Spacing
+            'm-0',
+            'py-1.5 px-3 pr-10',
+            // Size
+            'w-full',
+            // Shape
+            'rounded-md',
+            // Colors
+            'text-surface-900',
+            'placeholder:text-surface-400',
+            'bg-surface-0',
+            'ring-1 ring-inset ring-surface-300',
+            // States
+            'hover:border-primary-500',
+            'focus:outline-none focus:outline-offset-0 focus:ring-2 focus:ring-inset focus:ring-primary-500',
+            // Transition & Misc
+            'appearance-none',
+            'transition-colors duration-200',
+        ],
+    },
+    loadingicon: {
+        class: [
+            'text-general-400',
+            'absolute text-lg top-[50%] right-[50%] -mt-2 -mr-2 animate-spin',
+        ],
+    },
+    searchicon: {
+        class: [
+            // Position
+            'absolute top-1/2 -mt-2 right-3',
+            // Color
+            'text-surface-600',
+        ],
+    },
+    label: function (_a) {
+        var props = _a.props;
+        return ({
+            class: [
+                'inline-flex justify-between items-center gap-2',
+                'w-full',
+                'text-xs font-medium text-general-800',
+            ],
+        });
+    },
+};

package/wangsvue/treeselect/index.d.ts

@@ -0,0 +1,158 @@
+declare namespace _default {
+    function root({ props, state }: {
+        props: any;
+        state: any;
+    }): {
+        class: (string | {
+            'ring-1 ring-inset ring-surface-300': boolean;
+            'ring-2 ring-inset ring-primary-500': any;
+            'opacity-60'?: undefined;
+            'pointer-events-none'?: undefined;
+        } | {
+            'opacity-60': any;
+            'pointer-events-none': any;
+            'ring-1 ring-inset ring-surface-300'?: undefined;
+            'ring-2 ring-inset ring-primary-500'?: undefined;
+        })[];
+    };
+    namespace labelContainer {
+        let _class: string[];
+        export { _class as class };
+    }
+    namespace label {
+        let _class_1: string[];
+        export { _class_1 as class };
+    }
+    namespace trigger {
+        let _class_2: string[];
+        export { _class_2 as class };
+    }
+    namespace panel {
+        let _class_3: string[];
+        export { _class_3 as class };
+    }
+    namespace wrapper {
+        let _class_4: string[];
+        export { _class_4 as class };
+    }
+    namespace tree {
+        export namespace root_1 {
+            let _class_5: string[];
+            export { _class_5 as class };
+        }
+        export { root_1 as root };
+        export namespace wrapper_1 {
+            let _class_6: string[];
+            export { _class_6 as class };
+        }
+        export { wrapper_1 as wrapper };
+        export namespace container {
+            let _class_7: string[];
+            export { _class_7 as class };
+        }
+        export namespace node {
+            let _class_8: string[];
+            export { _class_8 as class };
+        }
+        export function content({ context, props }: {
+            context: any;
+            props: any;
+        }): {
+            class: (string | {
+                'bg-surface-100 text-primary-500': any;
+                'hover:bg-surface-200'?: undefined;
+                'cursor-pointer select-none'?: undefined;
+            } | {
+                'hover:bg-surface-200': boolean;
+                'bg-surface-100 text-primary-500'?: undefined;
+                'cursor-pointer select-none'?: undefined;
+            } | {
+                'cursor-pointer select-none': boolean;
+                'bg-surface-100 text-primary-500'?: undefined;
+                'hover:bg-surface-200'?: undefined;
+            })[];
+        };
+        export function toggler({ context }: {
+            context: any;
+        }): {
+            class: (string | {
+                invisible: any;
+            })[];
+        };
+        export namespace togglericon {
+            let _class_9: string[];
+            export { _class_9 as class };
+        }
+        export namespace nodeCheckbox {
+            export namespace root_2 {
+                let _class_10: string[];
+                export { _class_10 as class };
+            }
+            export { root_2 as root };
+            export function box({ props, context }: {
+                props: any;
+                context: any;
+            }): {
+                class: (string | {
+                    'border-surface-300 bg-surface-0': boolean;
+                    'border-primary-500 bg-primary-500': any;
+                    'ring-2 ring-primary-500'?: undefined;
+                    'cursor-default opacity-60'?: undefined;
+                    'peer-focus-visible:ring-2 peer-focus-visible:ring-primary-500'?: undefined;
+                } | {
+                    'ring-2 ring-primary-500': any;
+                    'cursor-default opacity-60': any;
+                    'border-surface-300 bg-surface-0'?: undefined;
+                    'border-primary-500 bg-primary-500'?: undefined;
+                    'peer-focus-visible:ring-2 peer-focus-visible:ring-primary-500'?: undefined;
+                } | {
+                    'peer-focus-visible:ring-2 peer-focus-visible:ring-primary-500': boolean;
+                    'cursor-default opacity-60': any;
+                    'border-surface-300 bg-surface-0'?: undefined;
+                    'border-primary-500 bg-primary-500'?: undefined;
+                    'ring-2 ring-primary-500'?: undefined;
+                })[];
+            };
+            export namespace input {
+                let _class_11: string[];
+                export { _class_11 as class };
+            }
+            export namespace icon {
+                let _class_12: string[];
+                export { _class_12 as class };
+            }
+        }
+        export namespace nodeicon {
+            let _class_13: string[];
+            export { _class_13 as class };
+        }
+        export namespace subgroup {
+            let _class_14: string[];
+            export { _class_14 as class };
+        }
+        export namespace filtercontainer {
+            let _class_15: string[];
+            export { _class_15 as class };
+        }
+        export namespace input_1 {
+            let _class_16: string[];
+            export { _class_16 as class };
+        }
+        export { input_1 as input };
+        export namespace loadingicon {
+            let _class_17: string[];
+            export { _class_17 as class };
+        }
+        export namespace searchicon {
+            let _class_18: string[];
+            export { _class_18 as class };
+        }
+    }
+    namespace transition {
+        let enterFromClass: string;
+        let enterActiveClass: string;
+        let leaveActiveClass: string;
+        let leaveToClass: string;
+    }
+}
+export default _default;