@fewangsit/wangsvue-presets 1.0.81 → 1.0.82

package/wangsvue/colorpicker/index.js

@@ -1,118 +1,134 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = {
-    root: function (_a) {
-        var props = _a.props;
-        return ({
-            class: [
-                // Display
-                'inline-block',
-                // Misc
-                {
-                    'opacity-60 select-none pointer-events-none cursor-default': props.disabled,
-                },
-            ],
-        });
-    },
-    input: {
-        class: [
-            // Font
-            'font-sans text-base ',
-            // Spacing
-            'm-0',
-            // Size & Shape
-            'rounded',
-            'w-4',
-            'h-4',
-            // Colors
-            'bg-surface-0',
-            'border border-surface-300',
-            // States
-            'hover:border-primary-500',
-            'focus:outline-none focus:outline-offset-0 focus:ring-2 focus:ring-primary-500',
-            // Transition
-            'transition-colors duration-200',
-            // Misc
-            'cursor-default',
-            'select-none',
-        ],
-    },
-    panel: function (_a) {
-        var props = _a.props;
-        return ({
-            class: [
-                // Position & Size
-                {
-                    'relative h-48 w-52': props.inline,
-                    'absolute h-48 w-52': !props.inline,
-                },
-                // Shape
-                'shadow-md',
-                'border-0',
-                'rounded-md',
-                // Colors
-                'bg-surface-800',
-                'ring-1 ring-inset ring-surface-900',
-            ],
-        });
-    },
-    selector: {
-        class: [
-            // Position
-            'absolute top-2 left-2',
-            // Size
-            'h-44 w-40',
-        ],
-    },
-    color: {
-        class: [
-            // Size
-            'h-44 w-40',
-        ],
-        style: 'background: linear-gradient(to top, #000 0%, rgb(0 0 0 / 0) 100%), linear-gradient(to right, #fff 0%, rgb(255 255 255 / 0) 100%)',
-    },
-    colorhandle: {
-        class: [
-            'absolute',
-            // Shape
-            'rounded-full border border-solid',
-            // Size
-            'h-3 w-3',
-            // Colors
-            'border-white',
-            // Misc
-            'cursor-pointer  opacity-85',
-        ],
-    },
-    hue: {
-        class: [
-            // Position
-            'absolute top-2 left-44',
-            // Size
-            'h-44 w-6',
-            // Opacity
-            'opacity-85',
-        ],
-        style: 'background: linear-gradient(0deg, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red)',
-    },
-    huehandle: {
-        class: [
-            // Position
-            'absolute left-0 -ml-1',
-            // Size
-            'h-2 w-8',
-            // Shape
-            'border-solid border-2 rounded',
-            // Colors
-            'border-white',
-            // Misc
-            'opacity-85',
-        ],
-    },
-    transition: {
-        enterFromClass: 'opacity-0 scale-y-[0.8]',
-        enterActiveClass: 'transition-[transform,opacity] duration-[120ms] ease-[cubic-bezier(0,0,0.2,1)]',
-        leaveActiveClass: 'transition-opacity duration-100 ease-linear',
-        leaveToClass: 'opacity-0',
-    },
-};
+export default {
+  root: ({ props }) => ({
+    class: [
+      // Display
+      'inline-block',
+
+      // Misc
+      {
+        'opacity-60 select-none pointer-events-none cursor-default':
+          props.disabled,
+      },
+    ],
+  }),
+  input: {
+    class: [
+      // Font
+      'font-sans text-base ',
+
+      // Spacing
+      'm-0',
+
+      // Size & Shape
+      'rounded',
+      'w-4',
+      'h-4',
+
+      // Colors
+      'bg-surface-0',
+      'border border-surface-300',
+
+      // States
+      'hover:border-primary-500',
+      'focus:outline-none focus:outline-offset-0 focus:ring-2 focus:ring-primary-500',
+
+      // Transition
+      'transition-colors duration-200',
+
+      // Misc
+      'cursor-default',
+      'select-none',
+    ],
+  },
+  panel: ({ props }) => ({
+    class: [
+      // Position & Size
+      {
+        'relative h-48 w-52': props.inline,
+        'absolute h-48 w-52': !props.inline,
+      },
+
+      // Shape
+      'shadow-md',
+      'border-0',
+      'rounded-md',
+
+      // Colors
+      'bg-surface-800',
+      'ring-1 ring-inset ring-surface-900',
+    ],
+  }),
+  selector: {
+    class: [
+      // Position
+      'absolute top-2 left-2',
+
+      // Size
+      'h-44 w-40',
+    ],
+  },
+  color: {
+    class: [
+      // Size
+      'h-44 w-40',
+    ],
+    style:
+      'background: linear-gradient(to top, #000 0%, rgb(0 0 0 / 0) 100%), linear-gradient(to right, #fff 0%, rgb(255 255 255 / 0) 100%)',
+  },
+  colorhandle: {
+    class: [
+      'absolute',
+
+      // Shape
+      'rounded-full border border-solid',
+
+      // Size
+      'h-3 w-3',
+
+      // Colors
+      'border-white',
+
+      // Misc
+      'cursor-pointer  opacity-85',
+    ],
+  },
+  hue: {
+    class: [
+      // Position
+      'absolute top-2 left-44',
+
+      // Size
+      'h-44 w-6',
+
+      // Opacity
+      'opacity-85',
+    ],
+    style:
+      'background: linear-gradient(0deg, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red)',
+  },
+  huehandle: {
+    class: [
+      // Position
+      'absolute left-0 -ml-1',
+
+      // Size
+      'h-2 w-8',
+
+      // Shape
+      'border-solid border-2 rounded',
+
+      // Colors
+      'border-white',
+
+      // Misc
+      'opacity-85',
+    ],
+  },
+  transition: {
+    enterFromClass: 'opacity-0 scale-y-[0.8]',
+    enterActiveClass:
+      'transition-[transform,opacity] duration-[120ms] ease-[cubic-bezier(0,0,0.2,1)]',
+    leaveActiveClass: 'transition-opacity duration-100 ease-linear',
+    leaveToClass: 'opacity-0',
+  },
+};

package/wangsvue/confirmpopup/index.js

@@ -1,104 +1,122 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = {
-    root: {
-        class: [
-            // Shape
-            'rounded-lg',
-            'shadow-xl',
-            'border-0',
-            // Positioning
-            'z-40 transform origin-center',
-            'mt-3 absolute left-0 top-0',
-            // Color
-            '',
-            'bg-surface-0',
-            'text-surface-700/80',
-            // Before: Arrow
-            'before:absolute before:w-0 before:-top-3 before:h-0 before:border-transparent before:border-solid before:ml-6 before:border-x-[0.75rem] before:border-b-[0.75rem] before:border-t-0 before:border-b-surface-0',
-        ],
-    },
-    content: {
-        class: [
-            // Font
-            'text-sm',
-            // Spacing
-            'px-6',
-            'py-3',
-            // Colors
-            'bg-surface-0',
-            'text-surface-600',
-            // Misc
-            'overflow-y-auto',
-        ],
-    },
-    icon: {
-        class: 'text-xl mr-2',
-    },
-    footer: {
-        class: [
-            // Flexbox and Alignment
-            'flex items-center justify-end',
-            'shrink-0',
-            'text-right',
-            'gap-3',
-            // Spacing
-            'px-6',
-            'py-3',
-            // Shape
-            'border-t-0',
-            'rounded-b-lg',
-            // Colors
-            'bg-surface-50',
-            'text-surface-700/80',
-        ],
-    },
-    rejectbutton: {
-        root: {
-            class: [
-                'relative',
-                // Alignments
-                'items-center inline-flex text-center align-bottom justify-center',
-                // Sizes & Spacing
-                'px-2.5 py-1.5 min-w-[2rem]',
-                'text-sm',
-                // Shape
-                'rounded-md',
-                // Color
-                'text-primary-500',
-                // States
-                'hover:bg-primary-300/20',
-                'focus:outline-none focus:outline-offset-0 focus:ring-2 focus:ring-inset',
-                'focus:ring-primary-500',
-            ],
-        },
-    },
-    acceptbutton: {
-        root: {
-            class: [
-                'relative',
-                // Alignments
-                'items-center inline-flex text-center align-bottom justify-center',
-                // Sizes & Spacing
-                'px-2.5 py-1.5 min-w-[2rem]',
-                'text-sm',
-                // Shape
-                'rounded-md',
-                // Color
-                'text-white',
-                'bg-primary-500',
-                'ring-1 ring-primary-500',
-                // States
-                'hover:bg-primary-600 hover:border-primary-600',
-                'focus:outline-none focus:outline-offset-0 focus:ring-2 focus:ring-offset-current',
-                'focus:ring-primary-500',
-            ],
-        },
-    },
-    transition: {
-        enterFromClass: 'opacity-0 scale-y-[0.8]',
-        enterActiveClass: 'transition-[transform,opacity] duration-[120ms] ease-[cubic-bezier(0,0,0.2,1)]',
-        leaveActiveClass: 'transition-opacity duration-100 ease-linear',
-        leaveToClass: 'opacity-0',
-    },
-};
+export default {
+  root: {
+    class: [
+      // Shape
+      'rounded-lg',
+      'shadow-xl',
+      'border-0',
+
+      // Positioning
+      'z-40 transform origin-center',
+      'mt-3 absolute left-0 top-0',
+
+      // Color
+      '',
+      'bg-surface-0',
+      'text-surface-700/80',
+
+      // Before: Arrow
+      'before:absolute before:w-0 before:-top-3 before:h-0 before:border-transparent before:border-solid before:ml-6 before:border-x-[0.75rem] before:border-b-[0.75rem] before:border-t-0 before:border-b-surface-0',
+    ],
+  },
+  content: {
+    class: [
+      // Font
+      'text-sm',
+
+      // Spacing
+      'px-6',
+      'py-3',
+
+      // Colors
+      'bg-surface-0',
+      'text-surface-600',
+
+      // Misc
+      'overflow-y-auto',
+    ],
+  },
+  icon: {
+    class: 'text-xl mr-2',
+  },
+  footer: {
+    class: [
+      // Flexbox and Alignment
+      'flex items-center justify-end',
+      'shrink-0',
+      'text-right',
+      'gap-3',
+
+      // Spacing
+      'px-6',
+      'py-3',
+
+      // Shape
+      'border-t-0',
+      'rounded-b-lg',
+
+      // Colors
+      'bg-surface-50',
+      'text-surface-700/80',
+    ],
+  },
+  rejectbutton: {
+    root: {
+      class: [
+        'relative',
+
+        // Alignments
+        'items-center inline-flex text-center align-bottom justify-center',
+
+        // Sizes & Spacing
+        'px-2.5 py-1.5 min-w-[2rem]',
+        'text-sm',
+
+        // Shape
+        'rounded-md',
+
+        // Color
+        'text-primary-500',
+
+        // States
+        'hover:bg-primary-300/20',
+        'focus:outline-none focus:outline-offset-0 focus:ring-2 focus:ring-inset',
+        'focus:ring-primary-500',
+      ],
+    },
+  },
+  acceptbutton: {
+    root: {
+      class: [
+        'relative',
+
+        // Alignments
+        'items-center inline-flex text-center align-bottom justify-center',
+
+        // Sizes & Spacing
+        'px-2.5 py-1.5 min-w-[2rem]',
+        'text-sm',
+
+        // Shape
+        'rounded-md',
+
+        // Color
+        'text-white',
+        'bg-primary-500',
+        'ring-1 ring-primary-500',
+
+        // States
+        'hover:bg-primary-600 hover:border-primary-600',
+        'focus:outline-none focus:outline-offset-0 focus:ring-2 focus:ring-offset-current',
+        'focus:ring-primary-500',
+      ],
+    },
+  },
+  transition: {
+    enterFromClass: 'opacity-0 scale-y-[0.8]',
+    enterActiveClass:
+      'transition-[transform,opacity] duration-[120ms] ease-[cubic-bezier(0,0,0.2,1)]',
+    leaveActiveClass: 'transition-opacity duration-100 ease-linear',
+    leaveToClass: 'opacity-0',
+  },
+};