Shopify (Dawn): блок “Embroidery/Monogram” в карточке товара + сохранение в line item properties

Нужен разработчик Shopify (Liquid/JS/CSS) для темы Dawn (Online Store 2.0).

Цель: сделать на странице товара (PDP) блок “Embroidery / Monogram” как у примера (карточка в правой колонке), который открывает панель настройки вышивки. Вышивка бесплатная (цена товара не меняется), но выбранные параметры должны уходить в заказ как line item properties.

Где должен быть блок

• Внутри Product information на странице товара

• Как block, а не отдельная секция

• Расположение: под Quantity selector, до Buy buttons

  
  

  UI/Функционал

В свернутом виде (карточка):

• Title: “Add Your Monogram”

• Subtitle: “Personalize with elegant hand-finished embroidery”

• Badge справа: “COMPLIMENTARY”

• Кнопка/ссылка: “Configure”

При клике Configure:

• Открывается drawer/модалка

  • Desktop: drawer справа

  • Mobile: bottom-sheet или полноэкранная панель

  
  

• Обязательно:

  • скролл внутри (контент не должен обрезаться)

  • закрытие по X и по клику на overlay

  • блок не должен “залипать” открытым

  
  

  
  

Внутри drawer шаги:

1. Выбор локации (radio):

   • Top Right Corner

   • Bottom Right Corner

   • Top Left Corner

   • Bottom Left Corner

   
   

2. Текст вышивки

   • max 10 символов

   • счетчик 0/10

   • валидация: минимум 1 символ (если не выбрано “No, thanks”)

   
   

3. Выбор шрифта

   • 6 опций (01–06)

   • Важно: кнопки не просто названия, а превью “ABC” как на экране вышивальной машины

   
   

4. Цвет нити

   • swatches (кружочки) + подпись/tooltip

   • цвета:

     • Cream #F5EFE3

     • Deep Ecru #D8C3A5

     • Ivory #F7F1E6

     • Cloud #B9B5AE

     • Dusty Navy #2F4E73

     • Baby Blue #7FB2D8

     • Light Mint #CFE8D8

     • Khaki #8A7B6A

     • Winterberry #A3182E

     • Red #D1122E

     • Pink #F2B6C6

       
       

     
     

Кнопки:

• “No, thanks”

• “Cancel”

• “Save”

После Save:

• показывается summary (текст + локация + шрифт + цвет)

• кнопки Edit / Remove

Что должно попадать в заказ (line item properties)

Нужно записывать в product form (через hidden inputs или иначе корректно):

• properties[Embroidery Text]

• properties[Embroidery Location]

• properties[Embroidery Font]

• properties[Embroidery Thread Color]

Если “No, thanks”:

• Embroidery Text = "No, thanks"

• остальные поля можно пустыми

Технические требования

• Dawn / OS 2.0

• Реализация как block в sections/main-product.liquid (schema + вывод через case block.type)

• Рендер через snippet snippets/embroidery-block.liquid

• JS без eval, без нарушений CSP, scoped selectors (чтобы не ломалось при нескольких блоках)

• Адаптив 320px+, drawer: max-height: 90vh; overflow-y: auto

• Не ломать стандартный add-to-cart Dawn, без ошибок в консоли

Результат

• Код внесён в тему + проверка на Desktop/Mobile

• Я проверяю: сохранение настроек → добавление в корзину → свойства видны в cart item и в order

  
  

Пожалуйста, в отклике

• пришлите 2–3 примера Shopify работ (Dawn/OS2.0)

• оценку по времени/стоимости

• подтвердите, что делали кастомные line item properties