@fewangsit/wangsvue-presets 1.0.86 → 1.0.87-alpha.0

package/fixedasset/badge/index.js

@@ -53,7 +53,7 @@ exports.default = {
                     'text-general-400': props.disabled,
                 },
             ],
-            'icon-class': 'w-[10px] h-[10px]',
+            'icon-class': 'w-[10px] h-[10px] !text-[10px]',
             'data-wv-section': 'removebutton',
         });
     },

package/fixedasset/buttonradio/index.d.ts

@@ -1,43 +1,36 @@
 declare namespace _default {
-    let root: {
-        class: string;
-        'data-wv-name': string;
-        'data-wv-section': string;
-    };
-    function wrapper({ props }: {
+    function root({ 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;
+            'bg-general-50': boolean;
+            'ring-general-100': boolean;
+            'ring-primary-500': boolean;
+            'ring-general-200': any;
+            '!ring-danger-500'?: undefined;
         } | {
-            '!border-danger-500': any;
+            '!ring-danger-500': any;
             'bg-white'?: undefined;
             'bg-general-50'?: undefined;
-            'border-general-100'?: undefined;
-            'border-primary-500'?: undefined;
-            'border-general-200'?: undefined;
+            'ring-general-100'?: undefined;
+            'ring-primary-500'?: undefined;
+            'ring-general-200'?: undefined;
         })[];
+        'data-wv-name': string;
+        'data-wv-section': string;
     };
     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;
+            'peer-focus-visible:ring-8 peer-focus-visible:ring-offset-2 peer-focus-visible:ring-primary-400/[8%]'?: 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;
+            'peer-focus-visible:ring-8 peer-focus-visible:ring-offset-2 peer-focus-visible:ring-primary-400/[8%]': boolean;
             'bg-primary-500'?: undefined;
             'bg-general-200'?: undefined;
         })[];
@@ -54,5 +47,14 @@ declare namespace _default {
         let _class: string;
         export { _class as class };
     }
+    let label: {
+        class: string[];
+    };
+    let labeltext: {
+        class: string;
+    };
+    let tooltipicon: {
+        class: string;
+    };
 }
 export default _default;

package/fixedasset/buttonradio/index.js

@@ -1,66 +1,55 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+var toggleswitch_1 = require("../toggleswitch");
 exports.default = {
-    root: {
-        'class': 'flex items-center w-max gap-1 cursor-pointer text-xs',
-        'data-wv-name': 'buttonradio',
-        'data-wv-section': 'root',
-    },
-    wrapper: function (_a) {
+    root: function (_a) {
         var props = _a.props;
         return ({
-            class: [
+            'class': [
                 'relative',
                 // Flexbox & Alignment
-                'flex items-center justify-center',
+                'inline-flex',
                 // Size
                 'w-4 h-4',
                 // Shape
-                'border-2',
+                'ring-inset',
+                'ring-2',
                 'rounded-full',
                 // Colors
                 {
-                    'bg-white': props.value !== props.modelValue &&
-                        props.value !== undefined &&
-                        !props.disabled,
-                    'bg-general-50': props.disabled,
-                    'border-general-100': props.value !== props.modelValue &&
-                        props.value !== undefined &&
-                        !props.disabled,
-                    'border-primary-500': props.value == props.modelValue &&
-                        props.value !== undefined &&
-                        !props.disabled,
-                    'border-general-200': props.disabled,
+                    'bg-white': !props.disabled || props.value == props.modelValue,
+                    'bg-general-50': props.disabled && props.value != props.modelValue,
+                    'ring-general-100': !props.disabled && props.value != props.modelValue,
+                    'ring-primary-500': !props.disabled && props.value == props.modelValue,
+                    'ring-general-200': props.disabled,
                 },
                 {
-                    '!border-danger-500': props.invalid,
+                    '!ring-danger-500': props.invalid,
                 },
                 // Misc
                 'cursor-pointer',
             ],
+            'data-wv-name': 'buttonradio',
+            'data-wv-section': 'root',
         });
     },
     box: function (_a) {
         var props = _a.props;
         return ({
             class: [
-                // Flexbox
-                'flex justify-center items-center',
                 // Size
                 'w-2 h-2',
                 'text-sm',
                 'font-medium',
+                // Position
+                'translate-x-1/2',
+                'translate-y-1/2',
                 // Shape
-                // 'border-2',
                 'rounded-full',
                 // Transition
                 'transition duration-200 ease-in-out',
                 // Colors
                 {
-                    'border-general-100': props.value !== props.modelValue && props.value !== undefined,
-                    'border-primary-500': props.value == props.modelValue &&
-                        props.value !== undefined &&
-                        !props.disabled,
                     'bg-primary-500': props.value == props.modelValue &&
                         props.value !== undefined &&
                         !props.disabled,
@@ -71,8 +60,7 @@ exports.default = {
                 // States
                 {
                     'outline-none outline-offset-0': !props.disabled,
-                    'peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-surface-0 peer-focus-visible:ring-primary-500': !props.disabled,
-                    // 'opacity-60 cursor-default': props.disabled,
+                    'peer-focus-visible:ring-8 peer-focus-visible:ring-offset-2 peer-focus-visible:ring-primary-400/[8%]': !props.disabled,
                 },
             ],
         });
@@ -96,7 +84,6 @@ exports.default = {
                 'opacity-0',
                 'rounded-md',
                 'outline-none',
-                // 'border-2 border-surface-300',
                 // Misc
                 'appearance-none',
                 { 'cursor-default': props.disabled, 'cursor-pointer': !props.disabled },
@@ -106,4 +93,7 @@ exports.default = {
     icon: {
         class: 'hidden',
     },
+    label: toggleswitch_1.default.label,
+    labeltext: toggleswitch_1.default.labeltext,
+    tooltipicon: toggleswitch_1.default.tooltipicon,
 };

package/fixedasset/card/index.js

@@ -8,7 +8,7 @@ exports.default = {
             'flex flex-col gap-y-3',
             //Color
             'bg-white',
-            'text-grayscale-900',
+            'text-general-800',
         ],
     },
     header: {
@@ -24,7 +24,7 @@ exports.default = {
         class: ['text-sm font-normal'],
     },
     content: {
-        class: 'flex flex-col gap-3 text-xs text-grayscale-900',
+        class: 'flex flex-col gap-3 text-xs tracking-[0.02em] font-medium',
     },
     footer: {
         class: ['inline-flex gap-1 text-xs items-center'],

package/fixedasset/dropdown/index.d.ts

@@ -12,13 +12,13 @@ declare namespace _default {
         props: any;
     }): {
         class: (string | {
-            '!text-general-200': boolean;
-            'text-grayscale-900': boolean;
+            '!text-general-200 font-light': boolean;
+            'text-general-800 font-medium': boolean;
             'pr-7'?: undefined;
         } | {
             'pr-7': any;
-            '!text-general-200'?: undefined;
-            'text-grayscale-900'?: undefined;
+            '!text-general-200 font-light'?: undefined;
+            'text-general-800 font-medium'?: undefined;
         })[];
     };
     namespace trigger {
@@ -45,60 +45,60 @@ declare namespace _default {
         context: any;
     }): {
         class: (string | {
-            '!font-medium': any;
-            'text-surface-600'?: undefined;
-            'bg-primary-50 text-surface-700'?: undefined;
-            'bg-primary-50 text-primary-500'?: undefined;
-            'text-surface-700'?: undefined;
+            'text-general-800': boolean;
+            'text-general-400'?: undefined;
+            'bg-primary-50'?: undefined;
+            'text-primary-500'?: undefined;
+            'text-general-900'?: undefined;
             'pointer-events-none cursor-default'?: undefined;
             'cursor-pointer'?: undefined;
         } | {
-            'text-surface-600': any;
-            '!font-medium'?: undefined;
-            'bg-primary-50 text-surface-700'?: undefined;
-            'bg-primary-50 text-primary-500'?: undefined;
-            'text-surface-700'?: undefined;
+            'text-general-400': any;
+            'text-general-800'?: undefined;
+            'bg-primary-50'?: undefined;
+            'text-primary-500'?: undefined;
+            'text-general-900'?: undefined;
             'pointer-events-none cursor-default'?: undefined;
             'cursor-pointer'?: undefined;
         } | {
-            'bg-primary-50 text-surface-700': boolean;
-            '!font-medium'?: undefined;
-            'text-surface-600'?: undefined;
-            'bg-primary-50 text-primary-500'?: undefined;
-            'text-surface-700'?: undefined;
+            'bg-primary-50': any;
+            'text-general-800'?: undefined;
+            'text-general-400'?: undefined;
+            'text-primary-500'?: undefined;
+            'text-general-900'?: undefined;
             'pointer-events-none cursor-default'?: undefined;
             'cursor-pointer'?: undefined;
         } | {
-            'bg-primary-50 text-primary-500': any;
-            '!font-medium'?: undefined;
-            'text-surface-600'?: undefined;
-            'bg-primary-50 text-surface-700'?: undefined;
-            'text-surface-700'?: undefined;
+            'text-primary-500': any;
+            'text-general-800'?: undefined;
+            'text-general-400'?: undefined;
+            'bg-primary-50'?: undefined;
+            'text-general-900'?: undefined;
             'pointer-events-none cursor-default'?: undefined;
             'cursor-pointer'?: undefined;
         } | {
-            'text-surface-700': any;
-            '!font-medium'?: undefined;
-            'text-surface-600'?: undefined;
-            'bg-primary-50 text-surface-700'?: undefined;
-            'bg-primary-50 text-primary-500'?: undefined;
+            'text-general-900': any;
+            'text-general-800'?: undefined;
+            'text-general-400'?: undefined;
+            'bg-primary-50'?: undefined;
+            'text-primary-500'?: undefined;
             'pointer-events-none cursor-default'?: undefined;
             'cursor-pointer'?: undefined;
         } | {
             'pointer-events-none cursor-default': any;
-            '!font-medium'?: undefined;
-            'text-surface-600'?: undefined;
-            'bg-primary-50 text-surface-700'?: undefined;
-            'bg-primary-50 text-primary-500'?: undefined;
-            'text-surface-700'?: undefined;
+            'text-general-800'?: undefined;
+            'text-general-400'?: undefined;
+            'bg-primary-50'?: undefined;
+            'text-primary-500'?: undefined;
+            'text-general-900'?: undefined;
             'cursor-pointer'?: undefined;
         } | {
             'cursor-pointer': boolean;
-            '!font-medium'?: undefined;
-            'text-surface-600'?: undefined;
-            'bg-primary-50 text-surface-700'?: undefined;
-            'bg-primary-50 text-primary-500'?: undefined;
-            'text-surface-700'?: undefined;
+            'text-general-800'?: undefined;
+            'text-general-400'?: undefined;
+            'bg-primary-50'?: undefined;
+            'text-primary-500'?: undefined;
+            'text-general-900'?: undefined;
             'pointer-events-none cursor-default'?: undefined;
         })[];
     };
@@ -121,6 +121,19 @@ declare namespace _default {
     };
     let filtericon: {
         class: string[];
+        icon: string;
+    };
+    let loadingicon: {
+        class: string;
+        icon: string;
+    };
+    function dropdownicon({ state }: {
+        state: any;
+    }): {
+        class: (string | {
+            'rotate-180': any;
+        })[];
+        icon: string;
     };
     namespace clearicon {
         let _class_5: string[];
@@ -132,5 +145,9 @@ declare namespace _default {
         let leaveActiveClass: string;
         let leaveToClass: string;
     }
+    namespace loadingplaceholder {
+        let _class_6: string;
+        export { _class_6 as class };
+    }
 }
 export default _default;

package/fixedasset/dropdown/index.js

@@ -7,11 +7,11 @@ exports.default = {
         return ({
             class: [
                 // Display and Position
-                'inline-flex items-center',
+                'inline-flex items-center justify-between',
                 'relative',
                 // Shape
                 'w-full',
-                'rounded-md',
+                'rounded-lg',
                 // Misc
                 'cursor-default',
                 'select-none',
@@ -24,21 +24,19 @@ exports.default = {
         return ({
             class: [
                 //Font
-                'text-xs  font-normal',
+                'text-xs tracking-[0.02em]',
                 {
-                    '!text-general-200': props.modelValue == null,
-                    'text-grayscale-900': props.modelValue != null,
+                    '!text-general-200 font-light': props.modelValue == null,
+                    'text-general-800 font-medium': props.modelValue != null,
                 },
                 // Display
-                'block',
-                'flex-auto',
+                'flex items-center',
                 // Color and Background
                 'bg-transparent',
-                'border-0',
                 'placeholder:text-general-200',
                 // Sizing and Spacing
-                'h-max',
-                'py-[5px] px-3 pr-0',
+                'h-[26px] w-full',
+                'px-3 pr-0',
                 { 'pr-7': props.showClear },
                 //Shape
                 'rounded-none',
@@ -69,7 +67,7 @@ exports.default = {
             'bg-transparent',
             'text-general-200',
             // Size
-            'w-6 h-full',
+            'w-6 h-6',
             // Shape
             'rounded-tr-md',
             'rounded-br-md',
@@ -82,12 +80,10 @@ exports.default = {
             'mt-2',
             'max-w-[30vw]',
             // Shape
-            'border-0',
             'rounded-lg',
             'shadow-panel',
             // Color
-            'bg-surface-0',
-            'text-surface-800',
+            'bg-grayscale-100',
         ],
     },
     wrapper: function (_a) {
@@ -96,11 +92,8 @@ exports.default = {
             class: [
                 // Sizing
                 'max-h-[15rem]',
-                // Shape
-                'border-[0.5px]',
                 // Color
                 'bg-white',
-                'border-grayscale-900',
                 // Misc
                 'overflow-auto',
                 {
@@ -123,30 +116,25 @@ exports.default = {
                 // Position
                 'relative',
                 // Shape
-                'border-0',
                 'rounded-none',
                 // Spacing
                 'm-0',
-                'py-2 px-4',
+                'py-1.5 px-4',
                 // Color
-                { '!font-medium': context.selected },
                 {
-                    'text-surface-700': !context.focused && !context.selected && !context.disabled,
+                    'text-general-800': !context.focused && !context.selected && !context.disabled,
                 },
                 {
-                    'text-surface-600': !context.focused && !context.selected && context.disabled,
+                    'text-general-400': !context.focused && !context.selected && context.disabled,
                 },
+                { 'bg-primary-50': context.focused },
                 {
-                    'bg-primary-50 text-surface-700': context.focused && !context.selected,
+                    'text-primary-500': context.focused || context.selected,
                 },
                 {
-                    'bg-primary-50 text-primary-500': context.focused && context.selected,
-                },
-                {
-                    'text-surface-700': !context.focused && context.selected,
+                    'text-general-900': !context.focused && context.selected,
                 },
                 //States
-                'hover:bg-primary-bg-weak hover:text-primary',
                 'focus-visible:outline-none focus-visible:outline-offset-0 focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-primary-500',
                 // Misc
                 { 'pointer-events-none cursor-default': context.disabled },
@@ -186,6 +174,11 @@ exports.default = {
     filtercontainer: index_js_1.default === null || index_js_1.default === void 0 ? void 0 : index_js_1.default.filtercontainer,
     filterinput: index_js_1.default === null || index_js_1.default === void 0 ? void 0 : index_js_1.default.filterinput,
     filtericon: index_js_1.default === null || index_js_1.default === void 0 ? void 0 : index_js_1.default.filtericon,
+    loadingicon: index_js_1.default === null || index_js_1.default === void 0 ? void 0 : index_js_1.default.loadingicon,
+    dropdownicon: function (_a) {
+        var state = _a.state;
+        return index_js_1.default.dropdownicon({ state: state });
+    },
     clearicon: {
         class: [
             // Color
@@ -204,4 +197,7 @@ exports.default = {
         leaveActiveClass: 'transition-opacity duration-100 ease-linear',
         leaveToClass: 'opacity-0',
     },
+    loadingplaceholder: {
+        class: 'text-general-200 font-light',
+    },
 };

package/fixedasset/form/index.js

@@ -4,7 +4,7 @@ exports.default = {
     // :class="['ts-form', { 'sticky-buttons': props.stickyButtons }]"
     'root': function () { return ({
         'class': [
-            'flex flex-col gap-3 text-general-900 text-[0.75rem] font-medium leading-[16.8px]',
+            'flex flex-col gap-3 text-general-800 text-[0.75rem] font-medium leading-[16.8px] tracking-[0.02em]',
         ],
         'data-wv-section': 'root',
     }); },

package/fixedasset/global.js

@@ -7,7 +7,7 @@ exports.ringClass = [
         'ring-[0.5px] p-[0.5px]': !navigator.userAgent.includes('Firefox'),
     },
     'ring-inset',
-    'ring-general-400',
+    'ring-general-200',
 ];
 exports.default = {
     css: "\n    *[data-pd-ripple=\"true\"]{\n        overflow: hidden;\n        position: relative;\n    }\n    span[data-p-ink-active=\"true\"]{\n        animation: ripple 0.4s linear;\n    }\n    @keyframes ripple {\n        100% {\n            opacity: 0;\n            transform: scale(2.5);\n        }\n    }\n\n    .progress-spinner-circle {\n        stroke-dasharray: 89, 400;\n        stroke-dashoffset: 0;\n        animation: p-progress-spinner-dash 1.5s ease-in-out infinite, p-progress-spinner-color 6s ease-in-out infinite;\n        stroke-linecap: round;\n    }\n\n    @keyframes p-progress-spinner-dash{\n        0% {\n            stroke-dasharray: 1, 400;\n            stroke-dashoffset: 0;\n        }\n\n        50% {\n            stroke-dasharray: 89, 400;\n            stroke-dashoffset: -35px;\n        }\n        100% {\n            stroke-dasharray: 89, 400;\n            stroke-dashoffset: -124px;\n        }\n    }\n    @keyframes p-progress-spinner-color {\n        100%, 0% {\n            stroke: #ff5757;\n        }\n        40% {\n            stroke: #696cff;\n        }\n        66% {\n            stroke: #1ea97c;\n        }\n        80%, 90% {\n            stroke: #cc8925;\n        }\n    }\n\n    .progressbar-value-animate::after {\n        will-change: left, right;\n        animation: p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;\n    }\n    .progressbar-value-animate::before {\n        will-change: left, right;\n        animation: p-progressbar-indeterminate-anim 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;\n    }\n\n    @keyframes p-progressbar-indeterminate-anim {\n        0% {\n            left: -35%;\n            right: 100%;\n        }\n        60% {\n            left: 100%;\n            right: -90%;\n        }\n        100% {\n            left: 100%;\n            right: -90%;\n        }\n    }\n",

package/fixedasset/index.d.ts

@@ -15,13 +15,13 @@ declare namespace fixedasset {
     export { calendar };
     export { checkbox };
     export { buttonradio };
-    export { inputswitch };
     export { selectbutton };
     export { slider };
     export { chips };
     export { rating };
     export { multiselect };
     export { togglebutton };
+    export { toggleswitch };
     export { cascadeselect };
     export { listbox };
     export { colorpicker };
@@ -113,13 +113,13 @@ import inputbadge from './inputbadge/index.js';
 import calendar from './calendar/index.js';
 import checkbox from './checkbox/index.js';
 import buttonradio from './buttonradio/index.js';
-import inputswitch from './inputswitch/index.js';
 import selectbutton from './selectbutton/index.js';
 import slider from './slider/index.js';
 import chips from './chips/index.js';
 import rating from './rating/index.js';
 import multiselect from './multiselect/index.js';
 import togglebutton from './togglebutton/index.js';
+import toggleswitch from './toggleswitch';
 import cascadeselect from './cascadeselect/index.js';
 import listbox from './listbox/index.js';
 import colorpicker from './colorpicker/index.js';