@selwise/widget 0.0.1 → 0.0.2

package/dist/npm/esm/modules/contract/vendor/widget-contract/configs.js

@@ -0,0 +1,1472 @@
+// AUTO-GENERATED FROM packages/widget-contract/src/configs.ts. DO NOT EDIT DIRECTLY.
+/**
+ * Unified Widget & Campaign Configurations
+ * Single source of truth for all widget/campaign configurations
+ *
+ * When adding a new widget type:
+ * 1. Add to WidgetType in types.ts
+ * 2. Add to WIDGET_TYPES below
+ * 3. Add content fields to TYPE_CONTENT_FIELDS
+ * 4. Add style sections to TYPE_STYLE_CONFIGS
+ * 5. Add to Prisma enum WidgetType (if DB storage needed)
+ */
+// ===========================================
+// WIDGET TYPES - Core type definitions
+// ===========================================
+export const WIDGET_TYPES = [
+    {
+        value: 'announcement_bar',
+        label: 'Announcement Bar',
+        description: 'Top or bottom bar for announcements',
+        icon: 'MessageSquare',
+        placementType: 'fixed',
+        placementOptions: ['top', 'bottom'],
+    },
+    {
+        value: 'inline_banner',
+        label: 'Inline Banner',
+        description: 'Banner inserted into page content',
+        icon: 'Layout',
+        placementType: 'selector',
+    },
+    {
+        value: 'floating_button',
+        label: 'Floating Button',
+        description: 'Fixed position floating action button',
+        icon: 'MousePointerClick',
+        placementType: 'fixed',
+        placementOptions: ['bottom-right', 'bottom-left', 'top-right', 'top-left'],
+    },
+    {
+        value: 'exit_intent_popup',
+        label: 'Exit Intent Popup',
+        description: 'Popup triggered when user tries to leave',
+        icon: 'LogOut',
+        placementType: 'fixed',
+        placementOptions: ['center'],
+    },
+    {
+        value: 'slide_in',
+        label: 'Slide In',
+        description: 'Panel that slides in from side or bottom',
+        icon: 'PanelRight',
+        placementType: 'fixed',
+        placementOptions: ['right', 'left', 'bottom'],
+    },
+    {
+        value: 'embedded_card',
+        label: 'Embedded Card',
+        description: 'Card inserted into page content',
+        icon: 'LayoutGrid',
+        placementType: 'selector',
+    },
+    {
+        value: 'sticky_footer',
+        label: 'Sticky Footer',
+        description: 'Fixed footer bar at bottom of page',
+        icon: 'PanelBottom',
+        placementType: 'fixed',
+        placementOptions: ['bottom'],
+    },
+    {
+        value: 'countdown_timer',
+        label: 'Countdown Timer',
+        description: 'Timer with countdown to end date',
+        icon: 'Timer',
+        placementType: 'fixed',
+        placementOptions: ['top', 'bottom'],
+    },
+    {
+        value: 'cookie_consent',
+        label: 'Cookie Consent',
+        description: 'GDPR compliant cookie consent banner',
+        icon: 'Shield',
+        placementType: 'fixed',
+        placementOptions: ['top', 'bottom', 'center-modal', 'bottom-left', 'bottom-right'],
+    },
+    {
+        value: 'custom',
+        label: 'Custom Widget',
+        description: 'Custom HTML/CSS widget',
+        icon: 'Code',
+        placementType: 'both',
+        placementOptions: ['top', 'bottom'],
+    },
+    {
+        value: 'product_view_count',
+        label: 'Product View Count',
+        description: 'Shows how many people viewed a product',
+        icon: 'Eye',
+        placementType: 'selector',
+    },
+    {
+        value: 'cart_count',
+        label: 'Cart Count',
+        description: 'Shows how many have product in cart',
+        icon: 'ShoppingCart',
+        placementType: 'selector',
+    },
+    {
+        value: 'newsletter',
+        label: 'Newsletter',
+        description: 'Email capture widget with consent-aware newsletter signup flow',
+        icon: 'Mail',
+        placementType: 'both',
+        placementOptions: ['bottom-right', 'bottom-left', 'center'],
+    },
+];
+// Helper to get type config by value
+export function getWidgetTypeConfig(type) {
+    return WIDGET_TYPES.find((t) => t.value === type);
+}
+// ===========================================
+// CONTENT FIELDS - Fields per widget type
+// ===========================================
+export const TYPE_CONTENT_FIELDS = {
+    announcement_bar: [
+        {
+            field: 'text',
+            label: 'Announcement Text',
+            type: 'text',
+            placeholder: 'Free shipping on orders over $50!',
+        },
+        ...commonCtaFields(),
+        commonImageField({ label: 'Icon / Logo' }),
+    ],
+    inline_banner: [
+        ...commonTitleTextFields({
+            titlePlaceholder: 'Special Offer',
+            textPlaceholder: 'Limited time offer...',
+        }),
+        ...commonCtaFields({ buttonTextPlaceholder: 'Learn More' }),
+        commonImageField(),
+    ],
+    floating_button: [
+        { field: 'text', label: 'Button Text/Icon', type: 'text', placeholder: '💬' },
+        { field: 'tooltip', label: 'Tooltip', type: 'text', placeholder: 'Chat with us' },
+        { field: 'buttonUrl', label: 'Link URL', type: 'url', placeholder: 'https://...' },
+    ],
+    exit_intent_popup: [
+        ...commonTitleTextFields({
+            titlePlaceholder: 'Wait! Before you go...',
+            textLabel: 'Message',
+            textPlaceholder: 'Get 10% off your first order!',
+        }),
+        ...commonCtaFields({ buttonTextPlaceholder: 'Get Discount' }),
+        commonImageField(),
+    ],
+    slide_in: [
+        ...commonTitleTextFields({
+            titlePlaceholder: 'Special Offer',
+            textLabel: 'Message',
+            textPlaceholder: 'Subscribe to our newsletter...',
+        }),
+        ...commonCtaFields({ buttonTextPlaceholder: 'Subscribe' }),
+        commonImageField(),
+    ],
+    embedded_card: [
+        ...commonTitleTextFields({
+            titlePlaceholder: 'Featured Product',
+            textPlaceholder: 'Amazing product...',
+        }),
+        ...commonCtaFields({ buttonTextPlaceholder: 'View Details' }),
+        commonImageField(),
+    ],
+    sticky_footer: [
+        { field: 'text', label: 'Message', type: 'text', placeholder: 'Free shipping on all orders!' },
+        { field: 'subtext', label: 'Sub-text', type: 'text', placeholder: 'Limited time only' },
+        ...commonCtaFields(),
+    ],
+    countdown_timer: [
+        { field: 'title', label: 'Title', type: 'text', placeholder: 'Sale ends in:' },
+        { field: 'text', label: 'Sub-text', type: 'text', placeholder: 'Hurry! Limited stock' },
+        { field: 'endDate', label: 'End Date', type: 'datetime-local' },
+        ...commonCtaFields({ buttonTextPlaceholder: 'Shop Sale' }),
+    ],
+    cookie_consent: [
+        { field: 'headline', label: 'Headline', type: 'text', placeholder: 'We use cookies' },
+        {
+            field: 'text',
+            label: 'Description',
+            type: 'textarea',
+            placeholder: 'To improve your experience, we use cookies...',
+        },
+        { field: 'buttonText', label: 'Accept Button Text', type: 'text', placeholder: 'Accept All' },
+        {
+            field: 'declineButtonText',
+            label: 'Decline Button Text',
+            type: 'text',
+            placeholder: 'Decline',
+        },
+        {
+            field: 'customizeButtonText',
+            label: 'Customize Button Text',
+            type: 'text',
+            placeholder: 'Customize',
+        },
+    ],
+    custom: [
+        {
+            field: 'html',
+            label: 'Custom HTML',
+            type: 'textarea',
+            placeholder: '<div>Your custom HTML here...</div>',
+        },
+        { field: 'css', label: 'Custom CSS', type: 'textarea', placeholder: '.my-widget { ... }' },
+    ],
+    product_view_count: [
+        {
+            field: 'template',
+            label: 'Metin Şablonu',
+            type: 'select',
+            options: [
+                'Bu ürünü son {timePeriod} içinde {count} kişi görüntüledi',
+                '{count} kişi bu ürünü görüntüledi',
+                'Popüler! {count} görüntülenme',
+                'Son {timePeriod}: {count} görüntüleme',
+            ],
+            placeholder: 'Select a template or customize below',
+        },
+        {
+            field: 'customText',
+            label: 'Özel Metin (şablonu geçersiz kılar)',
+            type: 'text',
+            placeholder: '{count}, {timePeriod} kullanın',
+        },
+        {
+            field: 'timePeriod',
+            label: 'Zaman Periyodu',
+            type: 'select',
+            options: ['1h', '24h', '7d', '30d'],
+            default: '24h',
+        },
+        {
+            field: 'showIcon',
+            label: 'İkon Göster',
+            type: 'checkbox',
+            default: true,
+        },
+        {
+            field: 'iconType',
+            label: 'İkon',
+            type: 'select',
+            options: ['eye', 'users', 'trending-up', 'flame'],
+            default: 'eye',
+        },
+        {
+            field: 'productId',
+            label: 'Ürün ID (SKU)',
+            type: 'text',
+            placeholder: 'Otomatik algılanır veya manuel girin',
+            required: false,
+        },
+    ],
+    cart_count: [
+        {
+            field: 'template',
+            label: 'Metin Şablonu',
+            type: 'select',
+            options: [
+                'Bu ürün şu an {count} kişinin sepetinde',
+                '{count} kişi sepete ekledi',
+                'Tükeniyor! Sadece {count} adet kaldı',
+                'Şu an {count} kişi bunu istiyor',
+            ],
+            placeholder: 'Select a template or customize below',
+        },
+        {
+            field: 'customText',
+            label: 'Özel Metin (şablonu geçersiz kılar)',
+            type: 'text',
+            placeholder: '{count} kullanın',
+        },
+        {
+            field: 'metricType',
+            label: 'Metrik Türü',
+            type: 'select',
+            options: ['active_carts'],
+            default: 'active_carts',
+        },
+        {
+            field: 'showIcon',
+            label: 'İkon Göster',
+            type: 'checkbox',
+            default: true,
+        },
+        {
+            field: 'iconType',
+            label: 'İkon',
+            type: 'select',
+            options: ['shopping-cart', 'shopping-bag', 'users', 'fire'],
+            default: 'shopping-cart',
+        },
+        {
+            field: 'productId',
+            label: 'Ürün ID (SKU)',
+            type: 'text',
+            placeholder: 'Otomatik algılanır veya manuel girin',
+            required: false,
+        },
+    ],
+    newsletter: [
+        {
+            field: 'headline',
+            label: 'Headline',
+            type: 'text',
+            placeholder: 'Join our newsletter',
+        },
+        {
+            field: 'text',
+            label: 'Description',
+            type: 'textarea',
+            placeholder: 'Get product updates, launches, and growth tips.',
+        },
+        {
+            field: 'emailPlaceholder',
+            label: 'Email Placeholder',
+            type: 'text',
+            placeholder: 'you@example.com',
+        },
+        {
+            field: 'buttonText',
+            label: 'Button Text',
+            type: 'text',
+            placeholder: 'Subscribe',
+        },
+        {
+            field: 'successMessage',
+            label: 'Success Message',
+            type: 'text',
+            placeholder: 'Thanks! Please check your inbox to confirm.',
+        },
+        {
+            field: 'errorMessage',
+            label: 'Error Message',
+            type: 'text',
+            placeholder: 'Unable to subscribe right now. Please try again.',
+        },
+    ],
+};
+// ===========================================
+// CONTENT FIELD FACTORIES
+// ===========================================
+/**
+ * Creates CTA (Call-to-Action) fields: buttonText + buttonUrl
+ */
+function commonCtaFields(config) {
+    return [
+        {
+            field: 'buttonText',
+            label: config?.buttonTextLabel || 'Button Text',
+            type: 'text',
+            placeholder: config?.buttonTextPlaceholder || 'Shop Now',
+        },
+        {
+            field: 'buttonUrl',
+            label: config?.buttonUrlLabel || 'Button URL',
+            type: 'url',
+            placeholder: 'https://...',
+        },
+    ];
+}
+/**
+ * Creates a single image URL field
+ */
+function commonImageField(config) {
+    return {
+        field: 'imageUrl',
+        label: config?.label || 'Image',
+        type: 'image-upload',
+        placeholder: config?.placeholder || 'https://...',
+    };
+}
+/**
+ * Creates title + text/description fields
+ */
+function commonTitleTextFields(config) {
+    return [
+        {
+            field: 'title',
+            label: config?.titleLabel || 'Title',
+            type: 'text',
+            placeholder: config?.titlePlaceholder || 'Special Offer',
+        },
+        {
+            field: 'text',
+            label: config?.textLabel || 'Description',
+            type: 'textarea',
+            placeholder: config?.textPlaceholder || 'Limited time offer...',
+        },
+    ];
+}
+// ===========================================
+// STYLE SECTION FACTORIES
+// ===========================================
+/**
+ * Creates a Colors section with standard color fields
+ */
+function makeColorSection(config) {
+    const fields = [
+        {
+            key: 'backgroundColor',
+            label: 'Background Color',
+            type: 'color',
+            default: config.backgroundColor || '#1a1a1a',
+        },
+        {
+            key: 'textColor',
+            label: 'Text Color',
+            type: 'color',
+            default: config.textColor || '#ffffff',
+        },
+        {
+            key: 'buttonColor',
+            label: 'Button Color',
+            type: 'color',
+            default: config.buttonColor || '#ffffff',
+        },
+        {
+            key: 'buttonTextColor',
+            label: 'Button Text Color',
+            type: 'color',
+            default: config.buttonTextColor || '#1a1a1a',
+        },
+    ];
+    // Add extra colors if provided (e.g., declineButtonColor for cookie_consent)
+    if (config.extraColors) {
+        Object.entries(config.extraColors).forEach(([key, cfg]) => {
+            fields.push({ key, label: cfg.label, type: 'color', default: cfg.default });
+        });
+    }
+    return { title: 'Colors', fields };
+}
+/**
+ * Creates a Layout section with border radius and padding
+ */
+function makeLayoutSection(config = {}) {
+    const fields = [];
+    if (config.includeRadius !== false) {
+        fields.push({
+            key: 'borderRadius',
+            label: 'Border Radius',
+            type: 'select',
+            options: config.borderRadiusOptions || ['0px', '4px', '8px', '12px', '16px'],
+            default: config.borderRadiusDefault || '8px',
+        });
+    }
+    fields.push({
+        key: 'padding',
+        label: 'Padding',
+        type: 'select',
+        options: config.paddingOptions || ['0px', '4px', '8px', '12px', '16px', '20px', '24px'],
+        default: config.paddingDefault || '16px',
+    });
+    if (config.extraFields) {
+        fields.push(...config.extraFields);
+    }
+    return { title: 'Layout', fields };
+}
+/**
+ * Creates an Effects section with shadow and border
+ */
+function makeEffectsSection(config = {}) {
+    const fields = [];
+    if (config.includeShadow !== false) {
+        fields.push({
+            key: 'shadow',
+            label: 'Shadow',
+            type: 'select',
+            options: config.shadowOptions || ['none', 'sm', 'md', 'lg', 'xl'],
+            default: config.shadowDefault || 'md',
+        });
+    }
+    if (config.includeBorder !== false) {
+        fields.push({
+            key: config.borderKey || 'border',
+            label: config.borderLabel || 'Border',
+            type: 'text',
+            default: config.borderDefault || 'none',
+            placeholder: '1px solid #e5e7eb',
+        });
+    }
+    if (config.extraFields) {
+        fields.push(...config.extraFields);
+    }
+    return { title: 'Effects', fields };
+}
+/**
+ * Creates a Typography section with font size and weight
+ */
+function makeTypographySection(config = {}) {
+    const fields = [
+        {
+            key: 'fontSize',
+            label: 'Font Size',
+            type: 'select',
+            options: config.fontSizeOptions || ['12px', '14px', '16px', '18px'],
+            default: config.fontSizeDefault || '14px',
+        },
+        {
+            key: 'fontWeight',
+            label: 'Font Weight',
+            type: 'select',
+            options: config.fontWeightOptions || ['normal', 'medium', 'semibold', 'bold'],
+            default: config.fontWeightDefault || 'medium',
+        },
+    ];
+    if (config.extraFields) {
+        fields.push(...config.extraFields);
+    }
+    return { title: 'Typography', fields };
+}
+/**
+ * Creates a Close Button section with toggle and color
+ */
+function makeCloseButtonSection(config = {}) {
+    return {
+        title: 'Close Button',
+        fields: [
+            {
+                key: 'showCloseButton',
+                label: 'Show Close Button',
+                type: 'toggle',
+                default: config.showDefault ?? true,
+            },
+            {
+                key: 'closeButtonColor',
+                label: 'Close Button Color',
+                type: 'color',
+                default: config.colorDefault || '#ffffff',
+            },
+        ],
+    };
+}
+// ===========================================
+// STYLE CONFIGS - Style sections per type
+// ===========================================
+export const TYPE_STYLE_CONFIGS = {
+    announcement_bar: [
+        makeColorSection({
+            backgroundColor: '#1a1a1a',
+            textColor: '#ffffff',
+            buttonColor: '#ffffff',
+            buttonTextColor: '#1a1a1a',
+        }),
+        makeTypographySection({ fontSizeDefault: '14px' }),
+        {
+            title: 'Layout',
+            fields: [
+                {
+                    key: 'padding',
+                    label: 'Padding',
+                    type: 'select',
+                    options: ['8px', '12px', '16px', '20px'],
+                    default: '12px',
+                },
+                {
+                    key: 'borderBottom',
+                    label: 'Border Bottom',
+                    type: 'text',
+                    default: 'none',
+                    placeholder: '1px solid #333',
+                },
+            ],
+        },
+        {
+            title: 'Image',
+            fields: [
+                {
+                    key: 'imageSize',
+                    label: 'Icon Size',
+                    type: 'select',
+                    options: ['20px', '24px', '28px', '32px', '40px'],
+                    default: '24px',
+                },
+                {
+                    key: 'imageBorderRadius',
+                    label: 'Icon Radius',
+                    type: 'select',
+                    options: ['0px', '4px', '8px', '50%'],
+                    default: '4px',
+                },
+                {
+                    key: 'imageSpacing',
+                    label: 'Icon Spacing',
+                    type: 'select',
+                    options: ['4px', '8px', '12px', '16px'],
+                    default: '8px',
+                },
+            ],
+        },
+        makeCloseButtonSection(),
+    ],
+    inline_banner: [
+        makeColorSection({
+            backgroundColor: '#6366f1',
+            textColor: '#ffffff',
+            buttonColor: '#ffffff',
+            buttonTextColor: '#6366f1',
+        }),
+        makeLayoutSection({ paddingDefault: '16px' }),
+        makeEffectsSection({ shadowDefault: 'md' }),
+        {
+            title: 'Image',
+            fields: [
+                {
+                    key: 'imageMode',
+                    label: 'Image Mode',
+                    type: 'select',
+                    options: ['thumbnail', 'cover', 'fullWidth'],
+                    default: 'thumbnail',
+                },
+                {
+                    key: 'imageSize',
+                    label: 'Thumbnail Size',
+                    type: 'select',
+                    options: ['40px', '48px', '60px', '80px', '128px'],
+                    default: '60px',
+                    condition: (styles) => styles.imageMode === 'thumbnail',
+                },
+                {
+                    key: 'imageAspectRatio',
+                    label: 'Aspect Ratio',
+                    type: 'select',
+                    options: ['auto', '16/9', '4/3', '1/1'],
+                    default: 'auto',
+                    condition: (styles) => styles.imageMode !== 'thumbnail',
+                },
+                {
+                    key: 'imageObjectFit',
+                    label: 'Object Fit',
+                    type: 'select',
+                    options: ['cover', 'contain', 'fill'],
+                    default: 'cover',
+                },
+                {
+                    key: 'imageBorderRadius',
+                    label: 'Image Radius',
+                    type: 'select',
+                    options: ['0px', '4px', '8px', '50%'],
+                    default: '8px',
+                },
+            ],
+        },
+        {
+            title: 'Content Layout',
+            fields: [
+                {
+                    key: 'contentDirection',
+                    label: 'Direction',
+                    type: 'select',
+                    options: ['row', 'column'],
+                    default: 'row',
+                },
+                {
+                    key: 'contentAlignment',
+                    label: 'Alignment',
+                    type: 'select',
+                    options: ['left', 'center', 'right'],
+                    default: 'left',
+                },
+                {
+                    key: 'imageSpacing',
+                    label: 'Image Spacing',
+                    type: 'select',
+                    options: ['0px', '8px', '12px', '16px', '24px'],
+                    default: '16px',
+                },
+            ],
+        },
+    ],
+    floating_button: [
+        {
+            title: 'Colors',
+            fields: [
+                { key: 'backgroundColor', label: 'Background Color', type: 'color', default: '#6366f1' },
+                { key: 'textColor', label: 'Icon/Text Color', type: 'color', default: '#ffffff' },
+            ],
+        },
+        {
+            title: 'Size & Shape',
+            fields: [
+                {
+                    key: 'size',
+                    label: 'Button Size',
+                    type: 'select',
+                    options: ['48px', '56px', '64px', '72px'],
+                    default: '56px',
+                },
+                {
+                    key: 'borderRadius',
+                    label: 'Border Radius',
+                    type: 'select',
+                    options: ['8px', '12px', '16px', '50%'],
+                    default: '50%',
+                },
+            ],
+        },
+        makeEffectsSection({
+            shadowDefault: 'lg',
+            includeBorder: false,
+            extraFields: [
+                { key: 'pulseAnimation', label: 'Pulse Animation', type: 'toggle', default: false },
+            ],
+        }),
+        {
+            title: 'Tooltip',
+            fields: [
+                { key: 'tooltipBgColor', label: 'Tooltip Background', type: 'color', default: '#1a1a1a' },
+                { key: 'tooltipTextColor', label: 'Tooltip Text', type: 'color', default: '#ffffff' },
+            ],
+        },
+    ],
+    exit_intent_popup: [
+        makeColorSection({
+            backgroundColor: '#ffffff',
+            textColor: '#1a1a1a',
+            buttonColor: '#6366f1',
+            buttonTextColor: '#ffffff',
+        }),
+        {
+            title: 'Overlay',
+            fields: [
+                { key: 'overlayColor', label: 'Overlay Color', type: 'color', default: '#000000' },
+                {
+                    key: 'overlayOpacity',
+                    label: 'Overlay Opacity',
+                    type: 'range',
+                    min: 0,
+                    max: 100,
+                    step: 5,
+                    default: 50,
+                },
+                {
+                    key: 'overlayBlur',
+                    label: 'Overlay Blur',
+                    type: 'select',
+                    options: ['none', '2px', '4px', '8px'],
+                    default: 'none',
+                },
+            ],
+        },
+        {
+            title: 'Layout',
+            fields: [
+                {
+                    key: 'maxWidth',
+                    label: 'Max Width',
+                    type: 'select',
+                    options: ['320px', '400px', '480px', '560px'],
+                    default: '400px',
+                },
+                {
+                    key: 'padding',
+                    label: 'Padding',
+                    type: 'select',
+                    options: ['16px', '20px', '24px', '32px'],
+                    default: '24px',
+                },
+                {
+                    key: 'borderRadius',
+                    label: 'Border Radius',
+                    type: 'select',
+                    options: ['0px', '8px', '12px', '16px', '24px'],
+                    default: '12px',
+                },
+            ],
+        },
+        {
+            title: 'Image',
+            fields: [
+                {
+                    key: 'imageMode',
+                    label: 'Image Mode',
+                    type: 'select',
+                    options: ['thumbnail', 'cover', 'fullWidth'],
+                    default: 'cover',
+                },
+                {
+                    key: 'imageSize',
+                    label: 'Thumbnail Size',
+                    type: 'select',
+                    options: ['48px', '60px', '80px', '120px'],
+                    default: '80px',
+                    condition: (styles) => styles.imageMode === 'thumbnail',
+                },
+                {
+                    key: 'imagePosition',
+                    label: 'Image Position',
+                    type: 'select',
+                    options: ['top', 'bottom', 'left', 'right'],
+                    default: 'top',
+                },
+                {
+                    key: 'imageAspectRatio',
+                    label: 'Aspect Ratio',
+                    type: 'select',
+                    options: ['auto', '16/9', '4/3', '1/1'],
+                    default: 'auto',
+                },
+                {
+                    key: 'imageObjectFit',
+                    label: 'Object Fit',
+                    type: 'select',
+                    options: ['cover', 'contain', 'fill'],
+                    default: 'cover',
+                },
+                {
+                    key: 'imageBorderRadius',
+                    label: 'Image Radius',
+                    type: 'select',
+                    options: ['0px', '4px', '8px', '12px'],
+                    default: '8px',
+                    condition: (styles) => styles.imageMode !== 'fullWidth',
+                },
+            ],
+        },
+        {
+            title: 'Animation',
+            fields: [
+                {
+                    key: 'animation',
+                    label: 'Animation',
+                    type: 'select',
+                    options: ['none', 'fade', 'scale', 'slide'],
+                    default: 'scale',
+                },
+                {
+                    key: 'shadow',
+                    label: 'Shadow',
+                    type: 'select',
+                    options: ['none', 'lg', 'xl', '2xl'],
+                    default: '2xl',
+                },
+            ],
+        },
+    ],
+    slide_in: [
+        makeColorSection({
+            backgroundColor: '#ffffff',
+            textColor: '#1a1a1a',
+            buttonColor: '#6366f1',
+            buttonTextColor: '#ffffff',
+        }),
+        {
+            title: 'Layout',
+            fields: [
+                {
+                    key: 'width',
+                    label: 'Width',
+                    type: 'select',
+                    options: ['280px', '320px', '360px', '400px'],
+                    default: '320px',
+                },
+                {
+                    key: 'padding',
+                    label: 'Padding',
+                    type: 'select',
+                    options: ['12px', '16px', '20px', '24px'],
+                    default: '16px',
+                },
+                {
+                    key: 'borderRadius',
+                    label: 'Border Radius',
+                    type: 'select',
+                    options: ['0px', '8px', '12px', '16px'],
+                    default: '12px',
+                },
+            ],
+        },
+        {
+            title: 'Image',
+            fields: [
+                {
+                    key: 'imageMode',
+                    label: 'Image Mode',
+                    type: 'select',
+                    options: ['cover', 'contain', 'fullWidth'],
+                    default: 'cover',
+                },
+                {
+                    key: 'imageAspectRatio',
+                    label: 'Aspect Ratio',
+                    type: 'select',
+                    options: ['auto', '16/9', '4/3', '1/1', '3/4'],
+                    default: 'auto',
+                },
+                {
+                    key: 'imageObjectFit',
+                    label: 'Object Fit',
+                    type: 'select',
+                    options: ['cover', 'contain', 'fill'],
+                    default: 'cover',
+                },
+                {
+                    key: 'imageBorderRadius',
+                    label: 'Image Radius',
+                    type: 'select',
+                    options: ['0px', '4px', '8px', '12px'],
+                    default: '8px',
+                    condition: (styles) => styles.imageMode !== 'fullWidth',
+                },
+            ],
+        },
+        makeEffectsSection({ shadowDefault: 'xl', shadowOptions: ['none', 'lg', 'xl', '2xl'] }),
+        {
+            title: 'Position',
+            fields: [
+                {
+                    key: 'offsetX',
+                    label: 'Horizontal Offset',
+                    type: 'select',
+                    options: ['8px', '12px', '16px', '24px'],
+                    default: '16px',
+                },
+                {
+                    key: 'offsetY',
+                    label: 'Vertical Offset',
+                    type: 'select',
+                    options: ['8px', '12px', '16px', '24px'],
+                    default: '16px',
+                },
+            ],
+        },
+    ],
+    embedded_card: [
+        makeColorSection({
+            backgroundColor: '#ffffff',
+            textColor: '#1a1a1a',
+            buttonColor: '#6366f1',
+            buttonTextColor: '#ffffff',
+        }),
+        makeLayoutSection({ borderRadiusDefault: '12px', paddingDefault: '16px' }),
+        makeEffectsSection({ shadowDefault: 'md', borderDefault: '1px solid #e5e7eb' }),
+        {
+            title: 'Image',
+            fields: [
+                {
+                    key: 'imageMode',
+                    label: 'Image Mode',
+                    type: 'select',
+                    options: ['cover', 'contain', 'fullWidth'],
+                    default: 'cover',
+                },
+                {
+                    key: 'imageAspectRatio',
+                    label: 'Aspect Ratio',
+                    type: 'select',
+                    options: ['auto', '16/9', '4/3', '1/1', '3/4'],
+                    default: '16/9',
+                },
+                {
+                    key: 'imageObjectFit',
+                    label: 'Object Fit',
+                    type: 'select',
+                    options: ['cover', 'contain', 'fill'],
+                    default: 'cover',
+                },
+                {
+                    key: 'imagePosition',
+                    label: 'Image Position',
+                    type: 'select',
+                    options: ['top', 'bottom'],
+                    default: 'top',
+                },
+                {
+                    key: 'imageBorderRadius',
+                    label: 'Image Radius',
+                    type: 'select',
+                    options: ['0px', '8px', '12px'],
+                    default: '8px',
+                    condition: (styles) => styles.imageMode !== 'fullWidth',
+                },
+            ],
+        },
+        {
+            title: 'Content Layout',
+            fields: [
+                {
+                    key: 'contentAlignment',
+                    label: 'Alignment',
+                    type: 'select',
+                    options: ['left', 'center', 'right'],
+                    default: 'left',
+                },
+            ],
+        },
+    ],
+    sticky_footer: [
+        makeColorSection({
+            backgroundColor: '#1a1a1a',
+            textColor: '#ffffff',
+            buttonColor: '#ffffff',
+            buttonTextColor: '#1a1a1a',
+        }),
+        {
+            title: 'Layout',
+            fields: [
+                {
+                    key: 'padding',
+                    label: 'Padding',
+                    type: 'select',
+                    options: ['8px', '12px', '16px', '20px'],
+                    default: '12px',
+                },
+                {
+                    key: 'fontSize',
+                    label: 'Font Size',
+                    type: 'select',
+                    options: ['12px', '14px', '16px'],
+                    default: '14px',
+                },
+            ],
+        },
+        makeEffectsSection({
+            shadowDefault: 'lg',
+            shadowOptions: ['none', 'sm', 'md', 'lg'],
+            borderKey: 'borderTop',
+            borderLabel: 'Border Top',
+            borderDefault: 'none',
+        }),
+        makeCloseButtonSection(),
+    ],
+    countdown_timer: [
+        makeColorSection({
+            backgroundColor: '#dc2626',
+            textColor: '#ffffff',
+            buttonColor: '#ffffff',
+            buttonTextColor: '#dc2626',
+        }),
+        {
+            title: 'Timer Style',
+            fields: [
+                {
+                    key: 'timerBgColor',
+                    label: 'Timer Background',
+                    type: 'color',
+                    default: 'rgba(255,255,255,0.2)',
+                },
+                {
+                    key: 'timerFontSize',
+                    label: 'Timer Font Size',
+                    type: 'select',
+                    options: ['14px', '16px', '18px', '20px'],
+                    default: '16px',
+                },
+                {
+                    key: 'timerFontWeight',
+                    label: 'Timer Font Weight',
+                    type: 'select',
+                    options: ['normal', 'medium', 'semibold', 'bold'],
+                    default: 'bold',
+                },
+            ],
+        },
+        {
+            title: 'Layout',
+            fields: [
+                {
+                    key: 'padding',
+                    label: 'Padding',
+                    type: 'select',
+                    options: ['8px', '12px', '16px'],
+                    default: '12px',
+                },
+                {
+                    key: 'separatorStyle',
+                    label: 'Separator Style',
+                    type: 'select',
+                    options: ['colon', 'dot', 'slash', 'none'],
+                    default: 'colon',
+                },
+            ],
+        },
+    ],
+    cookie_consent: [
+        makeColorSection({
+            backgroundColor: '#1f2937',
+            textColor: '#f3f4f6',
+            buttonColor: '#3b82f6',
+            buttonTextColor: '#ffffff',
+            extraColors: {
+                declineButtonColor: { label: 'Decline Button Color', default: '#6b7280' },
+                declineButtonTextColor: { label: 'Decline Button Text Color', default: '#ffffff' },
+                customizeButtonColor: { label: 'Customize Button Color', default: '#4b5563' },
+                customizeButtonTextColor: { label: 'Customize Button Text Color', default: '#ffffff' },
+                linkColor: { label: 'Link Color', default: '#60a5fa' },
+            },
+        }),
+        {
+            title: 'Layout',
+            fields: [
+                {
+                    key: 'padding',
+                    label: 'Padding',
+                    type: 'select',
+                    options: ['12px', '16px', '20px', '24px'],
+                    default: '16px',
+                },
+                {
+                    key: 'borderRadius',
+                    label: 'Border Radius',
+                    type: 'select',
+                    options: ['0px', '4px', '8px', '12px', '16px'],
+                    default: '8px',
+                },
+                {
+                    key: 'shadow',
+                    label: 'Shadow',
+                    type: 'select',
+                    options: ['none', 'sm', 'md', 'lg'],
+                    default: 'lg',
+                },
+                {
+                    key: 'maxWidth',
+                    label: 'Max Width',
+                    type: 'select',
+                    options: ['400px', '600px', '800px', '1200px', 'none'],
+                    default: 'none',
+                },
+            ],
+        },
+        {
+            title: 'Typography',
+            fields: [
+                {
+                    key: 'headlineFontSize',
+                    label: 'Headline Font Size',
+                    type: 'select',
+                    options: ['14px', '16px', '18px', '20px', '24px'],
+                    default: '18px',
+                },
+                {
+                    key: 'headlineFontWeight',
+                    label: 'Headline Font Weight',
+                    type: 'select',
+                    options: ['normal', 'medium', 'semibold', 'bold'],
+                    default: 'semibold',
+                },
+                {
+                    key: 'textFontSize',
+                    label: 'Text Font Size',
+                    type: 'select',
+                    options: ['12px', '14px', '16px'],
+                    default: '14px',
+                },
+                {
+                    key: 'buttonFontSize',
+                    label: 'Button Font Size',
+                    type: 'select',
+                    options: ['12px', '14px', '16px'],
+                    default: '14px',
+                },
+                {
+                    key: 'buttonFontWeight',
+                    label: 'Button Font Weight',
+                    type: 'select',
+                    options: ['normal', 'medium', 'semibold', 'bold'],
+                    default: 'medium',
+                },
+            ],
+        },
+        {
+            title: 'Behavior',
+            fields: [
+                { key: 'showDeclineButton', label: 'Show Decline Button', type: 'toggle', default: true },
+                {
+                    key: 'showCustomizeButton',
+                    label: 'Show Customize Button',
+                    type: 'toggle',
+                    default: true,
+                },
+                { key: 'showCloseButton', label: 'Show Close Button', type: 'toggle', default: false },
+                {
+                    key: 'autoHideAfterMs',
+                    label: 'Auto Hide After (ms)',
+                    type: 'number',
+                    default: 0,
+                    min: 0,
+                    max: 60000,
+                    step: 1000,
+                },
+            ],
+        },
+        {
+            title: 'Consent Settings',
+            fields: [
+                { key: 'granularEnabled', label: 'Enable Granular Consent', type: 'toggle', default: true },
+                {
+                    key: 'requiredCategories',
+                    label: 'Required Categories',
+                    type: 'text',
+                    default: 'necessary',
+                    placeholder: 'necessary,analytics',
+                },
+                {
+                    key: 'timeoutMs',
+                    label: 'Decision Timeout (ms)',
+                    type: 'number',
+                    default: 0,
+                    min: 0,
+                    max: 300000,
+                    step: 1000,
+                },
+            ],
+        },
+    ],
+    custom: [
+        {
+            title: 'Container',
+            fields: [
+                {
+                    key: 'containerPadding',
+                    label: 'Container Padding',
+                    type: 'select',
+                    options: ['0px', '8px', '16px', '24px'],
+                    default: '0px',
+                },
+                {
+                    key: 'containerBackground',
+                    label: 'Container Background',
+                    type: 'color',
+                    default: 'transparent',
+                },
+            ],
+        },
+    ],
+    product_view_count: [
+        {
+            title: 'Renkler',
+            fields: [
+                { key: 'backgroundColor', label: 'Arkaplan Rengi', type: 'color', default: '#f0fdf4' },
+                { key: 'textColor', label: 'Metin Rengi', type: 'color', default: '#166534' },
+                { key: 'iconColor', label: 'İkon Rengi', type: 'color', default: '#22c55e' },
+                { key: 'counterColor', label: 'Sayaç Rengi', type: 'color', default: '#16a34a' },
+            ],
+        },
+        {
+            title: 'Düzen',
+            fields: [
+                {
+                    key: 'borderRadius',
+                    label: 'Köşe Yuvarlama',
+                    type: 'select',
+                    options: ['0px', '4px', '8px', '12px', '16px', '50px'],
+                    default: '8px',
+                },
+                {
+                    key: 'padding',
+                    label: 'İç Boşluk',
+                    type: 'select',
+                    options: ['8px', '12px', '16px', '20px'],
+                    default: '12px',
+                },
+                {
+                    key: 'display',
+                    label: 'Görünüm',
+                    type: 'select',
+                    options: ['inline', 'block', 'flex'],
+                    default: 'inline',
+                },
+                {
+                    key: 'fontSize',
+                    label: 'Font Boyutu',
+                    type: 'select',
+                    options: ['12px', '14px', '16px', '18px'],
+                    default: '14px',
+                },
+            ],
+        },
+        {
+            title: 'Animasyon',
+            fields: [
+                { key: 'animateCounter', label: 'Animasyonlu Sayaç', type: 'toggle', default: true },
+                {
+                    key: 'animationDuration',
+                    label: 'Animasyon Süresi (ms)',
+                    type: 'select',
+                    options: ['500', '1000', '1500', '2000'],
+                    default: '1000',
+                },
+                {
+                    key: 'separator',
+                    label: 'Ayıraç',
+                    type: 'select',
+                    options: ['comma', 'dot', 'space', 'none'],
+                    default: 'comma',
+                },
+            ],
+        },
+    ],
+    cart_count: [
+        {
+            title: 'Renkler',
+            fields: [
+                { key: 'backgroundColor', label: 'Arkaplan Rengi', type: 'color', default: '#fef3c7' },
+                { key: 'textColor', label: 'Metin Rengi', type: 'color', default: '#92400e' },
+                { key: 'iconColor', label: 'İkon Rengi', type: 'color', default: '#f59e0b' },
+                { key: 'counterColor', label: 'Sayaç Rengi', type: 'color', default: '#ea580c' },
+            ],
+        },
+        {
+            title: 'Düzen',
+            fields: [
+                {
+                    key: 'borderRadius',
+                    label: 'Köşe Yuvarlama',
+                    type: 'select',
+                    options: ['0px', '4px', '8px', '12px', '16px', '50px'],
+                    default: '8px',
+                },
+                {
+                    key: 'padding',
+                    label: 'İç Boşluk',
+                    type: 'select',
+                    options: ['8px', '12px', '16px', '20px'],
+                    default: '12px',
+                },
+                {
+                    key: 'display',
+                    label: 'Görünüm',
+                    type: 'select',
+                    options: ['inline', 'block', 'flex'],
+                    default: 'inline',
+                },
+                {
+                    key: 'fontSize',
+                    label: 'Font Boyutu',
+                    type: 'select',
+                    options: ['12px', '14px', '16px', '18px'],
+                    default: '14px',
+                },
+            ],
+        },
+        {
+            title: 'Animasyon',
+            fields: [
+                { key: 'animateCounter', label: 'Animasyonlu Sayaç', type: 'toggle', default: true },
+                {
+                    key: 'animationDuration',
+                    label: 'Animasyon Süresi (ms)',
+                    type: 'select',
+                    options: ['500', '1000', '1500', '2000'],
+                    default: '1000',
+                },
+                {
+                    key: 'separator',
+                    label: 'Ayıraç',
+                    type: 'select',
+                    options: ['comma', 'dot', 'space', 'none'],
+                    default: 'comma',
+                },
+            ],
+        },
+        {
+            title: 'Aciliyet Rozeti',
+            fields: [
+                { key: 'showBadge', label: 'Rozet Göster', type: 'toggle', default: false },
+                { key: 'badgeText', label: 'Rozet Metni', type: 'text', default: 'HOT' },
+                { key: 'badgeColor', label: 'Rozet Rengi', type: 'color', default: '#dc2626' },
+                { key: 'badgeTextColor', label: 'Rozet Metin Rengi', type: 'color', default: '#ffffff' },
+            ],
+        },
+    ],
+    newsletter: [
+        makeColorSection({
+            backgroundColor: '#ffffff',
+            textColor: '#111827',
+            buttonColor: '#111827',
+            buttonTextColor: '#ffffff',
+            extraColors: {
+                inputBackgroundColor: {
+                    label: 'Input Background',
+                    default: '#f9fafb',
+                },
+                inputTextColor: {
+                    label: 'Input Text',
+                    default: '#111827',
+                },
+                inputBorderColor: {
+                    label: 'Input Border',
+                    default: '#d1d5db',
+                },
+            },
+        }),
+        makeTypographySection({
+            fontSizeDefault: '14px',
+            extraFields: [
+                {
+                    key: 'headlineFontSize',
+                    label: 'Headline Size',
+                    type: 'select',
+                    options: ['16px', '18px', '20px', '24px'],
+                    default: '20px',
+                },
+            ],
+        }),
+        makeLayoutSection({
+            paddingDefault: '16px',
+            borderRadiusDefault: '12px',
+            extraFields: [
+                {
+                    key: 'maxWidth',
+                    label: 'Max Width',
+                    type: 'select',
+                    options: ['280px', '320px', '360px', '420px', '100%'],
+                    default: '360px',
+                },
+            ],
+        }),
+        makeEffectsSection({
+            shadowDefault: 'lg',
+            extraFields: [
+                {
+                    key: 'showCloseButton',
+                    label: 'Show Close Button',
+                    type: 'toggle',
+                    default: true,
+                },
+            ],
+        }),
+    ],
+};
+// ===========================================
+// HELPER FUNCTIONS
+// ===========================================
+// Shadow value mapping
+export const SHADOW_VALUES = {
+    none: 'none',
+    sm: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
+    md: '0 4px 6px -1px rgba(0, 0, 0, 0.1)',
+    lg: '0 10px 15px -3px rgba(0, 0, 0, 0.1)',
+    xl: '0 20px 25px -5px rgba(0, 0, 0, 0.1)',
+    '2xl': '0 25px 50px -12px rgba(0, 0, 0, 0.25)',
+};
+// Get default styles for a widget type
+export function getDefaultStyles(type) {
+    const sections = TYPE_STYLE_CONFIGS[type] || TYPE_STYLE_CONFIGS.custom;
+    const defaults = {};
+    sections.forEach((section) => {
+        section.fields.forEach((field) => {
+            defaults[field.key] = field.default;
+        });
+    });
+    return defaults;
+}
+// Get content fields for a widget type
+export function getContentFields(type) {
+    return TYPE_CONTENT_FIELDS[type] || TYPE_CONTENT_FIELDS.custom;
+}
+// Get style sections for a widget type
+export function getStyleSections(type) {
+    return TYPE_STYLE_CONFIGS[type] || TYPE_STYLE_CONFIGS.custom;
+}
+// Convert shadow name to CSS value
+export function getShadowValue(shadow) {
+    return SHADOW_VALUES[shadow] || 'none';
+}
+export function getAllowedStyleKeys(type) {
+    const sections = getStyleSections(type);
+    return sections.flatMap((section) => section.fields.map((field) => field.key));
+}
+//# sourceMappingURL=configs.js.map