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

package/wangsvue/tieredmenu/index.js

@@ -1,108 +1,121 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = {
-    root: {
-        class: [
-            // Shape
-            'rounded-md',
-            // Size
-            'min-w-[12rem]',
-            'p-1.5',
-            // Colors
-            'bg-surface-0',
-            'ring-1 ring-surface-200',
-        ],
-    },
-    menu: {
-        class: [
-            // Spacings and Shape
-            'list-none',
-            'm-0',
-            'p-0',
-            'outline-none',
-        ],
-    },
-    menuitem: {
-        class: ['relative first:mt-0 mt-1'],
-    },
-    content: function (_a) {
-        var context = _a.context;
-        return ({
-            class: [
-                //Shape
-                'rounded-md',
-                //  Colors
-                {
-                    'text-surface-500/70': !context.focused && !context.active,
-                    'text-surface-500/70 bg-surface-200': context.focused && !context.active,
-                    'text-surface-900/80 bg-surface-50': context.focused && context.active,
-                    'text-surface-900/80 bg-surface-50': !context.focused && context.active,
-                },
-                // Hover States
-                {
-                    'hover:bg-surface-50': !context.active,
-                    'hover:bg-surface-100 text-surface-900/80': context.active,
-                },
-                // Transitions
-                'transition-shadow',
-                'duration-200',
-            ],
-        });
-    },
-    action: {
-        class: [
-            'relative',
-            // Font
-            'font-semibold',
-            // Flexbox
-            'flex',
-            'items-center',
-            // Spacing
-            'py-2',
-            'px-3',
-            // Misc
-            'no-underline',
-            'overflow-hidden',
-            'cursor-pointer',
-            'select-none',
-        ],
-    },
-    icon: {
-        class: [
-            // Spacing
-            'mr-2',
-            'leading-6',
-            'text-sm',
-        ],
-    },
-    label: {
-        class: ['leading-none', 'text-sm'],
-    },
-    submenuicon: {
-        class: [
-            // Position
-            'ml-auto',
-        ],
-    },
-    submenu: {
-        class: [
-            // Size
-            'w-full sm:w-48',
-            // Spacing
-            'p-1.5',
-            'm-0 mx-1.5',
-            'list-none',
-            // Shape
-            'shadow-none sm:shadow-md',
-            'border-0',
-            // Position
-            'static sm:absolute',
-            'z-10',
-            // Color
-            'bg-surface-0',
-        ],
-    },
-    separator: {
-        class: 'border-t border-surface-200 my-1',
-    },
-};
+export default {
+  root: {
+    class: [
+      // Shape
+      'rounded-md',
+
+      // Size
+      'min-w-[12rem]',
+      'p-1.5',
+
+      // Colors
+      'bg-surface-0',
+      'ring-1 ring-surface-200',
+    ],
+  },
+  menu: {
+    class: [
+      // Spacings and Shape
+      'list-none',
+      'm-0',
+      'p-0',
+      'outline-none',
+    ],
+  },
+  menuitem: {
+    class: ['relative first:mt-0 mt-1'],
+  },
+  content: ({ context }) => ({
+    class: [
+      //Shape
+      'rounded-md',
+
+      //  Colors
+      {
+        'text-surface-500/70':
+          !context.focused && !context.active,
+        'text-surface-500/70 bg-surface-200':
+          context.focused && !context.active,
+        'text-surface-900/80 bg-surface-50':
+          context.focused && context.active,
+        'text-surface-900/80 bg-surface-50':
+          !context.focused && context.active,
+      },
+
+      // Hover States
+      {
+        'hover:bg-surface-50': !context.active,
+        'hover:bg-surface-100 text-surface-900/80':
+          context.active,
+      },
+
+      // Transitions
+      'transition-shadow',
+      'duration-200',
+    ],
+  }),
+  action: {
+    class: [
+      'relative',
+
+      // Font
+      'font-semibold',
+
+      // Flexbox
+      'flex',
+      'items-center',
+
+      // Spacing
+      'py-2',
+      'px-3',
+
+      // Misc
+      'no-underline',
+      'overflow-hidden',
+      'cursor-pointer',
+      'select-none',
+    ],
+  },
+  icon: {
+    class: [
+      // Spacing
+      'mr-2',
+      'leading-6',
+      'text-sm',
+    ],
+  },
+  label: {
+    class: ['leading-none', 'text-sm'],
+  },
+  submenuicon: {
+    class: [
+      // Position
+      'ml-auto',
+    ],
+  },
+  submenu: {
+    class: [
+      // Size
+      'w-full sm:w-48',
+
+      // Spacing
+      'p-1.5',
+      'm-0 mx-1.5',
+      'list-none',
+
+      // Shape
+      'shadow-none sm:shadow-md',
+      'border-0',
+
+      // Position
+      'static sm:absolute',
+      'z-10',
+
+      // Color
+      'bg-surface-0',
+    ],
+  },
+  separator: {
+    class: 'border-t border-surface-200 my-1',
+  },
+};

package/wangsvue/timeline/index.js

@@ -1,83 +1,70 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var isEmptyObject = function (obj) {
-    if (!obj)
-        return true;
-    var keys = Object.keys(obj);
-    if (!keys.length)
-        return true; // Empty at the top level
-    return keys.every(function (key) {
-        var value = obj[key];
-        if (typeof value === 'object') {
-            if (Array.isArray(value)) {
-                return (!value.length ||
-                    value.every(function (val) {
-                        return typeof val === 'object' ? isEmptyObject(val) : val == null;
-                    }));
-            }
-            return isEmptyObject(value);
-        }
-        return value == null;
-    });
-};
-exports.default = {
-    root: function (_a) {
-        var props = _a.props;
-        return ({
-            class: ['flex flex-col grow', 'text-xs font-normal text-grayscale-900'],
-        });
-    },
-    event: function (_a) {
-        var props = _a.props, context = _a.context;
-        return ({
-            class: ['grid grid-cols-[max-content,1fr] gap-x-[10px] gap-y-1'],
-        });
-    },
-    opposite: function (_a) {
-        var props = _a.props, context = _a.context;
-        return ({
-            class: 'hidden',
-        });
-    },
-    separator: function (_a) {
-        var props = _a.props;
-        return ({
-            class: [
-                'flex items-center flex-initial',
-                {
-                    'flex-col': props.layout === 'vertical',
-                    'flex-row': props.layout === 'horizontal',
-                },
-            ],
-        });
-    },
-    marker: {
-        class: [
-            'w-max',
-            'rounded-full',
-            'bg-transparent',
-            'ring-2 ring-inset ring-primary-400 p-0.5',
-            'flex items-center justify-center',
-        ],
-    },
-    markerArrow: function (item) { return ({
-        'class': [
-            'w-4 h-4 invisible transition-transform duration-200 ease-in-out text-grayscale-900',
-            { '!visible': item.detail && !isEmptyObject(item.detail) },
-            { 'rotate-180': item.showDetail },
-        ],
-        'data-wv-section': 'markerArrow',
-    }); },
-    connector: function (_a) {
-        var props = _a.props;
-        return ({
-            class: ['w-[2px] grow bg-grayscale-900'],
-        });
-    },
-    content: function (_a) {
-        var props = _a.props, context = _a.context;
-        return ({
-            class: ['grid grid-rows-[max-content,auto] pb-2.5 gap-1'],
-        });
-    },
-};
+const isEmptyObject = (obj) => {
+  if (!obj) return true;
+
+  const keys = Object.keys(obj);
+  if (!keys.length) return true; // Empty at the top level
+
+  return keys.every((key) => {
+    const value = obj[key];
+
+    if (typeof value === 'object') {
+      if (Array.isArray(value)) {
+        return (
+          !value.length ||
+          value.every((val) =>
+            typeof val === 'object' ? isEmptyObject(val) : val == null,
+          )
+        );
+      }
+
+      return isEmptyObject(value);
+    }
+
+    return value == null;
+  });
+};
+
+export default {
+  root: ({ props }) => ({
+    class: ['flex flex-col grow', 'text-xs font-normal text-grayscale-900'],
+  }),
+  event: ({ props, context }) => ({
+    class: ['grid grid-cols-[max-content,1fr] gap-x-[10px] gap-y-1'],
+  }),
+  opposite: ({ props, context }) => ({
+    class: 'hidden',
+  }),
+  separator: ({ props }) => ({
+    class: [
+      'flex items-center flex-initial',
+      {
+        'flex-col': props.layout === 'vertical',
+        'flex-row': props.layout === 'horizontal',
+      },
+    ],
+  }),
+  marker: {
+    class: [
+      'w-max',
+      'rounded-full',
+      'bg-transparent',
+      'ring-2 ring-inset ring-primary-400 p-0.5',
+
+      'flex items-center justify-center',
+    ],
+  },
+  markerArrow: (item) => ({
+    'class': [
+      'w-4 h-4 invisible transition-transform duration-200 ease-in-out text-grayscale-900',
+      { '!visible': item.detail && !isEmptyObject(item.detail) },
+      { 'rotate-180': item.showDetail },
+    ],
+    'data-wv-section': 'markerArrow',
+  }),
+  connector: ({ props }) => ({
+    class: ['w-[2px] grow bg-grayscale-900'],
+  }),
+  content: ({ props, context }) => ({
+    class: ['grid grid-rows-[max-content,auto] pb-2.5 gap-1'],
+  }),
+};

package/wangsvue/toast/index.js

@@ -1,95 +1,97 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = {
-    root: function (_a) {
-        var props = _a.props;
-        return ({
-            class: [
-                //Size and Shape
-                'w-full max-w-[496px]',
-                // Positioning
-                {
-                    '-translate-x-2/4': props.position == 'top-center' || props.position == 'bottom-center',
-                },
-            ],
-            style: "z-index: ".concat(props.baseZIndex),
-        });
-    },
-    container: function (_a) {
-        var props = _a.props;
-        return ({
-            'class': [
-                'border-0 mt-6',
-                'rounded-[7px] w-full',
-                'shadow-lg',
-                // Colors
-                {
-                    'border-success-600 text-white bg-success-500': props.message.severity === 'success',
-                    'border-danger text-white bg-danger-500': props.message.severity === 'error',
-                    'border-primary-500 text-primary-500 bg-primary-50': props.message.severity === 'info',
-                },
-            ],
-            'data-wv-severity': props.message.severity,
-        });
-    },
-    content: {
-        class: 'flex items-center py-3 px-3 text-inherit gap-2',
-    },
-    icon: {
-        class: 'hidden',
-    },
-    text: {
-        class: [
-            // Font and Text
-            'text-xs leading-4 font-normal tracking-[0.02em] text-inherit',
-            'flex-1',
-        ],
-    },
-    summary: {
-        class: 'font-medium block',
-    },
-    detail: {
-        class: 'text-inherit',
-    },
-    closebutton: function (_a) {
-        var props = _a.props;
-        return ({
-            class: [
-                // Flexbox
-                'flex items-center justify-center',
-                // Size
-                'w-6 h-6',
-                // Spacing and Misc
-                'ml-auto relative',
-                // Shape
-                'rounded-full',
-                // Colors
-                'bg-transparent',
-                {
-                    'text-white': props.message.severity === 'success',
-                    'text-danger': props.message.severity === 'error',
-                    'text-primary-500': props.message.severity === 'info',
-                },
-                // Transitions
-                'transition duration-200 ease-in-out',
-                // States
-                // Misc
-                'overflow-hidden',
-            ],
-        });
-    },
-    closeicon: {
-        class: [
-            // Sizing and Spacing
-            'w-3 h-3',
-            'shrink-0',
-        ],
-    },
-    transition: {
-        enterFromClass: 'opacity-0 translate-y-2/4',
-        enterActiveClass: 'transition-[transform,opacity] duration-300',
-        leaveFromClass: 'max-h-[1000px]',
-        leaveActiveClass: '!transition-[max-height_.45s_cubic-bezier(0,1,0,1),opacity_.3s,margin-bottom_.3s] overflow-hidden',
-        leaveToClass: 'max-h-0 opacity-0 mb-0',
-    },
-};
+export default {
+  root: ({ props }) => ({
+    class: [
+      //Size and Shape
+      'w-full max-w-[496px]',
+
+      // Positioning
+      {
+        '-translate-x-2/4':
+          props.position == 'top-center' || props.position == 'bottom-center',
+      },
+    ],
+    style: `z-index: ${props.baseZIndex}`,
+  }),
+  container: ({ props }) => ({
+    'class': [
+      'border-0 mt-6',
+      'rounded-[7px] w-full',
+      'shadow-lg',
+      // Colors
+      {
+        'border-success-600 text-white bg-success-500':
+          props.message.severity === 'success',
+        'border-danger text-white bg-danger-500':
+          props.message.severity === 'error',
+        'border-primary-500 text-primary-500 bg-primary-50':
+          props.message.severity === 'info',
+      },
+    ],
+    'data-wv-severity': props.message.severity,
+  }),
+  content: {
+    class: 'flex items-center py-3 px-3 text-inherit gap-2',
+  },
+  icon: {
+    class: 'hidden',
+  },
+  text: {
+    class: [
+      // Font and Text
+      'text-xs leading-4 font-normal tracking-[0.02em] text-inherit',
+      'flex-1',
+    ],
+  },
+  summary: {
+    class: 'font-medium block',
+  },
+  detail: {
+    class: 'text-inherit',
+  },
+  closebutton: ({ props }) => ({
+    class: [
+      // Flexbox
+      'flex items-center justify-center',
+
+      // Size
+      'w-6 h-6',
+
+      // Spacing and Misc
+      'ml-auto relative',
+
+      // Shape
+      'rounded-full',
+
+      // Colors
+      'bg-transparent',
+      {
+        'text-white': props.message.severity === 'success',
+        'text-danger': props.message.severity === 'error',
+        'text-primary-500': props.message.severity === 'info',
+      },
+
+      // Transitions
+      'transition duration-200 ease-in-out',
+
+      // States
+
+      // Misc
+      'overflow-hidden',
+    ],
+  }),
+  closeicon: {
+    class: [
+      // Sizing and Spacing
+      'w-3 h-3',
+      'shrink-0',
+    ],
+  },
+  transition: {
+    enterFromClass: 'opacity-0 translate-y-2/4',
+    enterActiveClass: 'transition-[transform,opacity] duration-300',
+    leaveFromClass: 'max-h-[1000px]',
+    leaveActiveClass:
+      '!transition-[max-height_.45s_cubic-bezier(0,1,0,1),opacity_.3s,margin-bottom_.3s] overflow-hidden',
+    leaveToClass: 'max-h-0 opacity-0 mb-0',
+  },
+};