@appaflytech/zeyrek-ai-mcp 0.0.28 → 0.0.30

package/dist/knowledge/platform/mobileLayoutLint.js

@@ -0,0 +1,324 @@
+import { MOBILE_DROPPABLE_TYPES, MOBILE_OUT_OF_FLOW_TYPES, MOBILE_TRANSPARENT_WRAPPER_TYPES } from '../mobileComponentCatalog.js';
+import { PAGE_CONTAINER_ELEMENT_ID } from '../normalize.js';
+import { OVERLAY_TYPES, firstDrawn, safeAreaEdges, topSafeAreaMissing } from './mobile.js';
+import { MOBILE_RULES } from './mobileRules.js';
+import { FULL_WIDTH_TYPES, nativeMarginLeft, nativePaddingLeft } from './nativeBoxModel.js';
+/**
+ * Boş görünmesi hata olmayan bırakılabilir tipler: içeriği çalışma anında gelir (`widget-area`, `slot`), öğesini
+ * prop'tan çizer (`carousel` items, `tabs` başlığı, `grouped-list` satırları) ya da akış dışı bir katmandır.
+ */
+const EMPTY_ALLOWED_TYPES = ['widget-area', 'slot', 'carousel', 'tabs', 'grouped-list', ...OVERLAY_TYPES];
+export function describeShell(views) {
+    const root = asNodes(views)[0];
+    const children = asNodes(root?.children);
+    return { kind: 'shell', topInset: children.length > 0 && !topSafeAreaMissing(children, 'studio'), appBar: someNode(asNodes(views), node => node.type === 'app-bar') };
+}
+/**
+ * MOB-015…021 — mizanpaj sözleşmesinin iskelet (S1/S3/S12/S13) ve hiza/ölçek (S5/S6/S8/S9/S11) maddeleri (plans/mobil-mizanpaj-dili 03, S1/S3/S12/S13).
+ * Ağacın tamamına bakar; yama yolunda yalnız yazımın getirdiği bulgular raporlanır (`newFindings`).
+ */
+export function mobileLayoutFindings(input) {
+    const roots = asNodes(input.tree);
+    const screenRoot = input.kind === 'page' ? roots.find(node => node.elementId === PAGE_CONTAINER_ELEMENT_ID) : roots[0];
+    const screen = asNodes(screenRoot?.children);
+    const shell = input.kind === 'page' ? input.shell ?? { kind: 'none' } : { kind: 'none' };
+    const findings = [];
+    if (shell.kind === 'unknown') {
+        findings.push({ code: MOBILE_RULES['MOB-015'].id, severity: 'info', message: 'sayfanın kabuğu (layout) okunamadı — üst pay ve app-bar kuralları (MOB-015, MOB-017) bu yazımda denetlenmedi' });
+    }
+    // MOB-015 — üst güvenli alan tek yerde.
+    if (input.kind === 'layout' && screen.length > 0 && topSafeAreaMissing(screen, 'studio')) {
+        findings.push(rule('MOB-015', label(screenRoot), "kabuğun ilk çizilen öğesi üst güvenli alan değil: app-bar ve sayfalar durum çubuğunun/çentiğin altına girer. app-bar'ı `safe-area` (edges: 'top') içine alın — sayfalar ikinci pay vermez"));
+    }
+    if (input.kind === 'page' && shell.kind === 'none' && screen.length > 0 && topSafeAreaMissing(screen, 'studio')) {
+        findings.push(rule('MOB-015', label(screenRoot), "kabuksuz sayfanın ilk çizilen öğesi üst güvenli alan değil: içerik durum çubuğunun/çentiğin altına girer. Tepeye `safe-area` (edges: 'top') koyun ya da sayfayı üst payı veren bir kabuğa bağlayın (layoutId)"));
+    }
+    if (shell.kind === 'shell' && !shell.topInset) {
+        findings.push(rule('MOB-015', 'layout', "sayfanın kabuğu üst payı vermiyor: kabukta app-bar'ı `safe-area` (edges: 'top') içine alın (layout_schema_patch); payı sayfaya koymayın, her sayfada tekrarlanır"));
+    }
+    if (shell.kind === 'shell' && shell.topInset) {
+        // Katman (modal, drawer) kendi panelinde payı ayrıca çözer; ekranın akışındaki güvenli alanlar sayılır.
+        for (const node of collect(roots, node => node.type === 'safe-area' && safeAreaEdges(node) !== 'bottom', OVERLAY_TYPES)) {
+            findings.push(rule('MOB-015', label(node), `kabuk üst payı zaten veriyor; sayfadaki '${safeAreaEdges(node)}' güvenli alanı ikinci pay bırakır (içerik app-bar'dan kopar). Kaldırın; alt pay gerekiyorsa edges: 'bottom'`));
+        }
+    }
+    // MOB-016 — tek kaydırıcı: kök kaydırır ve içerik boyundadır.
+    if (screenRoot && propData(screenRoot, 'size') === 'grow') {
+        findings.push(rule('MOB-016', label(screenRoot), "kök kap `size: 'grow'`: çocuklar ekran boyunu eşit paylaşır, kısa içerik gerilir ya da üst üste biner (koşu 37 S-6/S-16). replace_prop size: 'shrink'"));
+    }
+    walkWithAncestors(roots, (node, ancestors) => {
+        if (node.type !== 'scroll-view' || setOrBound(node, 'horizontal'))
+            return;
+        const fixed = appearanceOf(node).heightType === 'fixed';
+        if (ancestors.some(item => item.type === 'scroll-view' && !setOrBound(item, 'horizontal')) && !fixed) {
+            findings.push(rule('MOB-016', label(node), "dikey kaydırıcı başka bir dikey kaydırıcının içinde: iç kaydırma jesti dışarıdakiyle çakışır. İçtekine sabit boy (heightType: 'fixed') verin ya da kaldırın"));
+        }
+        else if (!fixed && !setOrBound(node, 'refreshable') && !setOrBound(node, 'stickyHeader') && !asNodes(node.children).some(child => child.states?.isSticky === true)) {
+            findings.push(rule('MOB-016', label(node), "gerekçesiz dikey `scroll-view`: sayfa kökü zaten kaydırır. Kaldırın ya da gerekçesini verin — refreshable (çekerek yenile), stickyHeader / states.isSticky (yapışkan başlık), heightType: 'fixed' (sabit boylu iç liste)"));
+        }
+    });
+    // MOB-017 — ekranda tek app-bar, ilk çizilen öğe.
+    const appBars = collect(roots, node => node.type === 'app-bar', OVERLAY_TYPES);
+    if (shell.kind === 'shell' && shell.appBar) {
+        for (const node of appBars)
+            findings.push(rule('MOB-017', label(node), 'kabuk app-bar veriyor; sayfadaki ikinci app-bar ekranda çift başlık çubuğu çizer. Kaldırın; sayfa başlığını kabuğun app-bar\'ına bağlayın (title)'));
+    }
+    else if (shell.kind !== 'unknown' && appBars.length > 0) {
+        // Tepedeki app-bar: ilk çizilen öğenin kendisi ya da onun içindeki ilk app-bar (safe-area içi, saydam
+        // çubuk tarifi `stack` → görsel + kap → app-bar).
+        // Boş `safe-area` (kabuksuz sayfanın pay boşluğu) çizim yapmaz; tepedeki ilk içerikli öğeye bakılır.
+        const first = firstDrawn(screen.filter(item => !(item.type === 'safe-area' && asNodes(item.children).length === 0)));
+        const leading = first ? collect([first], item => item.type === 'app-bar', OVERLAY_TYPES)[0] : undefined;
+        for (const node of appBars.filter(item => item !== leading || leading?.type !== 'app-bar')) {
+            findings.push(rule('MOB-017', label(node), appBars.length > 1 && node !== appBars[0] ? 'ekranda ikinci app-bar: tek başlık çubuğu olmalı, kaldırın' : 'app-bar ilk çizilen öğe değil: başlık çubuğu ekranın tepesinde durur. Onu ilk sıraya (ya da tepedeki safe-area\'nın içine) taşıyın'));
+        }
+    }
+    // MOB-018 — boş kap bırakılmaz (tepedeki/dipteki güvenli alan bilinçli bir paydır).
+    walkWithAncestors(screen, (node, ancestors) => {
+        const type = String(node.type ?? '');
+        if (!MOBILE_DROPPABLE_TYPES.includes(type) || EMPTY_ALLOWED_TYPES.includes(type) || node.kind === 'widget')
+            return;
+        if (asNodes(node.children).length > 0 || boundVisibility(node))
+            return;
+        if (type === 'safe-area' && ancestors.length === 0)
+            return;
+        findings.push({ ...rule('MOB-018', label(node), `boş ${type}: ekranda boş şerit bırakır${type === 'safe-area' ? ` (edges: '${safeAreaEdges(node)}' payı kadar)` : ''}. İçeriğini ekleyin ya da silin`), severity: 'info' });
+    });
+    if (screenRoot)
+        findings.push(...alignmentFindings(screenRoot, input.kind), ...widthFindings(screenRoot), ...scaleFindings(screenRoot));
+    return findings;
+}
+/** Sütunda dizilen içerik (form alanları, düğmeler); satırda yan yana olmaları hata değildir. */
+const FIELD_TYPES = ['textinput', 'textarea', 'password', 'numberinput', 'dropdown', 'multi-select', 'datepicker', 'daterangepicker', 'datetimepicker', 'timepicker', 'fileInput', 'slider'];
+const BUTTON_TYPES = ['button', 'filebutton'];
+/** Metin gibi görünen düğmeler içerik genişliğinde durur (S8'in istisnası). */
+const INLINE_BUTTON_VARIANTS = ['text', 'link', 'ghost'];
+/** Sütun akışını taşıyan kap tipleri ve yazılmamış yönleri (`containerDirection`: safe-area/scroll-view sütun doğar). */
+const FLOW_TYPES = { container: 'row', form: 'row', 'safe-area': 'column', 'scroll-view': 'column' };
+const SPACING_SCALE = [0, 4, 8, 16, 24, 32];
+const RADIUS_SCALE = ['none', 'sm', 'md', 'lg', 'pill', '0', 0];
+/**
+ * MOB-019 — kenar değişmezi (S6/S8): aynı kapsamda (ekran ya da yüzey kabı) sütun akışındaki öğelerin sol
+ * kenarı eşittir. Zeminsiz kap ve saydam sarmalayıcı (tooltip) içeriğini kendi margin + padding'i kadar
+ * içeri iter; yüzey kabı yeni kapsam açar, içeriği bilerek içeride durur. Hesap runtime'ın kutu modeliyle
+ * (`nativeBoxModel.ts`), 01'in çizimde ölçtüğü sapmanın şemadan öngörüsüdür.
+ */
+function alignmentFindings(root, kind) {
+    const findings = [];
+    const scopes = [root];
+    for (let index = 0; index < scopes.length; index++) {
+        const owner = scopes[index];
+        const items = [];
+        collectFlowItems(asNodes(owner.children), 0, [], [], items, kind);
+        for (const item of items)
+            if (isSurface(item.node) && flowDirection(item.node) === 'column')
+                scopes.push(item.node);
+        // Ortalanmış ya da sağa hizalı kapsamda öğeler kendi genişliğince yerleşir; sol kenar eşitliği aranmaz.
+        if (!['center', 'right'].includes(String(propData(owner, 'horizontalAlign') ?? 'left')))
+            findings.push(...insetFindings(items));
+    }
+    return findings;
+}
+function collectFlowItems(nodes, inset, chain, shifts, items, kind) {
+    for (const node of nodes) {
+        const type = String(node.type ?? '');
+        if (MOBILE_OUT_OF_FLOW_TYPES.includes(type) || type === 'slot' || propData(node, 'isHidden') === true)
+            continue;
+        const margin = nativeMarginLeft(node);
+        if (transparent(node)) {
+            const shift = margin + nativePaddingLeft(node);
+            collectFlowItems(asNodes(node.children), inset + shift, [...chain, node], [...shifts, shift], items, kind);
+        }
+        else {
+            items.push({ node, inset: inset + margin, chain, shifts });
+        }
+    }
+}
+/** İçeriğini sütunda, sola ya da gerilerek dizen zeminsiz kap — kendi kutusu görünmez, içeriği görünür. */
+function transparent(node) {
+    const type = String(node.type ?? '');
+    if (MOBILE_TRANSPARENT_WRAPPER_TYPES.includes(type))
+        return true;
+    if (!FLOW_TYPES[type] || isSurface(node))
+        return false;
+    return flowDirection(node) === 'column' && !['center', 'right'].includes(String(propData(node, 'horizontalAlign') ?? 'left'));
+}
+/**
+ * Taban, kapsamın kendi sütunundaki (en sığ) öğelerdir — çoğunluk değil. Böylece "başlık + başlıklı grup"
+ * düzeninde suçlu grubu içeri iten kaptır, başlık değil; gruba alan eklemek tabanı el değiştirmez.
+ */
+function insetFindings(items) {
+    if (items.length === 0)
+        return [];
+    const depth = Math.min(...items.map(item => item.chain.length));
+    const counts = new Map();
+    for (const item of items.filter(entry => entry.chain.length === depth))
+        counts.set(item.inset, (counts.get(item.inset) ?? 0) + 1);
+    const baseline = [...counts].sort((a, b) => b[1] - a[1] || a[0] - b[0])[0]?.[0] ?? 0;
+    const reference = items.find(item => item.chain.length === depth && item.inset === baseline);
+    const groups = new Map();
+    for (const item of items.filter(entry => entry.inset !== baseline)) {
+        // Suçlu: ortak zincirden sonra içeriği gerçekten iten ilk kap; hiçbiri itmiyorsa fark öğenin kendi margin'idir.
+        const cause = item.chain.find((ancestor, index) => reference?.chain[index] !== ancestor && (item.shifts[index] ?? 0) !== 0) ?? item.node;
+        groups.set(cause, [...(groups.get(cause) ?? []), item]);
+    }
+    return [...groups].map(([cause, members]) => {
+        // Kabın kendi payı en az kayan üyededir; daha derindeki ek kayma iç kabın ayrı bulgusudur (kap düzelince görünür).
+        const delta = members.map(member => member.inset - baseline).sort((a, b) => Math.abs(a) - Math.abs(b))[0] ?? 0;
+        const where = `${Math.abs(delta)} dp ${delta > 0 ? 'içeride' : 'dışarıda'}`;
+        const ids = members.slice(0, 4).map(member => label(member.node)).join(', ') + (members.length > 4 ? ', …' : '');
+        if (members.length === 1 && cause === members[0]?.node) {
+            return rule('MOB-019', label(cause), `kardeşlerinden ${where} başlıyor: kendi margin'i farklı. Aralık ebeveynin gap'inden gelsin — marginType'ı kardeşleriyle aynı yapın`);
+        }
+        const recipe = MOBILE_TRANSPARENT_WRAPPER_TYPES.includes(String(cause.type ?? ''))
+            ? "paddingType:'none' ve marginType:'none' yazın"
+            : "grup görünsün isteniyorsa yüzey verin (surfaceStyle zemin ya da kenarlık — içerik bilerek içeride durur), istenmiyorsa paddingType:'none' ve marginType:'none' yazın";
+        return rule('MOB-019', label(cause), `${String(cause.type)} içeriği (${ids}) kardeşlerinden ${where} başlıyor — margin ve padding'i içeriği iter. ${recipe}`);
+    });
+}
+/**
+ * MOB-020 — genişlik (S8/S9): (1) sola hizalı sütunda tam genişlik sınıfındaki öğelerin bir kısmı `fill`, bir
+ * kısmı değilse fill olmayanlar; (2) form alanı taşıyan satır kabı (yönü yazılmamış container/form satırdır).
+ */
+function widthFindings(root) {
+    const findings = [];
+    walkWithAncestors([root], node => {
+        const children = asNodes(node.children).filter(child => propData(child, 'isHidden') !== true);
+        if (!FLOW_TYPES[String(node.type ?? '')])
+            return;
+        if (flowDirection(node) === 'row') {
+            // Yazılmış `row` bilinçlidir (arama satırı: alan + düğme); yazılmamış yön unutulmuş sütundur.
+            if (node !== root && propData(node, 'direction') === undefined && children.some(child => FIELD_TYPES.includes(String(child.type ?? '')))) {
+                findings.push(rule('MOB-020', label(node), "yönü yazılmamış kap form alanı taşıyor — yazılmamış yön satırdır, alanlar yan yana sıkışır. direction:'column' ve horizontalAlign:'stretch' yazın"));
+            }
+            return;
+        }
+        if (propData(node, 'horizontalAlign') === 'stretch')
+            return;
+        const wide = children.filter(fullWidthClass);
+        if (!wide.some(fills))
+            return;
+        for (const child of wide.filter(child => !fills(child))) {
+            findings.push(rule('MOB-020', label(child), `kardeşleri tam genişlik (widthType: 'fill'), bu öğe değil: sağ kenarı hizadan kopar. widthType:'fill' yazın`));
+        }
+    });
+    return findings;
+}
+/**
+ * MOB-021 — ölçek (S5/S7/S11): özel boşluk ve sayısal gap ölçekte, yarıçap ölçek adıyla, yazı boyu seviyeyle.
+ * Gap jetonları (`small`/`medium`/`large`) zaten ölçektir ve sözleşmenin ritmi üçünü de kullanır; sayılmaz.
+ */
+function scaleFindings(root) {
+    const findings = [];
+    walkWithAncestors([root], node => {
+        const appearance = appearanceOf(node);
+        const offScale = ['margin', 'padding'].flatMap(layer => {
+            if (appearance[`${layer}Type`] !== 'custom')
+                return [];
+            const values = appearance[`${layer}Values`];
+            const sides = ['top', 'right', 'bottom', 'left'].map(side => values?.[side]);
+            // `resolveSpacing`: tek değer yalnız yazılmamış kenarın yedeğidir.
+            const written = [...sides, ...(sides.some(side => side === undefined || side === null) ? [appearance[`${layer}Value`]] : [])];
+            const numbers = written.filter(value => value !== undefined && value !== null && value !== '').map(value => Number(String(value).replace(/px$/, '')));
+            return [...new Set(numbers.filter(value => !SPACING_SCALE.includes(value)))].map(value => `${layer} ${value}`);
+        });
+        const radius = nested(node, 'surfaceStyle', 'radius');
+        const fontSize = nested(node, 'typographyStyle', 'fontSize');
+        const gap = propData(node, 'gap');
+        const notes = [
+            ...offScale,
+            ...(radius !== undefined && !RADIUS_SCALE.includes(radius) && !/^var\(--ng-radius-/.test(String(radius)) ? [`radius ${String(radius)} (sm | md | lg | pill)`] : []),
+            ...(typeof fontSize === 'number' || (typeof fontSize === 'string' && /^\d+(\.\d+)?(px)?$/.test(fontSize.trim())) ? [`fontSize ${String(fontSize)} (text seviyesi)`] : []),
+            ...(typeof gap === 'number' && !SPACING_SCALE.includes(gap) ? [`gap ${gap}`] : [])
+        ];
+        if (notes.length > 0)
+            findings.push({ ...rule('MOB-021', label(node), `ölçek dışı değer: ${notes.join(', ')} — boşluk 0/4/8/16/24/32, yarıçap ve yazı temadan gelir`), severity: 'info' });
+    });
+    return findings;
+}
+function fullWidthClass(node) {
+    const type = String(node.type ?? '');
+    if (FIELD_TYPES.includes(type))
+        return true;
+    if (!BUTTON_TYPES.includes(type))
+        return false;
+    return propData(node, 'size') !== 'icon' && !INLINE_BUTTON_VARIANTS.includes(String(propData(node, 'variant') ?? ''));
+}
+function fills(node) {
+    return appearanceOf(node).widthType === 'fill' || FULL_WIDTH_TYPES.includes(String(node.type ?? ''));
+}
+function flowDirection(node) {
+    if (node.type === 'scroll-view' && setOrBound(node, 'horizontal'))
+        return 'row';
+    const written = propData(node, 'direction');
+    return written === 'row' || written === 'column' ? written : FLOW_TYPES[String(node.type ?? '')] ?? 'column';
+}
+/** Görünür yüzey: zemin, kenarlık ya da gölge taşıyan kap (`surfaceStyle`, `SURFACE_KEYS`). */
+function isSurface(node) {
+    const style = propData(node, 'surfaceStyle');
+    if (!style || typeof style !== 'object')
+        return false;
+    return Object.entries(style).some(([key, value]) => /^(background|border|shadow)/.test(key) && unwrap(value) !== undefined && unwrap(value) !== null && unwrap(value) !== '');
+}
+function nested(node, group, key) {
+    const style = propData(node, group);
+    return style && typeof style === 'object' ? unwrap(style[key]) : undefined;
+}
+function unwrap(value) {
+    return value && typeof value === 'object' && 'data' in value ? value.data : value;
+}
+/**
+ * Yazımdan önce de var olan bulgular tekrar edilmez: yama yalnız getirdiğini söyler. Aynı düğümün aynı kuralı
+ * mesajı değişse de (ör. app-bar sayısı) yeni sayılmaz. Hedefsiz bulgu bir durum bilgisidir (kabuk okunamadı)
+ * ve her yazımda söylenir — yoksa denetim sessizce atlanırdı.
+ */
+export function newFindings(before, after) {
+    const known = new Set(before.map(key));
+    return after.filter(finding => finding.target === undefined || !known.has(key(finding)));
+}
+function key(finding) {
+    return `${finding.code}|${finding.target ?? ''}`;
+}
+function rule(code, target, message) {
+    return { code: MOBILE_RULES[code].id, severity: MOBILE_RULES[code].severity, target, message, guide: "platform_guide('mobile-layout')" };
+}
+function asNodes(value) {
+    return Array.isArray(value) ? value.filter((item) => !!item && typeof item === 'object') : [];
+}
+function label(node) {
+    return String(node?.elementId ?? node?.name ?? node?.type ?? '?');
+}
+function appearanceOf(node) {
+    return node.appearance && typeof node.appearance === 'object' ? node.appearance : {};
+}
+function propData(node, prop) {
+    const value = node.props?.[prop];
+    return value && typeof value === 'object' && 'data' in value ? value.data : value;
+}
+/** Prop açık mı — ifadeye bağlıysa değeri çalışma anında belli olur, açık sayılır (yanlış uyarı vermemek için). */
+function setOrBound(node, prop) {
+    const raw = node.props?.[prop];
+    if (raw && typeof raw === 'object' && (raw.type === 'code' || raw.type === 'translation'))
+        return true;
+    const value = propData(node, prop);
+    return value === true || value === 'true';
+}
+function boundVisibility(node) {
+    const hidden = node.props?.isHidden;
+    return !!hidden && typeof hidden === 'object' && (hidden.type === 'code' || hidden.type === 'translation');
+}
+function someNode(nodes, test) {
+    return nodes.some(node => test(node) || someNode(asNodes(node.children), test));
+}
+function collect(nodes, test, skipInside = []) {
+    return nodes.flatMap(node => [
+        ...(test(node) ? [node] : []),
+        ...(skipInside.includes(String(node.type ?? '')) ? [] : collect(asNodes(node.children), test, skipInside))
+    ]);
+}
+function walkWithAncestors(nodes, visit, ancestors = []) {
+    for (const node of nodes) {
+        visit(node, ancestors);
+        walkWithAncestors(asNodes(node.children), visit, [...ancestors, node]);
+    }
+}

package/dist/knowledge/platform/mobileRules.js

@@ -0,0 +1,231 @@
+import { MOBILE_COMPONENT_NOTES, mobileComponentKnowledge } from '../mobileComponentCatalog.js';
+import { STYLE_GROUP_FIELDS } from '../styleResolve.js';
+export const MOBILE_RULES = {
+    'MOB-001': {
+        id: 'MOB-001',
+        severity: 'warn',
+        sourceRef: 'zeyrek-frontend/packages/ng-apps-ui-native/src/renderer (NativeRenderer blocks okumaz; sıra dizi indeksinden)',
+        summary: 'Mobil sayfada blok (12 sütun ızgara) ya da grid/cssgrid yerleşimi — çizer yok sayar'
+    },
+    'MOB-002': {
+        id: 'MOB-002',
+        severity: 'warn',
+        sourceRef: 'zeyrek-frontend/packages/ng-apps-ui-native/src/style/compose-native-style.ts (yalnız tipli gruplar derlenir)',
+        summary: "Mobil sayfada CSS-only alan (className, tooltip, zIndex, serbest style, hoverStyle, em/rem/calc ölçü, surfaceStyle'ın tanımadığı alt anahtar)"
+    },
+    'MOB-003': {
+        id: 'MOB-003',
+        severity: 'warn',
+        sourceRef: 'zeyrek-backend PageSchemaValidator unknown-type (mobil uygulama mobil kataloğa karşı doğrulanır)',
+        summary: 'Mobil katalogda olmayan bileşen tipi — backend 422 unknown-type ile reddeder'
+    },
+    'MOB-004': {
+        id: 'MOB-004',
+        severity: 'warn',
+        sourceRef: 'plans/mobil-uygulama-expo/05-mobil-ayarlar-ve-gezinme.md §2 (D14)',
+        summary: "Mobil layout/sayfada web kabuğu (navigations, sidebar, header) — app-bar, sekmeler ayarı ve drawer widget'ı var"
+    },
+    'MOB-005': {
+        id: 'MOB-005',
+        severity: 'info',
+        sourceRef: 'zeyrek-frontend/packages/ng-apps-ui-native/src/runtime/runtime-tasks.ts',
+        summary: "Mobil uygulamada download paylaşım/açma sayfası açar; setcookie storage'a eşlenir"
+    },
+    'MOB-006': {
+        id: 'MOB-006',
+        severity: 'warn',
+        sourceRef: 'zeyrek-backend/docs/harici-componentler (protokol v1 tarayıcı .mjs; mobil v2 Faz 3); plans/mobil-plantcare-acigi f-20 K7',
+        summary: "Harici bileşen mobil uygulamada desteklenmiyor — çağrı platforma gitmez; geçici yol 'html' bileşeni"
+    },
+    'MOB-007': {
+        id: 'MOB-007',
+        severity: 'warn',
+        sourceRef: 'plans/mobil-uygulama-expo/05-mobil-ayarlar-ve-gezinme.md §2.2, §2.6 (K13)',
+        summary: "Sekme ayarı tutarsız ya da layout/sayfada eski tab-bar/drawer-menu düğümü"
+    },
+    'MOB-008': {
+        id: 'MOB-008',
+        severity: 'warn',
+        sourceRef: 'zeyrek-frontend/apps/mobile-runtime/src/navigation/navigation.ts (hrefFor); zeyrek-backend FlowDtoValidator',
+        summary: "redirect.presentation kümede değil — push | modal | replace dışı değer backend'de 422, çizer push'a düşer"
+    },
+    'MOB-011': {
+        id: 'MOB-011',
+        severity: 'warn',
+        sourceRef: 'zeyrek-backend FilePathMapper.MapFileProperties (okunan FILE alanı { type: ref, value: <dosya id>, absolute_path }); zeyrek-frontend ng-apps-ui-native image-logic.ts resolveImageSource (plans/mobil-kosu-acik-yuksekler f-01)',
+        summary: "Görsel kaynağı ifadesi '.value' ile bitiyor — kayıttan okunan FILE alanında bu dosya kimliğidir (GUID), görsel çizilmez"
+    },
+    'MOB-012': {
+        id: 'MOB-012',
+        severity: 'info',
+        sourceRef: 'zeyrek-frontend/packages/ng-apps-ui-native/src/components/image/image-logic.ts (imageFrameStyle)',
+        summary: "Mobil görselin boyu ne kabuktan (fixed + ölçü, fill) ne orandan (aspectRatio + heightType auto + belli genişlik) geliyor — 96 dp taban boyla çizilir"
+    },
+    'MOB-013': {
+        id: 'MOB-013',
+        severity: 'info',
+        sourceRef: 'zeyrek-frontend/packages/ng-apps-ui-native/src/components/button/index.tsx (accessibleLabel: ariaLabel → text → ikon adı)',
+        summary: "İkon boyunda (size: icon) düğmenin adı yok — ne ariaLabel ne text; ekran okuyucu ikonun ligatür adını (notifications) okur"
+    },
+    'MOB-014': {
+        id: 'MOB-014',
+        severity: 'warn',
+        sourceRef: 'docs/adr/0004-state-saklama-turu.md; zeyrek-frontend/packages/ng-apps-flow/src/machine/state-persistence.ts (depoyu barındırıcı verir; web Runtime.svelte vermez)',
+        summary: "State saklama türü (storage: device | secure) uygulamanın platformunda uygulanmıyor — kayda yazılır, state bellekte çalışır"
+    },
+    'MOB-015': {
+        id: 'MOB-015',
+        severity: 'warn',
+        sourceRef: 'zeyrek-mcp guides/mobile-layout.md §Sözleşme S1; zeyrek-frontend/apps/studio/src/features/mobile/mobile-native-canvas.functions.ts (topSafeAreaMissing); apps/mobile-runtime PageScreen.tsx (host payı uygulamaz, plan D15)',
+        summary: 'Üst güvenli alan tek yerde değil: kabuksuz sayfada/kabukta eksik ya da kabuk verirken sayfada ikinci pay'
+    },
+    'MOB-016': {
+        id: 'MOB-016',
+        severity: 'warn',
+        sourceRef: 'zeyrek-mcp guides/mobile-layout.md §Sözleşme S3; zeyrek-frontend/apps/mobile-runtime/src/runtime/PageScreen.tsx (sayfa her zaman ScrollView içinde)',
+        summary: "Kaydırma tek yerde değil: kök `size: grow`, gerekçesiz ya da iç içe dikey scroll-view"
+    },
+    'MOB-017': {
+        id: 'MOB-017',
+        severity: 'warn',
+        sourceRef: 'zeyrek-mcp guides/mobile-layout.md §Sözleşme S12',
+        summary: 'Ekranda tek app-bar yok: kabuk verirken sayfada ikinci app-bar ya da app-bar ilk çizilen öğe değil'
+    },
+    'MOB-018': {
+        id: 'MOB-018',
+        severity: 'info',
+        sourceRef: 'zeyrek-mcp guides/mobile-layout.md §Sözleşme S13',
+        summary: 'Boş kap: çocuksuz, görünürlüğe bağlı olmayan bırakılabilir kap ekranda boş şerit bırakır'
+    },
+    'MOB-019': {
+        id: 'MOB-019',
+        severity: 'warn',
+        sourceRef: 'zeyrek-mcp guides/mobile-layout.md §Sözleşme S6/S8; zeyrek-frontend ng-apps-screen-builder spacing.ts + ng-apps-ui-native renderer.functions.ts nodeSpacingStyle (ayna: nativeBoxModel.ts)',
+        summary: 'Kenar kayması: sütun akışındaki öğe kardeşlerinden içeride/dışarıda başlıyor (zeminsiz kap ya da sarmalayıcı içeriği iter)'
+    },
+    'MOB-020': {
+        id: 'MOB-020',
+        severity: 'warn',
+        sourceRef: 'zeyrek-mcp guides/mobile-layout.md §Sözleşme S8/S9; renderer.functions.ts containerDirection (yazılmamış yön satır)',
+        summary: "Genişlik tutarsızlığı: sütunda fill olmayan tam genişlik öğesi ya da form alanı taşıyan satır kabı"
+    },
+    'MOB-021': {
+        id: 'MOB-021',
+        severity: 'info',
+        sourceRef: 'zeyrek-mcp guides/mobile-layout.md §Sözleşme S5/S7/S11',
+        summary: 'Ölçek dışı değer: özel boşluk ya da sayısal gap 0/4/8/16/24/32 dışında, ham yarıçap, px yazı boyu'
+    }
+};
+/**
+ * MOB-011: dosya nesnesini görsel olarak çizen prop'lar (mobil `resolveImageSource` tüketicileri).
+ * Hedefin tipi bilinmiyorsa (var olan düğüme `set_binding`) prop adı yeter — `IMAGE_SOURCE_PROP_NAMES`.
+ */
+export const IMAGE_SOURCE_PROPS = {
+    image: ['src'],
+    avatar: ['src'],
+    'list-item': ['leadingImage'],
+    card: ['image']
+};
+export const IMAGE_SOURCE_PROP_NAMES = new Set(Object.values(IMAGE_SOURCE_PROPS).flat());
+const TEMPLATE = /\{\{([\s\S]*?)\}\}/g;
+const MEMBER_PATH = /^[A-Za-z_$][\w$]*(?:\??\.[A-Za-z_$][\w$]*|\[\s*(?:\d+|'[^']*'|"[^"]*")\s*\])+$/;
+/**
+ * MOB-011'in desen denetimi. Gateway sayfa şemasından bir alanın FILE olduğunu BİLEMEZ (alan tipi
+ * entity'de, ifade yalnız bir yol) — bu yüzden kural metinseldir ve uyarı düzeyindedir: en az üç
+ * parçalı bir üye yolu (`item.foto.value`, `pages.x.params.kayit.foto.value`) `.value` ile bitiyorsa
+ * ilk eşleşen `{{ }}` şablonunu döner. İki parçalı yol (`urlInput.value` — bileşenin kendi değeri) ve
+ * `.value.value` (dosya alanının base64'ü: `fileInput1.value.value`) eşleşmez.
+ */
+export function fileIdImageExpression(template) {
+    for (const match of template.matchAll(TEMPLATE)) {
+        const body = (match[1] ?? '').trim();
+        if (!MEMBER_PATH.test(body))
+            continue;
+        const segments = body.match(/[A-Za-z_$][\w$]*|\[[^\]]*\]/g) ?? [];
+        if (segments.length >= 3 && segments[segments.length - 1] === 'value' && segments[segments.length - 2] !== 'value')
+            return match[0];
+    }
+    return undefined;
+}
+/** `redirect` adımının tanıdığı sunum biçimleri (b-01 `StepArgument.Presentation`). */
+export const REDIRECT_PRESENTATIONS = new Set(['push', 'modal', 'replace']);
+/**
+ * Bileşen dalgaları (`plans/mobil-uygulama-expo/01-mimari-tasarim.md` §11). MOB-003 bir web bileşeninin
+ * mobilde NE ZAMAN geleceğini söyler; `web-only` hiç gelmeyecekler ve karşılıkları.
+ *
+ * Mobil pakete giren bileşen Dalga 2/3 listesinden DÜŞER: yayında olduğunu mobil sözlükteki kaydı
+ * söyler (`mobileComponentKnowledge`, parite testiyle `components.json`'a kilitli). Katalog A
+ * (2026-09-24) sekiz web ikizini buradan indirdi: `radio`, `checkboxgroup`, `slider`, `tabs`, `badge`,
+ * `avatar`, `progress`, `collapsible-container`; Katalog C (09) Dalga 3'ten `video`, `signature`, `chart`,
+ * `fileInput` ve `filebutton`ı, Dalga 2'den `datepicker` ve `timepicker`ı (`fileUpload`un sürükle-bırak alanı
+ * dokunmatikte yok: web'e özgü, karşılığı iki dosya alanı); dil dalgası (plans/mobil-coklu-dil F1, 2026-09-25)
+ * Dalga 2'den `language-selector`ı; faz 10b (2026-09-27) Dalga 3'ten `datatable`ı; plans/mobil-plantcare-acigi f-11
+ * (2026-09-27) listede olmayan `daterangepicker`i doğrudan pakete aldı; f-20 (2026-09-28) Dalga 3'ten `html`ı (mobilde
+ * geçici çözüm kapısı, K7); f-12 (2026-09-28) listede olmayan `eventcalendar`ı (web ikizi, ay/hafta/gün); f-14 (2026-09-28)
+ * Dalga 3'ten `timeline`ı ve listede olmayan `dropdown-button`ı (web ikizleri) ile mobile özgü `skeleton` ve `photo-viewer`ı. Dalga 1
+ * listesi artık yalnız `mobileNotes`'un bilgi satırıdır — MOB-003'te yayındaki bileşeni sözlük tanır
+ * (`box-section` Dalga 1'de ama pakette yok).
+ */
+export const MOBILE_COMPONENT_WAVES = Object.fromEntries([
+    ...['container', 'box-section', 'form', 'slot', 'text', 'icon', 'image', 'divider', 'spacer', 'button', 'textinput', 'textarea', 'numberinput', 'password', 'checkbox', 'switch', 'dropdown', 'repeater', 'card', 'emptystate', 'form-validation-errors', 'modal', 'drawer', 'app-bar'].map(slug => [slug, 1]),
+    ...['box', 'phoneinput', 'statcard', 'detailview', 'page-header', 'autocomplete'].map(slug => [slug, 2]),
+    ...['kanban', 'texteditor', 'stepper', 'tree-view'].map(slug => [slug, 3])
+]);
+export const MOBILE_WEB_ONLY = {
+    iframe: "'webview' (src ya da html; bağlantılar varsayılan olarak sistem tarayıcısında açılır)",
+    sidebar: "'drawer' widget'ı + app-bar.menuTarget",
+    navigations: 'Ayarlar › Sekmeler (application_update properties.mobile.tabs)',
+    header: "'app-bar'",
+    'layout-shell': "tek slot'lu sıradan layout + 'app-bar'",
+    'layout-region': "tek slot'lu sıradan layout",
+    'auth-layout': "tek slot'lu sıradan layout",
+    popover: "'modal' widget'ı",
+    'theme-toggle': "uygulama içi tema ayarı: 'choice-chips' (variant: segmented, Sistem/Açık/Koyu) → storage adımı name: 'zeyrek:theme-mode', value: system | light | dark; barındırıcı temayı anında değiştirir, cihazda kalıcı (seçim yazılmadıysa cihaz teması)",
+    pagination: "'repeater' + daha fazla yükle düğmesi",
+    breadcrumb: "yığın gezinmesi (app-bar geri düğmesi)",
+    fileUpload: "'fileInput' (alan) ya da 'filebutton' (düğme) — dokunmatikte sürükle-bırak yok; ikisi de aynı base64 değeri yazar"
+};
+const STYLE_REPLACEMENTS = {
+    className: "yerine surfaceStyle (zemin, kenar, köşe, gölge) ve typographyStyle tipli gruplarını kullanın",
+    tooltip: "dokunmatikte üzerine gelme yok — düğümü 'tooltip' bileşenine sarın (dokunuşla açılır) ya da açıklamayı metin olarak koyun",
+    tooltipPosition: "dokunmatikte üzerine gelme yok — 'tooltip' bileşeninde balonun yanı `side` prop'udur",
+    zIndex: "görselin üstüne rozet/hap/etiket/açıklama bindirmek için 'stack' (ilk çocuk taban, ötekiler üst katman; katman olarak fill×fill bir container koyup kendi hizasıyla köşeye yerleştirin), ekrana sabit içerik (FAB, alt eylem çubuğu, üst şerit) için 'floating-container' (anchor 9 nokta, offsetX/offsetY, fullWidth), kaydırırken üstte kalan başlık için scroll-view çocuğunda states.isSticky, sayfayı örten katman için 'modal' ya da 'drawer' widget'ı",
+    style: "serbest CSS nesnesi React Native'de çizilmez — surfaceStyle ve typographyStyle tipli gruplarına taşıyın; position/zIndex ile ekrana sabitlemek yerine 'floating-container' kullanın",
+    hoverStyle: 'dokunmatikte üzerine gelme durumu yok'
+};
+export function styleReplacement(key) {
+    if (key.startsWith('surfaceStyle.')) {
+        const fields = (STYLE_GROUP_FIELDS.surfaceStyle ?? []).map(field => `\`${field}\``).join(', ');
+        return `yüzey grubunun alanları ${fields} (döndürme derece, ölçek yüzde — 100 aynı boy, kaydırma px)`;
+    }
+    return STYLE_REPLACEMENTS[key] ?? 'mobil çizer bu alanı okumaz';
+}
+export function missingComponentAdvice(slug) {
+    // Yayındaki bileşen: katalog senkronu bu uygulamaya henüz yazmamış olabilir — "gelecek" demek yanlış olur.
+    if (Object.hasOwn(mobileComponentKnowledge, slug))
+        return `'${slug}' mobil pakette var ama bu uygulamanın kataloğunda henüz yok — components-sync mobil kataloğu yazdı mı (component_list)? Yazmadıysa backend 422 unknown-type döner`;
+    const wave = Object.hasOwn(MOBILE_COMPONENT_WAVES, slug) ? MOBILE_COMPONENT_WAVES[slug] : undefined;
+    if (wave === 2)
+        return `'${slug}' web'de var, mobilde Dalga 2 (F6 sonrası) — şimdilik Dalga 1 bileşenleriyle kurun (component_list)`;
+    if (wave === 3)
+        return `'${slug}' web'de var, mobilde Faz 3 (ayrı iş) — bu planda mobil karşılığı yok`;
+    const alternative = Object.hasOwn(MOBILE_WEB_ONLY, slug) ? MOBILE_WEB_ONLY[slug] : undefined;
+    if (alternative)
+        return `'${slug}' web'e özgüdür, mobilde gelmeyecek — ${alternative}`;
+    return `'${slug}' mobil katalogda yok — component_list ile mobil uygulamanın bileşenlerini görün`;
+}
+/**
+ * `component_get` mobil uygulamada (G4): kayıt mobil kataloğun satırıdır, davranış notları web
+ * runtime'ından (`knowledge`), bileşene özgü farklar mobil sözlükten (`mobileKnowledge`) gelir; bu
+ * liste BÜTÜN mobil bileşenlere geçen notlardır — kural kodlu üç not + `MOBILE_COMPONENT_NOTES`.
+ */
+export function mobileComponentNotes(slug) {
+    const wave = slug === undefined ? undefined : MOBILE_COMPONENT_WAVES[slug];
+    return [
+        "Yerleşim yalnız flex: `layout` prop'u mobil şemalarda yoktur (grid/cssgrid yok), blocks/size yok sayılır, sıra dizi indeksidir; ölçü appearance ile verilir (widthType/heightType — MOB-001).",
+        "Görünüm tipli gruplarla: surfaceStyle ve typographyStyle React Native stiline derlenir; ham CSS `style` prop'u `html` dışında hiçbir mobil şemada yoktur (`html`'in metin `style`'ı kendi belgesine kapsamlı girer), className, `tooltip` alanı (ipucu için `tooltip` bileşeni), zIndex ve hoverStyle çizilmez (MOB-002). Karşılığı olmayan değer sessizce düşmez, uyarıya yazılır; düğümün gerçek stili: page_runtime_get(resolveStyles) → nativeStyle.",
+        "Basılabilir bileşen role=\"button\" taşır; page_screenshot click onu kabuğun içinde bulur.",
+        ...MOBILE_COMPONENT_NOTES,
+        ...(wave === undefined ? [] : [`Mobil bileşen dalgası: ${wave} (plans/mobil-uygulama-expo §11).`])
+    ];
+}

package/dist/knowledge/platform/mobileSpacing.js

@@ -0,0 +1,82 @@
+import { MOBILE_TRANSPARENT_WRAPPER_TYPES } from '../mobileComponentCatalog.js';
+import { PAGE_CONTAINER_ELEMENT_ID } from '../normalize.js';
+/**
+ * Boşluğunu runtime'ın kendisi çözen tipler: kabuk parçaları ve katmanlar margin'siz çizilir
+ * (`ng-apps-ui-native` `FLUSH_SPACING_TYPES`, `@ng-apps/screen-builder` `HIDE_SPACING_TYPES`). `tooltip`
+ * f-01'den beri runtime'da da muaf, ama burada bilerek yok: mobil runtime uygulamaya gömülüdür ve f-01'den
+ * önce derlenmiş uygulamada açık `none` hizayı yine korur.
+ */
+const RUNTIME_FLUSH_TYPES = ['safe-area', 'scroll-view', 'app-bar', 'auth-layout', 'modal', 'drawer'];
+export const emptyMobileSpacingFix = () => ({ margin: [], wrappers: [], legacyParents: [] });
+/**
+ * Mizanpaj sözleşmesi S5/S6 (plans/mobil-mizanpaj-dili 02, K3-b): mobilde kardeşler arası boşluk yalnız
+ * ebeveynin `gap`'inden gelir. Runtime margin tipi yazılmamış düğüme 4 dp verir ve bu her iç içe katmanda
+ * birikir; yeni düğüme `marginType: 'none'` yazılır. Kardeşleri varsayılan margin'le duran (eski) bir
+ * kaba eklenen düğüme dokunulmaz — yeni düğüm eskilerden 4 dp kayardı. Saydam sarmalayıcı (`tooltip`)
+ * içeriğini içeri itmesin diye padding'siz ve tam genişlik yazılır. Açıkça yazılmış değer korunur.
+ */
+export function applyMobileSpacingDefaults(nodes, existingSiblings, fix, parentId = '') {
+    const list = asNodes(nodes);
+    // Boşluğunu runtime'ın çözdüğü kardeş (kabuksuz sayfanın `safe_area_top`'u gibi) hizaya karar vermez.
+    const followsNone = existingSiblings
+        .filter(sibling => !RUNTIME_FLUSH_TYPES.includes(String(sibling.type ?? '')))
+        .every(sibling => appearanceOf(sibling).marginType === 'none');
+    if (!followsNone && list.length > 0 && !fix.legacyParents.includes(parentId))
+        fix.legacyParents.push(parentId);
+    for (const node of list) {
+        const type = String(node.type ?? '');
+        const appearance = appearanceOf(node);
+        const id = String(node.elementId ?? type);
+        if (followsNone && !RUNTIME_FLUSH_TYPES.includes(type) && appearance.marginType === undefined) {
+            node.appearance = { ...appearance, marginType: 'none' };
+            fix.margin.push(id);
+        }
+        if (MOBILE_TRANSPARENT_WRAPPER_TYPES.includes(type) && (appearance.paddingType === undefined || appearance.widthType === undefined)) {
+            node.appearance = {
+                ...appearanceOf(node),
+                ...(appearance.paddingType === undefined ? { paddingType: 'none' } : {}),
+                ...(appearance.widthType === undefined ? { widthType: 'fill' } : {})
+            };
+            fix.wrappers.push(id);
+        }
+        applyMobileSpacingDefaults(node.children, [], fix, id);
+    }
+}
+/** `add_component` op'larının (batch içindekiler dâhil) yeni düğümlerine aynı kural; kardeşler kayıtlı ağaçtan. */
+export function applyMobileSpacingToOps(ops, savedSchema, fix) {
+    for (const op of ops) {
+        if (op.op === 'batch')
+            applyMobileSpacingToOps(asNodes(op.ops), savedSchema, fix);
+        if (op.op !== 'add_component' || !op.component || typeof op.component !== 'object')
+            continue;
+        const saved = asNodes(savedSchema);
+        const requested = typeof op.parent === 'string' ? op.parent : 'root';
+        // Kök ekleme sayfada `page_container`'a gider (yazımda `retargetRootAdds`, kuru koşuda platform).
+        const parentId = requested === 'root' && findNode(saved, PAGE_CONTAINER_ELEMENT_ID) ? PAGE_CONTAINER_ELEMENT_ID : requested;
+        const siblings = parentId === 'root' ? saved : asNodes(findNode(saved, parentId)?.children);
+        applyMobileSpacingDefaults([op.component], siblings, fix, parentId);
+    }
+}
+export function mobileSpacingNote(fix) {
+    return [
+        ...(fix.margin.length > 0 ? [`mobil: margin tipi yazılmamış ${fix.margin.length} düğüme marginType:'none' yazıldı (${fix.margin.slice(0, 8).join(', ')}${fix.margin.length > 8 ? ', …' : ''}) — kardeşler arası boşluk yalnız ebeveynin gap'inden gelir; runtime'ın varsayılan 4 dp margin'i iç içe katmanlarda birikir (mizanpaj sözleşmesi S5). Bilerek boşluk istediğin düğüme marginType yaz`] : []),
+        ...(fix.wrappers.length > 0 ? [`mobil: saydam sarmalayıcıya (${fix.wrappers.join(', ')}) paddingType:'none' ve widthType:'fill' yazıldı — padding'i içeriğini kardeşlerinden içeri iterdi (S6)`] : []),
+        ...(fix.legacyParents.length > 0 ? [`mobil: kardeşleri varsayılan margin'le duran kapta (${fix.legacyParents.join(', ')}) yeni düğümün margin'ine dokunulmadı — eskilerle aynı hizada kalsın diye. Kabı sözleşmeye taşımak için bütün çocuklarına marginType:'none' yazın`] : [])
+    ];
+}
+function asNodes(value) {
+    return Array.isArray(value) ? value.filter((item) => !!item && typeof item === 'object') : [];
+}
+function appearanceOf(node) {
+    return node.appearance && typeof node.appearance === 'object' ? node.appearance : {};
+}
+function findNode(nodes, elementId) {
+    for (const node of nodes) {
+        if (node.elementId === elementId)
+            return node;
+        const found = findNode(asNodes(node.children), elementId);
+        if (found)
+            return found;
+    }
+    return undefined;
+}