@fewangsit/wangsvue-presets 1.0.99-alpha.3 → 1.0.99-alpha.4

package/fixedasset/style.css

@@ -1249,6 +1249,10 @@
   margin-right: -1.75rem;
 }
 
+.-mt-0\.5{
+  margin-top: -0.125rem;
+}
+
 .-mt-1\.5{
   margin-top: -0.375rem;
 }
@@ -2519,6 +2523,10 @@
   overflow: hidden;
 }
 
+.overflow-visible{
+  overflow: visible;
+}
+
 .overflow-scroll{
   overflow: scroll;
 }
@@ -2539,6 +2547,10 @@
   overflow-y: hidden;
 }
 
+.overflow-x-visible{
+  overflow-x: visible;
+}
+
 .overscroll-auto{
   overscroll-behavior: auto;
 }
@@ -4329,6 +4341,12 @@
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 
+.shadow-\[-2px_2px_2px_rgba\(0\2c 0\2c 0\2c 0\.25\)\]{
+  --tw-shadow: -2px 2px 2px rgba(0,0,0,0.25);
+  --tw-shadow-colored: -2px 2px 2px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
 .shadow-\[-4px_4px_20px_0px_\#0000001A\]{
   --tw-shadow: -4px 4px 20px 0px #0000001A;
   --tw-shadow-colored: -4px 4px 20px 0px var(--tw-shadow-color);

package/fixedasset/tabmenu/index.js

@@ -3,19 +3,25 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var core_1 = require("@wangs-ui/core");
 exports.default = (0, core_1.definePreset)('WANGS-TAB-MENU', {
     root: {
-        class: 'overflow-x-auto',
+        class: 'overflow-x-visible',
         style: 'scrollbar-width: none',
     },
-    menu: {
-        class: [
-            // Flexbox
-            'flex flex-1',
-            // Spacing
-            'list-none',
-            'p-0 m-0',
-            // Colors
-            'text-general-100',
-        ],
+    menu: function (_a) {
+        var props = _a.props;
+        return ({
+            class: [
+                // Flexbox
+                'flex flex-1',
+                // Spacing
+                'list-none',
+                'p-0 m-0',
+                // Colors
+                'text-general-100',
+                {
+                    'w-max ring-1 ring-inset ring-general-100 rounded': props.type === 'segmented',
+                },
+            ],
+        });
     },
     menuitem: {
         class: 'mr-0',
@@ -34,12 +40,14 @@ exports.default = (0, core_1.definePreset)('WANGS-TAB-MENU', {
                 // Spacing
                 {
                     'rounded-xl py-1 px-3': props.type === 'pill',
-                    'p-2 pb-1.5 pt-0.5 !h-6': props.type !== 'pill',
+                    'rounded': props.type === 'segmented',
+                    'p-2 pb-1.5 pt-0.5 !h-6': props.type === 'tab',
+                    'py-[5px] px-3 !h-6': props.type === 'segmented',
                     'ml-1': props.type === 'pill' && context.index !== 0,
                 },
                 // Shape
                 {
-                    'border-b-2': props.type !== 'pill',
+                    'border-b-2': props.type === 'tab',
                 },
                 // Colors and Conditions
                 {
@@ -49,6 +57,8 @@ exports.default = (0, core_1.definePreset)('WANGS-TAB-MENU', {
                     'text-primary-500': context.active,
                     'bg-primary-50 text-primary-500': props.type === 'pill' && context.active,
                     'bg-grayscale-200 text-grayscale-800': props.type === 'pill' && !context.active,
+                    'bg-primary-500 text-white shadow-[-2px_2px_2px_rgba(0,0,0,0.25)] -mt-0.5': props.type === 'segmented' && context.active,
+                    '!text-general-800': props.type === 'segmented' && !context.active,
                     'bg-transparent ': props.type !== 'pill' && !context.active,
                 },
                 // States
@@ -80,7 +90,11 @@ exports.default = (0, core_1.definePreset)('WANGS-TAB-MENU', {
         return ({
             class: [
                 'grow border-b-2 border-primary-100',
-                { hidden: props.type === 'pill' || props.useTrailingLine === false },
+                {
+                    hidden: props.type === 'pill' ||
+                        props.useTrailingLine === false ||
+                        props.type === 'segmented',
+                },
             ],
         });
     },