@burdenoff/fe-libs 2026.930.3 → 2026.930.5

package/dist/sharing/ShareDialog.js

@@ -189,7 +189,7 @@ var C = ({ resource: C, controller: w, open: T, onOpenChange: ae, workspaceId: E
 										value: V,
 										onChange: (e) => H(e.target.value),
 										"data-testid": "share-user-expiry",
-										className: "flex h-10 w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg",
+										className: "flex h-10 w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary scheme-normal dark:scheme-dark focus:outline-none focus:ring-2 focus:ring-action-primary-bg [&_option]:bg-bg-surface [&_option]:text-text-primary",
 										children: b.map((e) => /* @__PURE__ */ v("option", {
 											value: e.value,
 											children: e.label
@@ -268,7 +268,7 @@ var C = ({ resource: C, controller: w, open: T, onOpenChange: ae, workspaceId: E
 										value: q,
 										onChange: (e) => oe(e.target.value),
 										"data-testid": "share-link-expiry",
-										className: "flex h-10 w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg",
+										className: "flex h-10 w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary scheme-normal dark:scheme-dark focus:outline-none focus:ring-2 focus:ring-action-primary-bg [&_option]:bg-bg-surface [&_option]:text-text-primary",
 										children: b.map((e) => /* @__PURE__ */ v("option", {
 											value: e.value,
 											children: e.label

package/dist/storage/StorageFolderPicker.js

@@ -70,7 +70,7 @@ function c({ workspaceId: i, value: c, onChange: l, operations: u, initialParent
 				onChange: (e) => {
 					l(m.find((t) => t.id === e.target.value) ?? null);
 				},
-				className: "w-full rounded-md border border-border-subtle bg-bg-surface px-2 py-1.5 text-sm",
+				className: "w-full rounded-md border border-border-subtle bg-bg-surface text-text-primary px-2 py-1.5 text-sm scheme-normal dark:scheme-dark [&_option]:bg-bg-surface [&_option]:text-text-primary",
 				"aria-label": "Folder",
 				children: [/* @__PURE__ */ n("option", {
 					value: "",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@burdenoff/fe-libs",
-  "version": "2026.930.3",
+  "version": "2026.930.5",
   "description": "Burdenoff frontend primitives and domain libraries",
   "type": "module",
   "bin": {
@@ -50,6 +50,10 @@
       "types": "./dist/credentials.d.ts",
       "import": "./dist/credentials.js"
     },
+    "./connections": {
+      "types": "./dist/connections.d.ts",
+      "import": "./dist/connections.js"
+    },
     "./button": {
       "types": "./dist/button.d.ts",
       "import": "./dist/button.js"
@@ -307,7 +311,7 @@
     "format": "prettier --config shared/config/prettier.config.mjs --write \"src/**/*.{ts,tsx}\" \"!src/config/*.config.ts\"",
     "type:check": "bash scripts/build-limits.sh tsc --noEmit",
     "test:package-css-exports": "node scripts/validate-package-css-exports.mjs",
-    "test": "bun test scripts/graphql-schema-drift/__tests__ scripts/a11y-audit/__tests__ src/credentials src/storage src/shared/assistant src/shared/components src/shared/graphql/links/sse-link.test.ts src/shared/graphql/fetch.test.ts src/shared/config/gatewayUrls.test.ts src/shared/config/authBridgeUrls.test.ts src/shared/config/gatewayFallback.test.ts src/shared/config/products.test.ts src/shared/config/productSlug.test.ts src/shared/hooks/shell/useProducts.test.ts src/shared/providers/shell/brandAttribute.test.ts src/chrome/ProductSwitcher.test.ts src/shared/utils/gatewayFetchRewrite.test.ts src/shared/utils/authCookie.test.ts src/shared/providers/AppShellProvider.test.ts src/shared/providers/shell/interpolate.test.ts src/shared/providers/shell/resolveTranslation.test.ts src/shared/providers/shell/I18nProvider.render.test.tsx src/shared/providers/shell/personaSurfaceRemote.test.ts src/shared/providers/shell/workspaceSwitch.client.test.tsx src/shared/events/sinks/RybbitSink.test.ts src/shell-native src/shared/native src/chrome/__tests__ src/ui/__tests__",
+    "test": "bun test scripts/graphql-schema-drift/__tests__ scripts/a11y-audit/__tests__ src/credentials src/connections src/storage src/shared/assistant src/shared/components src/shared/graphql/links/sse-link.test.ts src/shared/graphql/fetch.test.ts src/shared/config/gatewayUrls.test.ts src/shared/config/authBridgeUrls.test.ts src/shared/config/gatewayFallback.test.ts src/shared/config/products.test.ts src/shared/config/productSlug.test.ts src/shared/hooks/shell/useProducts.test.ts src/shared/providers/shell/brandAttribute.test.ts src/chrome/ProductSwitcher.test.ts src/shared/utils/gatewayFetchRewrite.test.ts src/shared/utils/authCookie.test.ts src/shared/providers/AppShellProvider.test.ts src/shared/providers/shell/interpolate.test.ts src/shared/providers/shell/resolveTranslation.test.ts src/shared/providers/shell/I18nProvider.render.test.tsx src/shared/providers/shell/personaSurfaceRemote.test.ts src/shared/providers/shell/workspaceSwitch.client.test.tsx src/shared/events/sinks/RybbitSink.test.ts src/shell-native src/shared/native src/chrome/__tests__ src/ui/__tests__",
     "sanity": "bash scripts/build-limits.sh --gate bash -c 'bun run lint:sanity && bun run format && bun run type:check && bun run test && bun run build'",
     "switch:status": "bun scripts/deps-mode.ts status",
     "switch:remote": "bun scripts/deps-mode.ts remote",
@@ -352,6 +356,7 @@
     "@capacitor/geolocation": "^8.2.0",
     "@capgo/native-purchases": "^8.4.0",
     "@eslint/js": "^10.0.1",
+    "@iconify/react": "^6.0.2",
     "@tailwindcss/vite": "^4.1.8",
     "@tanstack/react-query": "^5.90.21",
     "@types/react": "^19.0.2",
@@ -395,6 +400,7 @@
   },
   "peerDependencies": {
     "@apollo/client": "^4.0.9",
+    "@iconify/react": "^5.2.0 || ^6.0.0",
     "@capacitor/core": "^8.3.1",
     "@capacitor/geolocation": "^8.2.0",
     "@capgo/native-purchases": "^8.4.0",
@@ -446,6 +452,9 @@
     "vite-plugin-dts": "4.5.4"
   },
   "peerDependenciesMeta": {
+    "@iconify/react": {
+      "optional": true
+    },
     "@capacitor/core": {
       "optional": true
     },

package/src/shared/tokens/build/semantic.css

@@ -200,6 +200,40 @@
   --color-status-warning-subtle: var(--color-status-warning-bgSubtle);
   --color-status-info: var(--color-status-info-bg);
   --color-status-info-subtle: var(--color-status-info-bgSubtle);
+
+  /* BOFF-7280: shadcn-default token aliases.
+   * Many MFE components use shadcn/ui default class names
+   * (bg-popover, bg-background, text-muted-foreground, ring-ring, etc.)
+   * that are NOT defined in the Boff UI design system. Without these
+   * aliases, those classes resolve to undefined CSS variables, which
+   * renders as a transparent / browser-default panel in Dark Mode.
+   * Map every shadcn-default token used by microfe-* dropdowns to the
+   * corresponding semantic value so the rendered colors stay consistent
+   * with the rest of the FluidGrids UI. Pixel-level duplicates of the
+   * semantic tokens, no new tokens, no new Tailwind utilities. */
+  --color-background: var(--color-bg-surface);
+  --color-foreground: var(--color-text-primary);
+  --color-muted: var(--color-bg-sunken);
+  --color-muted-foreground: var(--color-text-muted);
+  --color-accent: var(--color-bg-accentSubtle);
+  --color-accent-foreground: var(--color-text-primary);
+  --color-card: var(--color-bg-surface);
+  --color-card-foreground: var(--color-text-primary);
+  --color-secondary: var(--color-bg-sunken);
+  --color-secondary-foreground: var(--color-text-primary);
+  --color-popover: var(--color-bg-surface);
+  --color-popover-foreground: var(--color-text-primary);
+  --color-input: var(--color-border-default);
+  --color-ring: var(--color-action-primary-bg);
+  --color-destructive: var(--color-status-error-bg);
+  --color-destructive-foreground: var(--color-status-error-text);
+  --color-primary: var(--color-action-primary-bg);
+  --color-primary-foreground: var(--color-action-primary-text);
+  --color-background-primary: var(--color-bg-canvas);
+  --color-background-secondary: var(--color-bg-sunken);
+  --color-background-tertiary: var(--color-bg-sunken);
+  --color-border-secondary: var(--color-border-subtle);
+  --color-focus-ring: var(--color-action-primary-bg);
 }
 
 /* Semantic Tokens - Dark Mode - Auto-generated */
@@ -344,6 +378,37 @@
   --color-status-warning-subtle: var(--color-status-warning-bgSubtle);
   --color-status-info: var(--color-status-info-bg);
   --color-status-info-subtle: var(--color-status-info-bgSubtle);
+
+  /* BOFF-7280: shadcn-default token aliases — DARK MODE values.
+   * Same set as the light-mode block above, mapped to the dark-mode
+   * equivalents of each semantic token. Required because the consuming
+   * MFEs write class names like \`bg-popover\` / \`ring-ring\` directly
+   * and Tailwind v4's default theme supplies those names with hard-coded
+   * OKLCH values that disagree with the FluidGrids palette. Pinning
+   * them here keeps every dropdown in the app on-brand without forcing
+   * MFE-by-MFE component rewrites. */
+  --color-background: var(--color-bg-surface);
+  --color-foreground: var(--color-text-primary);
+  --color-muted: var(--color-bg-sunken);
+  --color-muted-foreground: var(--color-text-muted);
+  --color-accent: var(--color-bg-accentSubtle);
+  --color-accent-foreground: var(--color-text-primary);
+  --color-card: var(--color-bg-surface);
+  --color-card-foreground: var(--color-text-primary);
+  --color-secondary: var(--color-bg-sunken);
+  --color-secondary-foreground: var(--color-text-primary);
+  --color-popover: var(--color-bg-elevated);
+  --color-popover-foreground: var(--color-text-primary);
+  --color-input: var(--color-border-default);
+  --color-ring: var(--color-action-primary-bg);
+  --color-destructive: var(--color-status-error-bg);
+  --color-destructive-foreground: var(--color-status-error-text);
+  --color-primary: var(--color-action-primary-bg);
+  --color-primary-foreground: var(--color-action-primary-text);
+  --color-background-primary: var(--color-bg-canvas);
+  --color-background-secondary: var(--color-bg-sunken);
+  --color-background-tertiary: var(--color-bg-sunken);
+  --color-border-secondary: var(--color-border-subtle);
 }
 
 /* Compact Density - Auto-generated */
@@ -376,6 +441,71 @@
   --size-controlHeight-lg: 52px;
 }
 
+/* BOFF-7280: UNLAYERED shadcn-default token aliases (FINAL OVERRIDE).
+ *
+ * Declared at the TOP LEVEL (no @layer wrapper) so they win the cascade
+ * over BOTH Tailwind v4's built-in @layer theme defaults (e.g.
+ * `--color-popover: 222.2 84% 4.9%` from the shadcn palette, which
+ * otherwise bleeds into every microfe-* dropdown panel) AND any
+ * same-token aliases that landed in @layer semantic.
+ *
+ * Unlayered CSS wins any layered CSS per the CSS Cascade Level 5 spec,
+ * so these two blocks — one for the default :root and one for the
+ * dark-mode selectors — guarantee every shadcn-default class used by
+ * FluidGrids MFEs (microfe-rbac, microfe-files, microfe-tags,
+ * microfe-conversations, etc.) renders with the FluidGrids palette in
+ * BOTH light and dark mode. */
+:root {
+  --color-background: var(--color-bg-surface);
+  --color-foreground: var(--color-text-primary);
+  --color-muted: var(--color-bg-sunken);
+  --color-muted-foreground: var(--color-text-muted);
+  --color-accent: var(--color-bg-accentSubtle);
+  --color-accent-foreground: var(--color-text-primary);
+  --color-card: var(--color-bg-surface);
+  --color-card-foreground: var(--color-text-primary);
+  --color-secondary: var(--color-bg-sunken);
+  --color-secondary-foreground: var(--color-text-primary);
+  --color-popover: var(--color-bg-surface);
+  --color-popover-foreground: var(--color-text-primary);
+  --color-input: var(--color-border-default);
+  --color-ring: var(--color-action-primary-bg);
+  --color-destructive: var(--color-status-error-bg);
+  --color-destructive-foreground: var(--color-status-error-text);
+  --color-primary: var(--color-action-primary-bg);
+  --color-primary-foreground: var(--color-action-primary-text);
+  --color-background-primary: var(--color-bg-canvas);
+  --color-background-secondary: var(--color-bg-sunken);
+  --color-background-tertiary: var(--color-bg-sunken);
+  --color-border-secondary: var(--color-border-subtle);
+  --color-focus-ring: var(--color-action-primary-bg);
+}
+[data-theme="dark"], .dark, :root.dark {
+  --color-background: var(--color-bg-surface);
+  --color-foreground: var(--color-text-primary);
+  --color-muted: var(--color-bg-sunken);
+  --color-muted-foreground: var(--color-text-muted);
+  --color-accent: var(--color-bg-accentSubtle);
+  --color-accent-foreground: var(--color-text-primary);
+  --color-card: var(--color-bg-elevated);
+  --color-card-foreground: var(--color-text-primary);
+  --color-secondary: var(--color-bg-sunken);
+  --color-secondary-foreground: var(--color-text-primary);
+  --color-popover: var(--color-bg-elevated);
+  --color-popover-foreground: var(--color-text-primary);
+  --color-input: var(--color-border-default);
+  --color-ring: var(--color-action-primary-bg);
+  --color-destructive: var(--color-status-error-bg);
+  --color-destructive-foreground: var(--color-status-error-text);
+  --color-primary: var(--color-action-primary-bg);
+  --color-primary-foreground: var(--color-action-primary-text);
+  --color-background-primary: var(--color-bg-canvas);
+  --color-background-secondary: var(--color-bg-sunken);
+  --color-background-tertiary: var(--color-bg-sunken);
+  --color-border-secondary: var(--color-border-subtle);
+  --color-focus-ring: var(--color-action-primary-bg);
+}
+
 /* Large Typography Scale - Auto-generated */
 [data-typography="large"] {
   --font-size-body-sm: 16px;
@@ -397,3 +527,4 @@
   --font-size-heading-h3: 20px;
   --font-size-heading-h4: 18px;
 }
+