@brumaombra/ui-vintage 0.3.0 → 0.5.0

package/dist/lib/i18n.d.ts

@@ -0,0 +1,222 @@
+export declare const uiVintageMessages: {
+    readonly en: {
+        ui: {
+            common: {
+                empty: {
+                    title: string;
+                    description: string;
+                };
+                loading: {
+                    title: string;
+                    description: string;
+                };
+            };
+            buttons: {
+                all: string;
+                close: string;
+                cancel: string;
+                delete: string;
+                confirm: string;
+                filter: string;
+                search: string;
+                apply: string;
+                clear: string;
+                loading: string;
+                loadMore: string;
+                save: string;
+                update: string;
+                goBack: string;
+            };
+            theme: {
+                light: string;
+                dark: string;
+                auto: string;
+                title: string;
+                ariaLabel: string;
+            };
+            language: {
+                title: string;
+                ariaLabel: string;
+            };
+            footer: {
+                madeWith: string;
+                by: string;
+                allRightsReserved: string;
+            };
+            select: {
+                defaultPlaceholder: string;
+            };
+            messageDialog: {
+                error: string;
+                success: string;
+                info: string;
+                warning: string;
+            };
+        };
+    };
+    readonly it: {
+        ui: {
+            common: {
+                empty: {
+                    title: string;
+                    description: string;
+                };
+                loading: {
+                    title: string;
+                    description: string;
+                };
+            };
+            buttons: {
+                all: string;
+                close: string;
+                cancel: string;
+                delete: string;
+                confirm: string;
+                filter: string;
+                search: string;
+                apply: string;
+                clear: string;
+                loading: string;
+                loadMore: string;
+                save: string;
+                update: string;
+                goBack: string;
+            };
+            theme: {
+                light: string;
+                dark: string;
+                auto: string;
+                title: string;
+                ariaLabel: string;
+            };
+            language: {
+                title: string;
+                ariaLabel: string;
+            };
+            footer: {
+                madeWith: string;
+                by: string;
+                allRightsReserved: string;
+            };
+            select: {
+                defaultPlaceholder: string;
+            };
+            messageDialog: {
+                error: string;
+                success: string;
+                info: string;
+                warning: string;
+            };
+        };
+    };
+};
+export declare const getUiVintageMessagesForLocale: (locale: keyof typeof uiVintageMessages) => {
+    ui: {
+        common: {
+            empty: {
+                title: string;
+                description: string;
+            };
+            loading: {
+                title: string;
+                description: string;
+            };
+        };
+        buttons: {
+            all: string;
+            close: string;
+            cancel: string;
+            delete: string;
+            confirm: string;
+            filter: string;
+            search: string;
+            apply: string;
+            clear: string;
+            loading: string;
+            loadMore: string;
+            save: string;
+            update: string;
+            goBack: string;
+        };
+        theme: {
+            light: string;
+            dark: string;
+            auto: string;
+            title: string;
+            ariaLabel: string;
+        };
+        language: {
+            title: string;
+            ariaLabel: string;
+        };
+        footer: {
+            madeWith: string;
+            by: string;
+            allRightsReserved: string;
+        };
+        select: {
+            defaultPlaceholder: string;
+        };
+        messageDialog: {
+            error: string;
+            success: string;
+            info: string;
+            warning: string;
+        };
+    };
+} | {
+    ui: {
+        common: {
+            empty: {
+                title: string;
+                description: string;
+            };
+            loading: {
+                title: string;
+                description: string;
+            };
+        };
+        buttons: {
+            all: string;
+            close: string;
+            cancel: string;
+            delete: string;
+            confirm: string;
+            filter: string;
+            search: string;
+            apply: string;
+            clear: string;
+            loading: string;
+            loadMore: string;
+            save: string;
+            update: string;
+            goBack: string;
+        };
+        theme: {
+            light: string;
+            dark: string;
+            auto: string;
+            title: string;
+            ariaLabel: string;
+        };
+        language: {
+            title: string;
+            ariaLabel: string;
+        };
+        footer: {
+            madeWith: string;
+            by: string;
+            allRightsReserved: string;
+        };
+        select: {
+            defaultPlaceholder: string;
+        };
+        messageDialog: {
+            error: string;
+            success: string;
+            info: string;
+            warning: string;
+        };
+    };
+};
+export declare const getUiVintageRuntimeMessage: (path: string, fallback: string) => string;

package/dist/load-more-button.js

@@ -0,0 +1,5 @@
+import { _, _ as _2 } from "./LoadMoreButton.vue_vue_type_script_setup_true_lang-CGhFcsF-.js";
+export {
+  _ as LoadMoreButton,
+  _2 as default
+};

package/dist/loading-state-card.js

@@ -0,0 +1,5 @@
+import { _, _ as _2 } from "./LoadingStateCard.vue_vue_type_script_setup_true_lang-DwyQjtZ3.js";
+export {
+  _ as LoadingStateCard,
+  _2 as default
+};

package/dist/message-dialog.js

@@ -1,7 +1,9 @@
-import { reactive, render, h, markRaw, defineComponent, computed, openBlock, createBlock, unref, withCtx, createElementVNode, normalizeClass, resolveDynamicComponent, createVNode, createTextVNode, toDisplayString, createCommentVNode } from "vue";
-import { A as AE, $ as $o, T as TWr, H as HugeiconsIcon } from "./HugeiconsIcon.vue-BJ-_Wtmk.js";
-import { _ as _sfc_main$1, a as _sfc_main$2, b as _sfc_main$3, c as _sfc_main$4, d as _sfc_main$5, e as _sfc_main$6 } from "./AlertDialogTitle.vue_vue_type_script_setup_true_lang-Ca0g2mVz.js";
+import { reactive, render, h, markRaw, defineComponent, computed, openBlock, createBlock, unref, withCtx, createElementVNode, normalizeClass, createVNode, createTextVNode, toDisplayString, createCommentVNode } from "vue";
+import { H as HugeiconsIcon } from "./HugeiconsIcon.vue-By2RXWWz.js";
+import { A as AE, $ as $o, T as TWr } from "./index.min-CZ9FIOXr.js";
+import { _ as _sfc_main$1, a as _sfc_main$2, b as _sfc_main$3, c as _sfc_main$4, d as _sfc_main$5, e as _sfc_main$6 } from "./AlertDialogTitle.vue_vue_type_script_setup_true_lang-_UW48pv7.js";
 import { Button as _sfc_main$7 } from "./button.js";
+import { getUiVintageRuntimeMessage } from "./i18n.js";
 const messageDialogQueue = [];
 let nextMessageDialogId = 0;
 const DIALOG_CLOSE_DURATION_MS = 300;
@@ -87,10 +89,10 @@ const showMessageDialog = (options) => {
     enqueueMessageDialog({
       id: nextMessageDialogId += 1,
       options: {
-        type: options.type ?? "Info",
+        type: options.type ?? "info",
         title: options.title ?? "",
         message: options.message,
-        closeText: options.closeText ?? "Close",
+        closeText: options.closeText ?? "",
         icon: markIcon(options.icon),
         closeButtonIcon: markIcon(options.closeButtonIcon)
       },
@@ -104,25 +106,37 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "MessageDialog",
   setup(__props) {
     const currentDialog = computed(() => messageDialogState.current);
+    const resolvedTitle = computed(() => {
+      const current = currentDialog.value;
+      if (!current) return "";
+      return current.options.title || getUiVintageRuntimeMessage(`ui.messageDialog.${current.options.type}`, "");
+    });
+    const resolvedCloseText = computed(() => {
+      const current = currentDialog.value;
+      if (!current) return getUiVintageRuntimeMessage("ui.buttons.close", "Close");
+      return current.options.closeText || getUiVintageRuntimeMessage("ui.buttons.close", "Close");
+    });
     const defaultMessageIcon = computed(() => {
       const current = currentDialog.value;
       if (!current) return AE;
-      if (current.options.type === "Error") return $o;
-      if (current.options.type === "Success") return TWr;
+      if (current.options.type === "error" || current.options.type === "warning") return $o;
+      if (current.options.type === "success") return TWr;
       return AE;
     });
     const messageIconClasses = computed(() => {
       const current = currentDialog.value;
       if (!current) return "border-[var(--border)] bg-[var(--bg-surface-light)] dark:bg-[var(--bg-surface-dark)]";
-      if (current.options.type === "Error") return "border-red-200 bg-red-50 dark:border-red-900/50 dark:bg-red-950/30";
-      if (current.options.type === "Success") return "border-green-200 bg-green-50 dark:border-green-900/50 dark:bg-green-950/30";
+      if (current.options.type === "error") return "border-red-200 bg-red-50 dark:border-red-900/50 dark:bg-red-950/30";
+      if (current.options.type === "warning") return "border-amber-200 bg-amber-50 dark:border-amber-900/50 dark:bg-amber-950/30";
+      if (current.options.type === "success") return "border-green-200 bg-green-50 dark:border-green-900/50 dark:bg-green-950/30";
       return "border-[var(--border)] bg-[var(--bg-surface-light)] dark:bg-[var(--bg-surface-dark)]";
     });
     const messageGlyphClasses = computed(() => {
       const current = currentDialog.value;
       if (!current) return "text-blue-600";
-      if (current.options.type === "Error") return "text-red-600";
-      if (current.options.type === "Success") return "text-green-600";
+      if (current.options.type === "error") return "text-red-600";
+      if (current.options.type === "warning") return "text-amber-600";
+      if (current.options.type === "success") return "text-green-600";
       return "text-blue-600";
     });
     const handleOpenChange = (open) => {
@@ -143,11 +157,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   createElementVNode("div", {
                     class: normalizeClass(["flex size-12 shrink-0 self-center items-center justify-center rounded border sm:size-10 sm:self-start", messageIconClasses.value])
                   }, [
-                    currentDialog.value.options.icon ? (openBlock(), createBlock(resolveDynamicComponent(currentDialog.value.options.icon), {
+                    currentDialog.value.options.icon ? (openBlock(), createBlock(unref(HugeiconsIcon), {
                       key: 0,
+                      icon: currentDialog.value.options.icon,
                       "stroke-width": 1.8,
                       class: normalizeClass(["size-6", messageGlyphClasses.value])
-                    }, null, 8, ["class"])) : (openBlock(), createBlock(unref(HugeiconsIcon), {
+                    }, null, 8, ["icon", "class"])) : (openBlock(), createBlock(unref(HugeiconsIcon), {
                       key: 1,
                       icon: defaultMessageIcon.value,
                       "stroke-width": 1.8,
@@ -158,7 +173,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                     default: withCtx(() => [
                       createVNode(unref(_sfc_main$4), null, {
                         default: withCtx(() => [
-                          createTextVNode(toDisplayString(currentDialog.value.options.title), 1)
+                          createTextVNode(toDisplayString(resolvedTitle.value), 1)
                         ]),
                         _: 1
                       }),
@@ -176,16 +191,17 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               createVNode(unref(_sfc_main$6), { class: "items-end" }, {
                 default: withCtx(() => [
                   createVNode(unref(_sfc_main$7), {
-                    variant: "outline",
+                    variant: "secondary",
                     disabled: unref(messageDialogState).busy,
                     onClick: unref(resolveActiveMessageDialog)
                   }, {
                     default: withCtx(() => [
-                      currentDialog.value.options.closeButtonIcon ? (openBlock(), createBlock(resolveDynamicComponent(currentDialog.value.options.closeButtonIcon), {
+                      currentDialog.value.options.closeButtonIcon ? (openBlock(), createBlock(unref(HugeiconsIcon), {
                         key: 0,
+                        icon: currentDialog.value.options.closeButtonIcon,
                         class: "size-4"
-                      })) : createCommentVNode("", true),
-                      createTextVNode(" " + toDisplayString(currentDialog.value.options.closeText), 1)
+                      }, null, 8, ["icon"])) : createCommentVNode("", true),
+                      createTextVNode(" " + toDisplayString(resolvedCloseText.value), 1)
                     ]),
                     _: 1
                   }, 8, ["disabled", "onClick"])

package/dist/message-toast.js

@@ -0,0 +1,103 @@
+import { reactive, render, h } from "vue";
+const TOAST_CLOSE_DURATION_MS = 300;
+const DEFAULT_TOAST_DURATION_MS = 5e3;
+const MESSAGE_TOAST_ROOT_ID = "ui-vintage-message-toast-root";
+let dismissTimer = null;
+let clearTimer = null;
+let messageToastMountPromise = null;
+let openFrame = null;
+let activeToastId = 0;
+const messageToastState = reactive({
+  current: null,
+  isOpen: false
+});
+const ensureMessageToastMounted = () => {
+  if (typeof document === "undefined") {
+    return Promise.resolve();
+  }
+  const existingRoot = document.getElementById(MESSAGE_TOAST_ROOT_ID);
+  if (existingRoot) {
+    return Promise.resolve();
+  }
+  if (messageToastMountPromise) {
+    return messageToastMountPromise;
+  }
+  messageToastMountPromise = (async () => {
+    const { default: MessageToast } = await import("./MessageToast-uKrMyOZf.js");
+    if (document.getElementById(MESSAGE_TOAST_ROOT_ID)) {
+      return;
+    }
+    const container = document.createElement("div");
+    container.id = MESSAGE_TOAST_ROOT_ID;
+    document.body.appendChild(container);
+    render(h(MessageToast), container);
+  })().finally(() => {
+    messageToastMountPromise = null;
+  });
+  return messageToastMountPromise;
+};
+const clearMessageToastTimers = () => {
+  if (dismissTimer) {
+    clearTimeout(dismissTimer);
+    dismissTimer = null;
+  }
+  if (clearTimer) {
+    clearTimeout(clearTimer);
+    clearTimer = null;
+  }
+  if (openFrame !== null && typeof cancelAnimationFrame !== "undefined") {
+    cancelAnimationFrame(openFrame);
+    openFrame = null;
+  }
+};
+const clearCurrentMessageToast = () => {
+  messageToastState.current = null;
+};
+const scheduleCloseMessageToast = () => {
+  if (!messageToastState.current || !messageToastState.isOpen) {
+    return;
+  }
+  messageToastState.isOpen = false;
+  clearTimer = setTimeout(() => {
+    clearTimer = null;
+    clearCurrentMessageToast();
+  }, TOAST_CLOSE_DURATION_MS);
+};
+const closeMessageToast = () => {
+  clearMessageToastTimers();
+  scheduleCloseMessageToast();
+};
+const showMessageToast = (options) => {
+  clearMessageToastTimers();
+  activeToastId += 1;
+  const toastId = activeToastId;
+  const duration = options.duration ?? DEFAULT_TOAST_DURATION_MS;
+  messageToastState.current = {
+    message: options.message,
+    type: options.type ?? "success"
+  };
+  messageToastState.isOpen = false;
+  void ensureMessageToastMounted().then(() => {
+    if (toastId !== activeToastId || !messageToastState.current || typeof requestAnimationFrame === "undefined") {
+      return;
+    }
+    openFrame = requestAnimationFrame(() => {
+      openFrame = null;
+      if (toastId !== activeToastId || !messageToastState.current) {
+        return;
+      }
+      messageToastState.isOpen = true;
+      if (duration > 0) {
+        dismissTimer = setTimeout(() => {
+          dismissTimer = null;
+          scheduleCloseMessageToast();
+        }, duration);
+      }
+    });
+  });
+};
+export {
+  closeMessageToast,
+  messageToastState,
+  showMessageToast
+};

package/dist/native-select.js

@@ -1,4 +1,4 @@
-import { _, a } from "./NativeSelectOption.vue_vue_type_script_setup_true_lang-Ce5VmA0n.js";
+import { _, a } from "./NativeSelectOption.vue_vue_type_script_setup_true_lang-CNcUI9Yh.js";
 import { defineComponent, openBlock, createElementBlock, normalizeClass, unref, renderSlot } from "vue";
 import { c as cn } from "./utils-Bz4m9VPB.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/nullish-D3tMkl6i.js

@@ -0,0 +1,6 @@
+function isNullish(value) {
+  return value === null || value === void 0;
+}
+export {
+  isNullish as i
+};

package/dist/page-header.js

@@ -0,0 +1,57 @@
+import { defineComponent, useSlots, computed, Comment, Text, openBlock, createElementBlock, createBlock, resolveDynamicComponent, normalizeClass, withCtx, createTextVNode, toDisplayString, renderSlot, createCommentVNode } from "vue";
+const _hoisted_1 = { class: "flex flex-col gap-3 mb-6 sm:flex-row sm:justify-between sm:items-center sm:min-h-12 sm:gap-0" };
+const _hoisted_2 = {
+  key: 0,
+  class: "w-full sm:w-auto"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "PageHeader",
+  props: {
+    title: { type: String, required: true },
+    headingLevel: { type: Number, default: 1 },
+    size: { type: String, default: "large", validator: (value) => ["small", "medium", "large"].includes(String(value)) }
+  },
+  setup(__props) {
+    const props = __props;
+    const slots = useSlots();
+    const hasSlotContent = computed(() => {
+      if (!slots.default) return false;
+      return slots.default({}).some((vnode) => {
+        if (vnode.type === Comment) return false;
+        if (vnode.type === Text && typeof vnode.children === "string" && !vnode.children.trim()) return false;
+        return true;
+      });
+    });
+    const getSizeClasses = (size) => {
+      const baseClasses = "font-bold text-[var(--text-primary-light)] dark:text-[var(--text-primary-dark)]";
+      switch (size) {
+        case "small":
+          return `${baseClasses} text-base md:text-xl`;
+        case "medium":
+          return `${baseClasses} text-lg md:text-2xl`;
+        case "large":
+        default:
+          return `${baseClasses} text-xl md:text-3xl`;
+      }
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        (openBlock(), createBlock(resolveDynamicComponent(`h${__props.headingLevel}`), {
+          class: normalizeClass(getSizeClasses(props.size))
+        }, {
+          default: withCtx(() => [
+            createTextVNode(toDisplayString(props.title), 1)
+          ]),
+          _: 1
+        }, 8, ["class"])),
+        hasSlotContent.value ? (openBlock(), createElementBlock("div", _hoisted_2, [
+          renderSlot(_ctx.$slots, "default")
+        ])) : createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as PageHeader,
+  _sfc_main as default
+};

package/dist/popover.js

@@ -1,8 +1,8 @@
-import { i as injectPopoverRootContext } from "./PopoverTrigger.vue_vue_type_script_setup_true_lang-DFZJvU_P.js";
-import { _, b, a } from "./PopoverTrigger.vue_vue_type_script_setup_true_lang-DFZJvU_P.js";
+import { i as injectPopoverRootContext } from "./PopoverTrigger.vue_vue_type_script_setup_true_lang-Cf33q_yT.js";
+import { _, b, a } from "./PopoverTrigger.vue_vue_type_script_setup_true_lang-Cf33q_yT.js";
 import { defineComponent, onBeforeMount, onUnmounted, openBlock, createBlock, unref, normalizeProps, guardReactiveProps, withCtx, renderSlot, mergeProps } from "vue";
-import { u as useForwardExpose } from "./useForwardExpose-BiRQH8eO.js";
-import { P as PopperAnchor_default } from "./PopperContent-h-thLTz8.js";
+import { u as useForwardExpose } from "./useForwardExpose-BcX3VRdS.js";
+import { P as PopperAnchor_default } from "./PopperContent-DUJ8a4i0.js";
 var PopoverAnchor_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
   __name: "PopoverAnchor",
   props: {

package/dist/progress-component.js

@@ -0,0 +1,51 @@
+import { defineComponent, openBlock, createElementBlock, createElementVNode, toDisplayString, createVNode, unref, createCommentVNode } from "vue";
+import { _ as _sfc_main$1 } from "./Progress.vue_vue_type_script_setup_true_lang-BDJfyW-d.js";
+const _hoisted_1 = { class: "space-y-3" };
+const _hoisted_2 = { class: "flex items-center justify-between" };
+const _hoisted_3 = { class: "text-sm font-medium text-[var(--text-primary-light)] dark:text-[var(--text-primary-dark)]" };
+const _hoisted_4 = { class: "text-sm font-medium text-[var(--text-primary-light)] dark:text-[var(--text-primary-dark)]" };
+const _hoisted_5 = {
+  key: 0,
+  class: "flex items-center justify-between text-xs"
+};
+const _hoisted_6 = {
+  key: 0,
+  class: "text-[var(--text-secondary-light)] dark:text-[var(--text-secondary-dark)]"
+};
+const _hoisted_7 = {
+  key: 1,
+  class: "text-[var(--text-secondary-light)] dark:text-[var(--text-secondary-dark)]"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "ProgressComponent",
+  props: {
+    title: { type: String, required: true },
+    bottomLeftLabel: { type: String, default: "" },
+    bottomRightLabel: { type: String, default: "" },
+    value: { type: Number, required: true },
+    max: { type: Number, required: true }
+  },
+  setup(__props) {
+    const props = __props;
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", _hoisted_2, [
+          createElementVNode("span", _hoisted_3, toDisplayString(props.title), 1),
+          createElementVNode("span", _hoisted_4, toDisplayString(props.value) + " / " + toDisplayString(props.max), 1)
+        ]),
+        createVNode(unref(_sfc_main$1), {
+          "model-value": props.value,
+          max: props.max
+        }, null, 8, ["model-value", "max"]),
+        props.bottomLeftLabel || props.bottomRightLabel ? (openBlock(), createElementBlock("div", _hoisted_5, [
+          props.bottomLeftLabel ? (openBlock(), createElementBlock("span", _hoisted_6, toDisplayString(props.bottomLeftLabel), 1)) : createCommentVNode("", true),
+          props.bottomRightLabel ? (openBlock(), createElementBlock("span", _hoisted_7, toDisplayString(props.bottomRightLabel), 1)) : createCommentVNode("", true)
+        ])) : createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as ProgressComponent,
+  _sfc_main as default
+};

package/dist/progress.js

@@ -0,0 +1,4 @@
+import { _ } from "./Progress.vue_vue_type_script_setup_true_lang-BDJfyW-d.js";
+export {
+  _ as Progress
+};