@floegence/floe-webapp-core 0.35.59 → 0.36.1

package/dist/deck.js

@@ -1,22 +1,24 @@
 import { DECK_GRID_CONFIG as o, DeckGrid as t, getGridConfigFromElement as m } from "./components/deck/DeckGrid.js";
 import { DeckCell as f } from "./components/deck/DeckCell.js";
-import { DeckTopBar as x } from "./components/deck/DeckTopBar.js";
+import { DeckContextMenu as i } from "./components/deck/DeckContextMenu.js";
+import { DeckTopBar as D } from "./components/deck/DeckTopBar.js";
 import { DropZonePreview as g } from "./components/deck/DropZonePreview.js";
-import { LayoutSelector as D } from "./components/deck/LayoutSelector.js";
-import { WidgetFrame as c } from "./components/deck/WidgetFrame.js";
-import { WidgetPalette as C } from "./components/deck/WidgetPalette.js";
-import { WidgetResizeHandle as W } from "./components/deck/WidgetResizeHandle.js";
-import { WidgetTypeSwitcher as F } from "./components/deck/WidgetTypeSwitcher.js";
+import { LayoutSelector as n } from "./components/deck/LayoutSelector.js";
+import { WidgetFrame as C } from "./components/deck/WidgetFrame.js";
+import { WidgetPalette as G } from "./components/deck/WidgetPalette.js";
+import { WidgetResizeHandle as F } from "./components/deck/WidgetResizeHandle.js";
+import { WidgetTypeSwitcher as w } from "./components/deck/WidgetTypeSwitcher.js";
 export {
   o as DECK_GRID_CONFIG,
   f as DeckCell,
+  i as DeckContextMenu,
   t as DeckGrid,
-  x as DeckTopBar,
+  D as DeckTopBar,
   g as DropZonePreview,
-  D as LayoutSelector,
-  c as WidgetFrame,
-  C as WidgetPalette,
-  W as WidgetResizeHandle,
-  F as WidgetTypeSwitcher,
+  n as LayoutSelector,
+  C as WidgetFrame,
+  G as WidgetPalette,
+  F as WidgetResizeHandle,
+  w as WidgetTypeSwitcher,
   m as getGridConfigFromElement
 };

package/dist/display-mode.css

@@ -0,0 +1,70 @@
+@layer components {
+  .display-mode-page-shell {
+    position: fixed;
+    inset: 0;
+    display: flex;
+    flex-direction: column;
+    background: var(--background, #fff);
+    color: var(--foreground, #111);
+  }
+
+  .display-mode-page-shell__body {
+    position: relative;
+    flex: 1;
+    overflow: hidden;
+  }
+
+  .display-mode-switcher {
+    display: inline-flex;
+    align-items: center;
+    gap: 1px;
+    padding: 2px;
+    border: 1px solid color-mix(in srgb, var(--border, #e5e5e5) 60%, transparent);
+    border-radius: 8px;
+    background: color-mix(in srgb, var(--muted, #f1f1f1) 70%, transparent);
+  }
+
+  .display-mode-switcher__pill {
+    position: relative;
+    display: inline-flex;
+    align-items: center;
+    gap: 5px;
+    padding: 4px 9px;
+    border: none;
+    border-radius: 6px;
+    background: transparent;
+    color: var(--muted-foreground, #888);
+    font-size: 11px;
+    font-weight: 600;
+    letter-spacing: -0.005em;
+    cursor: pointer;
+    isolation: isolate;
+    transition: color 140ms ease;
+  }
+
+  .display-mode-switcher__pill:hover,
+  .display-mode-switcher__pill.is-active {
+    color: var(--foreground, #111);
+  }
+
+  .display-mode-switcher__pill-bg {
+    position: absolute;
+    inset: 0;
+    z-index: -1;
+    border: 1px solid color-mix(in srgb, var(--border, #e5e5e5) 70%, transparent);
+    border-radius: 6px;
+    background: var(--card, #fff);
+    box-shadow:
+      0 1px 2px color-mix(in srgb, var(--foreground, #000) 6%, transparent),
+      0 1px 0 color-mix(in srgb, white 60%, transparent) inset;
+  }
+
+  .display-mode-switcher__icon {
+    width: 12px;
+    height: 12px;
+  }
+
+  .display-mode-switcher__label {
+    line-height: 1;
+  }
+}