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

package/wangsvue/inputswitch/index.js

@@ -1,100 +1,114 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = {
-    root: function (_a) {
-        var props = _a.props;
-        return ({
-            class: [
-                // Alignments
-                'inline-flex relative align-middle',
-                'shrink-0',
-                // Shape
-                'rounded-[60px]',
-                // Size
-                'h-4 w-8',
-                // Misc
-                'cursor-pointer',
-                // States
-                {
-                    'select-none pointer-events-none cursor-default': props.disabled,
-                },
-            ],
-        });
-    },
-    slider: function (_a) {
-        var props = _a.props;
-        return ({
-            class: [
-                // Position
-                'absolute top-0 left-0 right-0 bottom-0',
-                // Shape
-                'rounded-[60px]',
-                // Before:
-                'before:absolute before:top-1/2',
-                'before:-mt-[6px] before:ml-0.5',
-                'before:h-3 before:w-3',
-                'before:rounded-full',
-                'before:duration-200 before:transition before:ease-in-out',
-                'before:shadow',
-                {
-                    'before:bg-white before:bg-white': props.modelValue == props.trueValue,
-                    'before:bg-primary-200': props.modelValue !== props.trueValue && !props.disabled,
-                    'before:bg-general-50': props.modelValue !== props.trueValue && props.disabled,
-                },
-                {
-                    'before:transform before:translate-x-3.5': props.modelValue == props.trueValue,
-                },
-                // Colors
-                'border',
-                {
-                    'border-primary-200': props.modelValue !== props.trueValue && !props.disabled,
-                    'border-transparent': props.modelValue == props.trueValue,
-                },
-                {
-                    'bg-white': props.modelValue !== props.trueValue && !props.disabled,
-                    'bg-primary-500': props.modelValue == props.trueValue && !props.disabled,
-                    'bg-primary-100': props.modelValue == props.trueValue && props.disabled,
-                    'bg-general-100': props.modelValue !== props.trueValue && props.disabled,
-                },
-                // States
-                'peer-focus-visible:ring-2 peer-focus-visible:ring-primary-500',
-                // Transition
-                'transition-colors duration-200',
-                // Misc
-                'cursor-pointer',
-            ],
-        });
-    },
-    input: function (_a) {
-        var props = _a.props;
-        return ({
-            class: [
-                'peer',
-                // Size
-                'w-full ',
-                'h-full',
-                // Position
-                'absolute',
-                'top-0 left-0',
-                'z-10',
-                // Spacing
-                'p-0',
-                'm-0',
-                // Shape
-                'rounded',
-                'border',
-                // Shape
-                'opacity-0',
-                'rounded-md',
-                'outline-none',
-                'border-2 border-surface-300',
-                // Misc
-                'appearance-none',
-                {
-                    'cursor-default': props.disabled,
-                    'cursor-pointer': !props.disabled,
-                },
-            ],
-        });
-    },
-};
+export default {
+  root: ({ props }) => ({
+    class: [
+      // Alignments
+      'inline-flex relative align-middle',
+      'shrink-0',
+
+      // Shape
+      'rounded-[60px]',
+
+      // Size
+      'h-4 w-8',
+
+      // Misc
+      'cursor-pointer',
+
+      // States
+      {
+        'select-none pointer-events-none cursor-default': props.disabled,
+      },
+    ],
+  }),
+  slider: ({ props }) => ({
+    class: [
+      // Position
+      'absolute top-0 left-0 right-0 bottom-0',
+
+      // Shape
+      'rounded-[60px]',
+
+      // Before:
+      'before:absolute before:top-1/2',
+      'before:-mt-[6px] before:ml-0.5',
+      'before:h-3 before:w-3',
+      'before:rounded-full',
+      'before:duration-200 before:transition before:ease-in-out',
+      'before:shadow',
+      {
+        'before:bg-white before:bg-white':
+          props.modelValue == props.trueValue,
+        'before:bg-primary-200':
+          props.modelValue !== props.trueValue && !props.disabled,
+        'before:bg-general-50':
+          props.modelValue !== props.trueValue && props.disabled,
+      },
+      {
+        'before:transform before:translate-x-3.5':
+          props.modelValue == props.trueValue,
+      },
+
+      // Colors
+      'border',
+      {
+        'border-primary-200':
+          props.modelValue !== props.trueValue && !props.disabled,
+        'border-transparent': props.modelValue == props.trueValue,
+      },
+      {
+        'bg-white':
+          props.modelValue !== props.trueValue && !props.disabled,
+        'bg-primary-500':
+          props.modelValue == props.trueValue && !props.disabled,
+        'bg-primary-100':
+          props.modelValue == props.trueValue && props.disabled,
+        'bg-general-100':
+          props.modelValue !== props.trueValue && props.disabled,
+      },
+
+      // States
+      'peer-focus-visible:ring-2 peer-focus-visible:ring-primary-500',
+
+      // Transition
+      'transition-colors duration-200',
+
+      // Misc
+      'cursor-pointer',
+    ],
+  }),
+  input: ({ props }) => ({
+    class: [
+      'peer',
+
+      // Size
+      'w-full ',
+      'h-full',
+
+      // Position
+      'absolute',
+      'top-0 left-0',
+      'z-10',
+
+      // Spacing
+      'p-0',
+      'm-0',
+
+      // Shape
+      'rounded',
+      'border',
+
+      // Shape
+      'opacity-0',
+      'rounded-md',
+      'outline-none',
+      'border-2 border-surface-300',
+
+      // Misc
+      'appearance-none',
+      {
+        'cursor-default': props.disabled,
+        'cursor-pointer': !props.disabled,
+      },
+    ],
+  }),
+};

package/wangsvue/inputtext/index.js

@@ -1,28 +1,27 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = {
-    root: function (_a) {
-        var _b, _c;
-        var props = _a.props, context = _a.context, parent = _a.parent;
-        return ({
-            class: [
-                'px-3 py-1 w-full bg-transparent',
-                // Size
-                'h-full',
-                {
-                    'max-h-[43px]': (_c = (_b = parent.instance) === null || _b === void 0 ? void 0 : _b.placeholder) === null || _c === void 0 ? void 0 : _c.includes('password'),
-                },
-                // Font
-                'text-grayscale-900 text-xs font-normal',
-                'placeholder:text-general-200',
-                'placeholder:!font-normal',
-                'appearance-none',
-                // Interactions
-                {
-                    'outline-none': !context.disabled,
-                    '!text-general-200 select-none pointer-events-none cursor-default': context.disabled,
-                },
-            ],
-        });
-    },
-};
+export default {
+  root: ({ props, context, parent }) => ({
+    class: [
+      'px-3 py-1 w-full bg-transparent',
+
+      // Size
+      'h-full',
+      {
+        'max-h-[43px]': parent.instance?.placeholder?.includes('password'),
+      },
+
+      // Font
+      'text-grayscale-900 text-xs font-normal',
+      'placeholder:text-general-200',
+      'placeholder:!font-normal',
+
+      'appearance-none',
+
+      // Interactions
+      {
+        'outline-none': !context.disabled,
+        '!text-general-200 select-none pointer-events-none cursor-default':
+          context.disabled,
+      },
+    ],
+  }),
+};

package/wangsvue/knob/index.js

@@ -1,45 +1,47 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = {
-    root: function (_a) {
-        var props = _a.props;
-        return ({
-            class: [
-                // Misc
-                {
-                    'opacity-60 select-none pointer-events-none cursor-default': props.disabled,
-                },
-            ],
-        });
-    },
-    range: {
-        class: [
-            // Stroke
-            'stroke-current',
-            // Color
-            'stroke-surface-200',
-            // Fill
-            'fill-none',
-            // Transition
-            'transition duration-100 ease-in',
-        ],
-    },
-    value: {
-        class: [
-            // Animation
-            'animate-dash-frame',
-            // Color
-            'stroke-primary-500',
-            // Fill
-            'fill-none',
-        ],
-    },
-    label: {
-        class: [
-            // Text Style
-            'text-center text-xl',
-            // Color
-            'fill-surface-600',
-        ],
-    },
-};
+export default {
+  root: ({ props }) => ({
+    class: [
+      // Misc
+      {
+        'opacity-60 select-none pointer-events-none cursor-default':
+          props.disabled,
+      },
+    ],
+  }),
+  range: {
+    class: [
+      // Stroke
+      'stroke-current',
+
+      // Color
+      'stroke-surface-200',
+
+      // Fill
+      'fill-none',
+
+      // Transition
+      'transition duration-100 ease-in',
+    ],
+  },
+  value: {
+    class: [
+      // Animation
+      'animate-dash-frame',
+
+      // Color
+      'stroke-primary-500',
+
+      // Fill
+      'fill-none',
+    ],
+  },
+  label: {
+    class: [
+      // Text Style
+      'text-center text-xl',
+
+      // Color
+      'fill-surface-600',
+    ],
+  },
+};