@lark-apaas/miaoda-inspector 0.1.0-alpha.5 → 0.1.0-alpha.7

package/dist/lib/config/ui-config.js

@@ -46,21 +46,13 @@ const defaultUIConfig = {
       type: "select",
       options: [
         { value: "font-thin", label: "\u6781\u7EC6\uFF08Thin\uFF09", rawValue: "100" },
-        {
-          value: "font-extralight",
-          label: "\u6781\u8F7B\uFF08Extra Light\uFF09",
-          rawValue: "200"
-        },
+        { value: "font-extralight", label: "\u6781\u8F7B\uFF08Extra Light\uFF09", rawValue: "200" },
         { value: "font-light", label: "\u8F7B\uFF08Light\uFF09", rawValue: "300" },
         { value: "font-normal", label: "\u5E38\u89C4\uFF08Normal\uFF09", rawValue: "400" },
         { value: "font-medium", label: "\u4E2D\u7C97\uFF08Medium\uFF09", rawValue: "500" },
         { value: "font-semibold", label: "\u534A\u7C97\uFF08Semi Bold\uFF09", rawValue: "600" },
         { value: "font-bold", label: "\u7C97\uFF08Bold\uFF09", rawValue: "700" },
-        {
-          value: "font-extrabold",
-          label: "\u6781\u7C97\uFF08Extra Bold\uFF09",
-          rawValue: "800"
-        },
+        { value: "font-extrabold", label: "\u6781\u7C97\uFF08Extra Bold\uFF09", rawValue: "800" },
         { value: "font-black", label: "\u9ED1\u4F53\uFF08Black\uFF09", rawValue: "900" }
       ]
     },
@@ -140,72 +132,22 @@ const defaultUIConfig = {
               type: "tailwind",
               rawValue: "#ffffff"
             },
-            {
-              value: "text-neutral-50",
-              label: "neutral-50",
-              type: "tailwind",
-              rawValue: "#f5f6f7"
-            },
-            {
-              value: "text-neutral-100",
-              label: "neutral-100",
-              type: "tailwind",
-              rawValue: "#f2f3f5"
-            },
-            {
-              value: "text-neutral-200",
-              label: "neutral-200",
-              type: "tailwind",
-              rawValue: "#eff0f1"
-            },
-            {
-              value: "text-neutral-300",
-              label: "neutral-300",
-              type: "tailwind",
-              rawValue: "#dee0e3"
-            },
-            {
-              value: "text-neutral-400",
-              label: "neutral-400",
-              type: "tailwind",
-              rawValue: "#d0d3d6"
-            },
-            {
-              value: "text-neutral-500",
-              label: "neutral-500",
-              type: "tailwind",
-              rawValue: "#bbbfc4"
-            },
-            {
-              value: "text-neutral-600",
-              label: "neutral-600",
-              type: "tailwind",
-              rawValue: "#8f959e"
-            },
+            { value: "text-neutral-50", label: "neutral-50", type: "tailwind", rawValue: "#f5f6f7" },
+            { value: "text-neutral-100", label: "neutral-100", type: "tailwind", rawValue: "#f2f3f5" },
+            { value: "text-neutral-200", label: "neutral-200", type: "tailwind", rawValue: "#eff0f1" },
+            { value: "text-neutral-300", label: "neutral-300", type: "tailwind", rawValue: "#dee0e3" },
+            { value: "text-neutral-400", label: "neutral-400", type: "tailwind", rawValue: "#d0d3d6" },
+            { value: "text-neutral-500", label: "neutral-500", type: "tailwind", rawValue: "#bbbfc4" },
+            { value: "text-neutral-600", label: "neutral-600", type: "tailwind", rawValue: "#8f959e" },
             {
               value: "text-neutral-650",
               label: "neutral-650",
               type: "tailwind",
               rawValue: "#51565d"
             },
-            {
-              value: "text-neutral-700",
-              label: "neutral-700",
-              type: "tailwind",
-              rawValue: "#646a73"
-            },
-            {
-              value: "text-neutral-800",
-              label: "neutral-800",
-              type: "tailwind",
-              rawValue: "#373c43"
-            },
-            {
-              value: "text-neutral-900",
-              label: "neutral-900",
-              type: "tailwind",
-              rawValue: "#2b2f36"
-            },
+            { value: "text-neutral-700", label: "neutral-700", type: "tailwind", rawValue: "#646a73" },
+            { value: "text-neutral-800", label: "neutral-800", type: "tailwind", rawValue: "#373c43" },
+            { value: "text-neutral-900", label: "neutral-900", type: "tailwind", rawValue: "#2b2f36" },
             {
               value: "text-neutral-950",
               label: "neutral-950",
@@ -234,72 +176,22 @@ const defaultUIConfig = {
               type: "tailwind",
               rawValue: "#ffffff"
             },
-            {
-              value: "bg-neutral-50",
-              label: "neutral-50",
-              type: "tailwind",
-              rawValue: "#f5f6f7"
-            },
-            {
-              value: "bg-neutral-100",
-              label: "neutral-100",
-              type: "tailwind",
-              rawValue: "#f2f3f5"
-            },
-            {
-              value: "bg-neutral-200",
-              label: "neutral-200",
-              type: "tailwind",
-              rawValue: "#eff0f1"
-            },
-            {
-              value: "bg-neutral-300",
-              label: "neutral-300",
-              type: "tailwind",
-              rawValue: "#dee0e3"
-            },
-            {
-              value: "bg-neutral-400",
-              label: "neutral-400",
-              type: "tailwind",
-              rawValue: "#d0d3d6"
-            },
-            {
-              value: "bg-neutral-500",
-              label: "neutral-500",
-              type: "tailwind",
-              rawValue: "#bbbfc4"
-            },
-            {
-              value: "bg-neutral-600",
-              label: "neutral-600",
-              type: "tailwind",
-              rawValue: "#8f959e"
-            },
+            { value: "bg-neutral-50", label: "neutral-50", type: "tailwind", rawValue: "#f5f6f7" },
+            { value: "bg-neutral-100", label: "neutral-100", type: "tailwind", rawValue: "#f2f3f5" },
+            { value: "bg-neutral-200", label: "neutral-200", type: "tailwind", rawValue: "#eff0f1" },
+            { value: "bg-neutral-300", label: "neutral-300", type: "tailwind", rawValue: "#dee0e3" },
+            { value: "bg-neutral-400", label: "neutral-400", type: "tailwind", rawValue: "#d0d3d6" },
+            { value: "bg-neutral-500", label: "neutral-500", type: "tailwind", rawValue: "#bbbfc4" },
+            { value: "bg-neutral-600", label: "neutral-600", type: "tailwind", rawValue: "#8f959e" },
             {
               value: "bg-neutral-650",
               label: "neutral-650",
               type: "tailwind",
               rawValue: "#51565d"
             },
-            {
-              value: "bg-neutral-700",
-              label: "neutral-700",
-              type: "tailwind",
-              rawValue: "#646a73"
-            },
-            {
-              value: "bg-neutral-800",
-              label: "neutral-800",
-              type: "tailwind",
-              rawValue: "#373c43"
-            },
-            {
-              value: "bg-neutral-900",
-              label: "neutral-900",
-              type: "tailwind",
-              rawValue: "#2b2f36"
-            },
+            { value: "bg-neutral-700", label: "neutral-700", type: "tailwind", rawValue: "#646a73" },
+            { value: "bg-neutral-800", label: "neutral-800", type: "tailwind", rawValue: "#373c43" },
+            { value: "bg-neutral-900", label: "neutral-900", type: "tailwind", rawValue: "#2b2f36" },
             {
               value: "bg-neutral-950",
               label: "neutral-950",
@@ -328,12 +220,7 @@ const defaultUIConfig = {
               type: "tailwind",
               rawValue: "#ffffff"
             },
-            {
-              value: "border-neutral-50",
-              label: "neutral-50",
-              type: "tailwind",
-              rawValue: "#f5f6f7"
-            },
+            { value: "border-neutral-50", label: "neutral-50", type: "tailwind", rawValue: "#f5f6f7" },
             {
               value: "border-neutral-100",
               label: "neutral-100",
@@ -582,5 +469,120 @@ const defaultUIConfig = {
     "cyan-800": "#0f587a",
     "cyan-900": "#06415c",
     "cyan-950": "#072b3d"
+  },
+  components: {
+    nativeTag: {
+      img: {
+        src: {
+          type: "image",
+          label: "\u56FE\u7247"
+        }
+      }
+    },
+    antd: {
+      Button: {
+        children: {
+          label: "\u6587\u6848",
+          type: "input"
+        },
+        icon: {
+          label: "\u56FE\u6807",
+          type: "icon-picker"
+        },
+        type: {
+          label: "\u7C7B\u578B",
+          type: "select",
+          options: [
+            {
+              value: "primary",
+              label: "\u4E3B\u8981\u6309\u94AE",
+              rawValue: "primary",
+              prefix: {
+                type: "tag",
+                value: "Button",
+                style: {
+                  display: "inline-block",
+                  backgroundColor: "#1456F0",
+                  color: "#fff",
+                  borderRadius: "5px",
+                  padding: "2px 8px",
+                  lineHeight: "20px"
+                }
+              }
+            },
+            {
+              value: "default",
+              label: "\u6B21\u8981\u6309\u94AE",
+              rawValue: "default",
+              prefix: {
+                type: "tag",
+                value: "Button",
+                style: {
+                  display: "inline-block",
+                  borderStyle: "solid",
+                  borderColor: "#1456F0",
+                  borderWidth: "1px",
+                  color: "#1456F0",
+                  borderRadius: "5px",
+                  padding: "1px 7px",
+                  lineHeight: "20px"
+                }
+              }
+            },
+            {
+              value: "text",
+              label: "\u6587\u5B57\u6309\u94AE",
+              rawValue: "text",
+              prefix: {
+                type: "tag",
+                value: "Button",
+                style: {
+                  display: "inline-block",
+                  color: "#1F2329",
+                  padding: "2px 8px",
+                  lineHeight: "20px"
+                }
+              }
+            },
+            {
+              value: "link",
+              label: "\u94FE\u63A5\u6309\u94AE",
+              rawValue: "link",
+              prefix: {
+                type: "tag",
+                value: "Button",
+                style: {
+                  display: "inline-block",
+                  color: "#1456F0",
+                  padding: "2px 8px",
+                  lineHeight: "20px"
+                }
+              }
+            }
+          ],
+          defaultValue: "default"
+        },
+        shape: {
+          label: "\u5F62\u72B6",
+          type: "radioGroup",
+          options: [
+            { value: "default", label: "\u77E9\u5F62", rawValue: "default" },
+            { value: "circle", label: "\u5706\u5F62", rawValue: "circle" },
+            { value: "round", label: "\u5706\u89D2", rawValue: "round" }
+          ],
+          defaultValue: "default"
+        },
+        size: {
+          label: "\u5C3A\u5BF8",
+          type: "radioGroup",
+          options: [
+            { value: "large", label: "\u5927", rawValue: "large" },
+            { value: "middle", label: "\u4E2D", rawValue: "middle" },
+            { value: "small", label: "\u5C0F", rawValue: "small" }
+          ],
+          defaultValue: "middle"
+        }
+      }
+    }
   }
 };

package/dist/lib/index.js

@@ -19,8 +19,10 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var index_exports = {};
 __export(index_exports, {
   MiaodaInspector: () => import_MiaodaInspector.MiaodaInspector,
+  defaultUIConfig: () => import_ui_config.defaultUIConfig,
   isOutgoingMessage: () => import_utils.isOutgoingMessage
 });
 module.exports = __toCommonJS(index_exports);
 var import_MiaodaInspector = require("./MiaodaInspector");
+var import_ui_config = require("./config/ui-config");
 var import_utils = require("./utils");

package/dist/lib/types/feature.js

@@ -0,0 +1,16 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var feature_exports = {};
+module.exports = __toCommonJS(feature_exports);

package/dist/lib/types/index.js

@@ -19,9 +19,11 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var types_exports = {};
 __export(types_exports, {
   ClearSelectedMessage: () => import_iframe_events.ClearSelectedMessage,
+  EditAttributesMessage: () => import_iframe_events.EditAttributesMessage,
   EditClassNameMessage: () => import_iframe_events.EditClassNameMessage,
   EditStyleMessage: () => import_iframe_events.EditStyleMessage,
   EditTextMessage: () => import_iframe_events.EditTextMessage,
+  Feature: () => import_feature.Feature,
   IncomingMessage: () => import_iframe_events.IncomingMessage,
   InitConfigMessage: () => import_iframe_events.InitConfigMessage,
   InspectorInfo: () => import_iframe_events.InspectorInfo,
@@ -32,3 +34,4 @@ __export(types_exports, {
 });
 module.exports = __toCommonJS(types_exports);
 var import_iframe_events = require("./iframe-events");
+var import_feature = require("./feature");

package/dist/lib/utils/config-mapper.js

@@ -88,9 +88,7 @@ function getStyleCalculationConfig(config, propertyName) {
     return getColorStyleCalculationConfig(config, propertyName);
   }
   if (uiComponent.type !== "select" && uiComponent.type !== "spacing") {
-    throw new Error(
-      `Unsupported UI component type: ${uiComponent.type} for property: ${propertyName}`
-    );
+    throw new Error(`Unsupported UI component type: ${uiComponent.type} for property: ${propertyName}`);
   }
   const map = {};
   for (const option of uiComponent.options) {

package/dist/lib/utils/element-guards.js

@@ -0,0 +1,55 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var element_guards_exports = {};
+__export(element_guards_exports, {
+  getCompiledComponentName: () => getCompiledComponentName,
+  getImportSource: () => getImportSource,
+  hasNonEmptyText: () => hasNonEmptyText,
+  isAntdText: () => isAntdText,
+  isNativeElementName: () => isNativeElementName
+});
+module.exports = __toCommonJS(element_guards_exports);
+function getCompiledComponentName(element, fallback) {
+  return element.getAttribute("data-miaoda-component-name") || fallback;
+}
+function getImportSource(element) {
+  return element.getAttribute("data-miaoda-import-source");
+}
+function hasNonEmptyText(element) {
+  return typeof element.textContent === "string" && element.textContent.trim().length > 0;
+}
+function isNativeElementName(componentName) {
+  return Boolean(componentName && componentName[0] !== componentName[0].toUpperCase());
+}
+function isAntdText(element, componentName) {
+  const importSource = getImportSource(element);
+  const compiledName = getCompiledComponentName(element, componentName);
+  if (importSource !== "antd" || !compiledName) {
+    return false;
+  }
+  const textualNames = /* @__PURE__ */ new Set([
+    "Typography.Text",
+    "Text",
+    "Typography.Title",
+    "Title",
+    "Typography.Paragraph",
+    "Paragraph"
+  ]);
+  return textualNames.has(compiledName);
+}

package/dist/lib/utils/style-calculator.js

@@ -49,6 +49,7 @@ __export(style_calculator_exports, {
   rgbaToHex: () => rgbaToHex
 });
 module.exports = __toCommonJS(style_calculator_exports);
+var import_element_guards = require("./element-guards");
 function rgbaToHex(rgba) {
   const match = rgba.match(/rgba?\(([^)]+)\)/);
   if (!match) return rgba;
@@ -71,7 +72,13 @@ function rgbaToHex(rgba) {
   return `#${toHex(r)}${toHex(g)}${toHex(b)}`;
 }
 function isValidElement(element, componentName, canUseNewInspector) {
-  return !!(element && componentName && componentName[0] !== componentName[0].toUpperCase() && canUseNewInspector && !(element instanceof SVGElement));
+  if (!element || !componentName || !canUseNewInspector || element instanceof SVGElement) {
+    return false;
+  }
+  if ((0, import_element_guards.isNativeElementName)(componentName)) {
+    return true;
+  }
+  return (0, import_element_guards.isAntdText)(element, componentName);
 }
 function isValidElementWithComponent(element, componentName, canUseNewInspector) {
   return !!(element && componentName && canUseNewInspector && !(element instanceof SVGElement));
@@ -133,48 +140,16 @@ function calculateStyle(styleName, element, componentName, canUseNewInspector, s
     return null;
   }
   const config = styleConfigs[styleName];
-  const tailwindPattern = new RegExp(
-    `\\b${config.tailwindPrefix}-(${Object.keys(config.map).join("|")})\\b`
-  );
+  const tailwindPattern = new RegExp(`\\b${config.tailwindPrefix}-(${Object.keys(config.map).join("|")})\\b`);
   return calculateStyleProperty(element, __spreadProps(__spreadValues({}, config), {
     tailwindPattern
   }));
 }
-const calculateFontSizeInfo = (element, componentName, canUseNewInspector, styleConfigs) => calculateStyle(
-  "fontSize",
-  element,
-  componentName,
-  canUseNewInspector,
-  styleConfigs
-);
-const calculateFontWeightInfo = (element, componentName, canUseNewInspector, styleConfigs) => calculateStyle(
-  "fontWeight",
-  element,
-  componentName,
-  canUseNewInspector,
-  styleConfigs
-);
-const calculateBorderRadiusInfo = (element, componentName, canUseNewInspector, styleConfigs) => calculateStyle(
-  "borderRadius",
-  element,
-  componentName,
-  canUseNewInspector,
-  styleConfigs
-);
-const calculateBorderWidthInfo = (element, componentName, canUseNewInspector, styleConfigs) => calculateStyle(
-  "borderWidth",
-  element,
-  componentName,
-  canUseNewInspector,
-  styleConfigs
-);
-const calculateTextAlignInfo = (element, componentName, canUseNewInspector, styleConfigs) => calculateStyle(
-  "textAlign",
-  element,
-  componentName,
-  canUseNewInspector,
-  styleConfigs
-);
+const calculateFontSizeInfo = (element, componentName, canUseNewInspector, styleConfigs) => calculateStyle("fontSize", element, componentName, canUseNewInspector, styleConfigs);
+const calculateFontWeightInfo = (element, componentName, canUseNewInspector, styleConfigs) => calculateStyle("fontWeight", element, componentName, canUseNewInspector, styleConfigs);
+const calculateBorderRadiusInfo = (element, componentName, canUseNewInspector, styleConfigs) => calculateStyle("borderRadius", element, componentName, canUseNewInspector, styleConfigs);
+const calculateBorderWidthInfo = (element, componentName, canUseNewInspector, styleConfigs) => calculateStyle("borderWidth", element, componentName, canUseNewInspector, styleConfigs);
+const calculateTextAlignInfo = (element, componentName, canUseNewInspector, styleConfigs) => calculateStyle("textAlign", element, componentName, canUseNewInspector, styleConfigs);
 const calculatePaddingInfo = (element, componentName, canUseNewInspector, styleConfigs) => {
   if (!isValidElementWithComponent(element, componentName, canUseNewInspector)) {
     return null;
@@ -187,24 +162,6 @@ const calculateMarginInfo = (element, componentName, canUseNewInspector, styleCo
   }
   return calculateStyleProperty(element, styleConfigs.margin);
 };
-const calculateColorInfo = (element, componentName, canUseNewInspector, styleConfigs) => calculateStyle(
-  "color",
-  element,
-  componentName,
-  canUseNewInspector,
-  styleConfigs
-);
-const calculateBackgroundColorInfo = (element, componentName, canUseNewInspector, styleConfigs) => calculateStyle(
-  "backgroundColor",
-  element,
-  componentName,
-  canUseNewInspector,
-  styleConfigs
-);
-const calculateBorderColorInfo = (element, componentName, canUseNewInspector, styleConfigs) => calculateStyle(
-  "borderColor",
-  element,
-  componentName,
-  canUseNewInspector,
-  styleConfigs
-);
+const calculateColorInfo = (element, componentName, canUseNewInspector, styleConfigs) => calculateStyle("color", element, componentName, canUseNewInspector, styleConfigs);
+const calculateBackgroundColorInfo = (element, componentName, canUseNewInspector, styleConfigs) => calculateStyle("backgroundColor", element, componentName, canUseNewInspector, styleConfigs);
+const calculateBorderColorInfo = (element, componentName, canUseNewInspector, styleConfigs) => calculateStyle("borderColor", element, componentName, canUseNewInspector, styleConfigs);

package/dist/types/Inspector/Inspector.d.ts

@@ -89,7 +89,14 @@ interface InspectorProps {
     /**
      * Callback when left-clicking on an element.
      */
-    onClickElement?: (params: InspectParams) => void;
+    onClickElement?: (params: InspectParams & {
+        componentProps?: Record<string, unknown & {
+            __miaoda_icon__?: {
+                source: 'lucide-react';
+                name: string;
+            };
+        }>;
+    }) => void;
     /** any children of react nodes */
     children?: ReactNode;
     /**

package/dist/types/Inspector/Overlay.d.ts

@@ -64,11 +64,18 @@ declare class ClickOverlay {
     currentElement: HTMLElement | null;
     currentName: string | undefined;
     positionUpdate?: () => void;
-    constructor(positionUpdate?: () => void);
+    onElementRebind?: (el: HTMLElement) => void;
+    mutationObserver?: MutationObserver;
+    currentElementId?: string;
+    constructor(options?: (() => void) | {
+        positionUpdate?: () => void;
+        onElementRebind?: (el: HTMLElement) => void;
+    });
     remove(): void;
-    highlight(element: HTMLElement, name?: string): void;
+    highlight(element: HTMLElement, name?: string, elementId?: string): void;
     updatePosition(element: HTMLElement): void;
     clearRect(): void;
+    private _rebind;
 }
 
 export { ClickOverlay, Overlay };

package/dist/types/Inspector/utils/index.d.ts

@@ -1,4 +1,4 @@
 export { StopFunction, setupHighlighter } from './highlight.js';
-export { CodeDataAttribute, CodeInfo, getCodeInfoFromDebugSource, getCodeInfoFromFiber, getCodeInfoFromProps, getElementCodeInfo, getElementInspect, getNamedFiber, getReferenceFiber } from './inspect.js';
+export { CodeDataAttribute, CodeInfo, extractPropsFromFiber, getCodeInfoFromDebugSource, getCodeInfoFromFiber, getCodeInfoFromProps, getElementCodeInfo, getElementInspect, getNamedFiber, getParentElement, getReferenceFiber } from './inspect.js';
 export { BoxSizing, Rect, getElementDimensions, getNestedBoundingClientRect } from './overlay.js';
 import 'react-reconciler';

package/dist/types/Inspector/utils/inspect.d.ts

@@ -109,5 +109,12 @@ declare const getElementInspect: (element: HTMLElement) => {
     name?: string;
     title: string;
 };
+declare const getParentElement: (element: HTMLElement) => HTMLElement | undefined;
+declare const extractPropsFromFiber: (fiber?: Fiber) => Record<string, unknown & {
+    __miaoda_icon__?: {
+        source: "lucide-react";
+        name: string;
+    };
+}>;
 
-export { type CodeDataAttribute, type CodeInfo, getCodeInfoFromDebugSource, getCodeInfoFromFiber, getCodeInfoFromProps, getElementCodeInfo, getElementInspect, getNamedFiber, getReferenceFiber };
+export { type CodeDataAttribute, type CodeInfo, extractPropsFromFiber, getCodeInfoFromDebugSource, getCodeInfoFromFiber, getCodeInfoFromProps, getElementCodeInfo, getElementInspect, getNamedFiber, getParentElement, getReferenceFiber };

package/dist/types/config/ui-config.d.ts

@@ -1,11 +1,26 @@
+interface SelectOptionPrefix {
+    type: 'tag';
+    value: string;
+    style?: Record<string, string>;
+}
 interface SelectOption {
     label: string;
     value: string;
     rawValue: string;
+    prefix?: SelectOptionPrefix;
 }
 interface SelectUIConfig {
     type: 'select';
     options: SelectOption[];
+    defaultValue?: string;
+}
+interface RadioGroupConfig {
+    type: 'radioGroup';
+    options: SelectOption[];
+    defaultValue?: string;
+}
+interface InputConfig {
+    type: 'input';
 }
 interface SpacingUIConfig {
     type: 'spacing';
@@ -27,7 +42,13 @@ interface ColorPickerUIConfig {
 interface IconPickerUIConfig {
     type: 'icon-picker';
 }
-type UIComponentConfig = SelectUIConfig | ColorPickerUIConfig | IconPickerUIConfig | SpacingUIConfig;
+interface ImageSetterUIConfig {
+    type: 'image';
+}
+type UIComponentConfig = SelectUIConfig | ColorPickerUIConfig | IconPickerUIConfig | SpacingUIConfig | RadioGroupConfig | InputConfig | ImageSetterUIConfig;
+type ComponentConfig = Record<string, UIComponentConfig & {
+    label: string;
+}>;
 interface InspectorUIConfig {
     version: string;
     common: {
@@ -42,9 +63,11 @@ interface InspectorUIConfig {
         borderColor: UIComponentConfig;
         backgroundColor: UIComponentConfig;
     };
-    components?: Record<string, Record<string, UIComponentConfig>>;
+    components?: Record<string, Record<string, Record<string, UIComponentConfig & {
+        label: string;
+    }>>>;
     tokens: Record<string, string>;
 }
 declare const defaultUIConfig: InspectorUIConfig;
 
-export { type ColorPickerUIConfig, type IconPickerUIConfig, type InspectorUIConfig, type SelectOption, type SelectUIConfig, type SpacingUIConfig, type UIComponentConfig, defaultUIConfig };
+export { type ColorPickerUIConfig, type ComponentConfig, type IconPickerUIConfig, type ImageSetterUIConfig, type InputConfig, type InspectorUIConfig, type RadioGroupConfig, type SelectOption, type SelectOptionPrefix, type SelectUIConfig, type SpacingUIConfig, type UIComponentConfig, defaultUIConfig };