@fy-/fws-vue 0.3.0 → 0.3.1

package/presets/Lara/panelmenu/index.js

@@ -1,139 +0,0 @@
-export default {
-  panel: {
-    class: "mb-1",
-  },
-  header: {
-    class: [
-      "rounded-md",
-      "outline-none",
-      "focus-visible:outline-none focus-visible:outline-offset-0 focus-visible:ring focus-visible:ring-primary-400/50 dark:focus-visible:ring-primary-300/50",
-    ],
-  },
-  headercontent: ({ context, instance }) => ({
-    class: [
-      // Shape
-      "rounded-t-md",
-      {
-        "rounded-br-md rounded-bl-md":
-          !context.active || instance.activeItem?.items === undefined,
-        "rounded-br-0 rounded-bl-0":
-          context.active && instance.activeItem?.items !== undefined,
-      },
-
-      // Color
-      "border border-surface-200 dark:border-surface-700",
-      "bg-surface-50 dark:bg-surface-800",
-      "text-surface-600 dark:text-surface-0/80",
-      { "text-surface-900": context.active },
-
-      // States
-      "hover:bg-surface-100 dark:hover:bg-surface-700/80",
-      "hover:text-surface-900",
-
-      // Transition
-      "transition duration-200 ease-in-out",
-      "transition-shadow duration-200",
-    ],
-  }),
-  headeraction: {
-    class: [
-      "relative",
-
-      // Font
-      "font-bold",
-      "leading-none",
-
-      // Flex & Alignments
-      "flex items-center",
-
-      // Spacing
-      "p-5",
-
-      // Misc
-      "select-none cursor-pointer no-underline",
-    ],
-  },
-  headerlabel: {
-    class: "leading-none",
-  },
-  headerIcon: {
-    class: "mr-2",
-  },
-  submenuicon: {
-    class: "mr-2",
-  },
-  menucontent: {
-    class: [
-      // Spacing
-      "py-2",
-
-      // Shape
-      "border border-t-0",
-      "rounded-t-none rounded-br-md rounded-bl-md",
-
-      // Color
-      "text-surface-700 dark:text-white/80",
-      "bg-surface-0 dark:bg-surface-800",
-      "border-surface-200 dark:border-surface-700",
-    ],
-  },
-  menu: {
-    class: ["outline-none", "m-0 p-0 list-none"],
-  },
-  content: {
-    class: [
-      // Shape
-      "border-none rounded-none",
-
-      // Color
-      "text-surface-700 dark:text-white/80",
-
-      // Transition
-      "transition-shadow duration-200",
-    ],
-  },
-  action: ({ context }) => ({
-    class: [
-      "relative",
-
-      // Font
-      "leading-none",
-
-      // Flex & Alignments
-      "flex items-center",
-
-      // Spacing
-      "py-3 px-5",
-
-      // Color
-      "text-surface-700 dark:text-white/80",
-
-      // States
-      "hover:bg-surface-100 dark:hover:bg-surface-700/80 hover:text-surface-700 dark:hover:text-white/80",
-      {
-        "bg-surface-200 text-surface-700 dark:text-white/80 dark:bg-surface-600/90":
-          context.focused,
-      },
-
-      // Misc
-      "cursor-pointer no-underline",
-      "select-none overflow-hidden",
-    ],
-  }),
-  icon: {
-    class: "mr-2",
-  },
-  submenu: {
-    class: "p-0 pl-4 m-0 list-none",
-  },
-  transition: {
-    enterFromClass: "max-h-0",
-    enterActiveClass:
-      "overflow-hidden transition-[max-height] duration-1000 ease-[cubic-bezier(0.42,0,0.58,1)]",
-    enterToClass: "max-h-[1000px]",
-    leaveFromClass: "max-h-[1000px]",
-    leaveActiveClass:
-      "overflow-hidden transition-[max-height] duration-[450ms] ease-[cubic-bezier(0,1,0,1)]",
-    leaveToClass: "max-h-0",
-  },
-};

package/presets/Lara/password/index.js

@@ -1,140 +0,0 @@
-export default {
-  root: ({ props }) => ({
-    class: [
-      "inline-flex relative",
-      {
-        "opacity-60 select-none pointer-events-none cursor-default":
-          props.disabled,
-      },
-      { "[&>input]:pr-10": props.toggleMask },
-    ],
-  }),
-  panel: {
-    class: [
-      // Spacing
-      "p-5",
-
-      // Shape
-      "border-0 dark:border",
-      "shadow-md rounded-md",
-
-      // Colors
-      "bg-surface-0 dark:bg-surface-900",
-      "text-surface-700 dark:text-white/80",
-      "dark:border-surface-700",
-    ],
-  },
-  meter: {
-    class: [
-      // Position and Overflow
-      "overflow-hidden",
-      "relative",
-
-      // Shape and Size
-      "border-0",
-      "h-3",
-
-      // Spacing
-      "mb-2",
-
-      // Colors
-      "bg-surface-100 dark:bg-surface-700",
-    ],
-  },
-  meterlabel: ({ instance }) => ({
-    class: [
-      // Size
-      "h-full",
-
-      // Colors
-      {
-        "bg-red-500 dark:bg-red-400/50": instance?.meter?.strength == "weak",
-        "bg-orange-500 dark:bg-orange-400/50":
-          instance?.meter?.strength == "medium",
-        "bg-green-500 dark:bg-green-400/50":
-          instance?.meter?.strength == "strong",
-      },
-
-      // Transitions
-      "transition-all duration-1000 ease-in-out",
-    ],
-  }),
-  showicon: {
-    class: [
-      "absolute top-1/2 right-3 -mt-2 z-10",
-      "text-surface-600 dark:text-white/70",
-    ],
-  },
-  hideicon: {
-    class: [
-      "absolute top-1/2 right-3 -mt-2 z-10",
-      "text-surface-600 dark:text-white/70",
-    ],
-  },
-  input: {
-    root: ({ props, context, parent }) => ({
-      class: [
-        // Font
-        "font-sans leading-none",
-
-        // Flex
-        { "flex-1 w-[1%]": parent.instance.$name == "InputGroup" },
-
-        // Spacing
-        "m-0",
-        {
-          "px-4 py-4": props.size == "large",
-          "px-2 py-2": props.size == "small",
-          "p-3": props.size == null,
-        },
-        "w-full",
-
-        // Shape
-        { "rounded-md": parent.instance.$name !== "InputGroup" },
-        {
-          "first:rounded-l-md rounded-none last:rounded-r-md":
-            parent.instance.$name == "InputGroup",
-        },
-        {
-          "border-0 border-y border-l last:border-r":
-            parent.instance.$name == "InputGroup",
-        },
-        {
-          "first:ml-0 -ml-px":
-            parent.instance.$name == "InputGroup" && !props.showButtons,
-        },
-
-        // Colors
-        "text-surface-600 dark:text-surface-200",
-        "placeholder:text-surface-400 dark:placeholder:text-surface-500",
-        "bg-surface-0 dark:bg-surface-900",
-        "border",
-        { "border-surface-300 dark:border-surface-600": !parent.props.invalid },
-
-        // Invalid State
-        { "border-red-500 dark:border-red-400": parent.props.invalid },
-
-        // States
-        {
-          "hover:border-primary-500 dark:hover:border-primary-400":
-            !context.disabled && !parent.props.invalid,
-          "focus:outline-none focus:outline-offset-0 focus:ring focus:ring-primary-500/50 dark:focus:ring-primary-400/50 focus:z-10":
-            !context.disabled,
-          "opacity-60 select-none pointer-events-none cursor-default":
-            context.disabled,
-        },
-
-        // Misc
-        "appearance-none",
-        "transition-colors duration-200",
-      ],
-    }),
-  },
-  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",
-  },
-};