@floegence/floe-webapp-core 0.35.7 → 0.35.8

package/dist/components/ui/MobileKeyboard.d.ts

@@ -0,0 +1,22 @@
+import { type JSX } from 'solid-js';
+export interface MobileKeyboardSuggestionItem {
+    id: string;
+    label: string;
+    detail?: string;
+    kind?: string;
+}
+export interface MobileKeyboardProps<TSuggestion extends MobileKeyboardSuggestionItem = MobileKeyboardSuggestionItem> extends JSX.HTMLAttributes<HTMLDivElement> {
+    /** Whether the keyboard is visible */
+    visible: boolean;
+    /** Called whenever a key resolves to a terminal payload */
+    onKey?: (key: string) => void;
+    /** Called when the user dismisses the keyboard from the built-in control */
+    onDismiss?: () => void;
+    /** Additional terminal-friendly quick insert keys shown in the utility strip */
+    quickInserts?: readonly string[];
+    /** Optional terminal suggestions shown in a dedicated candidate rail */
+    suggestions?: readonly TSuggestion[];
+    /** Called when the user picks one of the terminal suggestions */
+    onSuggestionSelect?: (suggestion: TSuggestion) => void;
+}
+export declare function MobileKeyboard<TSuggestion extends MobileKeyboardSuggestionItem = MobileKeyboardSuggestionItem>(props: MobileKeyboardProps<TSuggestion>): JSX.Element;

package/dist/components/ui/MobileKeyboard.js

@@ -0,0 +1,287 @@
+import { spread as B, mergeProps as N, insert as l, createComponent as b, memo as te, effect as re, className as ae, setStyleProperty as ie, template as f, setAttribute as $e, use as Se, delegateEvents as Re } from "solid-js/web";
+import { splitProps as Ee, createSignal as u, createMemo as k, createEffect as Ae, onCleanup as Ke, Show as W, For as _ } from "solid-js";
+import { cn as H } from "../../utils/cn.js";
+import { isRepeatableTerminalAction as Ce, DEFAULT_MOBILE_KEYBOARD_QUICK_INSERTS as Oe, applyTerminalModifiers as De, createMobileKeyboardPressTracker as Le, mapTerminalActionToKey as Me } from "./mobileKeyboardModel.js";
+import { floeTouchSurfaceAttrs as q, preventTouchSurfacePointerDown as oe } from "../../utils/touchSurfaceGuard.js";
+var xe = /* @__PURE__ */ f("<button type=button>"), Be = /* @__PURE__ */ f("<button>Hide"), Ne = /* @__PURE__ */ f('<div class=mobile-keyboard-rail-shell><div class=mobile-keyboard-suggestion-rail role=list aria-label="Terminal suggestions">'), We = /* @__PURE__ */ f('<div><div class=mobile-keyboard-panel><div></div><div class=mobile-keyboard-scroll><div class=mobile-keyboard-rail-shell><div class=mobile-keyboard-top-strip></div></div><div class=mobile-keyboard-main></div><div class=mobile-keyboard-bottom-zone><div class=mobile-keyboard-direction-pad role=group aria-label="Arrow keys">'), He = /* @__PURE__ */ f("<button>"), qe = /* @__PURE__ */ f("<div class=mobile-keyboard-row>");
+const Ye = ["q", "w", "e", "r", "t", "y", "u", "i", "o", "p"], Ue = ["a", "s", "d", "f", "g", "h", "j", "k", "l"], ze = ["z", "x", "c", "v", "b", "n", "m"], Fe = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0"], je = ["@", "#", "$", "%", "&", "*", "(", ")", "[", "]"], Qe = ["+", "=", "{", "}", ".", ",", "?", "!", "'"], Ve = [{
+  action: "escape",
+  label: "Esc"
+}, {
+  action: "tab",
+  label: "Tab"
+}], Ge = [{
+  action: "arrow-up",
+  label: "↑",
+  position: "up"
+}, {
+  action: "arrow-left",
+  label: "←",
+  position: "left"
+}, {
+  action: "arrow-down",
+  label: "↓",
+  position: "down"
+}, {
+  action: "arrow-right",
+  label: "→",
+  position: "right"
+}], Je = 320, Xe = 68;
+function it(le) {
+  const [n, se] = Ee(le, ["visible", "onKey", "onDismiss", "quickInserts", "suggestions", "onSuggestionSelect", "class"]), [g, Y] = u("letters"), [U, S] = u(!1), [z, R] = u(!1), [F, E] = u(!1), [ne, j] = u([]), [h, A] = u(null), ce = k(() => new Set(ne()));
+  let K, v;
+  const c = Le(), I = /* @__PURE__ */ new Map(), de = () => n.quickInserts ?? Oe, C = k(() => n.suggestions ?? []), Q = () => {
+    S(!1), R(!1), E(!1);
+  }, P = () => {
+    v && (clearTimeout(v), v = void 0);
+  }, O = () => {
+    j(c.getPressedKeyIds());
+  }, T = (e) => {
+    const t = I.get(e);
+    t && (t.delayTimer && clearTimeout(t.delayTimer), t.intervalTimer && clearInterval(t.intervalTimer), I.delete(e));
+  }, V = () => {
+    for (const e of I.keys())
+      T(e);
+  }, be = () => {
+    Y("letters"), Q(), c.reset(), j([]), A(null), P(), V();
+  }, G = (e) => {
+    e && n.onKey?.(e);
+  }, pe = (e) => {
+    G(De(e, {
+      ctrl: U(),
+      alt: z()
+    })), Q();
+  }, me = (e) => {
+    G(Me(e)), S(!1), R(!1);
+  }, D = (e) => g() !== "letters" ? e : F() ? e.toUpperCase() : e, ye = (e) => {
+    switch (e) {
+      case "ctrl":
+        S((t) => !t);
+        return;
+      case "alt":
+        R((t) => !t);
+        return;
+      case "shift":
+        E((t) => !t);
+    }
+  }, ue = (e) => {
+    Y(e), E(!1);
+  }, ke = (e, t, r) => {
+    const s = K?.getBoundingClientRect(), i = r.getBoundingClientRect();
+    P(), s && A({
+      pointerId: e,
+      label: t,
+      left: i.left - s.left + i.width / 2,
+      top: i.top - s.top,
+      visible: !0
+    });
+  }, J = (e) => {
+    h()?.pointerId === e && (P(), v = setTimeout(() => {
+      A((t) => t?.pointerId === e ? {
+        ...t,
+        visible: !1
+      } : t), v = void 0;
+    }, 100));
+  }, fe = (e, t, r, s) => {
+    if (T(e), !r || typeof window > "u") return;
+    const i = {};
+    I.set(e, i), i.delayTimer = setTimeout(() => {
+      i.delayTimer = void 0, c.hasPress(e, t) && (c.markRepeated(e), s(), i.intervalTimer = setInterval(() => {
+        if (!c.hasPress(e, t)) {
+          T(e);
+          return;
+        }
+        s();
+      }, Xe));
+    }, Je);
+  }, he = (e, t) => {
+    t.preventDefault(), t.currentTarget.setPointerCapture?.(t.pointerId), c.startPress(t.pointerId, e.keyId), O(), ke(t.pointerId, e.label, t.currentTarget), fe(t.pointerId, e.keyId, e.repeatable, e.activate);
+  }, ve = (e, t) => {
+    t.currentTarget.releasePointerCapture?.(t.pointerId), T(t.pointerId);
+    const r = c.finishPress(t.pointerId, e.keyId);
+    O(), J(t.pointerId), r.shouldActivate && e.activate();
+  }, Te = (e) => {
+    e.currentTarget.releasePointerCapture?.(e.pointerId), T(e.pointerId), c.cancelPress(e.pointerId), O(), J(e.pointerId);
+  }, we = (e, t) => {
+    t.detail === 0 && e.activate();
+  }, d = (e, t) => ({
+    keyId: t?.keyId ?? `text-${e}`,
+    label: t?.label ?? e,
+    repeatable: !1,
+    activate: () => pe(e),
+    width: t?.width,
+    class: t?.class,
+    kind: "text"
+  }), w = (e, t, r) => ({
+    keyId: r?.keyId ?? `action-${e}`,
+    label: t,
+    repeatable: r?.repeatable ?? Ce(e),
+    activate: () => me(e),
+    width: r?.width,
+    class: r?.class,
+    kind: "terminal"
+  }), L = (e, t, r) => ({
+    keyId: `modifier-${e}`,
+    label: t,
+    repeatable: !1,
+    activate: () => ye(e),
+    width: e === "shift" ? "wide" : "normal",
+    active: e === "ctrl" ? U() : e === "alt" ? z() : F(),
+    kind: "modifier",
+    class: r?.class
+  }), _e = k(() => [...Ve.map((e) => w(e.action, e.label, {
+    class: "mobile-keyboard-key-compact"
+  })), L("ctrl", "Ctrl", {
+    class: "mobile-keyboard-key-compact"
+  }), L("alt", "Alt", {
+    class: "mobile-keyboard-key-compact"
+  }), ...de().map((e) => d(e, {
+    keyId: `quick-${e}`,
+    class: "mobile-keyboard-key-compact mobile-keyboard-key-utility"
+  }))]), ge = k(() => g() === "symbols" ? [Fe.map((e) => d(e)), je.map((e) => d(e)), [...Qe.map((e) => d(e)), w("backspace", "⌫", {
+    width: "wide",
+    class: "mobile-keyboard-key-backspace"
+  })]] : [Ye.map((e) => d(D(e), {
+    keyId: `letter-${e}`
+  })), Ue.map((e) => d(D(e), {
+    keyId: `letter-${e}`
+  })), [L("shift", "Shift"), ...ze.map((e) => d(D(e), {
+    keyId: `letter-${e}`
+  })), w("backspace", "⌫", {
+    width: "wide",
+    class: "mobile-keyboard-key-backspace"
+  })]]), M = k(() => [{
+    keyId: "mode-switch",
+    label: g() === "letters" ? "123" : "ABC",
+    repeatable: !1,
+    activate: () => ue(g() === "letters" ? "symbols" : "letters"),
+    width: "wide",
+    kind: "mode",
+    class: "mobile-keyboard-key-bottom-mode"
+  }, d(" ", {
+    keyId: "space",
+    label: "Space",
+    width: "space",
+    class: "mobile-keyboard-key-bottom-space"
+  }), w("enter", "Enter", {
+    width: "wide",
+    class: "mobile-keyboard-key-bottom-enter"
+  })]), Ie = k(() => Ge.map((e) => w(e.action, e.label, {
+    class: `mobile-keyboard-direction-key mobile-keyboard-direction-key-${e.position}`
+  }))), m = (e) => (() => {
+    var t = xe();
+    return t.$$click = (r) => we(e, r), t.addEventListener("pointercancel", Te), t.$$pointerup = (r) => ve(e, r), t.$$pointerdown = (r) => he(e, r), l(t, () => e.label), re((r) => {
+      var s = H("mobile-keyboard-key", e.kind === "terminal" && "mobile-keyboard-key-terminal", e.kind === "modifier" && "mobile-keyboard-key-modifier", e.kind === "mode" && "mobile-keyboard-key-mode", e.width === "wide" && "mobile-keyboard-key-wide", e.width === "space" && "mobile-keyboard-key-space", e.active && "mobile-keyboard-key-active", ce().has(e.keyId) && "mobile-keyboard-key-pressed", e.class), i = e.active;
+      return s !== r.e && ae(t, r.e = s), i !== r.t && $e(t, "aria-pressed", r.t = i), r;
+    }, {
+      e: void 0,
+      t: void 0
+    }), t;
+  })(), X = () => b(W, {
+    get when() {
+      return n.onDismiss;
+    },
+    get children() {
+      var e = Be();
+      return B(e, N(q, {
+        type: "button",
+        class: "mobile-keyboard-dismiss",
+        "aria-label": "Close keyboard",
+        onPointerDown: (t) => {
+          oe(t), t.stopPropagation();
+        },
+        onClick: (t) => {
+          t.stopPropagation(), n.onDismiss?.();
+        }
+      }), !1, !0), e;
+    }
+  });
+  return Ae(() => {
+    n.visible || be();
+  }), Ke(() => {
+    P(), V();
+  }), (() => {
+    var e = We(), t = e.firstChild, r = t.firstChild, s = r.nextSibling, i = s.firstChild, Pe = i.firstChild, Z = i.nextSibling, $ = Z.nextSibling, x = $.firstChild;
+    B(e, N(q, {
+      get class() {
+        return H("mobile-keyboard-root", n.visible && "mobile-keyboard-visible", n.class);
+      },
+      get "aria-hidden"() {
+        return !n.visible;
+      },
+      role: "group",
+      "aria-label": "Mobile terminal keyboard"
+    }, se), !1, !0);
+    var ee = K;
+    return typeof ee == "function" ? Se(ee, t) : K = t, l(r, () => h()?.label ?? ""), l(s, b(W, {
+      get when() {
+        return C().length > 0;
+      },
+      get children() {
+        var a = Ne(), p = a.firstChild;
+        return l(p, b(_, {
+          get each() {
+            return C();
+          },
+          children: (o) => (() => {
+            var y = He();
+            return B(y, N(q, {
+              type: "button",
+              class: "mobile-keyboard-suggestion",
+              get "data-kind"() {
+                return o.kind;
+              },
+              get title() {
+                return o.detail ?? o.label;
+              },
+              get "aria-label"() {
+                return te(() => !!o.detail)() ? `${o.label} (${o.detail})` : o.label;
+              },
+              onPointerDown: oe,
+              onClick: () => n.onSuggestionSelect?.(o)
+            }), !1, !0), l(y, () => o.label), y;
+          })()
+        })), l(a, X, null), a;
+      }
+    }), i), l(Pe, b(_, {
+      get each() {
+        return _e();
+      },
+      children: (a) => m(a)
+    })), l(i, b(W, {
+      get when() {
+        return te(() => !!n.onDismiss)() && C().length === 0;
+      },
+      get children() {
+        return X();
+      }
+    }), null), l(Z, b(_, {
+      get each() {
+        return ge();
+      },
+      children: (a) => (() => {
+        var p = qe();
+        return l(p, b(_, {
+          each: a,
+          children: (o) => m(o)
+        })), p;
+      })()
+    })), l($, () => m(M()[0]), x), l($, () => m(M()[1]), x), l(x, b(_, {
+      get each() {
+        return Ie();
+      },
+      children: (a) => m(a)
+    })), l($, () => m(M()[2]), null), re((a) => {
+      var p = H("mobile-keyboard-popup", h()?.visible && "mobile-keyboard-popup-visible"), o = `${h()?.left ?? 0}px`, y = `${h()?.top ?? 0}px`;
+      return p !== a.e && ae(r, a.e = p), o !== a.t && ie(r, "left", a.t = o), y !== a.a && ie(r, "top", a.a = y), a;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0
+    }), e;
+  })();
+}
+Re(["pointerdown", "pointerup", "click"]);
+export {
+  it as MobileKeyboard
+};

package/dist/components/ui/index.d.ts

@@ -22,4 +22,5 @@ export { Switch, type SwitchProps, type SwitchSize } from './Switch';
 export { SegmentedControl, type SegmentedControlProps, type SegmentedControlOption, type SegmentedControlSize, } from './SegmentedControl';
 export { Checkbox, CheckboxGroup, CheckboxList, type CheckboxProps, type CheckboxGroupProps, type CheckboxListProps, type CheckboxSize, type CheckboxVariant, } from './Checkbox';
 export { Pagination, type PaginationProps, type PaginationSize, type PaginationVariant, } from './Pagination';
+export { MobileKeyboard, type MobileKeyboardProps, type MobileKeyboardSuggestionItem, } from './MobileKeyboard';
 export { LinearProgress, CircularProgress, SegmentedProgress, StepsProgress, type LinearProgressProps, type CircularProgressProps, type SegmentedProgressProps, type StepsProgressProps, type ProgressSize, type ProgressColor, } from './Progress';

package/dist/components/ui/mobileKeyboardModel.d.ts

@@ -0,0 +1,24 @@
+export type MobileKeyboardAction = 'escape' | 'tab' | 'enter' | 'backspace' | 'arrow-up' | 'arrow-down' | 'arrow-left' | 'arrow-right';
+export type MobileKeyboardLayout = 'letters' | 'symbols';
+export interface MobileKeyboardModifierState {
+    ctrl: boolean;
+    alt: boolean;
+}
+export interface MobileKeyboardPressResolution {
+    keyId: string | null;
+    shouldActivate: boolean;
+}
+export declare const DEFAULT_MOBILE_KEYBOARD_QUICK_INSERTS: string[];
+export declare function applyTerminalModifiers(text: string, modifiers: MobileKeyboardModifierState): string;
+export declare function mapTerminalActionToKey(action: MobileKeyboardAction): string;
+export declare function isRepeatableTerminalAction(action: MobileKeyboardAction): boolean;
+export declare function createMobileKeyboardPressTracker(): {
+    startPress(pointerId: number, keyId: string): void;
+    markRepeated(pointerId: number): boolean;
+    finishPress(pointerId: number, keyId: string): MobileKeyboardPressResolution;
+    cancelPress(pointerId: number): string | null;
+    hasPress(pointerId: number, keyId?: string): boolean;
+    isPressed(keyId: string): boolean;
+    getPressedKeyIds(): string[];
+    reset(): void;
+};

package/dist/components/ui/mobileKeyboardModel.js

@@ -0,0 +1,103 @@
+const u = ["|", "/", "-", "_", "~"];
+function o(r, s) {
+  if (!r) return "";
+  let c = r;
+  if (s.ctrl && r.length === 1) {
+    const n = r.toLowerCase().charCodeAt(0);
+    n >= 97 && n <= 122 && (c = String.fromCharCode(n - 96));
+  }
+  return s.alt && (c = `\x1B${c}`), c;
+}
+function i(r) {
+  switch (r) {
+    case "enter":
+      return "\r";
+    case "backspace":
+      return "";
+    case "tab":
+      return "	";
+    case "escape":
+      return "\x1B";
+    case "arrow-up":
+      return "\x1B[A";
+    case "arrow-down":
+      return "\x1B[B";
+    case "arrow-left":
+      return "\x1B[D";
+    case "arrow-right":
+      return "\x1B[C";
+  }
+}
+function l(r) {
+  switch (r) {
+    case "tab":
+    case "enter":
+    case "backspace":
+    case "arrow-up":
+    case "arrow-down":
+    case "arrow-left":
+    case "arrow-right":
+      return !0;
+    case "escape":
+      return !1;
+  }
+}
+function d() {
+  const r = /* @__PURE__ */ new Map(), s = /* @__PURE__ */ new Map(), c = (e) => {
+    s.set(e, (s.get(e) ?? 0) + 1);
+  }, n = (e) => {
+    const t = (s.get(e) ?? 0) - 1;
+    if (t > 0) {
+      s.set(e, t);
+      return;
+    }
+    s.delete(e);
+  };
+  return {
+    startPress(e, t) {
+      const a = r.get(e);
+      a && n(a.keyId), r.set(e, {
+        keyId: t,
+        didRepeat: !1
+      }), c(t);
+    },
+    markRepeated(e) {
+      const t = r.get(e);
+      return t ? (t.didRepeat = !0, !0) : !1;
+    },
+    finishPress(e, t) {
+      const a = r.get(e);
+      return a ? (r.delete(e), n(a.keyId), {
+        keyId: a.keyId,
+        shouldActivate: a.keyId === t && !a.didRepeat
+      }) : {
+        keyId: null,
+        shouldActivate: !1
+      };
+    },
+    cancelPress(e) {
+      const t = r.get(e);
+      return t ? (r.delete(e), n(t.keyId), t.keyId) : null;
+    },
+    hasPress(e, t) {
+      const a = r.get(e);
+      return a ? t ? a.keyId === t : !0 : !1;
+    },
+    isPressed(e) {
+      return s.has(e);
+    },
+    getPressedKeyIds() {
+      return [...s.keys()];
+    },
+    reset() {
+      r.clear(), s.clear();
+    }
+  };
+}
+export {
+  u as DEFAULT_MOBILE_KEYBOARD_QUICK_INSERTS,
+  o as applyTerminalModifiers,
+  d as createMobileKeyboardPressTracker,
+  l as isRepeatableTerminalAction,
+  i as mapTerminalActionToKey
+};

package/dist/floe.css

@@ -321,6 +321,18 @@
     user-select: none;
     -webkit-touch-callout: none;
   }
+
+  [data-floe-touch-surface='true'],
+  [data-floe-touch-surface='true'] * {
+    -webkit-user-select: none;
+    user-select: none;
+    -webkit-touch-callout: none;
+  }
+
+  [data-floe-touch-surface='true'] {
+    -webkit-tap-highlight-color: transparent;
+    touch-action: manipulation;
+  }
 }
 
 /* Animation utilities */

package/dist/full.d.ts

@@ -9,3 +9,4 @@ export * from './launchpad';
 export * from './file-browser';
 export * from './chat';
 export * from './widgets';
+export * from './terminal';