@flytedan/flytebot-design-system 0.65.0 → 0.67.0

package/dist/index.cjs

@@ -5003,6 +5003,7 @@ function isFieldSet(field, value) {
   switch (field.type) {
     case "text":
     case "select":
+    case "fixed":
       return isSet(value);
     case "multiSelect": {
       const v = value;
@@ -5042,6 +5043,8 @@ function validateFilterValue(field, value) {
   switch (field.type) {
     case "text":
       return typeof value === "string" ? { ok: true } : { ok: false, reason: "Enter text" };
+    case "fixed":
+      return { ok: false, reason: "This filter is set from outside and cannot be edited" };
     case "select":
       return field.options.some((o) => o.value === value) ? { ok: true } : { ok: false, reason: "Pick one of the options" };
     case "multiSelect": {
@@ -5123,6 +5126,8 @@ function chipLabel(field, value) {
   switch (field.type) {
     case "text":
       return String(value ?? "");
+    case "fixed":
+      return field.valueLabel;
     case "select": {
       const chosen = field.options.find((o) => o.value === value);
       return chosen ? chosen.label : String(value ?? "");
@@ -5760,7 +5765,7 @@ function FilterBar({ fields = [], filters, onFilterChange, onFilterRemove, align
       target?.focus();
     }
   }, [panel]);
-  const addableFields = fields.filter((f) => !isFieldSet(f, filters[f.key]));
+  const addableFields = fields.filter((f) => f.type !== "fixed" && !isFieldSet(f, filters[f.key]));
   const activeCount = activeFilterCount(fields, filters);
   const canAdd = addableFields.length > 0;
   const showCount = showActiveCount && activeCount > 0;
@@ -5854,6 +5859,14 @@ function FilterBar({ fields = [], filters, onFilterChange, onFilterRemove, align
         }
         const set = isFieldSet(field, value);
         if (!editing && !set) return null;
+        if (field.type === "fixed") {
+          const fixedText = field.label + ": " + field.valueLabel;
+          return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "fd-filterbar-chip", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("span", { className: "fd-tag fd-filterbar-fixed", role: "group", title: fixedText, "aria-label": fixedText, children: [
+            field.icon ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("i", { className: "ph ph-" + field.icon, "aria-hidden": "true" }) : null,
+            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "fd-tag-label", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(MiddleEllipsis, { text: field.icon ? field.valueLabel : fixedText }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("button", { type: "button", className: "fd-tag-remove", "aria-label": "Remove " + fixedText, onClick: () => removeField(field), children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("i", { className: "ph ph-x", "aria-hidden": "true" }) })
+          ] }) }, field.key);
+        }
         const chipRef = editing ? editAnchorRef : void 0;
         const toggleOrClose = () => editing ? closeEditing() : startEditing(field.key);
         const remove = () => {
@@ -5967,12 +5980,13 @@ function isZeroDelta(delta) {
   const match = delta.match(/[\d.]+/);
   return match !== null && parseFloat(match[0]) === 0;
 }
-function StatTile({ label, value, sub, delta, invert = false, loading = false, compact: compact3 = false, className = "", ...rest }) {
+function StatTile(props) {
+  const { label, value, sub, delta, invert = false, loading = false, compact: compact3 = false, className = "", ...rest } = props;
   const isDecrease = delta?.startsWith("-") ?? false;
   const isZero = isZeroDelta(delta);
   const isGood = invert ? isDecrease : !isDecrease;
   const deltaToneClass = isZero ? "fd-stat-delta-neutral" : isGood ? "fd-stat-delta-up" : "fd-stat-delta-down";
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: ["fd-stat", compact3 ? "fd-stat-compact" : "", className].filter(Boolean).join(" "), ...rest, children: [
+  const content = /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_jsx_runtime52.Fragment, { children: [
     loading ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "fd-skel fd-skel-text", style: { display: "block", height: compact3 ? 20 : 28, width: "62%" } }) : /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("span", { className: "fd-stat-top", children: [
       /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "fd-stat-figure", children: value }),
       delta ? /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("span", { className: "fd-stat-delta " + deltaToneClass, children: [
@@ -5984,6 +5998,12 @@ function StatTile({ label, value, sub, delta, invert = false, loading = false, c
     !loading && sub ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "fd-stat-sub", children: sub }) : null,
     loading ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "fd-skel fd-skel-text", style: { display: "block", height: 10, width: "40%", marginTop: 8 } }) : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "fd-stat-label", style: { display: "block" }, children: label })
   ] });
+  const classes = (...extra) => ["fd-stat", ...extra, compact3 ? "fd-stat-compact" : "", className].filter(Boolean).join(" ");
+  if (rest.onPress) {
+    const { onPress, pressed, disabled = false, ...buttonRest } = rest;
+    return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("button", { type: "button", className: classes("fd-stat-pressable"), "aria-pressed": pressed, disabled: disabled || loading, onClick: onPress, ...buttonRest, children: content });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: classes(), ...rest, children: content });
 }
 
 // src/components/data/CodeBlock.tsx