@workflow/web-shared 5.0.0-beta.21 → 5.0.0-beta.22

package/src/components/ui/kbd.tsx

@@ -1,21 +1,43 @@
-import type { ReactNode } from 'react';
+import { cva, type VariantProps } from 'class-variance-authority';
+import type { ComponentProps, ReactNode } from 'react';
 import { cn } from '../../lib/utils';
 
+const kbdVariants = cva(
+  'inline-flex items-center justify-center rounded px-1 text-center font-sans',
+  {
+    variants: {
+      variant: {
+        subtle: 'bg-background-100/20',
+        outline:
+          'border border-gray-alpha-400 bg-background-100 font-medium text-gray-900',
+      },
+      size: {
+        default: 'h-5 min-w-5 text-xs leading-none',
+        compact: 'h-4 min-h-4 min-w-4 text-[11px] leading-none',
+        search: 'h-5 min-h-5 min-w-5 text-[13px] leading-[1.7em]',
+      },
+    },
+    defaultVariants: {
+      variant: 'subtle',
+      size: 'default',
+    },
+  }
+);
+
+type KbdProps = ComponentProps<'kbd'> & VariantProps<typeof kbdVariants>;
+
 export function Kbd({
   children,
   className,
-}: {
-  children: ReactNode;
-  className?: string;
-}): ReactNode {
+  variant,
+  size,
+  ...props
+}: KbdProps): ReactNode {
   return (
-    <kbd
-      className={cn(
-        'inline-flex h-5 min-w-5 items-center justify-center rounded bg-background-100/20 px-1 text-center font-sans text-xs leading-none',
-        className
-      )}
-    >
+    <kbd className={cn(kbdVariants({ variant, size, className }))} {...props}>
       {children}
     </kbd>
   );
 }
+
+export { kbdVariants };

package/src/lib/hydration.ts

@@ -298,7 +298,7 @@ export function getWebRevivers(): Revivers {
 
     // Web-specific overrides for class instances.
     // Create objects with a dynamically-named constructor so that
-    // react-inspector shows the class name (it reads constructor.name).
+    // the data inspector shows the class name (it reads constructor.name).
     Class: (value) => `<class:${extractClassName(value.classId)}>`,
     Instance: (value) => {
       // Run instances are rendered as clickable RunRef badges
@@ -311,7 +311,7 @@ export function getWebRevivers(): Revivers {
       const props =
         data && typeof data === 'object' ? { ...data } : { value: data };
       // Create a constructor with the right name using computed property
-      // so react-inspector's `object.constructor.name` shows the class name.
+      // so the data inspector's `object.constructor.name` shows the class name.
       // Must use `function` (not arrow) because arrow functions have no .prototype.
       // biome-ignore lint/complexity/useArrowFunction: arrow functions have no .prototype
       const ctor = { [className]: function () {} }[className]!;

package/dist/components/ui/inspector-theme.d.ts

@@ -1,95 +0,0 @@
-/**
- * Shared theme configuration for react-inspector's ObjectInspector.
- *
- * Colors follow Geist's Shiki JSON palette so the inspector reads the same
- * as highlighted code blocks across the product:
- *   - property names / punctuation: --ds-gray-1000 (default foreground)
- *   - strings / numbers / booleans: --ds-green-900
- *   - null / undefined: --ds-gray-900 (muted)
- *   - regexp / function: --ds-purple-900
- *   - date: --ds-pink-900
- *
- * Because the `--ds-*` tokens adapt to theme automatically, the light and
- * dark objects are intentionally identical.
- */
-export interface InspectorThemeExtended {
-    /** Color for Date values (Node: 'magenta') */
-    OBJECT_VALUE_DATE_COLOR: string;
-}
-export declare const inspectorThemeExtendedLight: InspectorThemeExtended;
-export declare const inspectorThemeExtendedDark: InspectorThemeExtended;
-export declare const inspectorThemeLight: {
-    BASE_COLOR: string;
-    OBJECT_NAME_COLOR: string;
-    OBJECT_VALUE_STRING_COLOR: string;
-    OBJECT_VALUE_SYMBOL_COLOR: string;
-    OBJECT_VALUE_NUMBER_COLOR: string;
-    OBJECT_VALUE_BOOLEAN_COLOR: string;
-    OBJECT_VALUE_NULL_COLOR: string;
-    OBJECT_VALUE_UNDEFINED_COLOR: string;
-    OBJECT_VALUE_REGEXP_COLOR: string;
-    OBJECT_VALUE_FUNCTION_PREFIX_COLOR: string;
-    HTML_TAG_COLOR: string;
-    HTML_TAGNAME_COLOR: string;
-    HTML_ATTRIBUTE_NAME_COLOR: string;
-    HTML_ATTRIBUTE_VALUE_COLOR: string;
-    HTML_COMMENT_COLOR: string;
-    HTML_DOCTYPE_COLOR: string;
-    ARROW_COLOR: string;
-    TABLE_BORDER_COLOR: string;
-    TABLE_TH_BACKGROUND_COLOR: string;
-    TABLE_TH_HOVER_COLOR: string;
-    TABLE_SORT_ICON_COLOR: string;
-    BASE_FONT_SIZE: string;
-    BASE_LINE_HEIGHT: number;
-    BASE_BACKGROUND_COLOR: string;
-    OBJECT_PREVIEW_ARRAY_MAX_PROPERTIES: number;
-    OBJECT_PREVIEW_OBJECT_MAX_PROPERTIES: number;
-    HTML_TAGNAME_TEXT_TRANSFORM: "lowercase";
-    ARROW_MARGIN_RIGHT: number;
-    ARROW_FONT_SIZE: number;
-    TREENODE_FONT_FAMILY: string;
-    TREENODE_FONT_SIZE: string;
-    TREENODE_LINE_HEIGHT: number;
-    TREENODE_PADDING_LEFT: number;
-    TABLE_DATA_BACKGROUND_IMAGE: string;
-    TABLE_DATA_BACKGROUND_SIZE: string;
-};
-export declare const inspectorThemeDark: {
-    BASE_COLOR: string;
-    OBJECT_NAME_COLOR: string;
-    OBJECT_VALUE_STRING_COLOR: string;
-    OBJECT_VALUE_SYMBOL_COLOR: string;
-    OBJECT_VALUE_NUMBER_COLOR: string;
-    OBJECT_VALUE_BOOLEAN_COLOR: string;
-    OBJECT_VALUE_NULL_COLOR: string;
-    OBJECT_VALUE_UNDEFINED_COLOR: string;
-    OBJECT_VALUE_REGEXP_COLOR: string;
-    OBJECT_VALUE_FUNCTION_PREFIX_COLOR: string;
-    HTML_TAG_COLOR: string;
-    HTML_TAGNAME_COLOR: string;
-    HTML_ATTRIBUTE_NAME_COLOR: string;
-    HTML_ATTRIBUTE_VALUE_COLOR: string;
-    HTML_COMMENT_COLOR: string;
-    HTML_DOCTYPE_COLOR: string;
-    ARROW_COLOR: string;
-    TABLE_BORDER_COLOR: string;
-    TABLE_TH_BACKGROUND_COLOR: string;
-    TABLE_TH_HOVER_COLOR: string;
-    TABLE_SORT_ICON_COLOR: string;
-    BASE_FONT_SIZE: string;
-    BASE_LINE_HEIGHT: number;
-    BASE_BACKGROUND_COLOR: string;
-    OBJECT_PREVIEW_ARRAY_MAX_PROPERTIES: number;
-    OBJECT_PREVIEW_OBJECT_MAX_PROPERTIES: number;
-    HTML_TAGNAME_TEXT_TRANSFORM: "lowercase";
-    ARROW_MARGIN_RIGHT: number;
-    ARROW_FONT_SIZE: number;
-    TREENODE_FONT_FAMILY: string;
-    TREENODE_FONT_SIZE: string;
-    TREENODE_LINE_HEIGHT: number;
-    TREENODE_PADDING_LEFT: number;
-    TABLE_DATA_BACKGROUND_IMAGE: string;
-    TABLE_DATA_BACKGROUND_SIZE: string;
-};
-//# sourceMappingURL=inspector-theme.d.ts.map

package/dist/components/ui/inspector-theme.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"inspector-theme.d.ts","sourceRoot":"","sources":["../../../src/components/ui/inspector-theme.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AAOH,MAAM,WAAW,sBAAsB;IACrC,8CAA8C;IAC9C,uBAAuB,EAAE,MAAM,CAAC;CACjC;AAED,eAAO,MAAM,2BAA2B,EAAE,sBAEzC,CAAC;AAEF,eAAO,MAAM,0BAA0B,EAAE,sBAExC,CAAC;AAwEF,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAa,CAAC;AAM9C,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAa,CAAC"}

package/dist/components/ui/inspector-theme.js

@@ -1,82 +0,0 @@
-/**
- * Shared theme configuration for react-inspector's ObjectInspector.
- *
- * Colors follow Geist's Shiki JSON palette so the inspector reads the same
- * as highlighted code blocks across the product:
- *   - property names / punctuation: --ds-gray-1000 (default foreground)
- *   - strings / numbers / booleans: --ds-green-900
- *   - null / undefined: --ds-gray-900 (muted)
- *   - regexp / function: --ds-purple-900
- *   - date: --ds-pink-900
- *
- * Because the `--ds-*` tokens adapt to theme automatically, the light and
- * dark objects are intentionally identical.
- */
-export const inspectorThemeExtendedLight = {
-    OBJECT_VALUE_DATE_COLOR: 'var(--ds-pink-900)',
-};
-export const inspectorThemeExtendedDark = {
-    OBJECT_VALUE_DATE_COLOR: 'var(--ds-pink-900)',
-};
-// ---------------------------------------------------------------------------
-// Shared structural values (same in both themes)
-// ---------------------------------------------------------------------------
-const shared = {
-    BASE_FONT_SIZE: '11px',
-    BASE_LINE_HEIGHT: 1.4,
-    BASE_BACKGROUND_COLOR: 'transparent',
-    OBJECT_PREVIEW_ARRAY_MAX_PROPERTIES: 10,
-    OBJECT_PREVIEW_OBJECT_MAX_PROPERTIES: 5,
-    HTML_TAGNAME_TEXT_TRANSFORM: 'lowercase',
-    ARROW_MARGIN_RIGHT: 3,
-    ARROW_FONT_SIZE: 12,
-    TREENODE_FONT_FAMILY: 'var(--font-mono)',
-    TREENODE_FONT_SIZE: '11px',
-    TREENODE_LINE_HEIGHT: 1.4,
-    TREENODE_PADDING_LEFT: 12,
-    TABLE_DATA_BACKGROUND_IMAGE: 'none',
-    TABLE_DATA_BACKGROUND_SIZE: '0',
-};
-// ---------------------------------------------------------------------------
-// Light theme
-// ---------------------------------------------------------------------------
-const geistTheme = {
-    ...shared,
-    // Base text
-    BASE_COLOR: 'var(--ds-gray-1000)',
-    // Property names — default foreground (matches JSON key color in Geist Shiki)
-    OBJECT_NAME_COLOR: 'var(--ds-gray-1000)',
-    // Strings & symbols — green
-    OBJECT_VALUE_STRING_COLOR: 'var(--ds-green-900)',
-    OBJECT_VALUE_SYMBOL_COLOR: 'var(--ds-green-900)',
-    // Numbers & booleans — green (Geist JSON tokens)
-    OBJECT_VALUE_NUMBER_COLOR: 'var(--ds-green-900)',
-    OBJECT_VALUE_BOOLEAN_COLOR: 'var(--ds-green-900)',
-    // null — muted foreground
-    OBJECT_VALUE_NULL_COLOR: 'var(--ds-gray-900)',
-    // undefined — muted foreground
-    OBJECT_VALUE_UNDEFINED_COLOR: 'var(--ds-gray-900)',
-    // RegExp — purple
-    OBJECT_VALUE_REGEXP_COLOR: 'var(--ds-purple-900)',
-    // Functions — purple
-    OBJECT_VALUE_FUNCTION_PREFIX_COLOR: 'var(--ds-purple-900)',
-    // HTML (rarely used here, kept consistent with the palette)
-    HTML_TAG_COLOR: 'var(--ds-gray-900)',
-    HTML_TAGNAME_COLOR: 'var(--ds-blue-900)',
-    HTML_ATTRIBUTE_NAME_COLOR: 'var(--ds-amber-900)',
-    HTML_ATTRIBUTE_VALUE_COLOR: 'var(--ds-green-900)',
-    HTML_COMMENT_COLOR: 'var(--ds-gray-700)',
-    HTML_DOCTYPE_COLOR: 'var(--ds-gray-700)',
-    // Structural
-    ARROW_COLOR: 'var(--ds-gray-700)',
-    TABLE_BORDER_COLOR: 'var(--ds-gray-300)',
-    TABLE_TH_BACKGROUND_COLOR: 'var(--ds-gray-100)',
-    TABLE_TH_HOVER_COLOR: 'var(--ds-gray-200)',
-    TABLE_SORT_ICON_COLOR: 'var(--ds-gray-700)',
-};
-export const inspectorThemeLight = geistTheme;
-// ---------------------------------------------------------------------------
-// Dark theme
-// ---------------------------------------------------------------------------
-export const inspectorThemeDark = geistTheme;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5zcGVjdG9yLXRoZW1lLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvdWkvaW5zcGVjdG9yLXRoZW1lLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7Ozs7Ozs7Ozs7O0dBYUc7QUFZSCxNQUFNLENBQUMsTUFBTSwyQkFBMkIsR0FBMkI7SUFDakUsdUJBQXVCLEVBQUUsb0JBQW9CO0NBQzlDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSwwQkFBMEIsR0FBMkI7SUFDaEUsdUJBQXVCLEVBQUUsb0JBQW9CO0NBQzlDLENBQUM7QUFFRiw4RUFBOEU7QUFDOUUsaURBQWlEO0FBQ2pELDhFQUE4RTtBQUU5RSxNQUFNLE1BQU0sR0FBRztJQUNiLGNBQWMsRUFBRSxNQUFNO0lBQ3RCLGdCQUFnQixFQUFFLEdBQUc7SUFDckIscUJBQXFCLEVBQUUsYUFBYTtJQUNwQyxtQ0FBbUMsRUFBRSxFQUFFO0lBQ3ZDLG9DQUFvQyxFQUFFLENBQUM7SUFDdkMsMkJBQTJCLEVBQUUsV0FBb0I7SUFDakQsa0JBQWtCLEVBQUUsQ0FBQztJQUNyQixlQUFlLEVBQUUsRUFBRTtJQUNuQixvQkFBb0IsRUFBRSxrQkFBa0I7SUFDeEMsa0JBQWtCLEVBQUUsTUFBTTtJQUMxQixvQkFBb0IsRUFBRSxHQUFHO0lBQ3pCLHFCQUFxQixFQUFFLEVBQUU7SUFDekIsMkJBQTJCLEVBQUUsTUFBTTtJQUNuQywwQkFBMEIsRUFBRSxHQUFHO0NBQ2hDLENBQUM7QUFFRiw4RUFBOEU7QUFDOUUsY0FBYztBQUNkLDhFQUE4RTtBQUU5RSxNQUFNLFVBQVUsR0FBRztJQUNqQixHQUFHLE1BQU07SUFFVCxZQUFZO0lBQ1osVUFBVSxFQUFFLHFCQUFxQjtJQUVqQyw4RUFBOEU7SUFDOUUsaUJBQWlCLEVBQUUscUJBQXFCO0lBRXhDLDRCQUE0QjtJQUM1Qix5QkFBeUIsRUFBRSxxQkFBcUI7SUFDaEQseUJBQXlCLEVBQUUscUJBQXFCO0lBRWhELGlEQUFpRDtJQUNqRCx5QkFBeUIsRUFBRSxxQkFBcUI7SUFDaEQsMEJBQTBCLEVBQUUscUJBQXFCO0lBRWpELDBCQUEwQjtJQUMxQix1QkFBdUIsRUFBRSxvQkFBb0I7SUFFN0MsK0JBQStCO0lBQy9CLDRCQUE0QixFQUFFLG9CQUFvQjtJQUVsRCxrQkFBa0I7SUFDbEIseUJBQXlCLEVBQUUsc0JBQXNCO0lBRWpELHFCQUFxQjtJQUNyQixrQ0FBa0MsRUFBRSxzQkFBc0I7SUFFMUQsNERBQTREO0lBQzVELGNBQWMsRUFBRSxvQkFBb0I7SUFDcEMsa0JBQWtCLEVBQUUsb0JBQW9CO0lBQ3hDLHlCQUF5QixFQUFFLHFCQUFxQjtJQUNoRCwwQkFBMEIsRUFBRSxxQkFBcUI7SUFDakQsa0JBQWtCLEVBQUUsb0JBQW9CO0lBQ3hDLGtCQUFrQixFQUFFLG9CQUFvQjtJQUV4QyxhQUFhO0lBQ2IsV0FBVyxFQUFFLG9CQUFvQjtJQUNqQyxrQkFBa0IsRUFBRSxvQkFBb0I7SUFDeEMseUJBQXlCLEVBQUUsb0JBQW9CO0lBQy9DLG9CQUFvQixFQUFFLG9CQUFvQjtJQUMxQyxxQkFBcUIsRUFBRSxvQkFBb0I7Q0FDNUMsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLG1CQUFtQixHQUFHLFVBQVUsQ0FBQztBQUU5Qyw4RUFBOEU7QUFDOUUsYUFBYTtBQUNiLDhFQUE4RTtBQUU5RSxNQUFNLENBQUMsTUFBTSxrQkFBa0IsR0FBRyxVQUFVLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIFNoYXJlZCB0aGVtZSBjb25maWd1cmF0aW9uIGZvciByZWFjdC1pbnNwZWN0b3IncyBPYmplY3RJbnNwZWN0b3IuXG4gKlxuICogQ29sb3JzIGZvbGxvdyBHZWlzdCdzIFNoaWtpIEpTT04gcGFsZXR0ZSBzbyB0aGUgaW5zcGVjdG9yIHJlYWRzIHRoZSBzYW1lXG4gKiBhcyBoaWdobGlnaHRlZCBjb2RlIGJsb2NrcyBhY3Jvc3MgdGhlIHByb2R1Y3Q6XG4gKiAgIC0gcHJvcGVydHkgbmFtZXMgLyBwdW5jdHVhdGlvbjogLS1kcy1ncmF5LTEwMDAgKGRlZmF1bHQgZm9yZWdyb3VuZClcbiAqICAgLSBzdHJpbmdzIC8gbnVtYmVycyAvIGJvb2xlYW5zOiAtLWRzLWdyZWVuLTkwMFxuICogICAtIG51bGwgLyB1bmRlZmluZWQ6IC0tZHMtZ3JheS05MDAgKG11dGVkKVxuICogICAtIHJlZ2V4cCAvIGZ1bmN0aW9uOiAtLWRzLXB1cnBsZS05MDBcbiAqICAgLSBkYXRlOiAtLWRzLXBpbmstOTAwXG4gKlxuICogQmVjYXVzZSB0aGUgYC0tZHMtKmAgdG9rZW5zIGFkYXB0IHRvIHRoZW1lIGF1dG9tYXRpY2FsbHksIHRoZSBsaWdodCBhbmRcbiAqIGRhcmsgb2JqZWN0cyBhcmUgaW50ZW50aW9uYWxseSBpZGVudGljYWwuXG4gKi9cblxuLy8gLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tXG4vLyBFeHRlbmRlZCBjb2xvciB0b2tlbnMgbm90IHN1cHBvcnRlZCBieSByZWFjdC1pbnNwZWN0b3IncyBidWlsdC1pbiB0aGVtZVxuLy8gc3lzdGVtLCBhcHBsaWVkIHZpYSBvdXIgY3VzdG9tIG5vZGVSZW5kZXJlciBpbiBkYXRhLWluc3BlY3Rvci50c3guXG4vLyAtLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS1cblxuZXhwb3J0IGludGVyZmFjZSBJbnNwZWN0b3JUaGVtZUV4dGVuZGVkIHtcbiAgLyoqIENvbG9yIGZvciBEYXRlIHZhbHVlcyAoTm9kZTogJ21hZ2VudGEnKSAqL1xuICBPQkpFQ1RfVkFMVUVfREFURV9DT0xPUjogc3RyaW5nO1xufVxuXG5leHBvcnQgY29uc3QgaW5zcGVjdG9yVGhlbWVFeHRlbmRlZExpZ2h0OiBJbnNwZWN0b3JUaGVtZUV4dGVuZGVkID0ge1xuICBPQkpFQ1RfVkFMVUVfREFURV9DT0xPUjogJ3ZhcigtLWRzLXBpbmstOTAwKScsXG59O1xuXG5leHBvcnQgY29uc3QgaW5zcGVjdG9yVGhlbWVFeHRlbmRlZERhcms6IEluc3BlY3RvclRoZW1lRXh0ZW5kZWQgPSB7XG4gIE9CSkVDVF9WQUxVRV9EQVRFX0NPTE9SOiAndmFyKC0tZHMtcGluay05MDApJyxcbn07XG5cbi8vIC0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLVxuLy8gU2hhcmVkIHN0cnVjdHVyYWwgdmFsdWVzIChzYW1lIGluIGJvdGggdGhlbWVzKVxuLy8gLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tXG5cbmNvbnN0IHNoYXJlZCA9IHtcbiAgQkFTRV9GT05UX1NJWkU6ICcxMXB4JyxcbiAgQkFTRV9MSU5FX0hFSUdIVDogMS40LFxuICBCQVNFX0JBQ0tHUk9VTkRfQ09MT1I6ICd0cmFuc3BhcmVudCcsXG4gIE9CSkVDVF9QUkVWSUVXX0FSUkFZX01BWF9QUk9QRVJUSUVTOiAxMCxcbiAgT0JKRUNUX1BSRVZJRVdfT0JKRUNUX01BWF9QUk9QRVJUSUVTOiA1LFxuICBIVE1MX1RBR05BTUVfVEVYVF9UUkFOU0ZPUk06ICdsb3dlcmNhc2UnIGFzIGNvbnN0LFxuICBBUlJPV19NQVJHSU5fUklHSFQ6IDMsXG4gIEFSUk9XX0ZPTlRfU0laRTogMTIsXG4gIFRSRUVOT0RFX0ZPTlRfRkFNSUxZOiAndmFyKC0tZm9udC1tb25vKScsXG4gIFRSRUVOT0RFX0ZPTlRfU0laRTogJzExcHgnLFxuICBUUkVFTk9ERV9MSU5FX0hFSUdIVDogMS40LFxuICBUUkVFTk9ERV9QQURESU5HX0xFRlQ6IDEyLFxuICBUQUJMRV9EQVRBX0JBQ0tHUk9VTkRfSU1BR0U6ICdub25lJyxcbiAgVEFCTEVfREFUQV9CQUNLR1JPVU5EX1NJWkU6ICcwJyxcbn07XG5cbi8vIC0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLVxuLy8gTGlnaHQgdGhlbWVcbi8vIC0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLVxuXG5jb25zdCBnZWlzdFRoZW1lID0ge1xuICAuLi5zaGFyZWQsXG5cbiAgLy8gQmFzZSB0ZXh0XG4gIEJBU0VfQ09MT1I6ICd2YXIoLS1kcy1ncmF5LTEwMDApJyxcblxuICAvLyBQcm9wZXJ0eSBuYW1lcyDigJQgZGVmYXVsdCBmb3JlZ3JvdW5kIChtYXRjaGVzIEpTT04ga2V5IGNvbG9yIGluIEdlaXN0IFNoaWtpKVxuICBPQkpFQ1RfTkFNRV9DT0xPUjogJ3ZhcigtLWRzLWdyYXktMTAwMCknLFxuXG4gIC8vIFN0cmluZ3MgJiBzeW1ib2xzIOKAlCBncmVlblxuICBPQkpFQ1RfVkFMVUVfU1RSSU5HX0NPTE9SOiAndmFyKC0tZHMtZ3JlZW4tOTAwKScsXG4gIE9CSkVDVF9WQUxVRV9TWU1CT0xfQ09MT1I6ICd2YXIoLS1kcy1ncmVlbi05MDApJyxcblxuICAvLyBOdW1iZXJzICYgYm9vbGVhbnMg4oCUIGdyZWVuIChHZWlzdCBKU09OIHRva2VucylcbiAgT0JKRUNUX1ZBTFVFX05VTUJFUl9DT0xPUjogJ3ZhcigtLWRzLWdyZWVuLTkwMCknLFxuICBPQkpFQ1RfVkFMVUVfQk9PTEVBTl9DT0xPUjogJ3ZhcigtLWRzLWdyZWVuLTkwMCknLFxuXG4gIC8vIG51bGwg4oCUIG11dGVkIGZvcmVncm91bmRcbiAgT0JKRUNUX1ZBTFVFX05VTExfQ09MT1I6ICd2YXIoLS1kcy1ncmF5LTkwMCknLFxuXG4gIC8vIHVuZGVmaW5lZCDigJQgbXV0ZWQgZm9yZWdyb3VuZFxuICBPQkpFQ1RfVkFMVUVfVU5ERUZJTkVEX0NPTE9SOiAndmFyKC0tZHMtZ3JheS05MDApJyxcblxuICAvLyBSZWdFeHAg4oCUIHB1cnBsZVxuICBPQkpFQ1RfVkFMVUVfUkVHRVhQX0NPTE9SOiAndmFyKC0tZHMtcHVycGxlLTkwMCknLFxuXG4gIC8vIEZ1bmN0aW9ucyDigJQgcHVycGxlXG4gIE9CSkVDVF9WQUxVRV9GVU5DVElPTl9QUkVGSVhfQ09MT1I6ICd2YXIoLS1kcy1wdXJwbGUtOTAwKScsXG5cbiAgLy8gSFRNTCAocmFyZWx5IHVzZWQgaGVyZSwga2VwdCBjb25zaXN0ZW50IHdpdGggdGhlIHBhbGV0dGUpXG4gIEhUTUxfVEFHX0NPTE9SOiAndmFyKC0tZHMtZ3JheS05MDApJyxcbiAgSFRNTF9UQUdOQU1FX0NPTE9SOiAndmFyKC0tZHMtYmx1ZS05MDApJyxcbiAgSFRNTF9BVFRSSUJVVEVfTkFNRV9DT0xPUjogJ3ZhcigtLWRzLWFtYmVyLTkwMCknLFxuICBIVE1MX0FUVFJJQlVURV9WQUxVRV9DT0xPUjogJ3ZhcigtLWRzLWdyZWVuLTkwMCknLFxuICBIVE1MX0NPTU1FTlRfQ09MT1I6ICd2YXIoLS1kcy1ncmF5LTcwMCknLFxuICBIVE1MX0RPQ1RZUEVfQ09MT1I6ICd2YXIoLS1kcy1ncmF5LTcwMCknLFxuXG4gIC8vIFN0cnVjdHVyYWxcbiAgQVJST1dfQ09MT1I6ICd2YXIoLS1kcy1ncmF5LTcwMCknLFxuICBUQUJMRV9CT1JERVJfQ09MT1I6ICd2YXIoLS1kcy1ncmF5LTMwMCknLFxuICBUQUJMRV9USF9CQUNLR1JPVU5EX0NPTE9SOiAndmFyKC0tZHMtZ3JheS0xMDApJyxcbiAgVEFCTEVfVEhfSE9WRVJfQ09MT1I6ICd2YXIoLS1kcy1ncmF5LTIwMCknLFxuICBUQUJMRV9TT1JUX0lDT05fQ09MT1I6ICd2YXIoLS1kcy1ncmF5LTcwMCknLFxufTtcblxuZXhwb3J0IGNvbnN0IGluc3BlY3RvclRoZW1lTGlnaHQgPSBnZWlzdFRoZW1lO1xuXG4vLyAtLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS1cbi8vIERhcmsgdGhlbWVcbi8vIC0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLVxuXG5leHBvcnQgY29uc3QgaW5zcGVjdG9yVGhlbWVEYXJrID0gZ2Vpc3RUaGVtZTtcbiJdfQ==

package/src/components/ui/inspector-theme.ts

@@ -1,110 +0,0 @@
-/**
- * Shared theme configuration for react-inspector's ObjectInspector.
- *
- * Colors follow Geist's Shiki JSON palette so the inspector reads the same
- * as highlighted code blocks across the product:
- *   - property names / punctuation: --ds-gray-1000 (default foreground)
- *   - strings / numbers / booleans: --ds-green-900
- *   - null / undefined: --ds-gray-900 (muted)
- *   - regexp / function: --ds-purple-900
- *   - date: --ds-pink-900
- *
- * Because the `--ds-*` tokens adapt to theme automatically, the light and
- * dark objects are intentionally identical.
- */
-
-// ---------------------------------------------------------------------------
-// Extended color tokens not supported by react-inspector's built-in theme
-// system, applied via our custom nodeRenderer in data-inspector.tsx.
-// ---------------------------------------------------------------------------
-
-export interface InspectorThemeExtended {
-  /** Color for Date values (Node: 'magenta') */
-  OBJECT_VALUE_DATE_COLOR: string;
-}
-
-export const inspectorThemeExtendedLight: InspectorThemeExtended = {
-  OBJECT_VALUE_DATE_COLOR: 'var(--ds-pink-900)',
-};
-
-export const inspectorThemeExtendedDark: InspectorThemeExtended = {
-  OBJECT_VALUE_DATE_COLOR: 'var(--ds-pink-900)',
-};
-
-// ---------------------------------------------------------------------------
-// Shared structural values (same in both themes)
-// ---------------------------------------------------------------------------
-
-const shared = {
-  BASE_FONT_SIZE: '11px',
-  BASE_LINE_HEIGHT: 1.4,
-  BASE_BACKGROUND_COLOR: 'transparent',
-  OBJECT_PREVIEW_ARRAY_MAX_PROPERTIES: 10,
-  OBJECT_PREVIEW_OBJECT_MAX_PROPERTIES: 5,
-  HTML_TAGNAME_TEXT_TRANSFORM: 'lowercase' as const,
-  ARROW_MARGIN_RIGHT: 3,
-  ARROW_FONT_SIZE: 12,
-  TREENODE_FONT_FAMILY: 'var(--font-mono)',
-  TREENODE_FONT_SIZE: '11px',
-  TREENODE_LINE_HEIGHT: 1.4,
-  TREENODE_PADDING_LEFT: 12,
-  TABLE_DATA_BACKGROUND_IMAGE: 'none',
-  TABLE_DATA_BACKGROUND_SIZE: '0',
-};
-
-// ---------------------------------------------------------------------------
-// Light theme
-// ---------------------------------------------------------------------------
-
-const geistTheme = {
-  ...shared,
-
-  // Base text
-  BASE_COLOR: 'var(--ds-gray-1000)',
-
-  // Property names — default foreground (matches JSON key color in Geist Shiki)
-  OBJECT_NAME_COLOR: 'var(--ds-gray-1000)',
-
-  // Strings & symbols — green
-  OBJECT_VALUE_STRING_COLOR: 'var(--ds-green-900)',
-  OBJECT_VALUE_SYMBOL_COLOR: 'var(--ds-green-900)',
-
-  // Numbers & booleans — green (Geist JSON tokens)
-  OBJECT_VALUE_NUMBER_COLOR: 'var(--ds-green-900)',
-  OBJECT_VALUE_BOOLEAN_COLOR: 'var(--ds-green-900)',
-
-  // null — muted foreground
-  OBJECT_VALUE_NULL_COLOR: 'var(--ds-gray-900)',
-
-  // undefined — muted foreground
-  OBJECT_VALUE_UNDEFINED_COLOR: 'var(--ds-gray-900)',
-
-  // RegExp — purple
-  OBJECT_VALUE_REGEXP_COLOR: 'var(--ds-purple-900)',
-
-  // Functions — purple
-  OBJECT_VALUE_FUNCTION_PREFIX_COLOR: 'var(--ds-purple-900)',
-
-  // HTML (rarely used here, kept consistent with the palette)
-  HTML_TAG_COLOR: 'var(--ds-gray-900)',
-  HTML_TAGNAME_COLOR: 'var(--ds-blue-900)',
-  HTML_ATTRIBUTE_NAME_COLOR: 'var(--ds-amber-900)',
-  HTML_ATTRIBUTE_VALUE_COLOR: 'var(--ds-green-900)',
-  HTML_COMMENT_COLOR: 'var(--ds-gray-700)',
-  HTML_DOCTYPE_COLOR: 'var(--ds-gray-700)',
-
-  // Structural
-  ARROW_COLOR: 'var(--ds-gray-700)',
-  TABLE_BORDER_COLOR: 'var(--ds-gray-300)',
-  TABLE_TH_BACKGROUND_COLOR: 'var(--ds-gray-100)',
-  TABLE_TH_HOVER_COLOR: 'var(--ds-gray-200)',
-  TABLE_SORT_ICON_COLOR: 'var(--ds-gray-700)',
-};
-
-export const inspectorThemeLight = geistTheme;
-
-// ---------------------------------------------------------------------------
-// Dark theme
-// ---------------------------------------------------------------------------
-
-export const inspectorThemeDark = geistTheme;