@floegence/floe-webapp-core 0.78.2 → 0.78.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/dist/components/file-browser/DirectoryTree.js +10 -10
  2. package/dist/components/file-browser/FileBrowserStatusBar.js +16 -16
  3. package/dist/components/file-browser/FileListView.js +352 -339
  4. package/dist/components/layout/Sidebar.js +10 -10
  5. package/dist/floe.css +2 -0
  6. package/dist/primitives.css +12 -5
  7. package/dist/styles/tokens.d.ts +10 -10
  8. package/dist/styles/tokens.js +5 -5
  9. package/dist/styles.css +1 -1
  10. package/dist/ui.css +2 -2
  11. package/package.json +1 -1
package/dist/components/layout/Sidebar.js CHANGED
@@ -1,14 +1,14 @@
1
- import { insert as l, effect as s, setAttribute as f, className as c, setStyleProperty as u, memo as w, template as o, delegateEvents as S } from "solid-js/web";
1
+ import { insert as l, effect as s, setAttribute as f, className as c, setStyleProperty as u, memo as w, template as d, delegateEvents as S } from "solid-js/web";
2
2
  import "solid-js";
3
3
  import { cn as v } from "../../utils/cn.js";
4
- var k = /* @__PURE__ */ o('<aside data-floe-shell-slot=sidebar data-floe-geometry-surface=shell-sidebar><div class="flex-1 overflow-auto overscroll-contain">'), _ = /* @__PURE__ */ o("<div>"), C = /* @__PURE__ */ o("<section><div class=flex-1>"), I = /* @__PURE__ */ o('<div class="flex items-center justify-between px-2.5 py-2 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/60"><span>'), L = /* @__PURE__ */ o('<button type=button><span class="flex-1 truncate text-left">'), M = /* @__PURE__ */ o('<span class="flex-shrink-0 w-4 h-4 opacity-60">');
4
+ var k = /* @__PURE__ */ d('<aside data-floe-shell-slot=sidebar data-floe-geometry-surface=shell-sidebar><div class="flex-1 overflow-auto overscroll-contain">'), _ = /* @__PURE__ */ d("<div>"), C = /* @__PURE__ */ d("<section><div class=flex-1>"), I = /* @__PURE__ */ d('<div class="flex items-center justify-between px-2.5 py-2 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/60"><span>'), L = /* @__PURE__ */ d('<button type=button><span class="flex-1 truncate text-left">'), M = /* @__PURE__ */ d('<span class="flex-shrink-0 w-4 h-4 opacity-60">');
5
5
  function E(e) {
6
6
  const t = () => e.collapsed ?? !1, a = () => e.width ?? 350, n = () => e.visibilityMotion ?? "animated";
7
7
  return (() => {
8
- var i = k(), d = i.firstChild;
9
- return l(d, () => e.children), l(i, () => e.resizer, null), s((r) => {
10
- var b = n(), m = v("relative h-full flex flex-col shrink-0 min-h-0", "bg-sidebar text-sidebar-foreground", "border-r border-sidebar-border", "overflow-hidden", n() === "animated" && "transition-[width] duration-150 ease-out", e.class), h = t() ? "0px" : `${a()}px`, x = t() ? "hidden" : "visible", g = t() ? "0px" : void 0, y = e.ariaLabel, $ = t() ? "true" : void 0;
11
- return b !== r.e && f(i, "data-floe-sidebar-visibility-motion", r.e = b), m !== r.t && c(i, r.t = m), h !== r.a && u(i, "width", r.a = h), x !== r.o && u(i, "visibility", r.o = x), g !== r.i && u(i, "border-right-width", r.i = g), y !== r.n && f(i, "aria-label", r.n = y), $ !== r.s && f(i, "aria-hidden", r.s = $), r;
8
+ var i = k(), o = i.firstChild;
9
+ return l(o, () => e.children), l(i, () => e.resizer, null), s((r) => {
10
+ var b = n(), h = v("relative h-full flex flex-col shrink-0 min-h-0", "bg-sidebar text-sidebar-foreground", "border-r border-sidebar-border", "overflow-hidden", n() === "animated" && "transition-[width] duration-150 ease-out", e.class), m = t() ? "0px" : `${a()}px`, x = t() ? "hidden" : "visible", g = t() ? "0px" : void 0, y = e.ariaLabel, $ = t() ? "true" : void 0;
11
+ return b !== r.e && f(i, "data-floe-sidebar-visibility-motion", r.e = b), h !== r.t && c(i, r.t = h), m !== r.a && u(i, "width", r.a = m), x !== r.o && u(i, "visibility", r.o = x), g !== r.i && u(i, "border-right-width", r.i = g), y !== r.n && f(i, "aria-label", r.n = y), $ !== r.s && f(i, "aria-hidden", r.s = $), r;
12
12
  }, {
13
13
  e: void 0,
14
14
  t: void 0,
@@ -38,8 +38,8 @@ function q(e) {
38
38
  return l(t, (() => {
39
39
  var n = w(() => !!e.title);
40
40
  return () => n() && (() => {
41
- var i = I(), d = i.firstChild;
42
- return l(d, () => e.title), l(i, () => e.actions, null), i;
41
+ var i = I(), o = i.firstChild;
42
+ return l(o, () => e.title), l(i, () => e.actions, null), i;
43
43
  })();
44
44
  })(), a), l(a, () => e.children), s(() => c(t, v("flex flex-col", e.class))), t;
45
45
  })();
@@ -54,8 +54,8 @@ function B(e) {
54
54
  return l(i, () => e.icon), i;
55
55
  })();
56
56
  })(), a), l(a, () => e.children), s((n) => {
57
- var i = v("w-full flex items-center gap-2 px-2.5 py-1.5 text-xs cursor-pointer", "transition-colors duration-75", "hover:bg-sidebar-accent/80 hover:text-sidebar-accent-foreground", "focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-sidebar-ring", e.active && "bg-sidebar-accent text-sidebar-accent-foreground font-medium", e.class), d = e.indent ? `${10 + e.indent * 10}px` : void 0;
58
- return i !== n.e && c(t, n.e = i), d !== n.t && u(t, "padding-left", n.t = d), n;
57
+ var i = v("w-full min-h-[var(--floe-row-height)] flex items-center gap-2 px-2.5 py-1 text-[length:var(--floe-type-control)] leading-[var(--floe-line-control)] cursor-pointer", "transition-colors duration-75", "hover:bg-sidebar-accent/80 hover:text-sidebar-accent-foreground", "focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-sidebar-ring", e.active && "bg-sidebar-accent text-sidebar-accent-foreground font-medium", e.class), o = e.indent ? `${10 + e.indent * 10}px` : void 0;
58
+ return i !== n.e && c(t, n.e = i), o !== n.t && u(t, "padding-left", n.t = o), n;
59
59
  }, {
60
60
  e: void 0,
61
61
  t: void 0
package/dist/floe.css CHANGED
@@ -288,6 +288,8 @@
288
288
  background-color: var(--background);
289
289
  color: var(--foreground);
290
290
  font-family: var(--font-sans);
291
+ font-size: var(--floe-type-body);
292
+ line-height: var(--floe-line-body);
291
293
  }
292
294
 
293
295
  #root {
package/dist/primitives.css CHANGED
@@ -5,14 +5,14 @@
5
5
  --font-mono: 'JetBrains Mono', 'Fira Code', 'SF Mono', Menlo, Monaco, Consolas, monospace;
6
6
  --floe-type-caption: 0.6875rem;
7
7
  --floe-type-supporting: 0.75rem;
8
- --floe-type-control: 0.8125rem;
9
- --floe-type-body: 0.875rem;
8
+ --floe-type-control: 0.75rem;
9
+ --floe-type-body: 0.8125rem;
10
10
  --floe-type-heading: 1rem;
11
- --floe-line-control: 1.25rem;
12
- --floe-line-body: 1.375rem;
11
+ --floe-line-control: 1.125rem;
12
+ --floe-line-body: 1.25rem;
13
13
  --floe-control-height-sm: 1.75rem;
14
14
  --floe-control-height-md: 2rem;
15
- --floe-row-height: 2rem;
15
+ --floe-row-height: 1.75rem;
16
16
  --floe-space-1: 0.25rem;
17
17
  --floe-space-2: 0.5rem;
18
18
  --floe-space-3: 0.75rem;
@@ -25,6 +25,13 @@
25
25
 
26
26
  /* Compact visual controls retain usable, non-overlapping touch geometry. */
27
27
  @media (pointer: coarse) {
28
+ body {
29
+ --floe-type-control: 0.8125rem;
30
+ --floe-type-body: 0.875rem;
31
+ --floe-line-control: 1.25rem;
32
+ --floe-line-body: 1.375rem;
33
+ --floe-row-height: 2.75rem;
34
+ }
28
35
  [data-floe-control='button'],
29
36
  [data-floe-control='input'],
30
37
  [data-floe-control='compound-input'],
package/dist/styles/tokens.d.ts CHANGED
@@ -49,14 +49,14 @@ export declare const floeSharedCssVariables: {
49
49
  readonly '--font-mono': "'JetBrains Mono', 'Fira Code', 'SF Mono', Menlo, Monaco, Consolas, monospace";
50
50
  readonly '--floe-type-caption': "0.6875rem";
51
51
  readonly '--floe-type-supporting': "0.75rem";
52
- readonly '--floe-type-control': "0.8125rem";
53
- readonly '--floe-type-body': "0.875rem";
52
+ readonly '--floe-type-control': "0.75rem";
53
+ readonly '--floe-type-body': "0.8125rem";
54
54
  readonly '--floe-type-heading': "1rem";
55
- readonly '--floe-line-control': "1.25rem";
56
- readonly '--floe-line-body': "1.375rem";
55
+ readonly '--floe-line-control': "1.125rem";
56
+ readonly '--floe-line-body': "1.25rem";
57
57
  readonly '--floe-control-height-sm': "1.75rem";
58
58
  readonly '--floe-control-height-md': "2rem";
59
- readonly '--floe-row-height': "2rem";
59
+ readonly '--floe-row-height': "1.75rem";
60
60
  readonly '--floe-space-1': "0.25rem";
61
61
  readonly '--floe-space-2': "0.5rem";
62
62
  readonly '--floe-space-3': "0.75rem";
@@ -1265,14 +1265,14 @@ export declare const floeDesignTokens: {
1265
1265
  readonly '--font-mono': "'JetBrains Mono', 'Fira Code', 'SF Mono', Menlo, Monaco, Consolas, monospace";
1266
1266
  readonly '--floe-type-caption': "0.6875rem";
1267
1267
  readonly '--floe-type-supporting': "0.75rem";
1268
- readonly '--floe-type-control': "0.8125rem";
1269
- readonly '--floe-type-body': "0.875rem";
1268
+ readonly '--floe-type-control': "0.75rem";
1269
+ readonly '--floe-type-body': "0.8125rem";
1270
1270
  readonly '--floe-type-heading': "1rem";
1271
- readonly '--floe-line-control': "1.25rem";
1272
- readonly '--floe-line-body': "1.375rem";
1271
+ readonly '--floe-line-control': "1.125rem";
1272
+ readonly '--floe-line-body': "1.25rem";
1273
1273
  readonly '--floe-control-height-sm': "1.75rem";
1274
1274
  readonly '--floe-control-height-md': "2rem";
1275
- readonly '--floe-row-height': "2rem";
1275
+ readonly '--floe-row-height': "1.75rem";
1276
1276
  readonly '--floe-space-1': "0.25rem";
1277
1277
  readonly '--floe-space-2': "0.5rem";
1278
1278
  readonly '--floe-space-3': "0.75rem";
package/dist/styles/tokens.js CHANGED
@@ -5,14 +5,14 @@ const i = {
5
5
  "--font-mono": "'JetBrains Mono', 'Fira Code', 'SF Mono', Menlo, Monaco, Consolas, monospace",
6
6
  "--floe-type-caption": "0.6875rem",
7
7
  "--floe-type-supporting": "0.75rem",
8
- "--floe-type-control": "0.8125rem",
9
- "--floe-type-body": "0.875rem",
8
+ "--floe-type-control": "0.75rem",
9
+ "--floe-type-body": "0.8125rem",
10
10
  "--floe-type-heading": "1rem",
11
- "--floe-line-control": "1.25rem",
12
- "--floe-line-body": "1.375rem",
11
+ "--floe-line-control": "1.125rem",
12
+ "--floe-line-body": "1.25rem",
13
13
  "--floe-control-height-sm": "1.75rem",
14
14
  "--floe-control-height-md": "2rem",
15
- "--floe-row-height": "2rem",
15
+ "--floe-row-height": "1.75rem",
16
16
  "--floe-space-1": "0.25rem",
17
17
  "--floe-space-2": "0.5rem",
18
18
  "--floe-space-3": "0.75rem",