@nuxt/ui 2.10.0 → 2.11.1

package/dist/runtime/ui.config/index.mjs

@@ -0,0 +1,40 @@
+export { default as table } from "./data/table.mjs";
+export { default as avatar } from "./elements/avatar.mjs";
+export { default as avatarGroup } from "./elements/avatarGroup.mjs";
+export { default as badge } from "./elements/badge.mjs";
+export { default as button } from "./elements/button.mjs";
+export { default as buttonGroup } from "./elements/buttonGroup.mjs";
+export { default as chip } from "./elements/chip.mjs";
+export { default as dropdown } from "./elements/dropdown.mjs";
+export { default as accordion } from "./elements/accordion.mjs";
+export { default as alert } from "./elements/alert.mjs";
+export { default as kbd } from "./elements/kbd.mjs";
+export { default as progress } from "./elements/progress.mjs";
+export { default as meter } from "./elements/meter.mjs";
+export { default as meterGroup } from "./elements/meterGroup.mjs";
+export { default as input } from "./forms/input.mjs";
+export { default as formGroup } from "./forms/formGroup.mjs";
+export { default as textarea } from "./forms/textarea.mjs";
+export { default as select } from "./forms/select.mjs";
+export { default as selectMenu } from "./forms/selectMenu.mjs";
+export { default as radioGroup } from "./forms/radioGroup.mjs";
+export { default as radio } from "./forms/radio.mjs";
+export { default as checkbox } from "./forms/checkbox.mjs";
+export { default as toggle } from "./forms/toggle.mjs";
+export { default as range } from "./forms/range.mjs";
+export { default as card } from "./layout/card.mjs";
+export { default as container } from "./layout/container.mjs";
+export { default as skeleton } from "./layout/skeleton.mjs";
+export { default as divider } from "./layout/divider.mjs";
+export { default as verticalNavigation } from "./navigation/verticalNavigation.mjs";
+export { default as commandPalette } from "./navigation/commandPalette.mjs";
+export { default as pagination } from "./navigation/pagination.mjs";
+export { default as tabs } from "./navigation/tabs.mjs";
+export { default as breadcrumb } from "./navigation/breadcrumb.mjs";
+export { default as modal } from "./overlays/modal.mjs";
+export { default as slideover } from "./overlays/slideover.mjs";
+export { default as tooltip } from "./overlays/tooltip.mjs";
+export { default as popover } from "./overlays/popover.mjs";
+export { default as contextMenu } from "./overlays/contextMenu.mjs";
+export { default as notification } from "./overlays/notification.mjs";
+export { default as notifications } from "./overlays/notifications.mjs";

package/dist/runtime/ui.config/layout/card.d.ts

@@ -0,0 +1,24 @@
+declare const _default: {
+    base: string;
+    background: string;
+    divide: string;
+    ring: string;
+    rounded: string;
+    shadow: string;
+    body: {
+        base: string;
+        background: string;
+        padding: string;
+    };
+    header: {
+        base: string;
+        background: string;
+        padding: string;
+    };
+    footer: {
+        base: string;
+        background: string;
+        padding: string;
+    };
+};
+export default _default;

package/dist/runtime/ui.config/layout/card.mjs

@@ -0,0 +1,23 @@
+export default {
+  base: "overflow-hidden",
+  background: "bg-white dark:bg-gray-900",
+  divide: "divide-y divide-gray-200 dark:divide-gray-800",
+  ring: "ring-1 ring-gray-200 dark:ring-gray-800",
+  rounded: "rounded-lg",
+  shadow: "shadow",
+  body: {
+    base: "",
+    background: "",
+    padding: "px-4 py-5 sm:p-6"
+  },
+  header: {
+    base: "",
+    background: "",
+    padding: "px-4 py-5 sm:px-6"
+  },
+  footer: {
+    base: "",
+    background: "",
+    padding: "px-4 py-4 sm:px-6"
+  }
+};

package/dist/runtime/ui.config/layout/container.d.ts

@@ -0,0 +1,6 @@
+declare const _default: {
+    base: string;
+    padding: string;
+    constrained: string;
+};
+export default _default;

package/dist/runtime/ui.config/layout/container.mjs

@@ -0,0 +1,5 @@
+export default {
+  base: "mx-auto",
+  padding: "px-4 sm:px-6 lg:px-8",
+  constrained: "max-w-7xl"
+};

package/dist/runtime/ui.config/layout/divider.d.ts

@@ -0,0 +1,35 @@
+declare const _default: {
+    wrapper: {
+        base: string;
+        horizontal: string;
+        vertical: string;
+    };
+    container: {
+        base: string;
+        horizontal: string;
+        vertical: string;
+    };
+    border: {
+        base: string;
+        horizontal: string;
+        vertical: string;
+        size: {
+            horizontal: string;
+            vertical: string;
+        };
+        type: {
+            solid: string;
+            dotted: string;
+            dashed: string;
+        };
+    };
+    icon: {
+        base: string;
+    };
+    avatar: {
+        base: string;
+        size: "2xs";
+    };
+    label: string;
+};
+export default _default;

package/dist/runtime/ui.config/layout/divider.mjs

@@ -0,0 +1,34 @@
+export default {
+  wrapper: {
+    base: "flex items-center align-center text-center w-full",
+    horizontal: "flex-row",
+    vertical: "flex-col"
+  },
+  container: {
+    base: "font-medium text-gray-700 dark:text-gray-200 flex",
+    horizontal: "mx-3 whitespace-nowrap",
+    vertical: "my-2"
+  },
+  border: {
+    base: "flex border-gray-200 dark:border-gray-800",
+    horizontal: "w-full",
+    vertical: "h-full",
+    size: {
+      horizontal: "border-t",
+      vertical: "border-s"
+    },
+    type: {
+      solid: "border-solid",
+      dotted: "border-dotted",
+      dashed: "border-dashed"
+    }
+  },
+  icon: {
+    base: "flex-shrink-0 w-5 h-5"
+  },
+  avatar: {
+    base: "flex-shrink-0",
+    size: "2xs"
+  },
+  label: "text-sm"
+};

package/dist/runtime/ui.config/layout/skeleton.d.ts

@@ -0,0 +1,6 @@
+declare const _default: {
+    base: string;
+    background: string;
+    rounded: string;
+};
+export default _default;

package/dist/runtime/ui.config/layout/skeleton.mjs

@@ -0,0 +1,5 @@
+export default {
+  base: "animate-pulse",
+  background: "bg-gray-100 dark:bg-gray-800",
+  rounded: "rounded-md"
+};

package/dist/runtime/ui.config/navigation/breadcrumb.d.ts

@@ -0,0 +1,20 @@
+declare const _default: {
+    wrapper: string;
+    ol: string;
+    li: string;
+    base: string;
+    icon: {
+        base: string;
+        active: string;
+        inactive: string;
+    };
+    divider: {
+        base: string;
+    };
+    active: string;
+    inactive: string;
+    default: {
+        divider: string;
+    };
+};
+export default _default;

package/dist/runtime/ui.config/navigation/breadcrumb.mjs

@@ -0,0 +1,19 @@
+export default {
+  wrapper: "relative",
+  ol: "flex items-center gap-x-1.5",
+  li: "flex items-center gap-x-1.5 text-gray-500 dark:text-gray-400 text-sm",
+  base: "flex items-center gap-x-1.5 group font-semibold",
+  icon: {
+    base: "flex-shrink-0 w-4 h-4",
+    active: "",
+    inactive: ""
+  },
+  divider: {
+    base: "flex-shrink-0 w-5 h-5"
+  },
+  active: "text-primary-500 dark:text-primary-400",
+  inactive: " hover:text-gray-700 dark:hover:text-gray-200",
+  default: {
+    divider: "i-heroicons-chevron-right-20-solid rtl:i-heroicons-chevron-left-20-solid"
+  }
+};

package/dist/runtime/ui.config/navigation/commandPalette.d.ts

@@ -0,0 +1,72 @@
+declare const _default: {
+    wrapper: string;
+    container: string;
+    input: {
+        wrapper: string;
+        base: string;
+        padding: string;
+        height: string;
+        size: string;
+        icon: {
+            base: string;
+            loading: string;
+            size: string;
+            padding: string;
+        };
+        closeButton: {
+            base: string;
+            padding: string;
+        };
+    };
+    emptyState: {
+        wrapper: string;
+        label: string;
+        queryLabel: string;
+        icon: string;
+    };
+    group: {
+        wrapper: string;
+        label: string;
+        container: string;
+        command: {
+            base: string;
+            active: string;
+            inactive: string;
+            label: string;
+            prefix: string;
+            suffix: string;
+            container: string;
+            icon: {
+                base: string;
+                active: string;
+                inactive: string;
+            };
+            selectedIcon: {
+                base: string;
+            };
+            avatar: {
+                base: string;
+                size: "3xs";
+            };
+            chip: {
+                base: string;
+            };
+            disabled: string;
+            shortcuts: string;
+        };
+        active: string;
+        inactive: string;
+    };
+    default: {
+        icon: string;
+        loadingIcon: string;
+        emptyState: {
+            icon: string;
+            label: string;
+            queryLabel: string;
+        };
+        closeButton: null;
+        selectedIcon: string;
+    };
+};
+export default _default;

package/dist/runtime/ui.config/navigation/commandPalette.mjs

@@ -0,0 +1,71 @@
+export default {
+  wrapper: "flex flex-col flex-1 min-h-0 divide-y divide-gray-100 dark:divide-gray-800",
+  container: "relative flex-1 overflow-y-auto divide-y divide-gray-100 dark:divide-gray-800 scroll-py-2",
+  input: {
+    wrapper: "relative flex items-center",
+    base: "w-full placeholder-gray-400 dark:placeholder-gray-500 bg-transparent border-0 text-gray-900 dark:text-white focus:ring-0 focus:outline-none",
+    padding: "px-4",
+    height: "h-12",
+    size: "sm:text-sm",
+    icon: {
+      base: "pointer-events-none absolute start-4 text-gray-400 dark:text-gray-500",
+      loading: "animate-spin",
+      size: "h-4 w-4",
+      padding: "ps-10"
+    },
+    closeButton: {
+      base: "absolute end-4",
+      padding: "pe-10"
+    }
+  },
+  emptyState: {
+    wrapper: "flex flex-col items-center justify-center flex-1 px-6 py-14 sm:px-14",
+    label: "text-sm text-center text-gray-900 dark:text-white",
+    queryLabel: "text-sm text-center text-gray-900 dark:text-white",
+    icon: "w-6 h-6 mx-auto text-gray-400 dark:text-gray-500 mb-4"
+  },
+  group: {
+    wrapper: "p-2",
+    label: "px-2 my-2 text-xs font-semibold text-gray-900 dark:text-white",
+    container: "text-sm text-gray-700 dark:text-gray-200",
+    command: {
+      base: "flex justify-between select-none items-center rounded-md px-2 py-1.5 gap-2 relative",
+      active: "bg-gray-100 dark:bg-gray-800 text-gray-900 dark:text-white",
+      inactive: "",
+      label: "flex items-center gap-1.5 min-w-0",
+      prefix: "text-gray-400 dark:text-gray-500",
+      suffix: "text-gray-400 dark:text-gray-500",
+      container: "flex items-center gap-2 min-w-0",
+      icon: {
+        base: "flex-shrink-0 w-4 h-4",
+        active: "text-gray-900 dark:text-white",
+        inactive: "text-gray-400 dark:text-gray-500"
+      },
+      selectedIcon: {
+        base: "h-4 w-4 text-gray-900 dark:text-white flex-shrink-0"
+      },
+      avatar: {
+        base: "flex-shrink-0",
+        size: "3xs"
+      },
+      chip: {
+        base: "flex-shrink-0 w-2 h-2 mx-1 rounded-full"
+      },
+      disabled: "opacity-50",
+      shortcuts: "hidden md:inline-flex flex-shrink-0 gap-0.5"
+    },
+    active: "flex-shrink-0 text-gray-500 dark:text-gray-400",
+    inactive: "flex-shrink-0 text-gray-500 dark:text-gray-400"
+  },
+  default: {
+    icon: "i-heroicons-magnifying-glass-20-solid",
+    loadingIcon: "i-heroicons-arrow-path-20-solid",
+    emptyState: {
+      icon: "i-heroicons-magnifying-glass-20-solid",
+      label: "We couldn't find any items.",
+      queryLabel: "We couldn't find any items with that term. Please try again."
+    },
+    closeButton: null,
+    selectedIcon: "i-heroicons-check-20-solid"
+  }
+};

package/dist/runtime/ui.config/navigation/pagination.d.ts

@@ -0,0 +1,35 @@
+declare const _default: {
+    wrapper: string;
+    base: string;
+    rounded: string;
+    default: {
+        size: string;
+        activeButton: {
+            color: "primary";
+        };
+        inactiveButton: {
+            color: "white";
+        };
+        firstButton: {
+            color: "white";
+            class: string;
+            icon: string;
+        };
+        lastButton: {
+            color: "white";
+            class: string;
+            icon: string;
+        };
+        prevButton: {
+            color: "white";
+            class: string;
+            icon: string;
+        };
+        nextButton: {
+            color: "white";
+            class: string;
+            icon: string;
+        };
+    };
+};
+export default _default;

package/dist/runtime/ui.config/navigation/pagination.mjs

@@ -0,0 +1,34 @@
+export default {
+  wrapper: "flex items-center -space-x-px",
+  base: "",
+  rounded: "first:rounded-s-md last:rounded-e-md",
+  default: {
+    size: "sm",
+    activeButton: {
+      color: "primary"
+    },
+    inactiveButton: {
+      color: "white"
+    },
+    firstButton: {
+      color: "white",
+      class: "rtl:[&_span:first-child]:rotate-180",
+      icon: "i-heroicons-chevron-double-left-20-solid"
+    },
+    lastButton: {
+      color: "white",
+      class: "rtl:[&_span:last-child]:rotate-180",
+      icon: "i-heroicons-chevron-double-right-20-solid"
+    },
+    prevButton: {
+      color: "white",
+      class: "rtl:[&_span:first-child]:rotate-180",
+      icon: "i-heroicons-chevron-left-20-solid"
+    },
+    nextButton: {
+      color: "white",
+      class: "rtl:[&_span:last-child]:rotate-180",
+      icon: "i-heroicons-chevron-right-20-solid"
+    }
+  }
+};

package/dist/runtime/ui.config/navigation/tabs.d.ts

@@ -0,0 +1,34 @@
+declare const _default: {
+    wrapper: string;
+    container: string;
+    base: string;
+    list: {
+        base: string;
+        background: string;
+        rounded: string;
+        shadow: string;
+        padding: string;
+        height: string;
+        width: string;
+        marker: {
+            wrapper: string;
+            base: string;
+            background: string;
+            rounded: string;
+            shadow: string;
+        };
+        tab: {
+            base: string;
+            background: string;
+            active: string;
+            inactive: string;
+            height: string;
+            padding: string;
+            size: string;
+            font: string;
+            rounded: string;
+            shadow: string;
+        };
+    };
+};
+export default _default;

package/dist/runtime/ui.config/navigation/tabs.mjs

@@ -0,0 +1,33 @@
+export default {
+  wrapper: "relative space-y-2",
+  container: "relative w-full",
+  base: "focus:outline-none",
+  list: {
+    base: "relative",
+    background: "bg-gray-100 dark:bg-gray-800",
+    rounded: "rounded-lg",
+    shadow: "",
+    padding: "p-1",
+    height: "h-10",
+    width: "w-full",
+    marker: {
+      wrapper: "absolute top-[4px] left-[4px] duration-200 ease-out focus:outline-none",
+      base: "w-full h-full",
+      background: "bg-white dark:bg-gray-900",
+      rounded: "rounded-md",
+      shadow: "shadow-sm"
+    },
+    tab: {
+      base: "relative inline-flex items-center justify-center flex-shrink-0 w-full ui-focus-visible:outline-0 ui-focus-visible:ring-2 ui-focus-visible:ring-primary-500 dark:ui-focus-visible:ring-primary-400 ui-not-focus-visible:outline-none focus:outline-none disabled:cursor-not-allowed disabled:opacity-75 transition-colors duration-200 ease-out",
+      background: "",
+      active: "text-gray-900 dark:text-white",
+      inactive: "text-gray-500 dark:text-gray-400",
+      height: "h-8",
+      padding: "px-3",
+      size: "text-sm",
+      font: "font-medium",
+      rounded: "rounded-md",
+      shadow: ""
+    }
+  }
+};

package/dist/runtime/ui.config/navigation/verticalNavigation.d.ts

@@ -0,0 +1,28 @@
+declare const _default: {
+    wrapper: string;
+    base: string;
+    ring: string;
+    padding: string;
+    width: string;
+    rounded: string;
+    font: string;
+    size: string;
+    active: string;
+    inactive: string;
+    label: string;
+    icon: {
+        base: string;
+        active: string;
+        inactive: string;
+    };
+    avatar: {
+        base: string;
+        size: "3xs";
+    };
+    badge: {
+        base: string;
+        active: string;
+        inactive: string;
+    };
+};
+export default _default;

package/dist/runtime/ui.config/navigation/verticalNavigation.mjs

@@ -0,0 +1,27 @@
+export default {
+  wrapper: "relative",
+  base: "group relative flex items-center gap-2 focus:outline-none focus-visible:outline-none dark:focus-visible:outline-none focus-visible:before:ring-inset focus-visible:before:ring-1 focus-visible:before:ring-primary-500 dark:focus-visible:before:ring-primary-400 before:absolute before:inset-px before:rounded-md disabled:cursor-not-allowed disabled:opacity-75",
+  ring: "focus-visible:ring-inset focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400",
+  padding: "px-3 py-1.5",
+  width: "w-full",
+  rounded: "rounded-md",
+  font: "font-medium",
+  size: "text-sm",
+  active: "text-gray-900 dark:text-white before:bg-gray-100 dark:before:bg-gray-800",
+  inactive: "text-gray-500 dark:text-gray-400 hover:text-gray-900 dark:hover:text-white hover:before:bg-gray-50 dark:hover:before:bg-gray-800/50",
+  label: "truncate relative",
+  icon: {
+    base: "flex-shrink-0 w-4 h-4",
+    active: "text-gray-700 dark:text-gray-200",
+    inactive: "text-gray-400 dark:text-gray-500 group-hover:text-gray-700 dark:group-hover:text-gray-200"
+  },
+  avatar: {
+    base: "flex-shrink-0",
+    size: "3xs"
+  },
+  badge: {
+    base: "relative ms-auto inline-block py-0.5 px-2 text-xs rounded-md -me-1 -my-0.5",
+    active: "bg-white dark:bg-gray-900",
+    inactive: "bg-gray-100 dark:bg-gray-800 text-gray-900 dark:text-white group-hover:bg-white dark:group-hover:bg-gray-900"
+  }
+};

package/dist/runtime/ui.config/overlays/contextMenu.d.ts

@@ -0,0 +1,31 @@
+declare const _default: {
+    wrapper: string;
+    container: string;
+    width: string;
+    background: string;
+    shadow: string;
+    rounded: string;
+    ring: string;
+    base: string;
+    transition: {
+        enterActiveClass: string;
+        enterFromClass: string;
+        enterToClass: string;
+        leaveActiveClass: string;
+        leaveFromClass: string;
+        leaveToClass: string;
+    };
+    popper: {
+        placement: string;
+        scroll: boolean;
+    };
+    arrow: {
+        base: string;
+        ring: string;
+        rounded: string;
+        background: string;
+        shadow: string;
+        placement: string;
+    };
+};
+export default _default;

package/dist/runtime/ui.config/overlays/contextMenu.mjs

@@ -0,0 +1,25 @@
+import { arrow } from "../popper.mjs";
+export default {
+  wrapper: "relative",
+  container: "z-20 group",
+  width: "",
+  background: "bg-white dark:bg-gray-900",
+  shadow: "shadow-lg",
+  rounded: "rounded-md",
+  ring: "ring-1 ring-gray-200 dark:ring-gray-800",
+  base: "overflow-hidden focus:outline-none relative",
+  // Syntax for `<Transition>` component https://vuejs.org/guide/built-ins/transition.html#css-based-transitions
+  transition: {
+    enterActiveClass: "transition ease-out duration-200",
+    enterFromClass: "opacity-0 translate-y-1",
+    enterToClass: "opacity-100 translate-y-0",
+    leaveActiveClass: "transition ease-in duration-150",
+    leaveFromClass: "opacity-100 translate-y-0",
+    leaveToClass: "opacity-0 translate-y-1"
+  },
+  popper: {
+    placement: "bottom-start",
+    scroll: false
+  },
+  arrow
+};

package/dist/runtime/ui.config/overlays/modal.d.ts

@@ -0,0 +1,36 @@
+declare const _default: {
+    wrapper: string;
+    inner: string;
+    container: string;
+    padding: string;
+    margin: string;
+    base: string;
+    overlay: {
+        base: string;
+        background: string;
+        transition: {
+            enter: string;
+            enterFrom: string;
+            enterTo: string;
+            leave: string;
+            leaveFrom: string;
+            leaveTo: string;
+        };
+    };
+    background: string;
+    ring: string;
+    rounded: string;
+    shadow: string;
+    width: string;
+    height: string;
+    fullscreen: string;
+    transition: {
+        enter: string;
+        enterFrom: string;
+        enterTo: string;
+        leave: string;
+        leaveFrom: string;
+        leaveTo: string;
+    };
+};
+export default _default;