change import

Author: spartan-vutrannguyen

apps/studio/src/routes/editor/LayersPanel/BrandTab/ColorPanel/ColorNameInput.tsx

@@ -14,7 +14,7 @@ interface ColorNameInputProps {
     onBlur?: (value: string) => void;
 }
 
-const ColorNameInput = ({
+export const ColorNameInput = ({
     initialName,
     onSubmit,
     onCancel,
@@ -46,7 +46,7 @@ const ColorNameInput = ({
         }
 
         // Skip this check if we're editing the same name
-        if (camelCase(value) === initialName) {
+        if (camelCase(value) === camelCase(initialName)) {
             return null;
         }
 
@@ -109,5 +109,3 @@ const ColorNameInput = ({
         </Tooltip>
     );
 };
-
-export default ColorNameInput;

apps/studio/src/routes/editor/LayersPanel/BrandTab/ColorPanel/ColorPalletGroup.tsx

@@ -14,7 +14,7 @@ import { Tooltip, TooltipContent, TooltipPortal, TooltipTrigger } from '@onlook/
 import { Color, toNormalCase } from '@onlook/utility';
 import { useState } from 'react';
 import { ColorPopover } from './ColorPopover';
-import ColorNameInput from './ColorNameInput';
+import { ColorNameInput } from './ColorNameInput';
 
 export interface ColorItem {
     name: string;

apps/studio/src/routes/editor/LayersPanel/BrandTab/ColorPanel/ColorPopover.tsx

@@ -3,7 +3,7 @@ import { Popover, PopoverContent, PopoverTrigger } from '@onlook/ui/popover';
 import { toNormalCase, type Color } from '@onlook/utility';
 import { useEffect, useState } from 'react';
 import ColorPickerContent from '../../../EditPanel/StylesTab/single/ColorInput/ColorPicker';
-import ColorNameInput from './ColorNameInput';
+import { ColorNameInput } from './ColorNameInput';
 
 export const ColorPopover = ({
     color,

apps/studio/src/routes/editor/LayersPanel/BrandTab/ColorPanel/index.tsx

@@ -7,8 +7,7 @@ import type { Color } from '@onlook/utility';
 import { observer } from 'mobx-react-lite';
 import { useEffect, useState } from 'react';
 import { BrandPalletGroup } from './ColorPalletGroup';
-import ColorNameInput from './ColorNameInput';
-import { camelCase } from 'lodash';
+import { ColorNameInput } from './ColorNameInput';
 
 interface ColorPanelProps {
     onClose: () => void;