@nuxt/ui 2.10.0 → 2.11.0

package/dist/runtime/ui.config/elements/button.d.ts

@@ -0,0 +1,77 @@
+declare const _default: {
+    base: string;
+    font: string;
+    rounded: string;
+    size: {
+        '2xs': string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+    };
+    gap: {
+        '2xs': string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+    };
+    padding: {
+        '2xs': string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+    };
+    square: {
+        '2xs': string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+    };
+    color: {
+        white: {
+            solid: string;
+            ghost: string;
+        };
+        gray: {
+            solid: string;
+            ghost: string;
+            link: string;
+        };
+        black: {
+            solid: string;
+            link: string;
+        };
+    };
+    variant: {
+        solid: string;
+        outline: string;
+        soft: string;
+        ghost: string;
+        link: string;
+    };
+    icon: {
+        base: string;
+        size: {
+            '2xs': string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+        };
+    };
+    default: {
+        size: string;
+        variant: string;
+        color: string;
+        loadingIcon: string;
+    };
+};
+export default _default;

package/dist/runtime/ui.config/elements/button.mjs

@@ -0,0 +1,76 @@
+export default {
+  base: "focus:outline-none focus-visible:outline-0 disabled:cursor-not-allowed disabled:opacity-75 flex-shrink-0",
+  font: "font-medium",
+  rounded: "rounded-md",
+  size: {
+    "2xs": "text-xs",
+    xs: "text-xs",
+    sm: "text-sm",
+    md: "text-sm",
+    lg: "text-sm",
+    xl: "text-base"
+  },
+  gap: {
+    "2xs": "gap-x-1",
+    xs: "gap-x-1.5",
+    sm: "gap-x-1.5",
+    md: "gap-x-2",
+    lg: "gap-x-2.5",
+    xl: "gap-x-2.5"
+  },
+  padding: {
+    "2xs": "px-2 py-1",
+    xs: "px-2.5 py-1.5",
+    sm: "px-2.5 py-1.5",
+    md: "px-3 py-2",
+    lg: "px-3.5 py-2.5",
+    xl: "px-3.5 py-2.5"
+  },
+  square: {
+    "2xs": "p-1",
+    xs: "p-1.5",
+    sm: "p-1.5",
+    md: "p-2",
+    lg: "p-2.5",
+    xl: "p-2.5"
+  },
+  color: {
+    white: {
+      solid: "shadow-sm ring-1 ring-inset ring-gray-300 dark:ring-gray-700 text-gray-900 dark:text-white bg-white hover:bg-gray-50 disabled:bg-white dark:bg-gray-900 dark:hover:bg-gray-800/50 dark:disabled:bg-gray-900 focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400",
+      ghost: "text-gray-900 dark:text-white hover:bg-white dark:hover:bg-gray-900 focus-visible:ring-inset focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400"
+    },
+    gray: {
+      solid: "shadow-sm ring-1 ring-inset ring-gray-300 dark:ring-gray-700 text-gray-700 dark:text-gray-200 bg-gray-50 hover:bg-gray-100 disabled:bg-gray-50 dark:bg-gray-800 dark:hover:bg-gray-700/50 dark:disabled:bg-gray-800 focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400",
+      ghost: "text-gray-700 dark:text-gray-200 hover:text-gray-900 dark:hover:text-white hover:bg-gray-50 dark:hover:bg-gray-800 focus-visible:ring-inset focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400",
+      link: "text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-200 underline-offset-4 hover:underline focus-visible:ring-inset focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400"
+    },
+    black: {
+      solid: "shadow-sm text-white dark:text-gray-900 bg-gray-900 hover:bg-gray-800 disabled:bg-gray-900 dark:bg-white dark:hover:bg-gray-100 dark:disabled:bg-white focus-visible:ring-inset focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400",
+      link: "text-gray-900 dark:text-white underline-offset-4 hover:underline focus-visible:ring-inset focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400"
+    }
+  },
+  variant: {
+    solid: "shadow-sm text-white dark:text-gray-900 bg-{color}-500 hover:bg-{color}-600 disabled:bg-{color}-500 dark:bg-{color}-400 dark:hover:bg-{color}-500 dark:disabled:bg-{color}-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-{color}-500 dark:focus-visible:outline-{color}-400",
+    outline: "ring-1 ring-inset ring-current text-{color}-500 dark:text-{color}-400 hover:bg-{color}-50 disabled:bg-transparent dark:hover:bg-{color}-950 dark:disabled:bg-transparent focus-visible:ring-2 focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400",
+    soft: "text-{color}-500 dark:text-{color}-400 bg-{color}-50 hover:bg-{color}-100 disabled:bg-{color}-50 dark:bg-{color}-950 dark:hover:bg-{color}-900 dark:disabled:bg-{color}-950 focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400",
+    ghost: "text-{color}-500 dark:text-{color}-400 hover:bg-{color}-50 disabled:bg-transparent dark:hover:bg-{color}-950 dark:disabled:bg-transparent focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400",
+    link: "text-{color}-500 hover:text-{color}-600 disabled:text-{color}-500 dark:text-{color}-400 dark:hover:text-{color}-500 dark:disabled:text-{color}-400 underline-offset-4 hover:underline focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400"
+  },
+  icon: {
+    base: "flex-shrink-0",
+    size: {
+      "2xs": "h-4 w-4",
+      xs: "h-4 w-4",
+      sm: "h-5 w-5",
+      md: "h-5 w-5",
+      lg: "h-5 w-5",
+      xl: "h-6 w-6"
+    }
+  },
+  default: {
+    size: "sm",
+    variant: "solid",
+    color: "primary",
+    loadingIcon: "i-heroicons-arrow-path-20-solid"
+  }
+};

package/dist/runtime/ui.config/elements/buttonGroup.d.ts

@@ -0,0 +1,9 @@
+declare const _default: {
+    wrapper: {
+        horizontal: string;
+        vertical: string;
+    };
+    rounded: string;
+    shadow: string;
+};
+export default _default;

package/dist/runtime/ui.config/elements/buttonGroup.mjs

@@ -0,0 +1,8 @@
+export default {
+  wrapper: {
+    horizontal: "inline-flex -space-x-px",
+    vertical: "inline-flex flex-col -space-y-px"
+  },
+  rounded: "rounded-md",
+  shadow: "shadow-sm"
+};

package/dist/runtime/ui.config/elements/chip.d.ts

@@ -0,0 +1,35 @@
+declare const _default: {
+    wrapper: string;
+    base: string;
+    background: string;
+    position: {
+        'top-right': string;
+        'bottom-right': string;
+        'top-left': string;
+        'bottom-left': string;
+    };
+    translate: {
+        'top-right': string;
+        'bottom-right': string;
+        'top-left': string;
+        'bottom-left': string;
+    };
+    size: {
+        '3xs': string;
+        '2xs': string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+        '2xl': string;
+        '3xl': string;
+    };
+    default: {
+        size: string;
+        color: string;
+        position: string;
+        inset: boolean;
+    };
+};
+export default _default;

package/dist/runtime/ui.config/elements/chip.mjs

@@ -0,0 +1,34 @@
+export default {
+  wrapper: "relative inline-flex items-center justify-center flex-shrink-0",
+  base: "absolute rounded-full ring-1 ring-white dark:ring-gray-900 flex items-center justify-center text-white dark:text-gray-900 font-medium whitespace-nowrap",
+  background: "bg-{color}-500 dark:bg-{color}-400",
+  position: {
+    "top-right": "top-0 right-0",
+    "bottom-right": "bottom-0 right-0",
+    "top-left": "top-0 left-0",
+    "bottom-left": "bottom-0 left-0"
+  },
+  translate: {
+    "top-right": "-translate-y-1/2 translate-x-1/2 transform",
+    "bottom-right": "translate-y-1/2 translate-x-1/2 transform",
+    "top-left": "-translate-y-1/2 -translate-x-1/2 transform",
+    "bottom-left": "translate-y-1/2 -translate-x-1/2 transform"
+  },
+  size: {
+    "3xs": "h-[4px] min-w-[4px] text-[4px] p-px",
+    "2xs": "h-[5px] min-w-[5px] text-[5px] p-px",
+    xs: "h-1.5 min-w-[0.375rem] text-[6px] p-px",
+    sm: "h-2 min-w-[0.5rem] text-[7px] p-0.5",
+    md: "h-2.5 min-w-[0.625rem] text-[8px] p-0.5",
+    lg: "h-3 min-w-[0.75rem] text-[10px] p-0.5",
+    xl: "h-3.5 min-w-[0.875rem] text-[11px] p-1",
+    "2xl": "h-4 min-w-[1rem] text-[12px] p-1",
+    "3xl": "h-5 min-w-[1.25rem] text-[14px] p-1"
+  },
+  default: {
+    size: "sm",
+    color: "primary",
+    position: "top-right",
+    inset: false
+  }
+};

package/dist/runtime/ui.config/elements/dropdown.d.ts

@@ -0,0 +1,53 @@
+declare const _default: {
+    wrapper: string;
+    container: string;
+    width: string;
+    height: string;
+    background: string;
+    shadow: string;
+    rounded: string;
+    ring: string;
+    base: string;
+    divide: string;
+    padding: string;
+    item: {
+        base: string;
+        rounded: string;
+        padding: string;
+        size: string;
+        active: string;
+        inactive: string;
+        disabled: string;
+        icon: {
+            base: string;
+            active: string;
+            inactive: string;
+        };
+        avatar: {
+            base: string;
+            size: string;
+        };
+        shortcuts: string;
+    };
+    transition: {
+        enterActiveClass: string;
+        enterFromClass: string;
+        enterToClass: string;
+        leaveActiveClass: string;
+        leaveFromClass: string;
+        leaveToClass: string;
+    };
+    popper: {
+        placement: string;
+        strategy: string;
+    };
+    arrow: {
+        ring: string;
+        background: string;
+        base: string;
+        rounded: string;
+        shadow: string;
+        placement: string;
+    };
+};
+export default _default;

package/dist/runtime/ui.config/elements/dropdown.mjs

@@ -0,0 +1,51 @@
+import _popperArrow from "../_popperArrow.mjs";
+export default {
+  wrapper: "relative inline-flex text-left rtl:text-right",
+  container: "z-20 group",
+  width: "w-48",
+  height: "",
+  background: "bg-white dark:bg-gray-800",
+  shadow: "shadow-lg",
+  rounded: "rounded-md",
+  ring: "ring-1 ring-gray-200 dark:ring-gray-700",
+  base: "relative focus:outline-none overflow-y-auto scroll-py-1",
+  divide: "divide-y divide-gray-200 dark:divide-gray-700",
+  padding: "p-1",
+  item: {
+    base: "group flex items-center gap-2 w-full",
+    rounded: "rounded-md",
+    padding: "px-2 py-1.5",
+    size: "text-sm",
+    active: "bg-gray-100 dark:bg-gray-900 text-gray-900 dark:text-white",
+    inactive: "text-gray-700 dark:text-gray-200",
+    disabled: "cursor-not-allowed opacity-50",
+    icon: {
+      base: "flex-shrink-0 h-4 w-4",
+      active: "text-gray-500 dark:text-gray-400",
+      inactive: "text-gray-400 dark:text-gray-500"
+    },
+    avatar: {
+      base: "flex-shrink-0",
+      size: "3xs"
+    },
+    shortcuts: "hidden md:inline-flex flex-shrink-0 gap-0.5 ms-auto"
+  },
+  // Syntax for `<Transition>` component https://vuejs.org/guide/built-ins/transition.html#css-based-transitions
+  transition: {
+    enterActiveClass: "transition duration-100 ease-out",
+    enterFromClass: "transform scale-95 opacity-0",
+    enterToClass: "transform scale-100 opacity-100",
+    leaveActiveClass: "transition duration-75 ease-in",
+    leaveFromClass: "transform scale-100 opacity-100",
+    leaveToClass: "transform scale-95 opacity-0"
+  },
+  popper: {
+    placement: "bottom-end",
+    strategy: "fixed"
+  },
+  arrow: {
+    ..._popperArrow,
+    ring: "before:ring-1 before:ring-gray-200 dark:before:ring-gray-700",
+    background: "before:bg-white dark:before:bg-gray-700"
+  }
+};

package/dist/runtime/ui.config/elements/kbd.d.ts

@@ -0,0 +1,17 @@
+declare const _default: {
+    base: string;
+    padding: string;
+    size: {
+        xs: string;
+        sm: string;
+        md: string;
+    };
+    rounded: string;
+    font: string;
+    background: string;
+    ring: string;
+    default: {
+        size: string;
+    };
+};
+export default _default;

package/dist/runtime/ui.config/elements/kbd.mjs

@@ -0,0 +1,16 @@
+export default {
+  base: "inline-flex items-center justify-center text-gray-900 dark:text-white",
+  padding: "px-1",
+  size: {
+    xs: "h-4 min-w-[16px] text-[10px]",
+    sm: "h-5 min-w-[20px] text-[11px]",
+    md: "h-6 min-w-[24px] text-[12px]"
+  },
+  rounded: "rounded",
+  font: "font-medium font-sans",
+  background: "bg-gray-100 dark:bg-gray-800",
+  ring: "ring-1 ring-gray-300 dark:ring-gray-700 ring-inset",
+  default: {
+    size: "sm"
+  }
+};

package/dist/runtime/ui.config/elements/meter.d.ts

@@ -0,0 +1,77 @@
+declare const _default: {
+    wrapper: string;
+    indicator: {
+        container: string;
+        text: string;
+        size: {
+            '2xs': string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            '2xl': string;
+        };
+    };
+    meter: {
+        base: string;
+        background: string;
+        color: string;
+        ring: string;
+        rounded: string;
+        shadow: string;
+        size: {
+            '2xs': string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            '2xl': string;
+        };
+        appearance: {
+            inner: string;
+            meter: string;
+            bar: string;
+            value: string;
+        };
+        bar: {
+            transition: string;
+            ring: string;
+            rounded: string;
+            size: {
+                '2xs': string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xl: string;
+                '2xl': string;
+            };
+        };
+    };
+    label: {
+        base: string;
+        text: string;
+        color: string;
+        size: {
+            '2xs': string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            '2xl': string;
+        };
+    };
+    color: {
+        white: string;
+        black: string;
+        gray: string;
+    };
+    default: {
+        size: string;
+        color: string;
+    };
+};
+export default _default;

package/dist/runtime/ui.config/elements/meter.mjs

@@ -0,0 +1,76 @@
+export default {
+  wrapper: "w-full flex flex-col gap-2",
+  indicator: {
+    container: "min-w-fit transition-all",
+    text: "text-gray-400 dark:text-gray-500 text-end",
+    size: {
+      "2xs": "text-xs",
+      xs: "text-xs",
+      sm: "text-sm",
+      md: "text-sm",
+      lg: "text-sm",
+      xl: "text-base",
+      "2xl": "text-base"
+    }
+  },
+  meter: {
+    base: "appearance-none block w-full bg-none overflow-y-hidden",
+    background: "bg-gray-200 dark:bg-gray-700",
+    color: "text-{color}-500 dark:text-{color}-400",
+    ring: "",
+    rounded: "rounded-full",
+    shadow: "",
+    size: {
+      "2xs": "h-px",
+      xs: "h-0.5",
+      sm: "h-1",
+      md: "h-2",
+      lg: "h-3",
+      xl: "h-4",
+      "2xl": "h-5"
+    },
+    appearance: {
+      inner: "[&::-webkit-meter-inner-element]:block [&::-webkit-meter-inner-element]:relative [&::-webkit-meter-inner-element]:border-none [&::-webkit-meter-inner-element]:bg-none [&::-webkit-meter-inner-element]:bg-transparent",
+      meter: "[&::-webkit-meter-bar]:border-none [&::-webkit-meter-bar]:bg-none [&::-webkit-meter-bar]:bg-transparent",
+      bar: "[&::-webkit-meter-optimum-value]:border-none [&::-webkit-meter-optimum-value]:bg-none [&::-webkit-meter-optimum-value]:bg-current",
+      value: "[&::-moz-meter-bar]:border-none [&::-moz-meter-bar]:bg-none [&::-moz-meter-bar]:bg-current"
+    },
+    bar: {
+      transition: "[&::-webkit-meter-optimum-value]:transition-all [&::-moz-meter-bar]:transition-all",
+      ring: "",
+      rounded: "[&::-webkit-meter-optimum-value]:rounded-full [&::-moz-meter-bar]:rounded-full",
+      size: {
+        "2xs": "[&::-webkit-meter-optimum-value]:h-px [&::-moz-meter-bar]:h-px",
+        xs: "[&::-webkit-meter-optimum-value]:h-0.5 [&::-moz-meter-bar]:h-0.5",
+        sm: "[&::-webkit-meter-optimum-value]:h-1 [&::-moz-meter-bar]:h-1",
+        md: "[&::-webkit-meter-optimum-value]:h-2 [&::-moz-meter-bar]:h-2",
+        lg: "[&::-webkit-meter-optimum-value]:h-3 [&::-moz-meter-bar]:h-3",
+        xl: "[&::-webkit-meter-optimum-value]:h-4 [&::-moz-meter-bar]:h-4",
+        "2xl": "[&::-webkit-meter-optimum-value]:h-5 [&::-moz-meter-bar]:h-5"
+      }
+    }
+  },
+  label: {
+    base: "flex gap-2 items-center",
+    text: "truncate",
+    color: "text-{color}-500 dark:text-{color}-400",
+    size: {
+      "2xs": "text-xs",
+      xs: "text-xs",
+      sm: "text-sm",
+      md: "text-sm",
+      lg: "text-sm",
+      xl: "text-base",
+      "2xl": "text-base"
+    }
+  },
+  color: {
+    white: "text-white dark:text-black",
+    black: "text-black dark:text-white",
+    gray: "text-gray-500 dark:text-gray-400"
+  },
+  default: {
+    size: "md",
+    color: "primary"
+  }
+};

package/dist/runtime/ui.config/elements/meterGroup.d.ts

@@ -0,0 +1,12 @@
+declare const _default: {
+    wrapper: string;
+    base: string;
+    background: string;
+    transition: string;
+    rounded: string;
+    shadow: string;
+    default: {
+        size: string;
+    };
+};
+export default _default;

package/dist/runtime/ui.config/elements/meterGroup.mjs

@@ -0,0 +1,11 @@
+export default {
+  wrapper: "flex flex-col gap-2 w-full",
+  base: "flex flex-row flex-nowrap flex-shrink overflow-hidden",
+  background: "bg-gray-200 dark:bg-gray-700",
+  transition: "transition-all",
+  rounded: "rounded-full",
+  shadow: "",
+  default: {
+    size: "md"
+  }
+};

package/dist/runtime/ui.config/elements/progress.d.ts

@@ -0,0 +1,75 @@
+declare const _default: {
+    wrapper: string;
+    indicator: {
+        container: {
+            base: string;
+            width: string;
+            transition: string;
+        };
+        align: string;
+        width: string;
+        color: string;
+        size: {
+            '2xs': string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            '2xl': string;
+        };
+    };
+    progress: {
+        base: string;
+        width: string;
+        size: {
+            '2xs': string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            '2xl': string;
+        };
+        rounded: string;
+        track: string;
+        bar: string;
+        color: string;
+        background: string;
+        indeterminate: {
+            base: string;
+            rounded: string;
+        };
+    };
+    steps: {
+        base: string;
+        color: string;
+        size: {
+            '2xs': string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            '2xl': string;
+        };
+    };
+    step: {
+        base: string;
+        align: string;
+        active: string;
+        first: string;
+    };
+    animation: {
+        carousel: string;
+        'carousel-inverse': string;
+        swing: string;
+        elastic: string;
+    };
+    default: {
+        color: string;
+        size: string;
+        animation: string;
+    };
+};
+export default _default;