@promakeai/inspector-types 1.0.0 → 1.0.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@promakeai/inspector-types",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "Shared TypeScript types for @promakeai/inspector",
   "author": "Promake",
   "type": "module",
@@ -15,8 +15,7 @@
     "./package.json": "./package.json"
   },
   "files": [
-    "dist",
-    "src"
+    "dist"
   ],
   "scripts": {
     "build": "tsc --build",
@@ -29,11 +28,6 @@
     "types",
     "typescript"
   ],
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/promakeai/inspector.git",
-    "directory": "packages/types"
-  },
   "publishConfig": {
     "access": "public"
   }

package/src/index.js

@@ -1,7 +0,0 @@
-/**
- * Shared types for @promakeai/inspector
- *
- * Bu dosya inspector için kullanılan tüm type'ları içerir.
- * Hook ve plugin arasında paylaşılan type'lar burada tanımlanır.
- */
-export {};

package/src/index.ts

@@ -1,452 +0,0 @@
-/**
- * Shared types for @promakeai/inspector
- *
- * Bu dosya inspector için kullanılan tüm type'ları içerir.
- * Hook ve plugin arasında paylaşılan type'lar burada tanımlanır.
- */
-
-// Component info from React Fiber or vite-plugin-component-debugger
-export interface ComponentInfo {
-  id?: string;
-  name?: string;
-  path?: string;
-  fileName?: string;
-  lineNumber?: number;
-  columnNumber?: number;
-  component?: string;
-}
-
-// Element position on screen
-export interface ElementPosition {
-  top: number;
-  left: number;
-  width: number;
-  height: number;
-}
-
-// Element reference for parent/child tracking
-export interface ElementReference {
-  id: string;
-  tagName: string;
-  className: string;
-  selector?: string;
-}
-
-// Selected element data
-export interface SelectedElementData {
-  id: string;
-  tagName: string;
-  className: string;
-  component: ComponentInfo | null;
-  position: ElementPosition;
-  isTextNode?: boolean; // Whether the element is a text node
-  textContent?: string; // Text content of the element (if text node)
-  isImageNode?: boolean; // Whether the element is an image node
-  imageUrl?: string; // Image URL (if image node)
-  selector?: string; // CSS selector for element identification
-  currentRoute?: string; // Current route when element was selected
-  parents?: ElementReference[]; // 3 generations: [parent, grandparent, great-grandparent]
-  children?: ElementReference[]; // 3 generations: [child1, child2, child3, ...]
-}
-
-// URL change data
-export interface UrlChangeData {
-  url: string;
-  pathname: string;
-  search: string;
-  hash: string;
-}
-
-// Prompt submitted data
-export interface PromptSubmittedData {
-  prompt: string;
-  element: SelectedElementData;
-}
-
-// Text updated data
-export interface TextUpdatedData {
-  text: string;
-  originalText: string;
-  element: SelectedElementData;
-}
-
-// Image updated data
-export interface ImageUpdatedData {
-  imageData: string; // Base64 encoded image data
-  imageFile: {
-    name: string;
-    size: number;
-    type: string;
-  };
-  originalImageUrl: string;
-  element: SelectedElementData;
-}
-
-// Style changes data
-export interface StyleChanges {
-  // Layout
-  backgroundColor?: string;
-  height?: string;
-  width?: string;
-  display?: string;
-  opacity?: string;
-  flex?: string;
-  flexDirection?: string;
-  justifyContent?: string;
-  alignItems?: string;
-
-  // Image
-  objectFit?: string;
-
-  // Text
-  color?: string;
-  fontSize?: string;
-  fontWeight?: string;
-  fontFamily?: string;
-  textAlign?: string;
-  textDecoration?: string;
-
-  // Border
-  borderRadius?: string;
-  borderWidth?: string;
-  borderColor?: string;
-  borderStyle?: string;
-
-  // Spacing - Vertical/Horizontal (combined)
-  paddingVertical?: string;
-  paddingHorizontal?: string;
-  marginVertical?: string;
-  marginHorizontal?: string;
-
-  // Spacing - Individual sides (for all-sides mode)
-  paddingTop?: string;
-  paddingRight?: string;
-  paddingBottom?: string;
-  paddingLeft?: string;
-  marginTop?: string;
-  marginRight?: string;
-  marginBottom?: string;
-  marginLeft?: string;
-}
-
-// Style updated data
-export interface StyleUpdatedData {
-  element: SelectedElementData;
-  styles: StyleChanges; // Raw style values
-  inlineStyles: Record<string, string>; // React inline style object
-  tailwindClasses: string[]; // Tailwind class names for the changes
-  appliedStyles: {
-    // Detailed breakdown of what was changed
-    layout?: {
-      backgroundColor?: string;
-      height?: string;
-      width?: string;
-    };
-    text?: {
-      color?: string;
-      fontSize?: string;
-      fontWeight?: string;
-      fontFamily?: string;
-      textAlign?: string;
-    };
-    border?: {
-      borderRadius?: string;
-      borderWidth?: string;
-      borderColor?: string;
-      borderStyle?: string;
-    };
-    spacing?: {
-      paddingVertical?: string;
-      paddingHorizontal?: string;
-      marginVertical?: string;
-      marginHorizontal?: string;
-    };
-  };
-}
-
-// Error data
-export interface ErrorData {
-  type: "javascript" | "promise" | "console" | "vite";
-  message: string;
-  stack?: string;
-  fileName?: string;
-  lineNumber?: number;
-  columnNumber?: number;
-  timestamp: number;
-  // Vite error için ek alanlar
-  frame?: string; // Kod frame'i
-  plugin?: string; // Hangi plugin error verdi
-}
-// Highlight options for visual feedback
-export interface HighlightOptions {
-  duration?: number; // Highlight duration in ms (default: 3000)
-  scrollIntoView?: boolean; // Scroll to element (default: true)
-  color?: string; // Highlight color (default: '#4417db')
-  animation?: "pulse" | "fade" | "none"; // Animation type (default: 'pulse')
-  targetRoute?: string; // Target route to navigate before highlighting
-}
-
-// Element info response data
-export interface ElementInfoData {
-  found: boolean;
-  element?: SelectedElementData;
-  error?: string;
-}
-
-// Customizable labels
-export interface InspectorLabels {
-  // Text Editor
-  editText?: string;
-  textContentLabel?: string;
-  textPlaceholder?: string;
-  linkUrlLabel?: string;
-  updateText?: string;
-
-  // Image Editor
-  editImage?: string;
-  imageUploadTitle?: string; // Upload box title (e.g., "Select Image")
-  imageUploadHint?: string; // Upload box hint (e.g., "Click or drag")
-  updateImage?: string;
-
-  // Prompt Input
-  promptPlaceholder?: string;
-
-  // Style Editor
-  styleEditorTitle?: string;
-  layoutSectionTitle?: string;
-  displaySectionTitle?: string;
-  imageSectionTitle?: string;
-  textSectionTitle?: string;
-  borderSectionTitle?: string;
-  spacingSectionTitle?: string;
-
-  // Style Properties
-  backgroundColorLabel?: string;
-  heightLabel?: string;
-  widthLabel?: string;
-  displayLabel?: string;
-  opacityLabel?: string;
-  flexLabel?: string;
-  flexDirectionLabel?: string;
-  justifyContentLabel?: string;
-  alignItemsLabel?: string;
-  objectFitLabel?: string;
-  colorLabel?: string;
-  fontSizeLabel?: string;
-  fontWeightLabel?: string;
-  fontFamilyLabel?: string;
-  textAlignLabel?: string;
-  textDecorationLabel?: string;
-  borderRadiusLabel?: string;
-  borderWidthLabel?: string;
-  borderColorLabel?: string;
-  borderStyleLabel?: string;
-  paddingLabel?: string;
-  paddingVerticalLabel?: string;
-  paddingHorizontalLabel?: string;
-  marginLabel?: string;
-  marginVerticalLabel?: string;
-  marginHorizontalLabel?: string;
-
-  // Element name labels
-  elementContainer?: string; // Default: "Container"
-  elementText?: string; // Default: "Text"
-  elementImage?: string; // Default: "Image"
-  elementButton?: string; // Default: "Button"
-  elementLink?: string; // Default: "Link"
-  elementInput?: string; // Default: "Input"
-  elementTextArea?: string; // Default: "TextArea"
-  elementHeading?: string; // Default: "Heading"
-  elementParagraph?: string; // Default: "Paragraph"
-  elementSection?: string; // Default: "Section"
-  elementDefault?: string; // Default: "Element"
-
-  // Display Dropdown Options
-  displayBlock?: string;
-  displayInline?: string;
-  displayInlineBlock?: string;
-  displayFlex?: string;
-  displayGrid?: string;
-  displayNone?: string;
-
-  // Flex Direction Dropdown Options
-  flexDirectionRow?: string;
-  flexDirectionRowReverse?: string;
-  flexDirectionColumn?: string;
-  flexDirectionColumnReverse?: string;
-
-  // Justify Content Dropdown Options
-  justifyContentFlexStart?: string;
-  justifyContentCenter?: string;
-  justifyContentFlexEnd?: string;
-  justifyContentSpaceBetween?: string;
-  justifyContentSpaceAround?: string;
-  justifyContentSpaceEvenly?: string;
-
-  // Align Items Dropdown Options
-  alignItemsFlexStart?: string;
-  alignItemsCenter?: string;
-  alignItemsFlexEnd?: string;
-  alignItemsStretch?: string;
-  alignItemsBaseline?: string;
-
-  // Font Size Dropdown Options
-  fontSizeXS?: string;
-  fontSizeSM?: string;
-  fontSizeBase?: string;
-  fontSizeLG?: string;
-  fontSizeXL?: string;
-  fontSize2XL?: string;
-  fontSize3XL?: string;
-  fontSize4XL?: string;
-  fontSize5XL?: string;
-
-  // Font Weight Dropdown Options
-  fontWeightThin?: string;
-  fontWeightExtralight?: string;
-  fontWeightNormal?: string;
-  fontWeightMedium?: string;
-  fontWeightSemibold?: string;
-  fontWeightBold?: string;
-  fontWeightExtrabold?: string;
-  fontWeightBlack?: string;
-
-  // Text Decoration Dropdown Options
-  textDecorationNone?: string;
-  textDecorationUnderline?: string;
-  textDecorationLineThrough?: string;
-  textDecorationOverline?: string;
-
-  // Border Style Dropdown Options
-  borderStyleSolid?: string;
-  borderStyleDashed?: string;
-  borderStyleDotted?: string;
-  borderStyleDouble?: string;
-  borderStyleGroove?: string;
-  borderStyleRidge?: string;
-  borderStyleInset?: string;
-  borderStyleOutset?: string;
-  borderStyleNone?: string;
-
-  // Object Fit Dropdown Options
-  objectFitContain?: string;
-  objectFitCover?: string;
-  objectFitFill?: string;
-  objectFitNone?: string;
-  objectFitScaleDown?: string;
-
-  // Action Buttons
-  saveButton?: string;
-  resetButton?: string;
-  cancelButton?: string;
-
-  // Status Messages
-  unsavedChangesText?: string;
-  savingText?: string;
-  hintText?: string;
-
-  // Unsaved Changes Dialog
-  unsavedDialogTitle?: string;
-  unsavedDialogMessage?: string;
-  saveChangesButton?: string;
-  discardChangesButton?: string;
-  continueEditingButton?: string;
-
-  // Tab Names
-  textTabLabel?: string; // Default: "Content"
-  imageTabLabel?: string; // Default: "Image"
-  styleTabLabel?: string; // Default: "Design"
-
-  // Badge
-  badgeText?: string; // Badge text (default: "Built with Promake")
-  badgeUrl?: string; // Badge link URL (default: "https://promake.ai")
-}
-
-// Customizable theme colors
-// All properties are optional, defaults are used if not provided
-export interface InspectorTheme {
-  // Control Box
-  backgroundColor?: string; // Control box background color (default: #ffffff)
-  textColor?: string; // Label and text color (default: #111827)
-  secondaryTextColor?: string; // Secondary text color (default: #6b7280)
-
-  // Buttons
-  buttonColor?: string; // Primary button background color (default: #4417db)
-  buttonTextColor?: string; // Primary button text color (default: #ffffff)
-  buttonHoverColor?: string; // Primary button hover color (default: #3a13c0)
-  secondaryButtonColor?: string; // Secondary button background color (default: #f3f4f6)
-  secondaryButtonTextColor?: string; // Secondary button text color (default: #6b7280)
-  secondaryButtonHoverColor?: string; // Secondary button hover color (default: #e5e7eb)
-  dangerButtonColor?: string; // Danger button background color (default: #ef4444)
-  dangerButtonTextColor?: string; // Danger button text color (default: #ffffff)
-
-  // Inputs
-  inputBackgroundColor?: string; // Input/textarea background color (default: #f9fafb)
-  inputTextColor?: string; // Input/textarea text color (default: #111827)
-  inputBorderColor?: string; // Input/textarea border color (default: #d1d5db)
-  inputFocusBorderColor?: string; // Input/textarea focus border color (default: #4417db)
-  inputPlaceholderColor?: string; // Input/textarea placeholder color (default: #9ca3af)
-
-  // Borders & Dividers
-  borderColor?: string; // General border/divider color (default: #e5e7eb)
-
-  // Status Colors
-  warningColor?: string; // Warning text color (default: #f59e0b)
-  successColor?: string; // Success text color (default: #10b981)
-  errorColor?: string; // Error text color (default: #ef4444)
-
-  // Tabs
-  tabContainerBg?: string; // Tab container background color (default: #f9fafb)
-  tabActiveBg?: string; // Active tab background color (default: #4417db)
-  tabInactiveBg?: string; // Inactive tab background color (default: transparent)
-  tabActiveColor?: string; // Active tab text color (default: #ffffff)
-  tabInactiveColor?: string; // Inactive tab text color (default: #6b7280)
-
-  // Badge
-  badgeGradientStart?: string; // Badge gradient start color (default: #411E93)
-  badgeGradientEnd?: string; // Badge gradient end color (default: #E87C85)
-  badgeTextColor?: string; // Badge text color (default: #ffffff)
-
-  // Overlay
-  overlayColor?: string; // Element selection overlay color (default: #4417db with opacity)
-  overlayOpacity?: number; // Element selection overlay opacity (default: 0.2)
-
-  // Dialog
-  dialogBackdropColor?: string; // Dialog backdrop color (default: rgba(0, 0, 0, 0.6))
-  dialogBackgroundColor?: string; // Dialog background color (default: #ffffff)
-  dialogTextColor?: string; // Dialog text color (default: #111827)
-  dialogSecondaryTextColor?: string; // Dialog secondary text color (default: #6b7280)
-}
-
-// Content input request data
-export interface ContentInputRequestData {
-  show: boolean; // Whether to show or hide content input
-}
-
-// Hook callbacks
-export interface InspectorCallbacks {
-  onElementSelected?: (data: SelectedElementData) => void;
-  onUrlChange?: (data: UrlChangeData) => void;
-  onPromptSubmitted?: (data: PromptSubmittedData) => void;
-  onTextUpdated?: (data: TextUpdatedData) => void;
-  onImageUpdated?: (data: ImageUpdatedData) => void;
-  onStyleUpdated?: (data: StyleUpdatedData) => void; // Callback for style changes
-  onInspectorClosed?: () => void;
-  onError?: (data: ErrorData) => void;
-  onElementInfoReceived?: (data: ElementInfoData) => void; // Callback for element info responses
-}
-
-// Hook return type
-export interface UseInspectorReturn {
-  isInspecting: boolean;
-  toggleInspector: (active?: boolean) => void;
-  startInspecting: () => void;
-  stopInspecting: () => void;
-  showContentInput: (show: boolean, updateImmediately?: boolean) => void; // Show/hide text content input
-  showImageInput: (show: boolean, updateImmediately?: boolean) => void; // Show/hide image input
-  showStyleEditor: (show: boolean) => void; // Show/hide style editor
-  setBadgeVisible: (visible: boolean) => void; // Show/hide "Built by Promake" badge
-  highlightElement: (id: string, options?: HighlightOptions) => void; // Highlight an element in the iframe
-  getElementByInspectorId: (id: string) => void; // Request element info by inspector ID
-  setShowChildBorders: (show: boolean) => void; // Toggle child borders visibility
-}