@lunora/studio 1.0.0-alpha.4 → 1.0.0-alpha.41

package/dist/packem_chunks/kv-browser.js

@@ -0,0 +1,1896 @@
+import { useLunora } from '@lunora/react';
+import { useState, useReducer, useEffect } from 'react';
+import { C as Card, a as CardContent } from '../packem_shared/card-DURq3ElK.js';
+import { E as EmptyState } from '../packem_shared/empty-state-DY_oe0k6.js';
+import { T as Table, a as TableHeader, b as TableRow, c as TableHead, d as TableBody, e as TableCell } from '../packem_shared/table-DsCa9Qp9.js';
+import { useT } from '../packem_shared/DEFAULT_LOCALE-CiX4W7Kr.js';
+import { f as fireAndForget, e as errorMessage, j as formatBytes, g as copyToClipboard } from '../packem_shared/internal-CYcbqMjX.js';
+import { B as Button } from '../packem_shared/button-BhsN2uZH.js';
+import { C as Checkbox } from '../packem_shared/checkbox-UNkzAxl-.js';
+import { I as Input } from '../packem_shared/input-XH4r1Pt1.js';
+import { b as Sheet, c as SheetContent, d as SheetHeader, e as SheetTitle } from '../packem_shared/studio-Dh9UlaF_.js';
+import { c } from 'react/compiler-runtime';
+import { L as Label } from '../packem_shared/label-D8ykjn5J.js';
+import { T as Textarea } from '../packem_shared/textarea-D3gaCU_-.js';
+import { S as SelectValue, a as SelectTrigger, b as SelectItem, c as SelectContent, d as Select } from '../packem_shared/select-UkNYCT3s.js';
+import { jsxDEV, Fragment } from 'react/jsx-dev-runtime';
+import { B as Badge } from '../packem_shared/badge-B2PKA1-5.js';
+
+const parseTtl = (value) => {
+  const trimmed = value.trim();
+  if (trimmed === "") {
+    return void 0;
+  }
+  const seconds = Number(trimmed);
+  return Number.isFinite(seconds) && seconds > 0 ? Math.floor(seconds) : void 0;
+};
+const formatExpiration = (expiration) => expiration === void 0 ? "—" : new Date(expiration * 1e3).toISOString();
+const byteLength = (value) => new TextEncoder().encode(value).length;
+const tryFormatJson = (value) => {
+  if (value.trim() === "") {
+    return void 0;
+  }
+  try {
+    return JSON.stringify(JSON.parse(value), void 0, 2);
+  } catch {
+    return void 0;
+  }
+};
+const isJsonOrEmpty = (value) => {
+  if (value.trim() === "") {
+    return true;
+  }
+  try {
+    JSON.parse(value);
+    return true;
+  } catch {
+    return false;
+  }
+};
+const TTL_UNITS = [{
+  key: "seconds",
+  seconds: 1
+}, {
+  key: "minutes",
+  seconds: 60
+}, {
+  key: "hours",
+  seconds: 3600
+}, {
+  key: "days",
+  seconds: 86400
+}];
+const ttlToSeconds = (amount, unit) => {
+  const trimmed = amount.trim();
+  if (trimmed === "") {
+    return "";
+  }
+  const value = Number(trimmed);
+  const perUnit = TTL_UNITS.find((option) => option.key === unit)?.seconds ?? 1;
+  return Number.isFinite(value) && value > 0 ? String(Math.round(value * perUnit)) : trimmed;
+};
+const isTtlValid = (value) => {
+  const trimmed = value.trim();
+  if (trimmed === "") {
+    return true;
+  }
+  const seconds = Number(trimmed);
+  return Number.isInteger(seconds) && seconds >= 60;
+};
+const buildKvPutOptions = (fields, key, namespace, existingExpiration) => {
+  const ttl = parseTtl(fields.ttl);
+  return {
+    expiration: ttl === void 0 ? existingExpiration : void 0,
+    expirationTtl: ttl,
+    key,
+    metadata: fields.metadata.trim() === "" ? void 0 : JSON.parse(fields.metadata),
+    namespace,
+    value: fields.value
+  };
+};
+
+const TtlField = (t0) => {
+  const $ = c(60);
+  const {
+    helper,
+    id,
+    invalid,
+    onChange,
+    testId
+  } = t0;
+  const t = useT();
+  const [amount, setAmount] = useState("");
+  const [unit, setUnit] = useState("seconds");
+  let t1;
+  if ($[0] !== onChange || $[1] !== unit) {
+    t1 = (event) => {
+      setAmount(event.target.value);
+      onChange(ttlToSeconds(event.target.value, unit));
+    };
+    $[0] = onChange;
+    $[1] = unit;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  const onAmountChange = t1;
+  let t2;
+  if ($[3] !== amount || $[4] !== onChange) {
+    t2 = (nextUnit) => {
+      if (nextUnit === null) {
+        return;
+      }
+      setUnit(nextUnit);
+      onChange(ttlToSeconds(amount, nextUnit));
+    };
+    $[3] = amount;
+    $[4] = onChange;
+    $[5] = t2;
+  } else {
+    t2 = $[5];
+  }
+  const onUnitChange = t2;
+  let t3;
+  if ($[6] !== t) {
+    t3 = t("days");
+    $[6] = t;
+    $[7] = t3;
+  } else {
+    t3 = $[7];
+  }
+  let t4;
+  if ($[8] !== t) {
+    t4 = t("hours");
+    $[8] = t;
+    $[9] = t4;
+  } else {
+    t4 = $[9];
+  }
+  let t5;
+  if ($[10] !== t) {
+    t5 = t("minutes");
+    $[10] = t;
+    $[11] = t5;
+  } else {
+    t5 = $[11];
+  }
+  let t6;
+  if ($[12] !== t) {
+    t6 = t("seconds");
+    $[12] = t;
+    $[13] = t6;
+  } else {
+    t6 = $[13];
+  }
+  let t7;
+  if ($[14] !== t3 || $[15] !== t4 || $[16] !== t5 || $[17] !== t6) {
+    t7 = {
+      days: t3,
+      hours: t4,
+      minutes: t5,
+      seconds: t6
+    };
+    $[14] = t3;
+    $[15] = t4;
+    $[16] = t5;
+    $[17] = t6;
+    $[18] = t7;
+  } else {
+    t7 = $[18];
+  }
+  const unitLabel = t7;
+  let t8;
+  if ($[19] !== t) {
+    t8 = t("Expires after");
+    $[19] = t;
+    $[20] = t8;
+  } else {
+    t8 = $[20];
+  }
+  let t9;
+  if ($[21] !== id || $[22] !== t8) {
+    t9 = /* @__PURE__ */ jsxDEV(Label, {
+      className: "text-xs",
+      htmlFor: id,
+      children: t8
+    }, void 0, false);
+    $[21] = id;
+    $[22] = t8;
+    $[23] = t9;
+  } else {
+    t9 = $[23];
+  }
+  let t10;
+  if ($[24] !== t) {
+    t10 = t("No expiration");
+    $[24] = t;
+    $[25] = t10;
+  } else {
+    t10 = $[25];
+  }
+  let t11;
+  if ($[26] !== amount || $[27] !== id || $[28] !== invalid || $[29] !== onAmountChange || $[30] !== t10 || $[31] !== testId) {
+    t11 = /* @__PURE__ */ jsxDEV(Input, {
+      "aria-invalid": invalid,
+      className: "flex-1",
+      "data-testid": testId,
+      id,
+      inputMode: "numeric",
+      onChange: onAmountChange,
+      placeholder: t10,
+      value: amount
+    }, void 0, false);
+    $[26] = amount;
+    $[27] = id;
+    $[28] = invalid;
+    $[29] = onAmountChange;
+    $[30] = t10;
+    $[31] = testId;
+    $[32] = t11;
+  } else {
+    t11 = $[32];
+  }
+  let t12;
+  if ($[33] !== t) {
+    t12 = t("TTL unit");
+    $[33] = t;
+    $[34] = t12;
+  } else {
+    t12 = $[34];
+  }
+  const t13 = `${testId}-unit`;
+  let t14;
+  if ($[35] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t14 = /* @__PURE__ */ jsxDEV(SelectValue, {}, void 0, false);
+    $[35] = t14;
+  } else {
+    t14 = $[35];
+  }
+  let t15;
+  if ($[36] !== t12 || $[37] !== t13) {
+    t15 = /* @__PURE__ */ jsxDEV(SelectTrigger, {
+      "aria-label": t12,
+      className: "w-[7.5rem]",
+      "data-testid": t13,
+      children: t14
+    }, void 0, false);
+    $[36] = t12;
+    $[37] = t13;
+    $[38] = t15;
+  } else {
+    t15 = $[38];
+  }
+  let t16;
+  if ($[39] !== unitLabel) {
+    t16 = TTL_UNITS.map((option) => /* @__PURE__ */ jsxDEV(SelectItem, {
+      value: option.key,
+      children: unitLabel[option.key]
+    }, option.key, false));
+    $[39] = unitLabel;
+    $[40] = t16;
+  } else {
+    t16 = $[40];
+  }
+  let t17;
+  if ($[41] !== t16) {
+    t17 = /* @__PURE__ */ jsxDEV(SelectContent, {
+      children: t16
+    }, void 0, false);
+    $[41] = t16;
+    $[42] = t17;
+  } else {
+    t17 = $[42];
+  }
+  let t18;
+  if ($[43] !== onUnitChange || $[44] !== t15 || $[45] !== t17 || $[46] !== unit) {
+    t18 = /* @__PURE__ */ jsxDEV(Select, {
+      onValueChange: onUnitChange,
+      value: unit,
+      children: [t15, t17]
+    }, void 0, true);
+    $[43] = onUnitChange;
+    $[44] = t15;
+    $[45] = t17;
+    $[46] = unit;
+    $[47] = t18;
+  } else {
+    t18 = $[47];
+  }
+  let t19;
+  if ($[48] !== t11 || $[49] !== t18) {
+    t19 = /* @__PURE__ */ jsxDEV("div", {
+      className: "flex gap-2",
+      children: [t11, t18]
+    }, void 0, true);
+    $[48] = t11;
+    $[49] = t18;
+    $[50] = t19;
+  } else {
+    t19 = $[50];
+  }
+  let t20;
+  if ($[51] !== helper || $[52] !== invalid || $[53] !== t || $[54] !== testId) {
+    t20 = invalid ? /* @__PURE__ */ jsxDEV("p", {
+      className: "text-xs text-destructive",
+      "data-testid": `${testId}-invalid`,
+      children: t("TTL must be at least 60 seconds.")
+    }, void 0, false) : helper !== void 0 && /* @__PURE__ */ jsxDEV("p", {
+      className: "text-xs text-muted-foreground",
+      children: helper
+    }, void 0, false);
+    $[51] = helper;
+    $[52] = invalid;
+    $[53] = t;
+    $[54] = testId;
+    $[55] = t20;
+  } else {
+    t20 = $[55];
+  }
+  let t21;
+  if ($[56] !== t19 || $[57] !== t20 || $[58] !== t9) {
+    t21 = /* @__PURE__ */ jsxDEV("div", {
+      className: "mb-3 grid gap-1",
+      children: [t9, t19, t20]
+    }, void 0, true);
+    $[56] = t19;
+    $[57] = t20;
+    $[58] = t9;
+    $[59] = t21;
+  } else {
+    t21 = $[59];
+  }
+  return t21;
+};
+const MetadataField = (t0) => {
+  const $ = c(36);
+  const {
+    id,
+    invalidTestId,
+    onChange,
+    testId,
+    valid,
+    value
+  } = t0;
+  const t = useT();
+  let t1;
+  if ($[0] !== value) {
+    t1 = tryFormatJson(value);
+    $[0] = value;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const formatted = t1;
+  let t2;
+  if ($[2] !== t) {
+    t2 = t("Metadata (JSON)");
+    $[2] = t;
+    $[3] = t2;
+  } else {
+    t2 = $[3];
+  }
+  let t3;
+  if ($[4] !== id || $[5] !== t2) {
+    t3 = /* @__PURE__ */ jsxDEV(Label, {
+      className: "text-xs",
+      htmlFor: id,
+      children: t2
+    }, void 0, false);
+    $[4] = id;
+    $[5] = t2;
+    $[6] = t3;
+  } else {
+    t3 = $[6];
+  }
+  const t4 = `${testId}-format`;
+  const t5 = formatted === void 0;
+  let t6;
+  if ($[7] !== formatted || $[8] !== onChange) {
+    t6 = () => {
+      if (formatted !== void 0) {
+        onChange(formatted);
+      }
+    };
+    $[7] = formatted;
+    $[8] = onChange;
+    $[9] = t6;
+  } else {
+    t6 = $[9];
+  }
+  let t7;
+  if ($[10] !== t) {
+    t7 = t("Format JSON");
+    $[10] = t;
+    $[11] = t7;
+  } else {
+    t7 = $[11];
+  }
+  let t8;
+  if ($[12] !== t4 || $[13] !== t5 || $[14] !== t6 || $[15] !== t7) {
+    t8 = /* @__PURE__ */ jsxDEV(Button, {
+      "data-testid": t4,
+      disabled: t5,
+      onClick: t6,
+      size: "sm",
+      variant: "outline",
+      children: t7
+    }, void 0, false);
+    $[12] = t4;
+    $[13] = t5;
+    $[14] = t6;
+    $[15] = t7;
+    $[16] = t8;
+  } else {
+    t8 = $[16];
+  }
+  let t9;
+  if ($[17] !== t3 || $[18] !== t8) {
+    t9 = /* @__PURE__ */ jsxDEV("div", {
+      className: "flex items-center justify-between gap-2",
+      children: [t3, t8]
+    }, void 0, true);
+    $[17] = t3;
+    $[18] = t8;
+    $[19] = t9;
+  } else {
+    t9 = $[19];
+  }
+  const t10 = !valid;
+  let t11;
+  if ($[20] !== onChange) {
+    t11 = (event) => {
+      onChange(event.target.value);
+    };
+    $[20] = onChange;
+    $[21] = t11;
+  } else {
+    t11 = $[21];
+  }
+  let t12;
+  if ($[22] !== id || $[23] !== t10 || $[24] !== t11 || $[25] !== testId || $[26] !== value) {
+    t12 = /* @__PURE__ */ jsxDEV(Textarea, {
+      "aria-invalid": t10,
+      className: "min-h-[4rem] font-mono text-xs",
+      "data-testid": testId,
+      id,
+      onChange: t11,
+      value
+    }, void 0, false);
+    $[22] = id;
+    $[23] = t10;
+    $[24] = t11;
+    $[25] = testId;
+    $[26] = value;
+    $[27] = t12;
+  } else {
+    t12 = $[27];
+  }
+  let t13;
+  if ($[28] !== invalidTestId || $[29] !== t || $[30] !== valid) {
+    t13 = !valid && /* @__PURE__ */ jsxDEV("p", {
+      className: "text-xs text-destructive",
+      "data-testid": invalidTestId,
+      children: t("Metadata must be valid JSON.")
+    }, void 0, false);
+    $[28] = invalidTestId;
+    $[29] = t;
+    $[30] = valid;
+    $[31] = t13;
+  } else {
+    t13 = $[31];
+  }
+  let t14;
+  if ($[32] !== t12 || $[33] !== t13 || $[34] !== t9) {
+    t14 = /* @__PURE__ */ jsxDEV("div", {
+      className: "mb-3 grid gap-1",
+      children: [t9, t12, t13]
+    }, void 0, true);
+    $[32] = t12;
+    $[33] = t13;
+    $[34] = t9;
+    $[35] = t14;
+  } else {
+    t14 = $[35];
+  }
+  return t14;
+};
+
+const INITIAL_CREATE_STATE = {
+  busy: false,
+  error: null,
+  metadata: "",
+  name: "",
+  ttl: "",
+  value: ""
+};
+const createReducer = (state, action) => {
+  switch (action.type) {
+    case "setField": {
+      return {
+        ...state,
+        [action.field]: action.value
+      };
+    }
+    case "submitFailed": {
+      return {
+        ...state,
+        busy: false,
+        error: action.error
+      };
+    }
+    case "submitStart": {
+      return {
+        ...state,
+        busy: true,
+        error: null
+      };
+    }
+    default: {
+      return state;
+    }
+  }
+};
+const KvCreateForm = (t0) => {
+  const $ = c(73);
+  const {
+    namespace,
+    onCancel,
+    onCreated
+  } = t0;
+  const client = useLunora();
+  const t = useT();
+  const [state, dispatch] = useReducer(createReducer, INITIAL_CREATE_STATE);
+  let t1;
+  if ($[0] !== state.metadata) {
+    t1 = isJsonOrEmpty(state.metadata);
+    $[0] = state.metadata;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const metadataValid = t1;
+  let t2;
+  if ($[2] !== state.ttl) {
+    t2 = isTtlValid(state.ttl);
+    $[2] = state.ttl;
+    $[3] = t2;
+  } else {
+    t2 = $[3];
+  }
+  const ttlValid = t2;
+  let t3;
+  if ($[4] !== metadataValid || $[5] !== state.busy || $[6] !== state.name || $[7] !== ttlValid) {
+    t3 = state.name.trim() !== "" && metadataValid && ttlValid && !state.busy;
+    $[4] = metadataValid;
+    $[5] = state.busy;
+    $[6] = state.name;
+    $[7] = ttlValid;
+    $[8] = t3;
+  } else {
+    t3 = $[8];
+  }
+  const canSubmit = t3;
+  let t4;
+  if ($[9] !== canSubmit || $[10] !== client || $[11] !== namespace || $[12] !== onCreated || $[13] !== state.metadata || $[14] !== state.name || $[15] !== state.ttl || $[16] !== state.value) {
+    t4 = () => {
+      if (!canSubmit) {
+        return;
+      }
+      dispatch({
+        type: "submitStart"
+      });
+      fireAndForget((async () => {
+        try {
+          await client.putKvValue(buildKvPutOptions({
+            metadata: state.metadata,
+            ttl: state.ttl,
+            value: state.value
+          }, state.name, namespace));
+          onCreated();
+        } catch (t52) {
+          const error_ = t52;
+          dispatch({
+            error: errorMessage(error_),
+            type: "submitFailed"
+          });
+        }
+      })());
+    };
+    $[9] = canSubmit;
+    $[10] = client;
+    $[11] = namespace;
+    $[12] = onCreated;
+    $[13] = state.metadata;
+    $[14] = state.name;
+    $[15] = state.ttl;
+    $[16] = state.value;
+    $[17] = t4;
+  } else {
+    t4 = $[17];
+  }
+  const onSubmit = t4;
+  let t5;
+  if ($[18] !== t) {
+    t5 = t("Key name");
+    $[18] = t;
+    $[19] = t5;
+  } else {
+    t5 = $[19];
+  }
+  let t6;
+  if ($[20] !== t5) {
+    t6 = /* @__PURE__ */ jsxDEV(Label, {
+      className: "text-xs",
+      htmlFor: "kv-create-name",
+      children: t5
+    }, void 0, false);
+    $[20] = t5;
+    $[21] = t6;
+  } else {
+    t6 = $[21];
+  }
+  let t7;
+  if ($[22] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t7 = (event) => {
+      dispatch({
+        field: "name",
+        type: "setField",
+        value: event.target.value
+      });
+    };
+    $[22] = t7;
+  } else {
+    t7 = $[22];
+  }
+  let t8;
+  if ($[23] !== t) {
+    t8 = t("Key name");
+    $[23] = t;
+    $[24] = t8;
+  } else {
+    t8 = $[24];
+  }
+  let t9;
+  if ($[25] !== state.name || $[26] !== t8) {
+    t9 = /* @__PURE__ */ jsxDEV(Input, {
+      autoFocus: true,
+      "data-testid": "kv-create-name",
+      id: "kv-create-name",
+      onChange: t7,
+      placeholder: t8,
+      value: state.name
+    }, void 0, false);
+    $[25] = state.name;
+    $[26] = t8;
+    $[27] = t9;
+  } else {
+    t9 = $[27];
+  }
+  let t10;
+  if ($[28] !== t6 || $[29] !== t9) {
+    t10 = /* @__PURE__ */ jsxDEV("div", {
+      className: "grid gap-1",
+      children: [t6, t9]
+    }, void 0, true);
+    $[28] = t6;
+    $[29] = t9;
+    $[30] = t10;
+  } else {
+    t10 = $[30];
+  }
+  let t11;
+  if ($[31] !== t) {
+    t11 = t("Value");
+    $[31] = t;
+    $[32] = t11;
+  } else {
+    t11 = $[32];
+  }
+  let t12;
+  if ($[33] !== t11) {
+    t12 = /* @__PURE__ */ jsxDEV(Label, {
+      className: "text-xs",
+      htmlFor: "kv-create-value",
+      children: t11
+    }, void 0, false);
+    $[33] = t11;
+    $[34] = t12;
+  } else {
+    t12 = $[34];
+  }
+  let t13;
+  if ($[35] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t13 = (event_0) => {
+      dispatch({
+        field: "value",
+        type: "setField",
+        value: event_0.target.value
+      });
+    };
+    $[35] = t13;
+  } else {
+    t13 = $[35];
+  }
+  let t14;
+  if ($[36] !== state.value) {
+    t14 = /* @__PURE__ */ jsxDEV(Textarea, {
+      className: "min-h-[6rem] font-mono text-xs",
+      "data-testid": "kv-create-value",
+      id: "kv-create-value",
+      onChange: t13,
+      value: state.value
+    }, void 0, false);
+    $[36] = state.value;
+    $[37] = t14;
+  } else {
+    t14 = $[37];
+  }
+  let t15;
+  if ($[38] !== t12 || $[39] !== t14) {
+    t15 = /* @__PURE__ */ jsxDEV("div", {
+      className: "grid gap-1",
+      children: [t12, t14]
+    }, void 0, true);
+    $[38] = t12;
+    $[39] = t14;
+    $[40] = t15;
+  } else {
+    t15 = $[40];
+  }
+  const t16 = !ttlValid;
+  let t17;
+  if ($[41] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t17 = (seconds) => {
+      dispatch({
+        field: "ttl",
+        type: "setField",
+        value: seconds
+      });
+    };
+    $[41] = t17;
+  } else {
+    t17 = $[41];
+  }
+  let t18;
+  if ($[42] !== t16) {
+    t18 = /* @__PURE__ */ jsxDEV(TtlField, {
+      id: "kv-create-ttl",
+      invalid: t16,
+      onChange: t17,
+      testId: "kv-create-ttl"
+    }, void 0, false);
+    $[42] = t16;
+    $[43] = t18;
+  } else {
+    t18 = $[43];
+  }
+  let t19;
+  if ($[44] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t19 = (metadata) => {
+      dispatch({
+        field: "metadata",
+        type: "setField",
+        value: metadata
+      });
+    };
+    $[44] = t19;
+  } else {
+    t19 = $[44];
+  }
+  let t20;
+  if ($[45] !== metadataValid || $[46] !== state.metadata) {
+    t20 = /* @__PURE__ */ jsxDEV(MetadataField, {
+      id: "kv-create-metadata",
+      invalidTestId: "kv-create-metadata-invalid",
+      onChange: t19,
+      testId: "kv-create-metadata",
+      valid: metadataValid,
+      value: state.metadata
+    }, void 0, false);
+    $[45] = metadataValid;
+    $[46] = state.metadata;
+    $[47] = t20;
+  } else {
+    t20 = $[47];
+  }
+  const t21 = !canSubmit;
+  let t22;
+  if ($[48] !== state.busy || $[49] !== t) {
+    t22 = state.busy ? t("Creating…") : t("Create key");
+    $[48] = state.busy;
+    $[49] = t;
+    $[50] = t22;
+  } else {
+    t22 = $[50];
+  }
+  let t23;
+  if ($[51] !== onSubmit || $[52] !== t21 || $[53] !== t22) {
+    t23 = /* @__PURE__ */ jsxDEV(Button, {
+      "data-testid": "kv-create-submit",
+      disabled: t21,
+      onClick: onSubmit,
+      children: t22
+    }, void 0, false);
+    $[51] = onSubmit;
+    $[52] = t21;
+    $[53] = t22;
+    $[54] = t23;
+  } else {
+    t23 = $[54];
+  }
+  const t24 = state.busy;
+  let t25;
+  if ($[55] !== t) {
+    t25 = t("Cancel");
+    $[55] = t;
+    $[56] = t25;
+  } else {
+    t25 = $[56];
+  }
+  let t26;
+  if ($[57] !== onCancel || $[58] !== state.busy || $[59] !== t25) {
+    t26 = /* @__PURE__ */ jsxDEV(Button, {
+      "data-testid": "kv-create-cancel",
+      disabled: t24,
+      onClick: onCancel,
+      variant: "outline",
+      children: t25
+    }, void 0, false);
+    $[57] = onCancel;
+    $[58] = state.busy;
+    $[59] = t25;
+    $[60] = t26;
+  } else {
+    t26 = $[60];
+  }
+  let t27;
+  if ($[61] !== t23 || $[62] !== t26) {
+    t27 = /* @__PURE__ */ jsxDEV("div", {
+      className: "flex flex-wrap gap-2",
+      children: [t23, t26]
+    }, void 0, true);
+    $[61] = t23;
+    $[62] = t26;
+    $[63] = t27;
+  } else {
+    t27 = $[63];
+  }
+  let t28;
+  if ($[64] !== state.error) {
+    t28 = state.error !== null && /* @__PURE__ */ jsxDEV("p", {
+      className: "text-sm text-destructive",
+      "data-testid": "kv-create-error",
+      role: "alert",
+      children: state.error
+    }, void 0, false);
+    $[64] = state.error;
+    $[65] = t28;
+  } else {
+    t28 = $[65];
+  }
+  let t29;
+  if ($[66] !== t10 || $[67] !== t15 || $[68] !== t18 || $[69] !== t20 || $[70] !== t27 || $[71] !== t28) {
+    t29 = /* @__PURE__ */ jsxDEV("div", {
+      className: "grid gap-3 px-4 pb-4",
+      "data-testid": "kv-create-form",
+      children: [t10, t15, t18, t20, t27, t28]
+    }, void 0, true);
+    $[66] = t10;
+    $[67] = t15;
+    $[68] = t18;
+    $[69] = t20;
+    $[70] = t27;
+    $[71] = t28;
+    $[72] = t29;
+  } else {
+    t29 = $[72];
+  }
+  return t29;
+};
+
+const INITIAL_VALUE_STATE = {
+  busy: "",
+  editedMetadata: "",
+  editedTtl: "",
+  editedValue: "",
+  loadError: null,
+  loading: true,
+  value: null,
+  writeError: null
+};
+const valueReducer = (state, action) => {
+  switch (action.type) {
+    case "deleteStart": {
+      return {
+        ...state,
+        busy: "deleting",
+        writeError: null
+      };
+    }
+    case "editMetadata": {
+      return {
+        ...state,
+        editedMetadata: action.value
+      };
+    }
+    case "editTtl": {
+      return {
+        ...state,
+        editedTtl: action.value
+      };
+    }
+    case "editValue": {
+      return {
+        ...state,
+        editedValue: action.value
+      };
+    }
+    case "loaded": {
+      return {
+        ...state,
+        editedMetadata: action.metadata === null || action.metadata === void 0 ? "" : JSON.stringify(action.metadata, null, 2),
+        editedValue: action.value ?? "",
+        loading: false,
+        value: action.value
+      };
+    }
+    case "loadFailed": {
+      return {
+        ...state,
+        loadError: action.error,
+        loading: false
+      };
+    }
+    case "saveOk": {
+      return {
+        ...state,
+        busy: "",
+        value: state.editedValue
+      };
+    }
+    case "saveStart": {
+      return {
+        ...state,
+        busy: "saving",
+        writeError: null
+      };
+    }
+    case "writeFailed": {
+      return {
+        ...state,
+        busy: "",
+        writeError: action.error
+      };
+    }
+    default: {
+      return state;
+    }
+  }
+};
+const KvValueEditor = (t0) => {
+  const $ = c(67);
+  const {
+    expiration,
+    keyName,
+    namespace,
+    onDeleted
+  } = t0;
+  const client = useLunora();
+  const t = useT();
+  const [state, dispatch] = useReducer(valueReducer, INITIAL_VALUE_STATE);
+  let t1;
+  let t2;
+  if ($[0] !== client || $[1] !== keyName || $[2] !== namespace) {
+    t1 = () => {
+      const token = {
+        cancelled: false
+      };
+      fireAndForget((async () => {
+        try {
+          const result = await client.getKvValue({
+            key: keyName,
+            namespace
+          });
+          if (!token.cancelled) {
+            dispatch({
+              metadata: result.metadata,
+              type: "loaded",
+              value: result.value
+            });
+          }
+        } catch (t32) {
+          const error_ = t32;
+          if (!token.cancelled) {
+            dispatch({
+              error: errorMessage(error_),
+              type: "loadFailed"
+            });
+          }
+        }
+      })());
+      return () => {
+        token.cancelled = true;
+      };
+    };
+    t2 = [client, namespace, keyName];
+    $[0] = client;
+    $[1] = keyName;
+    $[2] = namespace;
+    $[3] = t1;
+    $[4] = t2;
+  } else {
+    t1 = $[3];
+    t2 = $[4];
+  }
+  useEffect(t1, t2);
+  let t3;
+  if ($[5] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t3 = (event) => {
+      dispatch({
+        type: "editValue",
+        value: event.target.value
+      });
+    };
+    $[5] = t3;
+  } else {
+    t3 = $[5];
+  }
+  const onEditedValueChange = t3;
+  let t4;
+  if ($[6] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t4 = (metadata) => {
+      dispatch({
+        type: "editMetadata",
+        value: metadata
+      });
+    };
+    $[6] = t4;
+  } else {
+    t4 = $[6];
+  }
+  const onEditedMetadataChange = t4;
+  let t5;
+  if ($[7] !== state.editedValue) {
+    t5 = tryFormatJson(state.editedValue);
+    $[7] = state.editedValue;
+    $[8] = t5;
+  } else {
+    t5 = $[8];
+  }
+  const formattedValue = t5;
+  let t6;
+  if ($[9] !== state.editedMetadata) {
+    t6 = isJsonOrEmpty(state.editedMetadata);
+    $[9] = state.editedMetadata;
+    $[10] = t6;
+  } else {
+    t6 = $[10];
+  }
+  const metadataValid = t6;
+  let t7;
+  if ($[11] !== state.editedTtl) {
+    t7 = isTtlValid(state.editedTtl);
+    $[11] = state.editedTtl;
+    $[12] = t7;
+  } else {
+    t7 = $[12];
+  }
+  const ttlValid = t7;
+  let t8;
+  if ($[13] !== formattedValue) {
+    t8 = () => {
+      if (formattedValue !== void 0) {
+        dispatch({
+          type: "editValue",
+          value: formattedValue
+        });
+      }
+    };
+    $[13] = formattedValue;
+    $[14] = t8;
+  } else {
+    t8 = $[14];
+  }
+  const onFormatValue = t8;
+  let t9;
+  if ($[15] !== client || $[16] !== expiration || $[17] !== keyName || $[18] !== metadataValid || $[19] !== namespace || $[20] !== state.editedMetadata || $[21] !== state.editedTtl || $[22] !== state.editedValue || $[23] !== t) {
+    t9 = () => {
+      if (!metadataValid) {
+        dispatch({
+          error: t("Metadata must be valid JSON."),
+          type: "writeFailed"
+        });
+        return;
+      }
+      dispatch({
+        type: "saveStart"
+      });
+      fireAndForget((async () => {
+        try {
+          await client.putKvValue(buildKvPutOptions({
+            metadata: state.editedMetadata,
+            ttl: state.editedTtl,
+            value: state.editedValue
+          }, keyName, namespace, expiration));
+          dispatch({
+            type: "saveOk"
+          });
+        } catch (t102) {
+          const error__0 = t102;
+          dispatch({
+            error: errorMessage(error__0),
+            type: "writeFailed"
+          });
+        }
+      })());
+    };
+    $[15] = client;
+    $[16] = expiration;
+    $[17] = keyName;
+    $[18] = metadataValid;
+    $[19] = namespace;
+    $[20] = state.editedMetadata;
+    $[21] = state.editedTtl;
+    $[22] = state.editedValue;
+    $[23] = t;
+    $[24] = t9;
+  } else {
+    t9 = $[24];
+  }
+  const onSave = t9;
+  let t10;
+  if ($[25] !== client || $[26] !== keyName || $[27] !== namespace || $[28] !== onDeleted) {
+    t10 = () => {
+      dispatch({
+        type: "deleteStart"
+      });
+      fireAndForget((async () => {
+        try {
+          await client.deleteKvKey({
+            key: keyName,
+            namespace
+          });
+          onDeleted(keyName);
+        } catch (t112) {
+          const error__1 = t112;
+          dispatch({
+            error: errorMessage(error__1),
+            type: "writeFailed"
+          });
+        }
+      })());
+    };
+    $[25] = client;
+    $[26] = keyName;
+    $[27] = namespace;
+    $[28] = onDeleted;
+    $[29] = t10;
+  } else {
+    t10 = $[29];
+  }
+  const onDelete = t10;
+  let t11;
+  if ($[30] !== keyName) {
+    t11 = () => {
+      copyToClipboard(keyName);
+    };
+    $[30] = keyName;
+    $[31] = t11;
+  } else {
+    t11 = $[31];
+  }
+  let t12;
+  if ($[32] !== t) {
+    t12 = t("Copy key");
+    $[32] = t;
+    $[33] = t12;
+  } else {
+    t12 = $[33];
+  }
+  let t13;
+  if ($[34] !== t11 || $[35] !== t12) {
+    t13 = /* @__PURE__ */ jsxDEV("div", {
+      className: "mb-2 flex justify-end",
+      children: /* @__PURE__ */ jsxDEV(Button, {
+        "data-testid": "kv-copy-key-btn",
+        onClick: t11,
+        size: "sm",
+        variant: "outline",
+        children: t12
+      }, void 0, false)
+    }, void 0, false);
+    $[34] = t11;
+    $[35] = t12;
+    $[36] = t13;
+  } else {
+    t13 = $[36];
+  }
+  let t14;
+  if ($[37] !== state.loadError) {
+    t14 = state.loadError !== null && /* @__PURE__ */ jsxDEV("p", {
+      className: "mb-2 text-sm text-destructive",
+      "data-testid": "kv-value-error",
+      role: "alert",
+      children: state.loadError
+    }, void 0, false);
+    $[37] = state.loadError;
+    $[38] = t14;
+  } else {
+    t14 = $[38];
+  }
+  let t15;
+  if ($[39] !== state.loading || $[40] !== t) {
+    t15 = state.loading && /* @__PURE__ */ jsxDEV("p", {
+      className: "text-sm text-muted-foreground",
+      "data-testid": "kv-value-loading",
+      children: t("Loading…")
+    }, void 0, false);
+    $[39] = state.loading;
+    $[40] = t;
+    $[41] = t15;
+  } else {
+    t15 = $[41];
+  }
+  let t16;
+  if ($[42] !== formattedValue || $[43] !== metadataValid || $[44] !== onDelete || $[45] !== onFormatValue || $[46] !== onSave || $[47] !== state.busy || $[48] !== state.editedMetadata || $[49] !== state.editedValue || $[50] !== state.loading || $[51] !== state.value || $[52] !== state.writeError || $[53] !== t || $[54] !== ttlValid) {
+    t16 = !state.loading && state.value !== null && /* @__PURE__ */ jsxDEV(Fragment, {
+      children: [/* @__PURE__ */ jsxDEV("div", {
+        className: "mb-1 flex flex-wrap items-center gap-2",
+        children: [/* @__PURE__ */ jsxDEV(Label, {
+          className: "text-xs",
+          htmlFor: "kv-value-editor",
+          children: t("Value")
+        }, void 0, false), formattedValue !== void 0 && /* @__PURE__ */ jsxDEV(Badge, {
+          variant: "secondary",
+          children: t("JSON")
+        }, void 0, false), /* @__PURE__ */ jsxDEV("span", {
+          className: "ml-auto text-xs tabular-nums text-muted-foreground",
+          "data-testid": "kv-value-size",
+          children: formatBytes(byteLength(state.editedValue))
+        }, void 0, false)]
+      }, void 0, true), /* @__PURE__ */ jsxDEV("textarea", {
+        "aria-label": t("KV value"),
+        className: "mb-2 min-h-[8rem] w-full rounded border border-border bg-muted/30 p-2 font-mono text-xs",
+        "data-testid": "kv-value-editor",
+        id: "kv-value-editor",
+        onChange: onEditedValueChange,
+        value: state.editedValue
+      }, void 0, false), /* @__PURE__ */ jsxDEV("div", {
+        className: "mb-3 flex flex-wrap gap-2",
+        children: [/* @__PURE__ */ jsxDEV(Button, {
+          "data-testid": "kv-format-btn",
+          disabled: formattedValue === void 0,
+          onClick: onFormatValue,
+          size: "sm",
+          variant: "outline",
+          children: t("Format JSON")
+        }, void 0, false), /* @__PURE__ */ jsxDEV(Button, {
+          "data-testid": "kv-copy-value-btn",
+          onClick: () => {
+            copyToClipboard(state.editedValue);
+          },
+          size: "sm",
+          variant: "outline",
+          children: t("Copy value")
+        }, void 0, false)]
+      }, void 0, true), /* @__PURE__ */ jsxDEV(TtlField, {
+        helper: t("Leave blank to keep the current expiration."),
+        id: "kv-ttl-input",
+        invalid: !ttlValid,
+        onChange: (seconds) => {
+          dispatch({
+            type: "editTtl",
+            value: seconds
+          });
+        },
+        testId: "kv-ttl-input"
+      }, void 0, false), /* @__PURE__ */ jsxDEV(MetadataField, {
+        id: "kv-metadata-editor",
+        invalidTestId: "kv-metadata-invalid",
+        onChange: onEditedMetadataChange,
+        testId: "kv-metadata-editor",
+        valid: metadataValid,
+        value: state.editedMetadata
+      }, void 0, false), /* @__PURE__ */ jsxDEV("div", {
+        className: "flex flex-wrap gap-2",
+        children: [/* @__PURE__ */ jsxDEV(Button, {
+          "data-testid": "kv-save-btn",
+          disabled: state.busy !== "" || !metadataValid || !ttlValid,
+          onClick: onSave,
+          children: state.busy === "saving" ? t("Saving…") : t("Save")
+        }, void 0, false), /* @__PURE__ */ jsxDEV(Button, {
+          "data-testid": "kv-delete-btn",
+          disabled: state.busy !== "",
+          onClick: onDelete,
+          variant: "destructive",
+          children: state.busy === "deleting" ? t("Deleting…") : t("Delete")
+        }, void 0, false)]
+      }, void 0, true), state.writeError !== null && /* @__PURE__ */ jsxDEV("p", {
+        className: "mt-2 text-sm text-destructive",
+        "data-testid": "kv-save-error",
+        role: "alert",
+        children: state.writeError
+      }, void 0, false)]
+    }, void 0, true);
+    $[42] = formattedValue;
+    $[43] = metadataValid;
+    $[44] = onDelete;
+    $[45] = onFormatValue;
+    $[46] = onSave;
+    $[47] = state.busy;
+    $[48] = state.editedMetadata;
+    $[49] = state.editedValue;
+    $[50] = state.loading;
+    $[51] = state.value;
+    $[52] = state.writeError;
+    $[53] = t;
+    $[54] = ttlValid;
+    $[55] = t16;
+  } else {
+    t16 = $[55];
+  }
+  let t17;
+  if ($[56] !== state.loadError || $[57] !== state.loading || $[58] !== state.value || $[59] !== t) {
+    t17 = !state.loading && state.value === null && state.loadError === null && /* @__PURE__ */ jsxDEV("p", {
+      className: "text-sm text-muted-foreground",
+      "data-testid": "kv-absent",
+      children: t("Key is absent or has no value.")
+    }, void 0, false);
+    $[56] = state.loadError;
+    $[57] = state.loading;
+    $[58] = state.value;
+    $[59] = t;
+    $[60] = t17;
+  } else {
+    t17 = $[60];
+  }
+  let t18;
+  if ($[61] !== t13 || $[62] !== t14 || $[63] !== t15 || $[64] !== t16 || $[65] !== t17) {
+    t18 = /* @__PURE__ */ jsxDEV("div", {
+      className: "px-4 pb-4",
+      "data-testid": "kv-value-section",
+      children: [t13, t14, t15, t16, t17]
+    }, void 0, true);
+    $[61] = t13;
+    $[62] = t14;
+    $[63] = t15;
+    $[64] = t16;
+    $[65] = t17;
+    $[66] = t18;
+  } else {
+    t18 = $[66];
+  }
+  return t18;
+};
+
+const DEFAULT_PAGE_SIZE = 100;
+const INITIAL_KEY_LIST_STATE = {
+  appliedPrefix: "",
+  bulk: [],
+  bulkBusy: false,
+  bulkError: null,
+  cursor: null,
+  keys: null,
+  listComplete: false,
+  loadError: null,
+  loading: false,
+  prefixInput: "",
+  reloadNonce: 0,
+  selectedKey: null
+};
+const keyListReducer = (state, action) => {
+  switch (action.type) {
+    case "appendPage": {
+      return {
+        ...state,
+        cursor: action.cursor,
+        keys: [...state.keys ?? [], ...action.keys],
+        listComplete: action.listComplete,
+        loading: false
+      };
+    }
+    case "applyFilter": {
+      return {
+        ...state,
+        appliedPrefix: state.prefixInput,
+        bulk: [],
+        bulkError: null,
+        cursor: null,
+        keys: null,
+        listComplete: false,
+        selectedKey: null
+      };
+    }
+    case "bulkDeleted": {
+      const removed = new Set(action.deleted);
+      return {
+        ...state,
+        bulk: state.bulk.filter((name) => !removed.has(name)),
+        bulkBusy: false,
+        bulkError: action.error,
+        keys: state.keys === null ? null : state.keys.filter((entry) => !removed.has(entry.name)),
+        selectedKey: state.selectedKey !== null && removed.has(state.selectedKey) ? null : state.selectedKey
+      };
+    }
+    case "bulkDeleteStart": {
+      return {
+        ...state,
+        bulkBusy: true,
+        bulkError: null
+      };
+    }
+    case "firstPage": {
+      return {
+        ...state,
+        cursor: action.cursor,
+        keys: action.keys,
+        listComplete: action.listComplete,
+        loading: false
+      };
+    }
+    case "keyDeleted": {
+      return {
+        ...state,
+        bulk: state.bulk.filter((name) => name !== action.name),
+        keys: state.keys === null ? null : state.keys.filter((entry) => entry.name !== action.name),
+        selectedKey: null
+      };
+    }
+    case "loadFailed": {
+      return {
+        ...state,
+        loadError: action.error,
+        loading: false
+      };
+    }
+    case "loadStart": {
+      return {
+        ...state,
+        loadError: null,
+        loading: true
+      };
+    }
+    case "prefixInput": {
+      return {
+        ...state,
+        prefixInput: action.value
+      };
+    }
+    case "reload": {
+      return {
+        ...state,
+        bulk: [],
+        bulkError: null,
+        reloadNonce: state.reloadNonce + 1,
+        selectedKey: null
+      };
+    }
+    case "selectKey": {
+      return {
+        ...state,
+        selectedKey: action.name
+      };
+    }
+    case "toggleAllBulk": {
+      return {
+        ...state,
+        bulk: action.names
+      };
+    }
+    case "toggleBulk": {
+      return {
+        ...state,
+        bulk: state.bulk.includes(action.name) ? state.bulk.filter((name) => name !== action.name) : [...state.bulk, action.name]
+      };
+    }
+    default: {
+      return state;
+    }
+  }
+};
+const KvKeyList = ({
+  namespace
+}) => {
+  const client = useLunora();
+  const t = useT();
+  const [state, dispatch] = useReducer(keyListReducer, INITIAL_KEY_LIST_STATE);
+  const {
+    appliedPrefix,
+    bulk,
+    bulkBusy,
+    bulkError,
+    cursor,
+    keys,
+    listComplete,
+    loadError,
+    loading,
+    prefixInput,
+    reloadNonce,
+    selectedKey
+  } = state;
+  const [showCreate, setShowCreate] = useState(false);
+  useEffect(() => {
+    const token = {
+      cancelled: false
+    };
+    fireAndForget((async () => {
+      dispatch({
+        type: "loadStart"
+      });
+      try {
+        const result = await client.listKvKeys({
+          limit: DEFAULT_PAGE_SIZE,
+          namespace,
+          prefix: appliedPrefix === "" ? void 0 : appliedPrefix
+        });
+        if (!token.cancelled) {
+          dispatch({
+            cursor: result.cursor ?? null,
+            keys: result.keys,
+            listComplete: result.listComplete,
+            type: "firstPage"
+          });
+        }
+      } catch (error_) {
+        if (!token.cancelled) {
+          dispatch({
+            error: errorMessage(error_),
+            type: "loadFailed"
+          });
+        }
+      }
+    })());
+    return () => {
+      token.cancelled = true;
+    };
+  }, [client, namespace, appliedPrefix, reloadNonce]);
+  const onPrefixChange = (event) => {
+    dispatch({
+      type: "prefixInput",
+      value: event.target.value
+    });
+  };
+  const onFilter = () => {
+    dispatch({
+      type: "applyFilter"
+    });
+  };
+  const onSelectKey = (event_0) => {
+    dispatch({
+      name: event_0.currentTarget.dataset.key ?? null,
+      type: "selectKey"
+    });
+  };
+  const onLoadMore = () => {
+    if (cursor === null) {
+      return;
+    }
+    dispatch({
+      type: "loadStart"
+    });
+    fireAndForget((async () => {
+      try {
+        const result_0 = await client.listKvKeys({
+          cursor,
+          limit: DEFAULT_PAGE_SIZE,
+          namespace,
+          prefix: appliedPrefix === "" ? void 0 : appliedPrefix
+        });
+        dispatch({
+          cursor: result_0.cursor ?? null,
+          keys: result_0.keys,
+          listComplete: result_0.listComplete,
+          type: "appendPage"
+        });
+      } catch (error__0) {
+        dispatch({
+          error: errorMessage(error__0),
+          type: "loadFailed"
+        });
+      }
+    })());
+  };
+  const onKeyDeleted = (name) => {
+    dispatch({
+      name,
+      type: "keyDeleted"
+    });
+  };
+  const onToggleBulk = (name_0) => {
+    dispatch({
+      name: name_0,
+      type: "toggleBulk"
+    });
+  };
+  const onToggleAll = (checked) => {
+    dispatch({
+      names: checked && keys !== null ? keys.map((entry) => entry.name) : [],
+      type: "toggleAllBulk"
+    });
+  };
+  const onBulkDelete = () => {
+    if (bulk.length === 0) {
+      return;
+    }
+    const names = [...bulk];
+    dispatch({
+      type: "bulkDeleteStart"
+    });
+    fireAndForget((async () => {
+      const results = await Promise.allSettled(names.map((name_1) => client.deleteKvKey({
+        key: name_1,
+        namespace
+      })));
+      const deleted = names.filter((_, index) => results[index]?.status === "fulfilled");
+      const failed = names.length - deleted.length;
+      dispatch({
+        deleted,
+        error: failed > 0 ? t("Failed to delete {count} keys.", {
+          count: failed
+        }) : null,
+        type: "bulkDeleted"
+      });
+    })());
+  };
+  const onCreated = () => {
+    setShowCreate(false);
+    dispatch({
+      type: "reload"
+    });
+  };
+  const allSelected = keys !== null && keys.length > 0 && bulk.length === keys.length;
+  return /* @__PURE__ */ jsxDEV(Fragment, {
+    children: [/* @__PURE__ */ jsxDEV("section", {
+      className: "border border-border bg-card p-3",
+      "data-testid": "kv-keys-section",
+      children: [/* @__PURE__ */ jsxDEV("div", {
+        className: "mb-3 flex flex-wrap items-center gap-2",
+        children: [/* @__PURE__ */ jsxDEV(Input, {
+          "aria-label": t("Filter keys by prefix"),
+          className: "min-w-[16rem] flex-1",
+          "data-testid": "kv-prefix-input",
+          onChange: onPrefixChange,
+          placeholder: t("Filter by prefix…"),
+          value: prefixInput
+        }, void 0, false), /* @__PURE__ */ jsxDEV(Button, {
+          "data-testid": "kv-filter-btn",
+          disabled: loading,
+          onClick: onFilter,
+          children: t("Filter")
+        }, void 0, false), /* @__PURE__ */ jsxDEV(Button, {
+          "data-testid": "kv-new-key-btn",
+          onClick: () => {
+            setShowCreate((open) => !open);
+          },
+          variant: "outline",
+          children: t("New key")
+        }, void 0, false), bulk.length > 0 && /* @__PURE__ */ jsxDEV(Button, {
+          "data-testid": "kv-bulk-delete-btn",
+          disabled: bulkBusy,
+          onClick: onBulkDelete,
+          variant: "destructive",
+          children: bulkBusy ? t("Deleting…") : t("Delete {count}", {
+            count: bulk.length
+          })
+        }, void 0, false)]
+      }, void 0, true), bulkError !== null && /* @__PURE__ */ jsxDEV("p", {
+        className: "mb-2 text-sm text-destructive",
+        "data-testid": "kv-bulk-error",
+        role: "alert",
+        children: bulkError
+      }, void 0, false), loadError !== null && /* @__PURE__ */ jsxDEV("p", {
+        className: "text-sm text-destructive",
+        "data-testid": "kv-keys-error",
+        role: "alert",
+        children: loadError
+      }, void 0, false), keys !== null && keys.length === 0 && !loading && /* @__PURE__ */ jsxDEV("p", {
+        className: "text-sm text-muted-foreground",
+        "data-testid": "kv-no-keys",
+        children: t("No keys.")
+      }, void 0, false), keys !== null && keys.length > 0 && /* @__PURE__ */ jsxDEV(Card, {
+        className: "overflow-hidden py-0",
+        children: /* @__PURE__ */ jsxDEV(CardContent, {
+          className: "px-0",
+          children: /* @__PURE__ */ jsxDEV(Table, {
+            "data-testid": "kv-key-table",
+            children: [/* @__PURE__ */ jsxDEV(TableHeader, {
+              children: /* @__PURE__ */ jsxDEV(TableRow, {
+                children: [/* @__PURE__ */ jsxDEV(TableHead, {
+                  className: "w-10",
+                  children: /* @__PURE__ */ jsxDEV(Checkbox, {
+                    "aria-label": t("Select all"),
+                    checked: allSelected,
+                    "data-testid": "kv-select-all",
+                    onCheckedChange: onToggleAll
+                  }, void 0, false)
+                }, void 0, false), /* @__PURE__ */ jsxDEV(TableHead, {
+                  children: t("Key")
+                }, void 0, false), /* @__PURE__ */ jsxDEV(TableHead, {
+                  children: t("Expiration")
+                }, void 0, false)]
+              }, void 0, true)
+            }, void 0, false), /* @__PURE__ */ jsxDEV(TableBody, {
+              children: keys.map((entry_0) => /* @__PURE__ */ jsxDEV(TableRow, {
+                className: entry_0.name === selectedKey ? "border-l-2 border-l-royal-amethyst bg-muted/50" : "cursor-pointer",
+                "data-key": entry_0.name,
+                "data-testid": `kv-key-row-${entry_0.name}`,
+                onClick: onSelectKey,
+                children: [/* @__PURE__ */ jsxDEV(TableCell, {
+                  onClick: (event_1) => {
+                    event_1.stopPropagation();
+                  },
+                  children: /* @__PURE__ */ jsxDEV(Checkbox, {
+                    "aria-label": t("Select {name}", {
+                      name: entry_0.name
+                    }),
+                    checked: bulk.includes(entry_0.name),
+                    "data-testid": `kv-select-${entry_0.name}`,
+                    onCheckedChange: () => {
+                      onToggleBulk(entry_0.name);
+                    }
+                  }, void 0, false)
+                }, void 0, false), /* @__PURE__ */ jsxDEV(TableCell, {
+                  className: "font-mono text-xs",
+                  children: entry_0.name
+                }, void 0, false), /* @__PURE__ */ jsxDEV(TableCell, {
+                  className: "tabular-nums text-xs",
+                  children: formatExpiration(entry_0.expiration)
+                }, void 0, false)]
+              }, entry_0.name, true))
+            }, void 0, false)]
+          }, void 0, true)
+        }, void 0, false)
+      }, void 0, false), !listComplete && cursor !== null && /* @__PURE__ */ jsxDEV("div", {
+        className: "mt-2",
+        children: /* @__PURE__ */ jsxDEV(Button, {
+          "data-testid": "kv-load-more",
+          disabled: loading,
+          onClick: onLoadMore,
+          variant: "outline",
+          children: loading ? t("Loading…") : t("Load more")
+        }, void 0, false)
+      }, void 0, false)]
+    }, void 0, true), /* @__PURE__ */ jsxDEV(Sheet, {
+      onOpenChange: (open_0) => {
+        if (!open_0) {
+          setShowCreate(false);
+        }
+      },
+      open: showCreate,
+      children: /* @__PURE__ */ jsxDEV(SheetContent, {
+        className: "w-full gap-0 overflow-y-auto sm:max-w-md",
+        "data-testid": "kv-create-sheet",
+        side: "right",
+        children: [/* @__PURE__ */ jsxDEV(SheetHeader, {
+          children: /* @__PURE__ */ jsxDEV(SheetTitle, {
+            children: t("New key")
+          }, void 0, false)
+        }, void 0, false), /* @__PURE__ */ jsxDEV(KvCreateForm, {
+          namespace,
+          onCancel: () => {
+            setShowCreate(false);
+          },
+          onCreated
+        }, void 0, false)]
+      }, void 0, true)
+    }, void 0, false), /* @__PURE__ */ jsxDEV(Sheet, {
+      onOpenChange: (open_1) => {
+        if (!open_1) {
+          dispatch({
+            name: null,
+            type: "selectKey"
+          });
+        }
+      },
+      open: selectedKey !== null,
+      children: /* @__PURE__ */ jsxDEV(SheetContent, {
+        className: "w-full gap-0 overflow-y-auto sm:max-w-md",
+        "data-testid": "kv-editor-sheet",
+        side: "right",
+        children: [/* @__PURE__ */ jsxDEV(SheetHeader, {
+          children: /* @__PURE__ */ jsxDEV(SheetTitle, {
+            className: "truncate font-mono text-xs",
+            children: selectedKey
+          }, void 0, false)
+        }, void 0, false), selectedKey !== null && /* @__PURE__ */ jsxDEV(KvValueEditor, {
+          expiration: keys?.find((entry_1) => entry_1.name === selectedKey)?.expiration,
+          keyName: selectedKey,
+          namespace,
+          onDeleted: onKeyDeleted
+        }, `${namespace}:${selectedKey}`, false)]
+      }, void 0, true)
+    }, void 0, false)]
+  }, void 0, true);
+};
+
+const KvBrowser = ({
+  loadNamespaces
+} = {}) => {
+  const client = useLunora();
+  const t = useT();
+  const [namespaces, setNamespaces] = useState(null);
+  const [nsError, setNsError] = useState(null);
+  const [selectedNs, setSelectedNs] = useState(null);
+  useEffect(() => {
+    const token = {
+      cancelled: false
+    };
+    fireAndForget((async () => {
+      try {
+        const result = await (loadNamespaces ?? (() => client.listKvNamespaces()))();
+        if (!token.cancelled) {
+          setNamespaces(result);
+          setNsError(null);
+          setSelectedNs((current) => current ?? result[0]?.binding ?? null);
+        }
+      } catch (error_) {
+        if (!token.cancelled) {
+          setNamespaces(null);
+          setNsError(errorMessage(error_));
+        }
+      }
+    })());
+    return () => {
+      token.cancelled = true;
+    };
+  }, [client, loadNamespaces]);
+  const onSelectNs = (event) => {
+    setSelectedNs(event.currentTarget.dataset.ns ?? null);
+  };
+  return /* @__PURE__ */ jsxDEV("div", {
+    className: "flex flex-col gap-4",
+    "data-testid": "lunora-kv-browser",
+    children: [nsError !== null && /* @__PURE__ */ jsxDEV("p", {
+      className: "text-sm text-destructive",
+      "data-testid": "kv-ns-error",
+      role: "alert",
+      children: nsError
+    }, void 0, false), namespaces !== null && namespaces.length === 0 && /* @__PURE__ */ jsxDEV(EmptyState, {
+      description: t("Add a kv_namespaces binding to wrangler.jsonc — it appears here automatically, no wiring needed."),
+      icon: /* @__PURE__ */ jsxDEV("svg", {
+        "aria-hidden": "true",
+        fill: "none",
+        stroke: "currentColor",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.6,
+        viewBox: "0 0 24 24",
+        children: /* @__PURE__ */ jsxDEV("path", {
+          d: "M5 5h14v4H5V5Zm0 5h14v4H5v-4Zm0 5h14v4H5v-4Z"
+        }, void 0, false)
+      }, void 0, false),
+      testId: "kv-empty",
+      title: t("No KV namespaces.")
+    }, void 0, false), namespaces !== null && namespaces.length > 0 && /* @__PURE__ */ jsxDEV(Card, {
+      className: "overflow-hidden py-0",
+      children: /* @__PURE__ */ jsxDEV(CardContent, {
+        className: "px-0",
+        children: /* @__PURE__ */ jsxDEV(Table, {
+          "data-testid": "kv-namespace-table",
+          children: [/* @__PURE__ */ jsxDEV(TableHeader, {
+            children: /* @__PURE__ */ jsxDEV(TableRow, {
+              children: /* @__PURE__ */ jsxDEV(TableHead, {
+                children: t("Namespace")
+              }, void 0, false)
+            }, void 0, false)
+          }, void 0, false), /* @__PURE__ */ jsxDEV(TableBody, {
+            children: namespaces.map((ns) => /* @__PURE__ */ jsxDEV(TableRow, {
+              className: ns.binding === selectedNs ? "border-l-2 border-l-royal-amethyst bg-muted/50" : "cursor-pointer",
+              "data-ns": ns.binding,
+              "data-testid": `kv-ns-row-${ns.binding}`,
+              onClick: onSelectNs,
+              children: /* @__PURE__ */ jsxDEV(TableCell, {
+                className: "font-mono text-xs",
+                children: ns.binding
+              }, void 0, false)
+            }, ns.binding, false))
+          }, void 0, false)]
+        }, void 0, true)
+      }, void 0, false)
+    }, void 0, false), selectedNs !== null && /* @__PURE__ */ jsxDEV(KvKeyList, {
+      namespace: selectedNs
+    }, selectedNs, false)]
+  }, void 0, true);
+};
+
+export { KvBrowser };