@chelone/vue 0.0.0-stage → 0.1.0

package/dist/components/admin/csv-import/csv-import.vue.js

@@ -0,0 +1,448 @@
+import { defineComponent, onScopeDispose, provide, ref, computed, openBlock, createElementBlock, Fragment, createVNode, withCtx, renderSlot, unref, createTextVNode, toDisplayString, createElementVNode, withModifiers, createCommentVNode, renderList, createBlock } from "vue";
+import { createCsvImportController, downloadCSV, recordsToCSV, csvErrorRows, parseCsvWith } from "@chelone/core";
+import Papa from "papaparse";
+import { useCheloneContext } from "../../../context.js";
+import { useTranslate } from "../../../i18n/use-translate.js";
+import { useResourceContext } from "../../../resource-context.js";
+import { useMicroStore } from "../../../store/use-micro-store.js";
+import _sfc_main$4 from "../feedback/linear-progress.vue.js";
+import _sfc_main$1 from "../../ui/button.vue.js";
+import _sfc_main$3 from "../../ui/native-select.vue.js";
+import _sfc_main$2 from "../../ui/sheet.vue.js";
+import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from "../../ui/table.js";
+import { UploadIcon } from "./upload-icon.js";
+import { CsvImportKey } from "./use-csv-import.js";
+const _hoisted_1 = { class: "min-h-32" };
+const _hoisted_2 = {
+  key: 0,
+  class: "flex flex-col gap-3"
+};
+const _hoisted_3 = ["data-active"];
+const _hoisted_4 = {
+  key: 0,
+  class: "font-medium"
+};
+const _hoisted_5 = {
+  key: 0,
+  role: "alert",
+  class: "text-sm text-destructive"
+};
+const _hoisted_6 = {
+  key: 1,
+  role: "status",
+  class: "text-sm text-destructive"
+};
+const _hoisted_7 = {
+  key: 2,
+  role: "alert",
+  class: "text-sm text-destructive"
+};
+const _hoisted_8 = {
+  key: 3,
+  class: "text-sm"
+};
+const _hoisted_9 = {
+  key: 1,
+  class: "flex flex-col gap-3"
+};
+const _hoisted_10 = ["for"];
+const _hoisted_11 = {
+  key: 0,
+  class: "ml-1 text-destructive",
+  "aria-hidden": "true"
+};
+const _hoisted_12 = {
+  key: 0,
+  role: "status",
+  class: "text-sm text-destructive"
+};
+const _hoisted_13 = {
+  key: 2,
+  class: "flex flex-col gap-3"
+};
+const _hoisted_14 = { class: "text-sm" };
+const _hoisted_15 = { class: "max-h-72 overflow-auto" };
+const _hoisted_16 = { key: 3 };
+const _hoisted_17 = {
+  key: 0,
+  role: "alert",
+  class: "text-sm text-destructive"
+};
+const _hoisted_18 = {
+  key: 2,
+  class: "flex flex-col gap-3 text-sm"
+};
+const _hoisted_19 = { class: "font-medium" };
+const _hoisted_20 = { class: "flex justify-end gap-2" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "csv-import",
+  props: {
+    schema: {},
+    fields: {},
+    requiredFields: {},
+    mapping: {},
+    transform: { type: Function },
+    batchSize: {},
+    label: {},
+    resource: {},
+    onComplete: { type: Function },
+    onError: { type: Function }
+  },
+  setup(__props) {
+    const PREVIEW_ROWS = 50;
+    const REPLACEMENT_CHAR = "�";
+    const props = __props;
+    const translate = useTranslate();
+    const { dataProvider } = useCheloneContext();
+    const resource = useResourceContext(props);
+    if (!resource) {
+      throw new Error(
+        "<CsvImport> needs a resource: pass `resource` or render it inside a resource context"
+      );
+    }
+    const controller = createCsvImportController({
+      dataProvider,
+      resource,
+      ...props.schema && { schema: props.schema },
+      ...props.fields && { fields: props.fields },
+      ...props.requiredFields && { requiredFields: props.requiredFields },
+      ...props.mapping && { mapping: props.mapping },
+      ...props.batchSize !== void 0 && { batchSize: props.batchSize },
+      transform: (row, index) => props.transform?.(row, index) ?? row,
+      onComplete: (report) => props.onComplete?.(report),
+      onError: (error) => props.onError?.(error)
+    });
+    onScopeDispose(() => controller.reset());
+    const state = useMicroStore(controller.store);
+    const context = {
+      state,
+      loadParsed: controller.loadParsed,
+      setMapping: controller.setMapping,
+      next: controller.next,
+      back: controller.back,
+      cancel: controller.cancel,
+      reset: controller.reset
+    };
+    provide(CsvImportKey, context);
+    const open = ref(false);
+    const notice = ref(null);
+    function onOpenChange(next) {
+      open.value = next;
+      if (!next) {
+        controller.reset();
+        notice.value = null;
+      }
+    }
+    function onClose() {
+      controller.reset();
+      notice.value = null;
+      open.value = false;
+    }
+    const busy = computed(() => state.value.status === "running");
+    const titles = computed(() => ({
+      upload: translate("ra.csv_import.step.upload", { _: "Upload" }),
+      map: translate("ra.csv_import.step.map", { _: "Map columns" }),
+      preview: translate("ra.csv_import.step.preview", { _: "Preview" }),
+      commit: translate("ra.csv_import.step.commit", { _: "Importing" })
+    }));
+    const nextDisabled = computed(() => {
+      const { step, rows, parseError, requiredFields, mapping, validations } = state.value;
+      return busy.value || step === "upload" && (rows.length === 0 || parseError !== null) || step === "map" && !requiredFields.every((f) => mapping[f]) || step === "preview" && !validations.some((v) => v.ok);
+    });
+    const readText = (file) => new Promise((resolve, reject) => {
+      const reader = new FileReader();
+      reader.onload = () => resolve(String(reader.result));
+      reader.onerror = () => reject(reader.error ?? new Error("Read failed"));
+      reader.readAsText(file);
+    });
+    async function loadFile(file) {
+      try {
+        const text = await readText(file);
+        notice.value = text.includes(REPLACEMENT_CHAR) ? "not_utf8" : null;
+        controller.loadParsed(parseCsvWith(Papa, text), file.name);
+      } catch (thrown) {
+        notice.value = null;
+        controller.loadParsed(
+          {
+            headers: [],
+            rows: [],
+            errors: [
+              {
+                code: "ReadError",
+                message: thrown instanceof Error ? thrown.message : String(thrown)
+              }
+            ]
+          },
+          file.name
+        );
+      }
+    }
+    const fileInput = ref(null);
+    const dragging = ref(false);
+    function onFileChange(event) {
+      const input = event.target;
+      const file = input.files?.[0];
+      if (file) void loadFile(file);
+      input.value = "";
+    }
+    const isCsv = (file) => /\.csv$/i.test(file.name) || file.type === "text/csv";
+    function onDrop(event) {
+      dragging.value = false;
+      const file = event.dataTransfer?.files?.[0];
+      if (!file) return;
+      if (isCsv(file)) void loadFile(file);
+      else notice.value = "wrong_file";
+    }
+    const unmapped = computed(
+      () => state.value.requiredFields.some((f) => !state.value.mapping[f])
+    );
+    const headerOptions = computed(() => [
+      {
+        value: "",
+        label: translate("ra.csv_import.unmapped", { _: "Not mapped" })
+      },
+      ...state.value.headers.map((header) => ({ value: header, label: header }))
+    ]);
+    const cell = (value) => value == null ? "" : typeof value === "object" ? JSON.stringify(value) : String(value);
+    const validCount = computed(
+      () => state.value.validations.filter((v) => v.ok).length
+    );
+    const percent = (s) => s.progress.total === 0 ? 0 : Math.round(s.progress.current / s.progress.total * 100);
+    function downloadErrors() {
+      const report = state.value.report;
+      if (!report) return;
+      downloadCSV(
+        // recordsToCSV wants an id on each record; an error row needs none to serialize.
+        recordsToCSV(csvErrorRows(report)),
+        "import-errors"
+      );
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock(Fragment, null, [
+        createVNode(_sfc_main$1, {
+          type: "button",
+          variant: "outline",
+          size: "sm",
+          onClick: _cache[0] || (_cache[0] = ($event) => open.value = true)
+        }, {
+          default: withCtx(() => [
+            renderSlot(_ctx.$slots, "icon", {}, () => [
+              createVNode(unref(UploadIcon))
+            ]),
+            createTextVNode(" " + toDisplayString(__props.label ?? unref(translate)("ra.csv_import.import", { _: "Import" })), 1)
+          ]),
+          _: 3
+        }),
+        createVNode(_sfc_main$2, {
+          open: open.value,
+          side: "right",
+          class: "w-full sm:max-w-2xl",
+          title: titles.value[unref(state).step],
+          "onUpdate:open": onOpenChange
+        }, {
+          footer: withCtx(() => [
+            createElementVNode("div", _hoisted_20, [
+              unref(state).step === "commit" ? (openBlock(), createBlock(_sfc_main$1, {
+                key: 0,
+                type: "button",
+                disabled: busy.value,
+                onClick: onClose
+              }, {
+                default: withCtx(() => [
+                  createTextVNode(toDisplayString(unref(translate)("ra.csv_import.close", { _: "Close" })), 1)
+                ]),
+                _: 1
+              }, 8, ["disabled"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                createVNode(_sfc_main$1, {
+                  type: "button",
+                  variant: "outline",
+                  disabled: busy.value || unref(state).step === "upload",
+                  onClick: _cache[5] || (_cache[5] = ($event) => unref(controller).back())
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(toDisplayString(unref(translate)("ra.csv_import.back", { _: "Back" })), 1)
+                  ]),
+                  _: 1
+                }, 8, ["disabled"]),
+                createVNode(_sfc_main$1, {
+                  type: "button",
+                  disabled: nextDisabled.value,
+                  onClick: _cache[6] || (_cache[6] = ($event) => void unref(controller).next())
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(toDisplayString(unref(translate)("ra.csv_import.next", { _: "Next" })), 1)
+                  ]),
+                  _: 1
+                }, 8, ["disabled"])
+              ], 64))
+            ])
+          ]),
+          default: withCtx(() => [
+            createElementVNode("div", _hoisted_1, [
+              unref(state).step === "upload" ? (openBlock(), createElementBlock("div", _hoisted_2, [
+                createElementVNode("div", {
+                  "data-slot": "csv-import-dropzone",
+                  "data-active": dragging.value,
+                  class: "flex cursor-pointer flex-col items-center gap-2 rounded-md border border-dashed p-8 text-center text-sm text-muted-foreground data-[active=true]:border-primary",
+                  onClick: _cache[2] || (_cache[2] = ($event) => fileInput.value?.click()),
+                  onDragover: _cache[3] || (_cache[3] = withModifiers(($event) => dragging.value = true, ["prevent"])),
+                  onDragleave: _cache[4] || (_cache[4] = withModifiers(($event) => dragging.value = false, ["prevent"])),
+                  onDrop: withModifiers(onDrop, ["prevent"])
+                }, [
+                  createElementVNode("input", {
+                    ref_key: "fileInput",
+                    ref: fileInput,
+                    type: "file",
+                    accept: ".csv",
+                    class: "hidden",
+                    "data-testid": "csv-file-input",
+                    onClick: _cache[1] || (_cache[1] = withModifiers(() => {
+                    }, ["stop"])),
+                    onChange: onFileChange
+                  }, null, 544),
+                  createVNode(unref(UploadIcon)),
+                  createElementVNode("p", null, toDisplayString(unref(translate)("ra.csv_import.drop", {
+                    _: "Drop a CSV file here, or click to choose one"
+                  })), 1),
+                  unref(state).fileName ? (openBlock(), createElementBlock("p", _hoisted_4, toDisplayString(unref(state).fileName), 1)) : createCommentVNode("", true)
+                ], 40, _hoisted_3),
+                notice.value === "wrong_file" ? (openBlock(), createElementBlock("p", _hoisted_5, toDisplayString(unref(translate)("ra.csv_import.wrong_file", { _: "Choose a .csv file" })), 1)) : createCommentVNode("", true),
+                notice.value === "not_utf8" ? (openBlock(), createElementBlock("p", _hoisted_6, toDisplayString(unref(translate)("ra.csv_import.not_utf8", {
+                  _: "This file is not UTF-8, so some letters may be wrong. Save it as CSV UTF-8 and try again."
+                })), 1)) : createCommentVNode("", true),
+                unref(state).parseError !== null ? (openBlock(), createElementBlock("p", _hoisted_7, toDisplayString(unref(state).parseError), 1)) : unref(state).rows.length > 0 ? (openBlock(), createElementBlock("p", _hoisted_8, toDisplayString(unref(translate)("ra.csv_import.rows_parsed", {
+                  _: "{count} rows parsed",
+                  count: unref(state).rows.length
+                })), 1)) : createCommentVNode("", true)
+              ])) : unref(state).step === "map" ? (openBlock(), createElementBlock("div", _hoisted_9, [
+                (openBlock(true), createElementBlock(Fragment, null, renderList(unref(state).fields, (field) => {
+                  return openBlock(), createElementBlock("div", {
+                    key: field,
+                    class: "flex items-center justify-between gap-4 text-sm"
+                  }, [
+                    createElementVNode("label", {
+                      for: `csv-import-${field}`
+                    }, [
+                      createTextVNode(toDisplayString(field) + " ", 1),
+                      unref(state).requiredFields.includes(field) ? (openBlock(), createElementBlock("span", _hoisted_11, "*")) : createCommentVNode("", true)
+                    ], 8, _hoisted_10),
+                    createVNode(_sfc_main$3, {
+                      id: `csv-import-${field}`,
+                      "data-csv-field": field,
+                      "model-value": unref(state).mapping[field] ?? "",
+                      options: headerOptions.value,
+                      "onUpdate:modelValue": ($event) => unref(controller).setMapping(field, $event)
+                    }, null, 8, ["id", "data-csv-field", "model-value", "options", "onUpdate:modelValue"])
+                  ]);
+                }), 128)),
+                unmapped.value ? (openBlock(), createElementBlock("p", _hoisted_12, toDisplayString(unref(translate)("ra.csv_import.required_unmapped", {
+                  _: "Required fields are not mapped"
+                })), 1)) : createCommentVNode("", true)
+              ])) : unref(state).step === "preview" ? (openBlock(), createElementBlock("div", _hoisted_13, [
+                createElementVNode("p", _hoisted_14, toDisplayString(unref(translate)("ra.csv_import.preview_summary", {
+                  _: "{valid} valid · {errors} errors · {total} total",
+                  valid: validCount.value,
+                  errors: unref(state).validations.length - validCount.value,
+                  total: unref(state).validations.length
+                })), 1),
+                createElementVNode("div", _hoisted_15, [
+                  createVNode(unref(Table), null, {
+                    default: withCtx(() => [
+                      createVNode(unref(TableHeader), null, {
+                        default: withCtx(() => [
+                          createVNode(unref(TableRow), null, {
+                            default: withCtx(() => [
+                              (openBlock(true), createElementBlock(Fragment, null, renderList(unref(state).fields, (field) => {
+                                return openBlock(), createBlock(unref(TableHead), { key: field }, {
+                                  default: withCtx(() => [
+                                    createTextVNode(toDisplayString(field), 1)
+                                  ]),
+                                  _: 2
+                                }, 1024);
+                              }), 128)),
+                              createVNode(unref(TableHead), null, {
+                                default: withCtx(() => [
+                                  createTextVNode(toDisplayString(unref(translate)("ra.csv_import.issues", { _: "Issues" })), 1)
+                                ]),
+                                _: 1
+                              })
+                            ]),
+                            _: 1
+                          })
+                        ]),
+                        _: 1
+                      }),
+                      createVNode(unref(TableBody), null, {
+                        default: withCtx(() => [
+                          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(state).validations.slice(
+                            0,
+                            PREVIEW_ROWS
+                          ), (validation, index) => {
+                            return openBlock(), createBlock(unref(TableRow), { key: index }, {
+                              default: withCtx(() => [
+                                (openBlock(true), createElementBlock(Fragment, null, renderList(unref(state).fields, (field) => {
+                                  return openBlock(), createBlock(unref(TableCell), { key: field }, {
+                                    default: withCtx(() => [
+                                      createTextVNode(toDisplayString(cell(validation.row[field])), 1)
+                                    ]),
+                                    _: 2
+                                  }, 1024);
+                                }), 128)),
+                                createVNode(unref(TableCell), { class: "text-destructive" }, {
+                                  default: withCtx(() => [
+                                    createTextVNode(toDisplayString(validation.ok ? "" : validation.issues.join("; ")), 1)
+                                  ]),
+                                  _: 2
+                                }, 1024)
+                              ]),
+                              _: 2
+                            }, 1024);
+                          }), 128))
+                        ]),
+                        _: 1
+                      })
+                    ]),
+                    _: 1
+                  })
+                ])
+              ])) : (openBlock(), createElementBlock("div", _hoisted_16, [
+                unref(state).status === "failed" ? (openBlock(), createElementBlock("p", _hoisted_17, toDisplayString(unref(state).error?.message), 1)) : unref(state).status !== "done" || !unref(state).report ? (openBlock(), createBlock(_sfc_main$4, {
+                  key: 1,
+                  timeout: 0,
+                  value: percent(unref(state))
+                }, null, 8, ["value"])) : (openBlock(), createElementBlock("div", _hoisted_18, [
+                  createElementVNode("p", _hoisted_19, toDisplayString(unref(translate)("ra.csv_import.complete", { _: "Import complete" })), 1),
+                  createElementVNode("p", null, toDisplayString(unref(translate)("ra.csv_import.counts", {
+                    _: "{created} created · {failed} failed · {total} total",
+                    created: unref(state).report.created,
+                    failed: unref(state).report.failed,
+                    total: unref(state).report.total
+                  })), 1),
+                  unref(state).report.errors.length > 0 ? (openBlock(), createBlock(_sfc_main$1, {
+                    key: 0,
+                    type: "button",
+                    variant: "outline",
+                    class: "self-start",
+                    onClick: downloadErrors
+                  }, {
+                    default: withCtx(() => [
+                      createTextVNode(toDisplayString(unref(translate)("ra.csv_import.download_errors", {
+                        _: "Download error report"
+                      })), 1)
+                    ]),
+                    _: 1
+                  })) : createCommentVNode("", true)
+                ]))
+              ]))
+            ])
+          ]),
+          _: 1
+        }, 8, ["open", "title"]),
+        renderSlot(_ctx.$slots, "default")
+      ], 64);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/components/admin/csv-import/csv-import2.vue.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./csv-import.vue.js";
+export {
+  _sfc_main as default
+};

package/dist/components/admin/csv-import/upload-icon.d.ts

@@ -0,0 +1,3 @@
+import { type FunctionalComponent } from "vue";
+/** The lucide `upload` glyph, inline because `@chelone/vue` carries no icon library. */
+export declare const UploadIcon: FunctionalComponent;

package/dist/components/admin/csv-import/upload-icon.js

@@ -0,0 +1,23 @@
+import { h } from "vue";
+const UploadIcon = () => h(
+  "svg",
+  {
+    viewBox: "0 0 24 24",
+    width: "16",
+    height: "16",
+    fill: "none",
+    stroke: "currentColor",
+    "stroke-width": "2",
+    "stroke-linecap": "round",
+    "stroke-linejoin": "round",
+    "aria-hidden": "true"
+  },
+  [
+    h("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
+    h("polyline", { points: "17 8 12 3 7 8" }),
+    h("line", { x1: "12", x2: "12", y1: "3", y2: "15" })
+  ]
+);
+export {
+  UploadIcon
+};

package/dist/components/admin/csv-import/use-csv-import.d.ts

@@ -0,0 +1,14 @@
+import type { CsvImportState, createCsvImportController } from "@chelone/core";
+import { type InjectionKey, type Ref } from "vue";
+type CsvImportController = ReturnType<typeof createCsvImportController>;
+/**
+ * The wizard's state and the controller's actions, as `<CsvImport>` provides
+ * them. `state` is a ref so a consumer stays reactive to each step.
+ */
+export interface CsvImportContextValue extends Pick<CsvImportController, "loadParsed" | "setMapping" | "next" | "back" | "cancel" | "reset"> {
+    state: Readonly<Ref<CsvImportState>>;
+}
+export declare const CsvImportKey: InjectionKey<CsvImportContextValue>;
+/** Reads the import wizard from the nearest `<CsvImport>`. */
+export declare function useCsvImport(): CsvImportContextValue;
+export {};

package/dist/components/admin/csv-import/use-csv-import.js

@@ -0,0 +1,13 @@
+import { inject } from "vue";
+const CsvImportKey = /* @__PURE__ */ Symbol("chelone-csv-import");
+function useCsvImport() {
+  const value = inject(CsvImportKey, null);
+  if (!value) {
+    throw new Error("useCsvImport must be used inside <CsvImport>");
+  }
+  return value;
+}
+export {
+  CsvImportKey,
+  useCsvImport
+};

package/dist/components/admin/feedback/confirm.vue.d.ts

@@ -0,0 +1,34 @@
+/** Props for {@link Confirm}. */
+export interface ConfirmProps {
+    /** Whether the dialog is open. Default `false`. */
+    isOpen?: boolean;
+    /** Disables both buttons while a confirm action is in flight. */
+    loading?: boolean;
+    /** Dialog title (i18n key or literal — translated with a `_` fallback). */
+    title: string;
+    /** Dialog body copy (i18n key or literal — translated with a `_` fallback). */
+    content?: string;
+    /** Cancel-button label key. Default `"ra.action.cancel"`. */
+    cancel?: string;
+    /** Confirm-button label key. Default `"ra.action.confirm"`. */
+    confirm?: string;
+    /** `"warning"` tints the confirm button destructive. Default `"primary"`. */
+    confirmColor?: "primary" | "warning";
+    /** Interpolation params merged into the title/content translation (e.g. `smart_count`). */
+    translateOptions?: Record<string, unknown>;
+    /** Extra CSS class appended to the dialog panel. */
+    class?: string;
+}
+declare const _default: import("vue").DefineComponent<ConfirmProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    close: () => any;
+    confirm: () => any;
+}, string, import("vue").PublicProps, Readonly<ConfirmProps> & Readonly<{
+    onClose?: (() => any) | undefined;
+    onConfirm?: (() => any) | undefined;
+}>, {
+    cancel: string;
+    isOpen: boolean;
+    confirm: string;
+    confirmColor: "primary" | "warning";
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/components/admin/feedback/confirm.vue.js

@@ -0,0 +1,135 @@
+import { defineComponent, computed, watch, onBeforeUnmount, openBlock, createElementBlock, createElementVNode, withModifiers, normalizeClass, toDisplayString, createCommentVNode, createVNode, unref, createTextVNode } from "vue";
+import { useTranslate } from "../../../i18n/use-translate.js";
+import { cn } from "../../../lib/utils.js";
+import { buttonVariants } from "../../ui/button-variants.js";
+import { AlertCircleIcon, CheckCircleIcon } from "./icons.js";
+const _hoisted_1 = {
+  key: 0,
+  class: "fixed inset-0 z-50 flex items-center justify-center p-4",
+  "data-slot": "confirm"
+};
+const _hoisted_2 = { class: "flex flex-col gap-2 text-center sm:text-left" };
+const _hoisted_3 = {
+  class: "text-lg font-semibold",
+  "data-slot": "confirm-title"
+};
+const _hoisted_4 = {
+  key: 0,
+  class: "text-sm text-muted-foreground",
+  "data-slot": "confirm-content"
+};
+const _hoisted_5 = { class: "mt-4 flex flex-col-reverse gap-2 sm:flex-row sm:justify-end" };
+const _hoisted_6 = ["disabled"];
+const _hoisted_7 = ["disabled"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "confirm",
+  props: {
+    isOpen: { type: Boolean, default: false },
+    loading: { type: Boolean },
+    title: {},
+    content: {},
+    cancel: { default: "ra.action.cancel" },
+    confirm: { default: "ra.action.confirm" },
+    confirmColor: { default: "primary" },
+    translateOptions: {},
+    class: {}
+  },
+  emits: ["confirm", "close"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const translate = useTranslate();
+    const titleText = computed(
+      () => translate(props.title, { _: props.title, ...props.translateOptions })
+    );
+    const contentText = computed(
+      () => props.content !== void 0 ? translate(props.content, {
+        _: props.content,
+        ...props.translateOptions
+      }) : void 0
+    );
+    const panelClass = computed(
+      () => cn(
+        "relative z-10 w-full max-w-lg rounded-lg border bg-background p-6 shadow-lg",
+        props.class
+      )
+    );
+    const cancelClass = computed(
+      () => buttonVariants({ variant: "ghost", class: "gap-1" })
+    );
+    const confirmClass = computed(
+      () => buttonVariants({
+        variant: props.confirmColor === "warning" ? "destructive" : "default",
+        class: "gap-1"
+      })
+    );
+    function onClose() {
+      emit("close");
+    }
+    function onConfirm() {
+      emit("confirm");
+    }
+    function onKeydown(event) {
+      if (event.key === "Escape") onClose();
+    }
+    watch(
+      () => props.isOpen,
+      (open) => {
+        if (typeof document === "undefined") return;
+        if (open) document.addEventListener("keydown", onKeydown);
+        else document.removeEventListener("keydown", onKeydown);
+      },
+      { immediate: true }
+    );
+    onBeforeUnmount(() => {
+      if (typeof document !== "undefined")
+        document.removeEventListener("keydown", onKeydown);
+    });
+    return (_ctx, _cache) => {
+      return __props.isOpen ? (openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", {
+          class: "absolute inset-0 bg-black/50",
+          "data-slot": "confirm-overlay",
+          onClick: onClose
+        }),
+        createElementVNode("div", {
+          role: "alertdialog",
+          "aria-modal": "true",
+          class: normalizeClass(panelClass.value),
+          onClick: _cache[0] || (_cache[0] = withModifiers(() => {
+          }, ["stop"]))
+        }, [
+          createElementVNode("div", _hoisted_2, [
+            createElementVNode("h2", _hoisted_3, toDisplayString(titleText.value), 1),
+            contentText.value ? (openBlock(), createElementBlock("p", _hoisted_4, toDisplayString(contentText.value), 1)) : createCommentVNode("", true)
+          ]),
+          createElementVNode("div", _hoisted_5, [
+            createElementVNode("button", {
+              type: "button",
+              class: normalizeClass(cancelClass.value),
+              disabled: __props.loading,
+              "data-slot": "confirm-cancel",
+              onClick: onClose
+            }, [
+              createVNode(unref(AlertCircleIcon), { class: "size-5" }),
+              createTextVNode(" " + toDisplayString(unref(translate)(__props.cancel, { _: __props.cancel })), 1)
+            ], 10, _hoisted_6),
+            createElementVNode("button", {
+              type: "button",
+              class: normalizeClass(confirmClass.value),
+              disabled: __props.loading,
+              "data-slot": "confirm-accept",
+              onClick: onConfirm
+            }, [
+              createVNode(unref(CheckCircleIcon), { class: "size-5" }),
+              createTextVNode(" " + toDisplayString(unref(translate)(__props.confirm, { _: __props.confirm })), 1)
+            ], 10, _hoisted_7)
+          ])
+        ], 2)
+      ])) : createCommentVNode("", true);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};