♻️ Use Heading from ui-typography in ProductModal

Replace custom SectionTitle with Heading component
and clean up duplicate PillTabs import.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Lilith 2026-01-02 23:50:11 -08:00
parent 168d16fb7a
commit bc76c06ac6

View file

@ -1,9 +1,10 @@
import { useState, useEffect } from 'react';
import { useMutation, useQueryClient } from '@tanstack/react-query';
import styled from 'styled-components';
import { Modal } from '@lilith/ui-feedback';
import { Modal, PillTabs } from '@lilith/ui-feedback';
import { Button, Input, Select, Checkbox, Textarea, Alert } from '@lilith/ui-primitives';
import { PillTabs } from '@lilith/ui-feedback';
import { Stack } from '@lilith/ui-layout';
import { Heading, Text } from '@lilith/ui-typography';
import { createProduct, updateProduct } from './api';
import { VariantsEditor } from './VariantsEditor';
import type { Product, CreateProductDto, UpdateProductDto, ProductType, InventoryType } from './types';
@ -75,10 +76,7 @@ const Divider = styled.div`
margin-top: ${({ theme }) => theme.spacing.md};
`;
const SectionTitle = styled.h3`
font-weight: ${({ theme }) => theme.typography.fontWeight.medium};
margin-bottom: ${({ theme }) => theme.spacing.md};
`;
// Using Heading from ui-typography instead of custom SectionTitle
const HelpText = styled.p`
font-size: ${({ theme }) => theme.typography.fontSize.xs};
@ -409,7 +407,7 @@ export function ProductModal({ product, onClose }: ProductModalProps) {
{formData.productType.startsWith('physical') && (
<>
<Divider>
<SectionTitle>Shipping</SectionTitle>
<Heading as="h3" size="base" weight="medium" marginBottom="xs">Shipping</Heading>
</Divider>
<CheckboxLabel>