@adecore/ui 0.33.2 → 0.34.0

package/dist/match.js

@@ -0,0 +1,47 @@
+const WORD_START = /[\s\-_./:]/;
+/* Whether `query` starts the text or one of its words. */
+const startsWord = (text, query) => {
+  let at = text.indexOf(query);
+  while (at !== -1) {
+    if (at === 0 || WORD_START.test(text[at - 1])) {
+      return true;
+    }
+    at = text.indexOf(query, at + 1);
+  }
+  return false;
+};
+const lettersInOrder = (text, query) => {
+  let at = 0;
+  for (const letter of query.replace(/\s+/g, '')) {
+    at = text.indexOf(letter, at);
+    if (at === -1) {
+      return false;
+    }
+    at += 1;
+  }
+  return true;
+};
+/*
+ * How well `text` answers to what a person typed, ignoring case: 5 when it starts with the query,
+ * 4 when one of its words does, 3 when every typed word is in it and it starts with the first,
+ * 2 when every typed word is in it in any order, 1 when the letters are in it in order, and `null`
+ * when it does not match. An empty query matches everything with 0.
+ */
+export function matchScore(text, query) {
+  const wanted = query.trim().toLowerCase();
+  if (wanted === '') {
+    return 0;
+  }
+  const haystack = text.toLowerCase();
+  if (haystack.startsWith(wanted)) {
+    return 5;
+  }
+  if (startsWord(haystack, wanted)) {
+    return 4;
+  }
+  const words = wanted.split(/\s+/);
+  if (words.every(word => haystack.includes(word))) {
+    return haystack.startsWith(words[0]) ? 3 : 2;
+  }
+  return lettersInOrder(haystack, wanted) ? 1 : null;
+}

package/dist/segmented-keys.d.ts

@@ -0,0 +1,3 @@
+import type { SegmentedOption } from './Segmented.tsx';
+export declare function segmentedStop<T extends string>(options: readonly SegmentedOption<T>[], value: T): number;
+export declare function segmentedTarget(options: readonly SegmentedOption<string>[], index: number, key: string): number | null;

package/dist/segmented-keys.js

@@ -0,0 +1,33 @@
+const STEPS = {
+  ArrowRight: 1,
+  ArrowDown: 1,
+  ArrowLeft: -1,
+  ArrowUp: -1
+};
+// The index of the one tab stop: the picked option, or the first that can be picked when that one is missing or disabled.
+export function segmentedStop(options, value) {
+  const picked = options.findIndex(option => option.id === value);
+  return picked !== -1 && !options[picked].disabled ? picked : options.findIndex(option => !option.disabled);
+}
+// The index a key moves to from `index`, passing over disabled options and around the ends; `null` when the key moves nothing.
+export function segmentedTarget(options, index, key) {
+  const nearest = (from, step) => {
+    for (let offset = 0; offset < options.length; offset++) {
+      const candidate = ((from + step * offset) % options.length + options.length) % options.length;
+      if (!options[candidate].disabled) {
+        return candidate;
+      }
+    }
+    return null;
+  };
+  if (key in STEPS) {
+    return nearest(index + STEPS[key], STEPS[key]);
+  }
+  if (key === 'Home') {
+    return nearest(0, 1);
+  }
+  if (key === 'End') {
+    return nearest(options.length - 1, -1);
+  }
+  return null;
+}

package/dist/theme.css

@@ -58,6 +58,14 @@
     --status-error: #dc2626;
     --positive: #15803d;
     --positive-text: #ffffff;
+    /* The series of a chart, in order: the accent, then a categorical order checked for color vision
+       deficiency on both grounds: orange, aqua, yellow, magenta, green. */
+    --chart-1: var(--accent);
+    --chart-2: #eb6834;
+    --chart-3: #1baf7a;
+    --chart-4: #eda100;
+    --chart-5: #e87ba4;
+    --chart-6: #008300;
     /* A control drawn over a picture rather than over the interface, the handle of a wipe, so it
        stays the same in both themes. */
     --media-handle: #ffffff;
@@ -122,6 +130,13 @@
     /* Dark on light green: the dark theme's positive is a foreground color, so text sits on it the
        other way round from the light theme, where the same token is a fill deep enough for white. */
     --positive-text: #052e16;
+    /* Repeated so a dark theme nested under a light one resolves its own accent. */
+    --chart-1: var(--accent);
+    --chart-2: #d95926;
+    --chart-3: #199e70;
+    --chart-4: #c98500;
+    --chart-5: #d55181;
+    --chart-6: #008300;
     --file-icon-gray: #adadb1;
     --file-icon-red: #ff6762;
     --file-icon-vermilion: #d5512f;

package/dist/toast-store.d.ts

@@ -21,6 +21,7 @@ export interface Toast {
     action?: ToastAction;
     actions?: ToastAction[];
     persist?: boolean;
+    lifetime?: number;
     onClose?: () => void;
     deadline?: ToastDeadline;
 }

package/dist/toast-store.js

@@ -3,6 +3,8 @@ import { create } from 'zustand';
 export const SUCCESS_MS = 4000;
 // How long a deletion can still be taken back.
 export const UNDO_MS = 8000;
+// `setTimeout` fires at once past this, so a longer lifetime, `Infinity` too, is a toast that stays.
+const LONGEST_TIMER_MS = 2 ** 31 - 1;
 /* How far into its lifetime a toast is at `now`, held inside that lifetime. */
 export const elapsedOf = (deadline, now) => Math.min(Math.max(now - deadline.start, 0), deadline.end - deadline.start);
 /*
@@ -17,11 +19,19 @@ export const createToastStore = () => {
       clearTimeout(timers.get(id));
       timers.delete(id);
     };
-    /* A toast that went well takes itself away, and so does the offer to undo; a failure and a running action stay. */
-    const schedule = (id, kind, persist) => {
+    /*
+     * A toast that went well takes itself away, and so does the offer to undo; a failure and a running
+     * action stay, unless the toast names a lifetime of its own.
+     */
+    const schedule = (id, toast) => {
       stop(id);
-      const lifetime = kind === 'deleted' ? UNDO_MS : kind === 'success' && !persist ? SUCCESS_MS : null;
-      if (lifetime === null) {
+      const {
+        kind,
+        persist
+      } = toast;
+      const own = toast.lifetime !== undefined && toast.lifetime > 0 ? toast.lifetime : undefined;
+      const lifetime = own ?? (kind === 'deleted' ? UNDO_MS : kind === 'success' && persist !== true ? SUCCESS_MS : null);
+      if (lifetime === null || lifetime > LONGEST_TIMER_MS) {
         return undefined;
       }
       timers.set(id, setTimeout(() => {
@@ -42,7 +52,7 @@ export const createToastStore = () => {
         const next = {
           ...toast,
           id,
-          deadline: schedule(id, toast.kind, toast.persist === true)
+          deadline: schedule(id, toast)
         };
         const toasts = get().toasts;
         set({
@@ -61,7 +71,7 @@ export const createToastStore = () => {
         };
         const next = {
           ...merged,
-          deadline: schedule(id, merged.kind, merged.persist === true)
+          deadline: schedule(id, merged)
         };
         set({
           toasts: get().toasts.map(entry => entry.id === id ? next : entry)

package/dist/workspace/TabStrip.d.ts

@@ -21,6 +21,7 @@ export interface TabStripProps extends Omit<useRender.ComponentProps<'div'>, 'ch
     renderTab?(item: TabStripItem): ReactNode;
     focused?: boolean;
     insertAt?: number | null;
+    pressToClose?: boolean;
     onClose?(id: string): void;
     onDoubleClick?(id: string, event: MouseEvent<HTMLButtonElement>): void;
     onContextMenu?(id: string, event: MouseEvent<HTMLSpanElement>): void;
@@ -29,7 +30,7 @@ export interface TabStripProps extends Omit<useRender.ComponentProps<'div'>, 'ch
     onTabDragOver?(index: number, event: DragEvent<HTMLDivElement>): void;
     onTabDrop?(index: number, event: DragEvent<HTMLDivElement>): void;
 }
-export declare function TabStrip({ items, value, onValueChange, renderTab, focused, insertAt, onClose, onDoubleClick, onContextMenu, onDragStart, onDragEnd, onTabDragOver, onTabDrop, render, className, ref, ...props }: TabStripProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export declare function TabStrip({ items, value, onValueChange, renderTab, focused, insertAt, pressToClose, onClose, onDoubleClick, onContextMenu, onDragStart, onDragEnd, onTabDragOver, onTabDrop, render, className, ref, ...props }: TabStripProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
 export interface DocumentTabProps extends Omit<useRender.ComponentProps<'span'>, 'children' | 'onDoubleClick' | 'onDragStart' | 'onDragEnd'> {
     item: TabStripItem;
     onClose?(): void;