@adecore/ui 0.53.3 → 0.54.1

package/dist/Banner.d.ts

@@ -1,5 +1,5 @@
-import type { ReactNode, Ref } from 'react';
 import type { LucideIcon } from 'lucide-react';
+import type { ReactNode, Ref } from 'react';
 export type BannerTone = 'attention' | 'error' | 'neutral';
 export interface BannerProps {
     icon: LucideIcon;

package/dist/ButtonGroup.js

@@ -1,6 +1,6 @@
 import { c as _c } from "react/compiler-runtime";
-import clsx from 'clsx';
 import { useRender } from '@base-ui/react/use-render';
+import clsx from 'clsx';
 /* Icon buttons that belong together sit 1px apart; groups keep the wider gap of their container. */
 export function ButtonGroup(t0) {
   const $ = _c(14);

package/dist/Checkbox.js

@@ -1,7 +1,7 @@
 import { c as _c } from "react/compiler-runtime";
+import { Checkbox as BaseCheckbox } from '@base-ui/react/checkbox';
 import clsx from 'clsx';
 import { Check, Minus } from 'lucide-react';
-import { Checkbox as BaseCheckbox } from '@base-ui/react/checkbox';
 import { Icon } from "./Icon.js";
 /* Picked or not, as one item out of a list or an option that waits for a Save button. */
 import { jsx as _jsx } from "react/jsx-runtime";

package/dist/ChoiceCards.d.ts

@@ -1,5 +1,5 @@
-import { type ReactNode, type Ref } from 'react';
 import type { LucideIcon } from 'lucide-react';
+import { type ReactNode, type Ref } from 'react';
 export interface Choice<Value extends string | number> {
     value: Value;
     title: string;

package/dist/ChoiceCards.js

@@ -1,8 +1,8 @@
 import { c as _c } from "react/compiler-runtime";
-import { Fragment, useId } from 'react';
-import clsx from 'clsx';
 import { Radio } from '@base-ui/react/radio';
 import { RadioGroup } from '@base-ui/react/radio-group';
+import clsx from 'clsx';
+import { Fragment, useId } from 'react';
 import { Icon } from "./Icon.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 function ChoiceCard(t0) {

package/dist/CloseButton.js

@@ -1,6 +1,6 @@
 import { c as _c } from "react/compiler-runtime";
-import { X } from 'lucide-react';
 import { Dialog } from '@base-ui/react/dialog';
+import { X } from 'lucide-react';
 import { IconButton } from "./IconButton.js";
 /* The close button in the header of every panel and dialog. In a dialog it is that dialog's own close part. */
 import { jsx as _jsx } from "react/jsx-runtime";

package/dist/ColorSwatch.d.ts

@@ -1,5 +1,5 @@
-import type { ComponentProps } from 'react';
 import { useRender } from '@base-ui/react/use-render';
+import type { ComponentProps } from 'react';
 declare const PICKED_RING: {
     readonly surface: 'ring-2 ring-accent ring-offset-2 ring-offset-surface';
     readonly popup: 'ring-2 ring-accent ring-offset-1 ring-offset-surface-raised';

package/dist/ColorSwatch.js

@@ -1,7 +1,7 @@
 import { c as _c } from "react/compiler-runtime";
+import { useRender } from '@base-ui/react/use-render';
 import clsx from 'clsx';
 import { Check } from 'lucide-react';
-import { useRender } from '@base-ui/react/use-render';
 import { Icon } from "./Icon.js";
 /* `focus-ring` for the swatch that is a menu item rather than a button, which the keyboard reaches all the same. */
 import { jsx as _jsx } from "react/jsx-runtime";

package/dist/ColorWheelPicker.js

@@ -1,6 +1,6 @@
 import { c as _c } from "react/compiler-runtime";
-import { useEffect, useId, useRef, useState } from 'react';
 import { ChevronDown } from 'lucide-react';
+import { useEffect, useId, useRef, useState } from 'react';
 import { ColorSwatch } from "./ColorSwatch.js";
 import { Icon } from "./Icon.js";
 import { PopoverPopup, PopoverRoot, PopoverTrigger } from "./popover/parts.js";

package/dist/CopyButton.js

@@ -1,7 +1,7 @@
 import { c as _c } from "react/compiler-runtime";
+import { Check, Copy } from 'lucide-react';
 import { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { Check, Copy } from 'lucide-react';
 import { Button } from "./Button.js";
 import { copyText } from './clipboard.js';
 import { Icon } from "./Icon.js";

package/dist/DockShell.js

@@ -1,6 +1,6 @@
 import { c as _c } from "react/compiler-runtime";
-import { useEffect, useRef, useState } from 'react';
 import clsx from 'clsx';
+import { useEffect, useRef, useState } from 'react';
 import { Surface } from "./Surface.js";
 /* How close to the bottom of the window the pointer has to come before a hidden dock slides back. */
 import { jsx as _jsx } from "react/jsx-runtime";

package/dist/EmptyState.d.ts

@@ -1,5 +1,5 @@
-import { type ReactElement, type ReactNode, type Ref } from 'react';
 import type { LucideIcon } from 'lucide-react';
+import { type ReactElement, type ReactNode, type Ref } from 'react';
 export interface EmptyStateProps {
     icon?: LucideIcon | ReactElement<{
         size?: number;

package/dist/EmptyState.js

@@ -1,6 +1,6 @@
 import { c as _c } from "react/compiler-runtime";
-import { cloneElement, isValidElement } from 'react';
 import clsx from 'clsx';
+import { cloneElement, isValidElement } from 'react';
 import { Icon } from "./Icon.js";
 import { Spinner } from "./Spinner.js";
 // One size in a panel, a card and a dialog alike, so no caller picks its own.

package/dist/ErrorBoundary.js

@@ -1,13 +1,14 @@
 import { c as _c } from "react/compiler-runtime";
-import { Component } from 'react';
 import clsx from 'clsx';
 import { RotateCw, TriangleAlert } from 'lucide-react';
+import { Component } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Button } from "./Button.js";
 import { ButtonGroup } from "./ButtonGroup.js";
 import { CopyButton } from "./CopyButton.js";
 import { errorMessageOf, errorReport, shouldReset } from './error-boundary.js';
 import { Icon } from "./Icon.js";
+import { ScrollArea } from "./ScrollArea.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const CLEAR = {
   error: null,
@@ -16,7 +17,7 @@ const CLEAR = {
 };
 /* A function component, so the words come from the i18next instance the app renders with. */
 function ErrorFallback(t0) {
-  const $ = _c(46);
+  const $ = _c(48);
   const {
     label,
     error,
@@ -29,101 +30,108 @@ function ErrorFallback(t0) {
   const {
     t
   } = useTranslation("ui");
-  const t1 = compact ? "p-3" : "p-6";
-  let t2;
-  if ($[0] !== className || $[1] !== t1) {
-    t2 = clsx("grid place-items-center overflow-auto bg-surface", t1, className);
+  let t1;
+  if ($[0] !== className) {
+    t1 = clsx("bg-surface", className);
     $[0] = className;
     $[1] = t1;
-    $[2] = t2;
   } else {
-    t2 = $[2];
+    t1 = $[1];
   }
-  const t3 = compact ? "gap-1" : "gap-2";
-  let t4;
-  if ($[3] !== t3) {
-    t4 = clsx("flex max-w-[360px] flex-col items-center text-center", t3);
+  const t2 = compact ? "p-3" : "p-6";
+  let t3;
+  if ($[2] !== t2) {
+    t3 = clsx("grid place-items-center", t2);
+    $[2] = t2;
     $[3] = t3;
-    $[4] = t4;
   } else {
-    t4 = $[4];
+    t3 = $[3];
   }
+  const t4 = compact ? "gap-1" : "gap-2";
   let t5;
-  if ($[5] !== compact) {
-    t5 = !compact && /*#__PURE__*/_jsx(Icon, {
+  if ($[4] !== t4) {
+    t5 = clsx("flex max-w-[360px] flex-col items-center text-center", t4);
+    $[4] = t4;
+    $[5] = t5;
+  } else {
+    t5 = $[5];
+  }
+  let t6;
+  if ($[6] !== compact) {
+    t6 = !compact && /*#__PURE__*/_jsx(Icon, {
       icon: TriangleAlert,
       size: 20,
       className: "text-status-error"
     });
-    $[5] = compact;
-    $[6] = t5;
+    $[6] = compact;
+    $[7] = t6;
   } else {
-    t5 = $[6];
+    t6 = $[7];
   }
-  let t6;
-  if ($[7] !== label) {
-    t6 = /*#__PURE__*/_jsx("p", {
+  let t7;
+  if ($[8] !== label) {
+    t7 = /*#__PURE__*/_jsx("p", {
       className: "text-sm font-medium text-text",
       children: label
     });
-    $[7] = label;
-    $[8] = t6;
+    $[8] = label;
+    $[9] = t7;
   } else {
-    t6 = $[8];
+    t7 = $[9];
   }
-  let t7;
-  if ($[9] !== error) {
-    t7 = errorMessageOf(error);
-    $[9] = error;
-    $[10] = t7;
+  let t8;
+  if ($[10] !== error) {
+    t8 = errorMessageOf(error);
+    $[10] = error;
+    $[11] = t8;
   } else {
-    t7 = $[10];
+    t8 = $[11];
   }
-  let t8;
-  if ($[11] !== t7) {
-    t8 = /*#__PURE__*/_jsx("p", {
+  let t9;
+  if ($[12] !== t8) {
+    t9 = /*#__PURE__*/_jsx("p", {
       className: "line-clamp-4 text-xs break-words text-text-muted",
-      children: t7
+      children: t8
     });
-    $[11] = t7;
     $[12] = t8;
-  } else {
-    t8 = $[12];
-  }
-  const t9 = compact ? "mt-1" : "mt-2";
-  let t10;
-  if ($[13] !== t9) {
-    t10 = clsx("flex items-center gap-2", t9);
     $[13] = t9;
-    $[14] = t10;
   } else {
-    t10 = $[14];
+    t9 = $[13];
   }
+  const t10 = compact ? "mt-1" : "mt-2";
   let t11;
-  if ($[15] !== t) {
-    t11 = t("action.retry");
-    $[15] = t;
-    $[16] = t11;
+  if ($[14] !== t10) {
+    t11 = clsx("flex items-center gap-2", t10);
+    $[14] = t10;
+    $[15] = t11;
   } else {
-    t11 = $[16];
+    t11 = $[15];
   }
   let t12;
-  if ($[17] !== onRetry || $[18] !== t11) {
-    t12 = /*#__PURE__*/_jsx(Button, {
+  if ($[16] !== t) {
+    t12 = t("action.retry");
+    $[16] = t;
+    $[17] = t12;
+  } else {
+    t12 = $[17];
+  }
+  let t13;
+  if ($[18] !== onRetry || $[19] !== t12) {
+    t13 = /*#__PURE__*/_jsx(Button, {
       variant: "secondary",
       size: "sm",
       onClick: onRetry,
-      children: t11
+      children: t12
     });
-    $[17] = onRetry;
-    $[18] = t11;
+    $[18] = onRetry;
     $[19] = t12;
+    $[20] = t13;
   } else {
-    t12 = $[19];
+    t13 = $[20];
   }
-  let t13;
-  if ($[20] !== reload || $[21] !== t) {
-    t13 = reload && /*#__PURE__*/_jsxs(Button, {
+  let t14;
+  if ($[21] !== reload || $[22] !== t) {
+    t14 = reload && /*#__PURE__*/_jsxs(Button, {
       variant: "secondary",
       size: "sm",
       onClick: _temp,
@@ -132,88 +140,90 @@ function ErrorFallback(t0) {
         size: 14
       }), t("action.reload")]
     });
-    $[20] = reload;
-    $[21] = t;
-    $[22] = t13;
+    $[21] = reload;
+    $[22] = t;
+    $[23] = t14;
   } else {
-    t13 = $[22];
-  }
-  let t14;
-  if ($[23] !== componentStack || $[24] !== error || $[25] !== label) {
-    t14 = errorReport(label, error, componentStack);
-    $[23] = componentStack;
-    $[24] = error;
-    $[25] = label;
-    $[26] = t14;
-  } else {
-    t14 = $[26];
+    t14 = $[23];
   }
   let t15;
-  if ($[27] !== t) {
-    t15 = t("action.copyError");
-    $[27] = t;
-    $[28] = t15;
+  if ($[24] !== componentStack || $[25] !== error || $[26] !== label) {
+    t15 = errorReport(label, error, componentStack);
+    $[24] = componentStack;
+    $[25] = error;
+    $[26] = label;
+    $[27] = t15;
   } else {
-    t15 = $[28];
+    t15 = $[27];
   }
   let t16;
-  if ($[29] !== t14 || $[30] !== t15) {
-    t16 = /*#__PURE__*/_jsx(ButtonGroup, {
+  if ($[28] !== t) {
+    t16 = t("action.copyError");
+    $[28] = t;
+    $[29] = t16;
+  } else {
+    t16 = $[29];
+  }
+  let t17;
+  if ($[30] !== t15 || $[31] !== t16) {
+    t17 = /*#__PURE__*/_jsx(ButtonGroup, {
       children: /*#__PURE__*/_jsx(CopyButton, {
-        text: t14,
-        label: t15,
+        text: t15,
+        label: t16,
         size: "sm"
       })
     });
-    $[29] = t14;
     $[30] = t15;
     $[31] = t16;
+    $[32] = t17;
   } else {
-    t16 = $[31];
+    t17 = $[32];
   }
-  let t17;
-  if ($[32] !== t10 || $[33] !== t12 || $[34] !== t13 || $[35] !== t16) {
-    t17 = /*#__PURE__*/_jsxs("div", {
-      className: t10,
-      children: [t12, t13, t16]
+  let t18;
+  if ($[33] !== t11 || $[34] !== t13 || $[35] !== t14 || $[36] !== t17) {
+    t18 = /*#__PURE__*/_jsxs("div", {
+      className: t11,
+      children: [t13, t14, t17]
     });
-    $[32] = t10;
-    $[33] = t12;
+    $[33] = t11;
     $[34] = t13;
-    $[35] = t16;
+    $[35] = t14;
     $[36] = t17;
+    $[37] = t18;
   } else {
-    t17 = $[36];
+    t18 = $[37];
   }
-  let t18;
-  if ($[37] !== t17 || $[38] !== t4 || $[39] !== t5 || $[40] !== t6 || $[41] !== t8) {
-    t18 = /*#__PURE__*/_jsxs("div", {
-      className: t4,
-      children: [t5, t6, t8, t17]
+  let t19;
+  if ($[38] !== t18 || $[39] !== t5 || $[40] !== t6 || $[41] !== t7 || $[42] !== t9) {
+    t19 = /*#__PURE__*/_jsxs("div", {
+      className: t5,
+      children: [t6, t7, t9, t18]
     });
-    $[37] = t17;
-    $[38] = t4;
+    $[38] = t18;
     $[39] = t5;
     $[40] = t6;
-    $[41] = t8;
-    $[42] = t18;
+    $[41] = t7;
+    $[42] = t9;
+    $[43] = t19;
   } else {
-    t18 = $[42];
+    t19 = $[43];
   }
-  let t19;
-  if ($[43] !== t18 || $[44] !== t2) {
-    t19 = /*#__PURE__*/_jsx("div", {
+  let t20;
+  if ($[44] !== t1 || $[45] !== t19 || $[46] !== t3) {
+    t20 = /*#__PURE__*/_jsx(ScrollArea, {
       role: "alert",
-      className: t2,
-      children: t18
+      className: t1,
+      viewportClassName: t3,
+      children: t19
     });
-    $[43] = t18;
-    $[44] = t2;
+    $[44] = t1;
     $[45] = t19;
+    $[46] = t3;
+    $[47] = t20;
   } else {
-    t19 = $[45];
+    t20 = $[47];
   }
-  return t19;
+  return t20;
 }
 /* Without one React unmounts the whole tree, and whatever lives in it (an embedded page, a running terminal) goes down with it. */
 function _temp() {

package/dist/Field.d.ts

@@ -1,5 +1,5 @@
-import { type ReactNode, type Ref } from 'react';
 import { useRender } from '@base-ui/react/use-render';
+import { type ReactNode, type Ref } from 'react';
 export type FieldHintProps = useRender.ComponentProps<'p'>;
 export declare function FieldHint({ render, className, ref, ...props }: FieldHintProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
 export type FormErrorProps = useRender.ComponentProps<'p'>;

package/dist/Field.js

@@ -1,7 +1,7 @@
 import { c as _c } from "react/compiler-runtime";
-import { useId } from 'react';
-import clsx from 'clsx';
 import { useRender } from '@base-ui/react/use-render';
+import clsx from 'clsx';
+import { useId } from 'react';
 import { FieldContext } from './field-context.js';
 import { SectionLabel } from "./SectionLabel.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";

package/dist/FileIcon.d.ts

@@ -3,6 +3,6 @@ export interface FileIconProps {
     path: string;
     size?: number;
     className?: string;
-    ref?: Ref<SVGSVGElement>;
+    ref?: Ref<SVGSVGElement | HTMLImageElement>;
 }
 export declare function FileIcon({ path, size, className, ref }: FileIconProps): import("react").JSX.Element;

package/dist/FileIcon.js

@@ -1,14 +1,14 @@
 import { c as _c } from "react/compiler-runtime";
-import { useInsertionEffect } from 'react';
 import clsx from 'clsx';
-import { fileIconFor, fileIconOverrideFor, mountFileIconSprite } from './file-icon.js';
+import { useInsertionEffect, useSyncExternalStore } from 'react';
+import { fileIconFor, fileIconOverrideFor, fileIconOverrideVersion, mountFileIconSprite, subscribeFileIconOverride } from './file-icon.js';
 /*
  * The one place the library steps outside Lucide. The glyphs are Seti's, and so are their colors: a
  * TypeScript blue is the mark of the file type, not a theme choice. Decorative like every other icon here.
  */
 import { jsx as _jsx } from "react/jsx-runtime";
 export function FileIcon(t0) {
-  const $ = _c(20);
+  const $ = _c(22);
   const {
     path,
     size: t1,
@@ -24,71 +24,75 @@ export function FileIcon(t0) {
     t2 = $[0];
   }
   useInsertionEffect(mountFileIconSprite, t2);
+  const version = useSyncExternalStore(subscribeFileIconOverride, fileIconOverrideVersion, fileIconOverrideVersion);
   let t3;
-  if ($[1] !== path) {
-    t3 = fileIconOverrideFor(path);
+  if ($[1] !== path || $[2] !== version) {
+    t3 = overrideFor(path, version);
     $[1] = path;
-    $[2] = t3;
+    $[2] = version;
+    $[3] = t3;
   } else {
-    t3 = $[2];
+    t3 = $[3];
   }
   const own = t3;
   if (own !== null) {
     let t4;
-    if ($[3] !== className) {
+    if ($[4] !== className) {
       t4 = clsx("file-icon", className);
-      $[3] = className;
-      $[4] = t4;
+      $[4] = className;
+      $[5] = t4;
     } else {
-      t4 = $[4];
+      t4 = $[5];
     }
     let t5;
-    if ($[5] !== own || $[6] !== size || $[7] !== t4) {
+    if ($[6] !== own || $[7] !== ref || $[8] !== size || $[9] !== t4) {
       t5 = /*#__PURE__*/_jsx("img", {
+        ref: ref,
         src: own,
         alt: "",
         width: size,
         height: size,
         className: t4
       });
-      $[5] = own;
-      $[6] = size;
-      $[7] = t4;
-      $[8] = t5;
+      $[6] = own;
+      $[7] = ref;
+      $[8] = size;
+      $[9] = t4;
+      $[10] = t5;
     } else {
-      t5 = $[8];
+      t5 = $[10];
     }
     return t5;
   }
   let t4;
-  if ($[9] !== className) {
+  if ($[11] !== className) {
     t4 = clsx("file-icon", className);
-    $[9] = className;
-    $[10] = t4;
+    $[11] = className;
+    $[12] = t4;
   } else {
-    t4 = $[10];
+    t4 = $[12];
   }
   let t5;
-  if ($[11] !== path) {
+  if ($[13] !== path) {
     t5 = fileIconFor(path);
-    $[11] = path;
-    $[12] = t5;
+    $[13] = path;
+    $[14] = t5;
   } else {
-    t5 = $[12];
+    t5 = $[14];
   }
   const t6 = `#${t5}`;
   let t7;
-  if ($[13] !== t6) {
+  if ($[15] !== t6) {
     t7 = /*#__PURE__*/_jsx("use", {
       href: t6
     });
-    $[13] = t6;
-    $[14] = t7;
+    $[15] = t6;
+    $[16] = t7;
   } else {
-    t7 = $[14];
+    t7 = $[16];
   }
   let t8;
-  if ($[15] !== ref || $[16] !== size || $[17] !== t4 || $[18] !== t7) {
+  if ($[17] !== ref || $[18] !== size || $[19] !== t4 || $[20] !== t7) {
     t8 = /*#__PURE__*/_jsx("svg", {
       ref: ref,
       className: t4,
@@ -98,13 +102,17 @@ export function FileIcon(t0) {
       "aria-hidden": true,
       children: t7
     });
-    $[15] = ref;
-    $[16] = size;
-    $[17] = t4;
-    $[18] = t7;
-    $[19] = t8;
+    $[17] = ref;
+    $[18] = size;
+    $[19] = t4;
+    $[20] = t7;
+    $[21] = t8;
   } else {
-    t8 = $[19];
+    t8 = $[21];
   }
   return t8;
+}
+/* Takes the version so the compiler caches the result on it as well as on the path. */
+function overrideFor(path, _version) {
+  return fileIconOverrideFor(path);
 }

package/dist/Icon.d.ts

@@ -1,5 +1,5 @@
-import type { Ref } from 'react';
 import type { LucideIcon } from 'lucide-react';
+import type { Ref } from 'react';
 export interface IconProps {
     icon: LucideIcon;
     size?: number;

package/dist/IconButton.d.ts

@@ -1,9 +1,9 @@
-import type { ComponentProps, ReactNode } from 'react';
-import type { LucideIcon } from 'lucide-react';
 import { useRender } from '@base-ui/react/use-render';
+import type { LucideIcon } from 'lucide-react';
+import type { ComponentProps, ReactNode } from 'react';
+import { type IconButtonSize } from './icon-button-size.ts';
 import type { Shortcut } from './shortcut.ts';
 import { type TooltipSide } from './Tooltip.tsx';
-import { type IconButtonSize } from './icon-button-size.ts';
 export type { IconButtonSize };
 export interface IconButtonProps extends Omit<ComponentProps<'button'>, 'children'> {
     icon?: LucideIcon;

package/dist/IconButton.js

@@ -1,10 +1,10 @@
 import { c as _c } from "react/compiler-runtime";
-import clsx from 'clsx';
 import { useRender } from '@base-ui/react/use-render';
+import clsx from 'clsx';
+import { ICON_BUTTON_CLASS, ICON_BUTTON_ICON_SIZE } from './icon-button-size.js';
 import { Icon } from "./Icon.js";
 import { Spinner } from "./Spinner.js";
 import { Tooltip } from "./Tooltip.js";
-import { ICON_BUTTON_CLASS, ICON_BUTTON_ICON_SIZE } from './icon-button-size.js';
 /* The one place the icon inside an icon button is sized. */
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 export function IconButton(t0) {