64 lines
		
	
	
		
			1.5 KiB
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
		
		
			
		
	
	
			64 lines
		
	
	
		
			1.5 KiB
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
|  | /** | ||
|  |  * Common styles shared across all block types | ||
|  |  */ | ||
|  | 
 | ||
|  | export const commonBlockStyles = `
 | ||
|  |   /* Common block spacing and layout */ | ||
|  |   /* TODO: Extract common spacing from existing blocks */ | ||
|  |    | ||
|  |   /* Common focus states */ | ||
|  |   /* TODO: Extract common focus styles */ | ||
|  |    | ||
|  |   /* Common selected states */ | ||
|  |   /* TODO: Extract common selection styles */ | ||
|  |    | ||
|  |   /* Common hover states */ | ||
|  |   /* TODO: Extract common hover styles */ | ||
|  |    | ||
|  |   /* Common transition effects */ | ||
|  |   /* TODO: Extract common transitions */ | ||
|  |    | ||
|  |   /* Common placeholder styles */ | ||
|  |   /* TODO: Extract common placeholder styles */ | ||
|  |    | ||
|  |   /* Common error states */ | ||
|  |   /* TODO: Extract common error styles */ | ||
|  |    | ||
|  |   /* Common loading states */ | ||
|  |   /* TODO: Extract common loading styles */ | ||
|  | `;
 | ||
|  | 
 | ||
|  | /** | ||
|  |  * Helper function to generate consistent block classes | ||
|  |  */ | ||
|  | export const getBlockClasses = ( | ||
|  |   type: string, | ||
|  |   isSelected: boolean, | ||
|  |   additionalClasses: string[] = [] | ||
|  | ): string => { | ||
|  |   const classes = ['block', type]; | ||
|  |   if (isSelected) { | ||
|  |     classes.push('selected'); | ||
|  |   } | ||
|  |   classes.push(...additionalClasses); | ||
|  |   return classes.join(' '); | ||
|  | }; | ||
|  | 
 | ||
|  | /** | ||
|  |  * Helper function to generate consistent data attributes | ||
|  |  */ | ||
|  | export const getBlockDataAttributes = ( | ||
|  |   blockId: string, | ||
|  |   blockType: string, | ||
|  |   additionalAttributes: Record<string, string> = {} | ||
|  | ): string => { | ||
|  |   const attributes = { | ||
|  |     'data-block-id': blockId, | ||
|  |     'data-block-type': blockType, | ||
|  |     ...additionalAttributes | ||
|  |   }; | ||
|  |    | ||
|  |   return Object.entries(attributes) | ||
|  |     .map(([key, value]) => `${key}="${value}"`) | ||
|  |     .join(' '); | ||
|  | }; |