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

package/wangsvue/dataviewlayoutoptions/index.js

@@ -1,58 +1,64 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = {
-    listbutton: function (_a) {
-        var props = _a.props;
-        return ({
-            class: [
-                // Font
-                'leading-none',
-                // Flex Alignment
-                'inline-flex items-center align-bottom text-center',
-                // Shape
-                'rounded-md rounded-r-none',
-                // Spacing
-                'px-2.5 py-1.5',
-                // Color
-                'ring-1 ring-surface-200',
-                props.modelValue === 'list'
-                    ? 'bg-surface-100 text-surface-700'
-                    : 'bg-surface-0 text-surface-700/80',
-                // States
-                'focus:outline-none focus:outline-offset-0 focus:ring-primary-500',
-                'hover:bg-surface-200/80',
-                // Transition
-                'transition duration-200',
-                // Misc
-                'cursor-pointer select-none overflow-hidden',
-            ],
-        });
-    },
-    gridbutton: function (_a) {
-        var props = _a.props;
-        return ({
-            class: [
-                // Font
-                'leading-none',
-                // Flex Alignment
-                'inline-flex items-center align-bottom text-center',
-                // Shape
-                'rounded-md rounded-l-none',
-                // Spacing
-                'px-2.5 py-1.5',
-                // Color
-                'ring-1 ring-surface-200',
-                props.modelValue === 'grid'
-                    ? 'bg-surface-100 text-surface-700'
-                    : 'bg-surface-0 text-surface-700/80',
-                // States
-                'focus:outline-none focus:outline-offset-0 focus:ring-primary-500',
-                'hover:bg-surface-200/80',
-                // Transition
-                'transition duration-200',
-                // Misc
-                'cursor-pointer select-none overflow-hidden',
-            ],
-        });
-    },
-};
+export default {
+  listbutton: ({ props }) => ({
+    class: [
+      // Font
+      'leading-none',
+
+      // Flex Alignment
+      'inline-flex items-center align-bottom text-center',
+
+      // Shape
+      'rounded-md rounded-r-none',
+
+      // Spacing
+      'px-2.5 py-1.5',
+
+      // Color
+      'ring-1 ring-surface-200',
+      props.modelValue === 'list'
+        ? 'bg-surface-100 text-surface-700'
+        : 'bg-surface-0 text-surface-700/80',
+
+      // States
+      'focus:outline-none focus:outline-offset-0 focus:ring-primary-500',
+      'hover:bg-surface-200/80',
+
+      // Transition
+      'transition duration-200',
+
+      // Misc
+      'cursor-pointer select-none overflow-hidden',
+    ],
+  }),
+  gridbutton: ({ props }) => ({
+    class: [
+      // Font
+      'leading-none',
+
+      // Flex Alignment
+      'inline-flex items-center align-bottom text-center',
+
+      // Shape
+      'rounded-md rounded-l-none',
+
+      // Spacing
+      'px-2.5 py-1.5',
+
+      // Color
+      'ring-1 ring-surface-200',
+      props.modelValue === 'grid'
+        ? 'bg-surface-100 text-surface-700'
+        : 'bg-surface-0 text-surface-700/80',
+
+      // States
+      'focus:outline-none focus:outline-offset-0 focus:ring-primary-500',
+      'hover:bg-surface-200/80',
+
+      // Transition
+      'transition duration-200',
+
+      // Misc
+      'cursor-pointer select-none overflow-hidden',
+    ],
+  }),
+};

package/wangsvue/datepicker/index.js

@@ -0,0 +1,39 @@
+export default {
+  inputgroup: {
+    class: ['grid grid-cols-[1fr,max-content] !items-center gap-1 px-3 py-1'],
+  },
+
+  inputtext: {
+    class: ['!p-0'],
+  },
+
+  inputtrigger: {
+    class: ['w-4 h-4 shrink-0 !text-general-500'],
+  },
+
+  panel: {
+    class: ['border-none !mt-0 !shadow-panel'],
+  },
+
+  panelcontent: {
+    class: ['grid grid-cols-7 grid-rows-[repeat(5,max-content)] p-6'],
+  },
+
+  date: {
+    class: [
+      'text-body-medium text-general-800',
+      'bg-white hover:bg-primary-100',
+      'rounded-[20px]',
+      // In range selection
+      '[&[data-in-range="true"]]:bg-primary-200',
+      '[&[data-in-range="true"]]:text-general-800',
+      '[&[data-in-range="true"]]:rounded-[0]',
+
+      // Selected State
+      '[&[aria-selected="true"]]:bg-primary-500',
+      '[&[aria-selected="true"]]:text-white',
+
+      'text-center p-2 cursor-pointer',
+    ],
+  },
+};

package/wangsvue/daypicker/index.js

@@ -0,0 +1,38 @@
+export default {
+  inputgroup: {
+    class: ['grid grid-cols-[1fr,max-content] !items-center gap-1 px-3 py-1'],
+  },
+
+  inputtext: {
+    class: ['!p-0'],
+  },
+
+  inputtrigger: {
+    class: ['w-4 h-4 shrink-0 !text-general-500'],
+  },
+
+  panel: {
+    class: ['border-none !mt-0 !shadow-panel'],
+  },
+
+  panelcontent: {
+    class: ['grid grid-cols-3 grid-rows-[repeat(3,max-content)] p-6 gap-y-4'],
+  },
+
+  day: {
+    class: [
+      'text-body-medium text-general-800',
+      'bg-white hover:bg-primary-100',
+      // In range selection
+      '[&[data-in-range="true"]]:bg-primary-200',
+      '[&[data-in-range="true"]]:text-general-800',
+
+      // Selected State
+      '[&[aria-selected="true"]]:bg-primary-500',
+      '[&[aria-selected="true"]]:text-white',
+      '[&[aria-selected="true"]]:rounded-[20px]',
+
+      'last:col-span-3 text-center p-2 cursor-pointer',
+    ],
+  },
+};