@fewangsit/wangsvue-presets 1.0.81 → 1.0.82-alpha.1

package/fixedasset/button/index.js

@@ -0,0 +1,423 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = {
+    root: function (_a) {
+        var props = _a.props, context = _a.context;
+        return ({
+            class: [
+                'relative',
+                // Alignments
+                'items-center inline-flex text-center align-bottom justify-center',
+                {
+                    'flex-col': (props.iconPos === 'top' || props.iconPos === 'bottom') &&
+                        props.label,
+                },
+                props.iconPos,
+                {
+                    'flex-row-reverse': props.iconPos === 'right',
+                },
+                // Sizes & Spacing
+                'leading-none font-normal rounded-[50px]',
+                {
+                    '!text-xs px-3 py-[5px]': props.size === null && props.label,
+                    '!text-xs !p-0.5': props.size === 'small',
+                    'text-xl py-3 px-4': props.size === 'large',
+                },
+                { 'gap-1': props.label !== null },
+                {
+                    'p-[7px] w-max': props.label === null && props.icon && props.size === null,
+                },
+                {
+                    '!p-0.5 !h-4 !w-4': props.label === null && props.icon && props.size === 'small',
+                },
+                // Ring
+                'ring-inset ring-1 ',
+                // Shapes
+                { 'shadow-lg': props.raised },
+                // Link Button
+                {
+                    'text-grayscale-900-600 bg-transparent ring-transparent': props.link,
+                },
+                // Plain Button
+                {
+                    'text-white bg-gray-500 ring-1 ring-gray-500': props.plain && !props.outlined && !props.text,
+                },
+                // Plain Text Button
+                { 'text-primary-400': props.plain && props.text },
+                // Plain Outlined Button
+                {
+                    'text-primary-400 ring-1 ring-gray-500': props.plain && props.outlined,
+                },
+                // Text Button
+                { 'bg-transparent ring-transparent': props.text && !props.plain },
+                // Outlined Button
+                { 'bg-transparent ring-1': props.outlined && !props.plain },
+                // --- Severity Buttons ---
+                // Secondary Button
+                {
+                    'text-white': !props.link &&
+                        props.severity === 'secondary' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                    'bg-grayscale-900': !props.link &&
+                        props.severity === 'secondary' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                    'ring-1 ring-grayscale-900': !props.link &&
+                        props.severity === 'secondary' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                },
+                // Secondary Text Button
+                {
+                    'text-grayscale-900': props.text && props.severity === 'secondary' && !props.plain,
+                },
+                // Secondary Outlined Button
+                {
+                    'text-grayscale-900 ring-1 ring-grayscale-900': props.outlined && props.severity === 'secondary' && !props.plain,
+                },
+                // Primary Gold Button
+                {
+                    'text-white': props.severity === null &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                    'bg-primary-400': props.severity === null &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                    'ring-1 ring-primary-400': props.severity === null &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                },
+                // Primary Gold Text Button
+                {
+                    'text-primary-400': props.text && props.severity === null && !props.plain,
+                },
+                // Primary Gold Outlined Button
+                {
+                    'text-primary-400 ring-1 ring-primary-400 hover:bg-primary-400/20': props.outlined && props.severity === null && !props.plain,
+                },
+                // Success Button
+                {
+                    'text-white': props.severity === 'success' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                    'bg-success-500': props.severity === 'success' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                    'ring-1 ring-success-500': props.severity === 'success' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                },
+                // Success Text Button
+                {
+                    'text-success-500': props.text && props.severity === 'success' && !props.plain,
+                },
+                // Success Outlined Button
+                {
+                    'text-success-500 ring-1 ring-success-500 hover:bg-success-300/20': props.outlined && props.severity === 'success' && !props.plain,
+                },
+                // Info Button
+                {
+                    'text-white': props.severity === 'info' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                    'bg-blue-500': props.severity === 'info' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                    'ring-1 ring-blue-500': props.severity === 'info' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                },
+                // Info Text Button
+                {
+                    'text-blue-500': props.text && props.severity === 'info' && !props.plain,
+                },
+                // Info Outlined Button
+                {
+                    'text-blue-500 ring-1 ring-blue-500 hover:bg-blue-300/20 ': props.outlined && props.severity === 'info' && !props.plain,
+                },
+                // Warning Button
+                {
+                    'text-white': props.severity === 'warning' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                    'bg-warning-500': props.severity === 'warning' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                    'ring-1 ring-warning-500': props.severity === 'warning' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                },
+                // Warning Text Button
+                {
+                    'text-warning-500': props.text && props.severity === 'warning' && !props.plain,
+                },
+                // Warning Outlined Button
+                {
+                    'text-warning-500 ring-1 ring-warning-500 hover:bg-warning-300/20': props.outlined && props.severity === 'warning' && !props.plain,
+                },
+                // Help Button
+                {
+                    'text-white': props.severity === 'help' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                    'bg-purple-500': props.severity === 'help' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                    'ring-1 ring-purple-500': props.severity === 'help' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                },
+                // Help Text Button
+                {
+                    'text-purple-500': props.text && props.severity === 'help' && !props.plain,
+                },
+                // Help Outlined Button
+                {
+                    'text-purple-500 ring-1 ring-purple-500 hover:bg-purple-300/20': props.outlined && props.severity === 'help' && !props.plain,
+                },
+                // Danger Button
+                {
+                    'text-white': props.severity === 'danger' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                    'bg-danger-500': props.severity === 'danger' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                    'ring-1 ring-danger-500': props.severity === 'danger' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                },
+                // Danger Text Button
+                {
+                    'text-danger-500': props.text && props.severity === 'danger' && !props.plain,
+                },
+                // Danger Outlined Button
+                {
+                    'text-danger-500 ring-1 ring-danger-500 hover:bg-danger-300/20': props.outlined && props.severity === 'danger' && !props.plain,
+                },
+                // Contrast Button
+                {
+                    'text-white': props.severity === 'contrast' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                    'bg-surface-900': props.severity === 'contrast' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                    'ring-1 ring-surface-900': props.severity === 'contrast' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                },
+                // Contrast Text Button
+                {
+                    'text-surface-900': props.text && props.severity === 'contrast' && !props.plain,
+                },
+                // Contrast Outlined Button
+                {
+                    'text-surface-900 ring-1 ring-surface-900': props.outlined && props.severity === 'contrast' && !props.plain,
+                },
+                // --- Severity Button States ---
+                'focus:outline-none focus:outline-offset-0',
+                // Link
+                { 'focus:ring-grayscale-900': props.link },
+                // Plain
+                {
+                    'hover:bg-gray-600 hover:ring-gray-600': props.plain && !props.outlined && !props.text,
+                },
+                // Text & Outlined Button
+                {
+                    'hover:bg-primary-400/20': props.plain && (props.text || props.outlined),
+                },
+                // Secondary
+                {
+                    'hover:bg-grayscale-900/[8%] active:bg-grayscale-900/[12%] ': props.severity === 'secondary',
+                    'hover:shadow-hover active:!shadow-none hover:!bg-grayscale-900/90 active:bg-grayscale-900/90 hover:ring-0': !props.link &&
+                        props.severity === 'secondary' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                },
+                // Primary
+                {
+                    'hover:bg-primary-400/[8%] active:bg-primary-400/[12%] ': props.severity === null,
+                    'hover:shadow-hover active:!shadow-none hover:!bg-primary-400/90 active:bg-primary-400/90 hover:ring-0': !props.link &&
+                        props.severity === null &&
+                        !props.text &&
+                        !props.outlined &&
+                        !context.disabled &&
+                        !props.plain,
+                },
+                // Success
+                {
+                    'hover:bg-success-500/[8%] active:bg-success-500/[12%] ': props.severity === 'success',
+                    'hover:shadow-hover active:!shadow-none hover:!bg-success-500/90 active:bg-success-500/90 hover:ring-0': !props.link &&
+                        props.severity === 'success' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                },
+                // Info
+                {
+                    'hover:bg-blue-600 hover:ring-blue-600': props.severity === 'info' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                },
+                {
+                    'focus:ring-blue-400/50': props.severity === 'info',
+                },
+                // Text & Outlined Button
+                {
+                    'hover:bg-blue-300/20': (props.text || props.outlined) &&
+                        props.severity === 'info' &&
+                        !props.plain,
+                },
+                // Warning
+                {
+                    'hover:bg-warning-500/[8%] active:bg-warning-500/[12%] ': props.severity === 'warning',
+                    'hover:shadow-hover active:!shadow-none hover:!bg-warning-500/90 active:bg-warning-500/90 hover:ring-0': !props.link &&
+                        props.severity === 'warning' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                },
+                // Text & Outlined Button
+                {
+                    'hover:bg-warning-300/20': (props.text || props.outlined) &&
+                        props.severity === 'warning' &&
+                        !props.plain,
+                },
+                // Help
+                {
+                    'hover:bg-purple-600 hover:ring-purple-600': props.severity === 'help' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                },
+                {
+                    'focus:ring-purple-400/50': props.severity === 'help',
+                },
+                // Text & Outlined Button
+                {
+                    'hover:bg-purple-300/20': (props.text || props.outlined) &&
+                        props.severity === 'help' &&
+                        !props.plain,
+                },
+                // Danger
+                {
+                    'hover:bg-danger-500/[8%] active:bg-danger-500/[12%] ': props.severity === 'danger',
+                    'hover:shadow-hover active:!shadow-none hover:!bg-danger-500/90 active:bg-danger-500/90 hover:ring-0': !props.link &&
+                        props.severity === 'danger' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                },
+                // Text & Outlined Button
+                {
+                    'hover:bg-danger-300/20': (props.text || props.outlined) &&
+                        props.severity === 'danger' &&
+                        !props.plain,
+                },
+                // Contrast
+                {
+                    'hover:bg-surface-800 hover:ring-surface-800': props.severity === 'contrast' &&
+                        !props.text &&
+                        !props.outlined &&
+                        !props.plain,
+                },
+                {
+                    'focus:ring-primary-400': props.severity === 'contrast',
+                },
+                // Text & Outlined Button
+                {
+                    'hover:bg-surface-900/10': (props.text || props.outlined) &&
+                        props.severity === 'contrast' &&
+                        !props.plain,
+                },
+                // Disabled
+                {
+                    'pointer-events-none cursor-default': context.disabled,
+                    '!text-general-300': context.disabled && (props.outlined || props.text),
+                    '!ring-general-300': context.disabled && props.outlined,
+                    '!bg-general-300 !text-white !ring-0': context.disabled && !props.outlined && !props.text,
+                },
+                // Transitions
+                'transition duration-200 ease-in-out',
+                // Misc
+                'cursor-pointer overflow-hidden select-none',
+                // Badge
+                '[&>[data-pc-name=badge]]:min-w-4 [&>[data-pc-name=badge]]:h-4 [&>[data-pc-name=badge]]:leading-4',
+            ],
+        });
+    },
+    label: function (_a) {
+        var props = _a.props;
+        return ({
+            class: [
+                'duration-200',
+                'font-normal text-xs',
+                props.label ? 'leading-5' : 'leading-4',
+                {
+                    'hover:underline': props.link,
+                },
+                { 'flex-1': props.label !== null, 'invisible w-0': props.label == null },
+            ],
+        });
+    },
+    icon: function (_a) {
+        var props = _a.props;
+        return ({
+            class: ['shrink-0', { '!h-[11px] !w-[11px]': props.size === 'small' }],
+        });
+    },
+    loadingIcon: function (_a) {
+        var props = _a.props;
+        return ({
+            class: [
+                'h-4 w-4',
+                'mx-0',
+                {
+                    'mr-2': props.iconPos === 'left' && props.label != null,
+                    'ml-2 order-1': props.iconPos === 'right' && props.label != null,
+                    'mb-2': props.iconPos === 'top' && props.label != null,
+                    'mt-2': props.iconPos === 'bottom' && props.label != null,
+                },
+                'animate-spin',
+            ],
+        });
+    },
+    badge: function (_a) {
+        var props = _a.props;
+        return ({
+            class: [
+                {
+                    'ml-2 w-4 h-4 leading-none flex items-center justify-center': props.badge,
+                },
+            ],
+        });
+    },
+};

package/fixedasset/buttonbulkaction/index.d.ts

@@ -0,0 +1,32 @@
+declare namespace _default {
+    let root: {
+        class: string;
+        'data-wv-name': string;
+        'data-wv-section': string;
+    };
+    let menu: {
+        id: string;
+        class: string;
+        'data-wv-section': string;
+    };
+    let selectionmessage: {
+        class: string;
+        'data-wv-section': string;
+    };
+    function buttonselectall({ context }: {
+        context: any;
+    }): {
+        class: (string | {
+            'pointer-events-none': any;
+        })[];
+        'data-wv-section': string;
+    };
+    let bulkactiontoggle: {
+        'data-wv-section': string;
+    };
+    let buttonclearselection: {
+        class: string;
+        'data-wv-section': string;
+    };
+}
+export default _default;

package/fixedasset/buttonbulkaction/index.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = {
+    root: {
+        'class': 'flex gap-2 items-center',
+        'data-wv-name': 'buttonbulkaction',
+        'data-wv-section': 'root',
+    },
+    menu: {
+        'id': 'bulkaction-overlay-menu',
+        'class': 'flex gap-2 items-center',
+        'data-wv-section': 'menu',
+    },
+    selectionmessage: {
+        'class': 'text-xs text-grayscale-900 cursor-default whitespace-nowrap',
+        'data-wv-section': 'selectionmessage',
+    },
+    buttonselectall: function (_a) {
+        var context = _a.context;
+        return ({
+            'class': [
+                '!px-1.5 !py-1 -ml-1.5 -mr-1.5 !text-xs',
+                { 'pointer-events-none': context.selectedAll },
+            ],
+            'data-wv-section': 'buttonselectall',
+        });
+    },
+    bulkactiontoggle: {
+        'data-wv-section': 'bulkactiontoggle',
+    },
+    buttonclearselection: {
+        'class': '!p-0 !w-6 !h-6 [&_.icon]:!w-5 [&_.icon]:!h-5',
+        'data-wv-section': 'buttonclearselection',
+    },
+};

package/fixedasset/buttondownload/index.d.ts

@@ -0,0 +1,12 @@
+declare namespace _default {
+    let root: {
+        class: string;
+        'data-wv-name': string;
+        'data-wv-section': string;
+    };
+    let icon: {
+        class: string;
+        'data-wv-section': string;
+    };
+}
+export default _default;

package/fixedasset/buttondownload/index.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = {
+    root: {
+        'class': 'focus-within:ring-2 focus-within:ring-primary-400 focus-within:outline-none rounded-sm',
+        'data-wv-name': 'buttondownload',
+        'data-wv-section': 'root',
+    },
+    icon: {
+        'class': 'text-2xl',
+        'data-wv-section': 'icon',
+    },
+};

package/fixedasset/buttonfilter/index.d.ts

@@ -0,0 +1,12 @@
+declare namespace _default {
+    let root: {
+        class: string;
+        'data-wv-name': string;
+        'data-wv-section': string;
+    };
+    let icon: {
+        class: string;
+        'data-wv-section': string;
+    };
+}
+export default _default;

package/fixedasset/buttonfilter/index.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = {
+    root: {
+        'class': 'focus-within:ring-2 focus-within:ring-primary-400 focus-within:outline-none rounded-sm',
+        'data-wv-name': 'buttonfilter',
+        'data-wv-section': 'root',
+    },
+    icon: {
+        'class': 'text-2xl',
+        'data-wv-section': 'icon',
+    },
+};

package/fixedasset/buttonradio/index.d.ts

@@ -0,0 +1,58 @@
+declare namespace _default {
+    let root: {
+        class: string;
+        'data-wv-name': string;
+        'data-wv-section': string;
+    };
+    function wrapper({ props }: {
+        props: any;
+    }): {
+        class: (string | {
+            'bg-white': boolean;
+            'bg-general-50': any;
+            'border-general-100': boolean;
+            'border-primary-500': boolean;
+            'border-general-200': any;
+            '!border-danger-500'?: undefined;
+        } | {
+            '!border-danger-500': any;
+            'bg-white'?: undefined;
+            'bg-general-50'?: undefined;
+            'border-general-100'?: undefined;
+            'border-primary-500'?: undefined;
+            'border-general-200'?: undefined;
+        })[];
+    };
+    function box({ props }: {
+        props: any;
+    }): {
+        class: (string | {
+            'border-general-100': boolean;
+            'border-primary-500': boolean;
+            'bg-primary-500': boolean;
+            'bg-general-200': any;
+            'outline-none outline-offset-0'?: undefined;
+            'peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-surface-0 peer-focus-visible:ring-primary-500'?: undefined;
+        } | {
+            'outline-none outline-offset-0': boolean;
+            'peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-surface-0 peer-focus-visible:ring-primary-500': boolean;
+            'border-general-100'?: undefined;
+            'border-primary-500'?: undefined;
+            'bg-primary-500'?: undefined;
+            'bg-general-200'?: undefined;
+        })[];
+    };
+    function input({ props }: {
+        props: any;
+    }): {
+        class: (string | {
+            'cursor-default': any;
+            'cursor-pointer': boolean;
+        })[];
+    };
+    namespace icon {
+        let _class: string;
+        export { _class as class };
+    }
+}
+export default _default;