[{"data":1,"prerenderedAt":3575},["ShallowReactive",2],{"navigation_docs":3,"-apps-app-development-guides-schema-components-vs-ui-components":1765,"-apps-app-development-guides-schema-components-vs-ui-components-surround":3570},[4,136,446,617,1450,1522,1528,1534,1593,1692],{"title":5,"path":6,"stem":7,"children":8},"Getting Started","/getting-started","0.getting-started/0.index",[9,10,14,18,56,81,115,132],{"title":5,"path":6,"stem":7},{"title":11,"path":12,"stem":13},"Starting new project","/getting-started/starting-new-project","0.getting-started/1.starting-new-project",{"title":15,"path":16,"stem":17},"What is Laioutr?","/getting-started/what-is-laioutr","0.getting-started/2.what-is-laioutr",{"title":19,"path":20,"stem":21,"children":22,"page":55},"Key Concepts","/getting-started/key-concepts","0.getting-started/3.key-concepts",[23,27,31,35,39,43,47,51],{"title":24,"path":25,"stem":26},"Architecture","/getting-started/key-concepts/architecture","0.getting-started/3.key-concepts/1.architecture",{"title":28,"path":29,"stem":30},"Data Model","/getting-started/key-concepts/data-model","0.getting-started/3.key-concepts/2.data-model",{"title":32,"path":33,"stem":34},"Internationalization","/getting-started/key-concepts/5.internationalization","0.getting-started/3.key-concepts/3.5.internationalization",{"title":36,"path":37,"stem":38},"Data Flow","/getting-started/key-concepts/data-flow","0.getting-started/3.key-concepts/3.data-flow",{"title":40,"path":41,"stem":42},"Extensibility","/getting-started/key-concepts/extensibility","0.getting-started/3.key-concepts/4.extensibility",{"title":44,"path":45,"stem":46},"Philosophy","/getting-started/key-concepts/philosophy","0.getting-started/3.key-concepts/5.philosophy",{"title":48,"path":49,"stem":50},"CI/CD Pipeline","/getting-started/key-concepts/ci-cd-pipeline","0.getting-started/3.key-concepts/6.ci-cd-pipeline",{"title":52,"path":53,"stem":54},"Multi-tenancy","/getting-started/key-concepts/multi-tenancy","0.getting-started/3.key-concepts/multi-tenancy",false,{"title":57,"path":58,"stem":59,"children":60,"page":55},"Next Steps","/getting-started/next-steps","0.getting-started/4.next-steps",[61,65,69,73,77],{"title":62,"path":63,"stem":64},"Create Organization and Project","/getting-started/next-steps/create-org-and-project","0.getting-started/4.next-steps/0.create-org-and-project",{"title":66,"path":67,"stem":68},"First Project Configuration","/getting-started/next-steps/first-project-config","0.getting-started/4.next-steps/1.first-project-config",{"title":70,"path":71,"stem":72},"Setup Local Development Environment","/getting-started/next-steps/local-setup","0.getting-started/4.next-steps/3.local-setup",{"title":74,"path":75,"stem":76},"Create your first custom app","/getting-started/next-steps/create-custom-app","0.getting-started/4.next-steps/4.create-custom-app",{"title":78,"path":79,"stem":80},"CLI","/getting-started/next-steps/cli","0.getting-started/4.next-steps/5.cli",{"title":82,"path":83,"stem":84,"children":85},"Changelogs","/getting-started/changelogs","0.getting-started/5.Changelogs/0.index",[86,87,91,95,99,103,107,111],{"title":82,"path":83,"stem":84},{"title":88,"path":89,"stem":90},"CLI Changelog","/getting-started/changelogs/cli-changelog","0.getting-started/5.Changelogs/cli-changelog",{"title":92,"path":93,"stem":94},"Cockpit Changelog","/getting-started/changelogs/cockpit-changelog","0.getting-started/5.Changelogs/cockpit-changelog",{"title":96,"path":97,"stem":98},"Figma Kit Changelog","/getting-started/changelogs/figma-kit-changelog","0.getting-started/5.Changelogs/figma-kit-changelog",{"title":100,"path":101,"stem":102},"Frontend Changelog","/getting-started/changelogs/frontend-changelog","0.getting-started/5.Changelogs/frontend-changelog",{"title":104,"path":105,"stem":106},"Orchestr Changelog","/getting-started/changelogs/orchestr-changelog","0.getting-started/5.Changelogs/orchestr-changelog",{"title":108,"path":109,"stem":110},"Orchestr Devtools Changelog","/getting-started/changelogs/orchestr-devtools-changelog","0.getting-started/5.Changelogs/orchestr-devtools-changelog",{"title":112,"path":113,"stem":114},"UI Changelog","/getting-started/changelogs/ui-changelog","0.getting-started/5.Changelogs/ui-changelog",{"title":116,"path":117,"stem":118,"children":119,"page":55},"Hints And Tips","/getting-started/hints-and-tips","0.getting-started/6.Hints-and-Tips",[120,124,128],{"title":121,"path":122,"stem":123},"Introduction","/getting-started/hints-and-tips/introduction","0.getting-started/6.Hints-and-Tips/0.introduction",{"title":125,"path":126,"stem":127},"Developer tools","/getting-started/hints-and-tips/developer-tools","0.getting-started/6.Hints-and-Tips/1.developer-tools",{"title":129,"path":130,"stem":131},"Claude Code plugin","/getting-started/hints-and-tips/claude-marketplace","0.getting-started/6.Hints-and-Tips/2.claude-marketplace",{"title":133,"path":134,"stem":135},"MCP Server","/getting-started/mcp-server","0.getting-started/7.mcp-server",{"title":137,"path":138,"stem":139,"children":140},"Frontend","/frontend","1.Frontend/0.index",[141,142,153,215,241,305],{"title":137,"path":138,"stem":139},{"title":121,"path":143,"stem":144,"children":145,"page":55},"/frontend/introduction","1.Frontend/1.Introduction",[146,149],{"title":19,"path":147,"stem":148},"/frontend/introduction/key-concepts","1.Frontend/1.Introduction/0.key-concepts",{"title":150,"path":151,"stem":152},"Tech Stack","/frontend/introduction/tech-stack","1.Frontend/1.Introduction/1.tech-stack",{"title":154,"path":155,"stem":156,"children":157},"Features","/frontend/features","1.Frontend/2.Features/0.index",[158,159,163,167,171,175,179,183,187,191,195,199,203,207,211],{"title":154,"path":155,"stem":156},{"title":160,"path":161,"stem":162},"Consent Management","/frontend/features/consent-management","1.Frontend/2.Features/consent-management",{"title":164,"path":165,"stem":166},"Currencies","/frontend/features/currencies","1.Frontend/2.Features/currencies",{"title":168,"path":169,"stem":170},"Environments & Staging","/frontend/features/environments","1.Frontend/2.Features/environments",{"title":172,"path":173,"stem":174},"Hooks","/frontend/features/hooks","1.Frontend/2.Features/hooks",{"title":176,"path":177,"stem":178},"Media and Media Library","/frontend/features/media","1.Frontend/2.Features/media",{"title":180,"path":181,"stem":182},"Multi-language Support","/frontend/features/multi-language-support","1.Frontend/2.Features/multi-language-support",{"title":184,"path":185,"stem":186},"Multi-market","/frontend/features/multi-market","1.Frontend/2.Features/multi-market",{"title":188,"path":189,"stem":190},"Page Types","/frontend/features/pagetypes","1.Frontend/2.Features/pagetypes",{"title":192,"path":193,"stem":194},"PWA","/frontend/features/pwa","1.Frontend/2.Features/pwa",{"title":196,"path":197,"stem":198},"Redirects","/frontend/features/redirects","1.Frontend/2.Features/redirects",{"title":200,"path":201,"stem":202},"Routing","/frontend/features/routing","1.Frontend/2.Features/routing",{"title":204,"path":205,"stem":206},"Server-Side Rendering (SSR) and Caching","/frontend/features/ssr-and-caching","1.Frontend/2.Features/ssr-and-caching",{"title":208,"path":209,"stem":210},"Tracking","/frontend/features/tracking","1.Frontend/2.Features/tracking",{"title":212,"path":213,"stem":214},"Z-Ordering","/frontend/features/z-ordering","1.Frontend/2.Features/z-ordering",{"title":216,"path":217,"stem":218,"children":219},"SEO","/frontend/seo","1.Frontend/3.SEO/0.index",[220,221,225,229,233,237],{"title":216,"path":217,"stem":218},{"title":222,"path":223,"stem":224},"Link Checker","/frontend/seo/link-checker","1.Frontend/3.SEO/link-checker",{"title":226,"path":227,"stem":228},"OG Image","/frontend/seo/og-image","1.Frontend/3.SEO/og-image",{"title":230,"path":231,"stem":232},"Robots.txt","/frontend/seo/robots-txt","1.Frontend/3.SEO/robots-txt",{"title":234,"path":235,"stem":236},"Schema.org","/frontend/seo/schema-org","1.Frontend/3.SEO/schema-org",{"title":238,"path":239,"stem":240},"Sitemap","/frontend/seo/sitemap","1.Frontend/3.SEO/sitemap",{"title":242,"path":243,"stem":244,"children":245},"Backend for Frontend","/frontend/orchestr","1.Frontend/4.Orchestr/0.index",[246,247,273,277,281,285,289,293,297,301],{"title":242,"path":243,"stem":244},{"title":248,"path":249,"stem":250,"children":251},"Recipes","/frontend/orchestr/recipes","1.Frontend/4.Orchestr/99.recipes/0.index",[252,253,257,261,265,269],{"title":248,"path":249,"stem":250},{"title":254,"path":255,"stem":256},"Analytics components from query handlers","/frontend/orchestr/recipes/analytics-from-query-handlers","1.Frontend/4.Orchestr/99.recipes/analytics-from-query-handlers",{"title":258,"path":259,"stem":260},"Identity cookies (cart and visitor IDs)","/frontend/orchestr/recipes/identity-cookies","1.Frontend/4.Orchestr/99.recipes/identity-cookies",{"title":262,"path":263,"stem":264},"System bootstrap in extendRequest","/frontend/orchestr/recipes/system-bootstrap","1.Frontend/4.Orchestr/99.recipes/system-bootstrap",{"title":266,"path":267,"stem":268},"Translating vendor errors","/frontend/orchestr/recipes/translating-vendor-errors","1.Frontend/4.Orchestr/99.recipes/translating-vendor-errors",{"title":270,"path":271,"stem":272},"Userland cache patterns","/frontend/orchestr/recipes/userland-cache-patterns","1.Frontend/4.Orchestr/99.recipes/userland-cache-patterns",{"title":274,"path":275,"stem":276},"Actions","/frontend/orchestr/actions","1.Frontend/4.Orchestr/Actions",{"title":278,"path":279,"stem":280},"Caching","/frontend/orchestr/caching","1.Frontend/4.Orchestr/Caching",{"title":282,"path":283,"stem":284},"Middleware","/frontend/orchestr/middleware","1.Frontend/4.Orchestr/Middleware",{"title":286,"path":287,"stem":288},"Queries & Links","/frontend/orchestr/queries","1.Frontend/4.Orchestr/Queries",{"title":290,"path":291,"stem":292},"Component Resolvers","/frontend/orchestr/component-resolvers","1.Frontend/4.Orchestr/component-resolvers",{"title":294,"path":295,"stem":296},"Filters","/frontend/orchestr/filters","1.Frontend/4.Orchestr/filters",{"title":298,"path":299,"stem":300},"URL Query Parameters","/frontend/orchestr/url-query-params","1.Frontend/4.Orchestr/url-query-params",{"title":302,"path":303,"stem":304},"Orchestr Wire Format","/frontend/orchestr/wire-format","1.Frontend/4.Orchestr/wire-format",{"title":306,"path":307,"stem":308,"children":309},"API Reference","/frontend/api-reference","1.Frontend/99.api-reference/0.index",[310,311,368,371,396,412,420,431,439],{"title":306,"path":307,"stem":308},{"title":312,"path":313,"stem":314,"children":315,"page":55},"Entities","/frontend/api-reference/entities","1.Frontend/99.api-reference/01.entities",[316,320,324,328,332,336,340,344,348,352,356,360,364],{"title":317,"path":318,"stem":319},"Product","/frontend/api-reference/entities/product","1.Frontend/99.api-reference/01.entities/1.product",{"title":321,"path":322,"stem":323},"SuggestedSearch","/frontend/api-reference/entities/suggested-search","1.Frontend/99.api-reference/01.entities/10.suggested-search",{"title":325,"path":326,"stem":327},"SuggestedSearchEntry","/frontend/api-reference/entities/suggested-search-entry","1.Frontend/99.api-reference/01.entities/11.suggested-search-entry",{"title":329,"path":330,"stem":331},"BlogCollection","/frontend/api-reference/entities/blog-collection","1.Frontend/99.api-reference/01.entities/12.blog-collection",{"title":333,"path":334,"stem":335},"Comment","/frontend/api-reference/entities/comment","1.Frontend/99.api-reference/01.entities/13.comment",{"title":337,"path":338,"stem":339},"ProductVariant","/frontend/api-reference/entities/product-variant","1.Frontend/99.api-reference/01.entities/2.product-variant",{"title":341,"path":342,"stem":343},"Category","/frontend/api-reference/entities/category","1.Frontend/99.api-reference/01.entities/3.category",{"title":345,"path":346,"stem":347},"Cart","/frontend/api-reference/entities/cart","1.Frontend/99.api-reference/01.entities/4.cart",{"title":349,"path":350,"stem":351},"CartItem","/frontend/api-reference/entities/cart-item","1.Frontend/99.api-reference/01.entities/5.cart-item",{"title":353,"path":354,"stem":355},"Review","/frontend/api-reference/entities/review","1.Frontend/99.api-reference/01.entities/6.review",{"title":357,"path":358,"stem":359},"BreadcrumbItem","/frontend/api-reference/entities/breadcrumb-item","1.Frontend/99.api-reference/01.entities/7.breadcrumb-item",{"title":361,"path":362,"stem":363},"MenuItem","/frontend/api-reference/entities/menu-item","1.Frontend/99.api-reference/01.entities/8.menu-item",{"title":365,"path":366,"stem":367},"BlogPost","/frontend/api-reference/entities/blog-post","1.Frontend/99.api-reference/01.entities/9.blog-post",{"title":188,"path":369,"stem":370},"/frontend/api-reference/page-types","1.Frontend/99.api-reference/02.page-types",{"title":372,"path":373,"stem":374,"children":375,"page":55},"Common Types","/frontend/api-reference/common-types","1.Frontend/99.api-reference/03.common-types",[376,380,384,388,392],{"title":377,"path":378,"stem":379},"Link","/frontend/api-reference/common-types/link","1.Frontend/99.api-reference/03.common-types/1.link",{"title":381,"path":382,"stem":383},"Media","/frontend/api-reference/common-types/media","1.Frontend/99.api-reference/03.common-types/2.media",{"title":385,"path":386,"stem":387},"Money","/frontend/api-reference/common-types/money","1.Frontend/99.api-reference/03.common-types/3.money",{"title":389,"path":390,"stem":391},"UnitPrice","/frontend/api-reference/common-types/unit-price","1.Frontend/99.api-reference/03.common-types/4.unit-price",{"title":393,"path":394,"stem":395},"Measurement","/frontend/api-reference/common-types/measurement","1.Frontend/99.api-reference/03.common-types/5.measurement",{"title":397,"path":398,"stem":399,"children":400,"page":55},"Ecommerce","/frontend/api-reference/ecommerce","1.Frontend/99.api-reference/10.ecommerce",[401,404,408],{"title":274,"path":402,"stem":403},"/frontend/api-reference/ecommerce/actions","1.Frontend/99.api-reference/10.ecommerce/1.actions",{"title":405,"path":406,"stem":407},"Queries","/frontend/api-reference/ecommerce/queries","1.Frontend/99.api-reference/10.ecommerce/2.queries",{"title":409,"path":410,"stem":411},"Errors","/frontend/api-reference/ecommerce/errors","1.Frontend/99.api-reference/10.ecommerce/3.errors",{"title":413,"path":414,"stem":415,"children":416,"page":55},"Newsletter","/frontend/api-reference/newsletter","1.Frontend/99.api-reference/11.newsletter",[417],{"title":274,"path":418,"stem":419},"/frontend/api-reference/newsletter/actions","1.Frontend/99.api-reference/11.newsletter/1.actions",{"title":421,"path":422,"stem":423,"children":424,"page":55},"Blog","/frontend/api-reference/blog","1.Frontend/99.api-reference/12.blog",[425,428],{"title":405,"path":426,"stem":427},"/frontend/api-reference/blog/queries","1.Frontend/99.api-reference/12.blog/1.queries",{"title":409,"path":429,"stem":430},"/frontend/api-reference/blog/errors","1.Frontend/99.api-reference/12.blog/2.errors",{"title":432,"path":433,"stem":434,"children":435,"page":55},"Suggested Search","/frontend/api-reference/suggested-search","1.Frontend/99.api-reference/13.suggested-search",[436],{"title":405,"path":437,"stem":438},"/frontend/api-reference/suggested-search/queries","1.Frontend/99.api-reference/13.suggested-search/1.queries",{"title":208,"path":440,"stem":441,"children":442,"page":55},"/frontend/api-reference/tracking","1.Frontend/99.api-reference/14.tracking",[443],{"title":274,"path":444,"stem":445},"/frontend/api-reference/tracking/actions","1.Frontend/99.api-reference/14.tracking/1.actions",{"title":447,"path":448,"stem":449,"children":450},"Apps","/apps","2.Apps/0.index",[451,452,528,601],{"title":447,"path":448,"stem":449},{"title":453,"path":454,"stem":455,"children":456},"App Development","/apps/app-development","2.Apps/app-development/0.index",[457,458,480,484,488,492,496,500,504,508,512,516,520,524],{"title":453,"path":454,"stem":455},{"title":459,"path":460,"stem":461,"children":462},"Guides","/apps/app-development/guides","2.Apps/app-development/99.guides/0.index",[463,464,468,472,476],{"title":459,"path":460,"stem":461},{"title":465,"path":466,"stem":467},"Separate schema components from UI components","/apps/app-development/guides/schema-components-vs-ui-components","2.Apps/app-development/99.guides/schema-components-vs-ui-components",{"title":469,"path":470,"stem":471},"Section config standard","/apps/app-development/guides/section-config-standard","2.Apps/app-development/99.guides/section-config-standard",{"title":473,"path":474,"stem":475},"Shared field factories","/apps/app-development/guides/shared-field-factories","2.Apps/app-development/99.guides/shared-field-factories",{"title":477,"path":478,"stem":479},"How to write CSS","/apps/app-development/guides/writing-css","2.Apps/app-development/99.guides/writing-css",{"title":481,"path":482,"stem":483},"App Configuration","/apps/app-development/app-configuration","2.Apps/app-development/app-configuration",{"title":485,"path":486,"stem":487},"App Starter","/apps/app-development/app-starter","2.Apps/app-development/app-starter",{"title":489,"path":490,"stem":491},"Best Practice","/apps/app-development/best-practice","2.Apps/app-development/best-practice",{"title":493,"path":494,"stem":495},"Block Definitions","/apps/app-development/block-definitions","2.Apps/app-development/block-definitions",{"title":497,"path":498,"stem":499},"Coding Standards","/apps/app-development/coding-standards","2.Apps/app-development/coding-standards",{"title":501,"path":502,"stem":503},"Consent Adapters","/apps/app-development/consent-adapters","2.Apps/app-development/consent-adapters",{"title":505,"path":506,"stem":507},"Consuming Query Fields","/apps/app-development/consuming-query-fields","2.Apps/app-development/consuming-query-fields",{"title":509,"path":510,"stem":511},"Implementation Overview","/apps/app-development/implementation-overview","2.Apps/app-development/implementation-overview",{"title":513,"path":514,"stem":515},"Platform Dependencies","/apps/app-development/platform-dependencies","2.Apps/app-development/platform-dependencies",{"title":517,"path":518,"stem":519},"Schema Fields","/apps/app-development/schema-fields","2.Apps/app-development/schema-fields",{"title":521,"path":522,"stem":523},"Section Definitions","/apps/app-development/section-definitions","2.Apps/app-development/section-definitions",{"title":525,"path":526,"stem":527},"Studio Icons","/apps/app-development/studio-icons","2.Apps/app-development/studio-icons",{"title":529,"path":530,"stem":531,"children":532,"page":55},"App Docs","/apps/app-docs","2.Apps/app-docs",[533,537,541,545,549,553,557,561,565,569,573,577,581,585,589,593,597],{"title":534,"path":535,"stem":536},"Adobe Commerce","/apps/app-docs/adobe-commerce","2.Apps/app-docs/adobe-commerce",{"title":538,"path":539,"stem":540},"B2Bsellers","/apps/app-docs/b2bsellers","2.Apps/app-docs/b2bsellers",{"title":542,"path":543,"stem":544},"Battery Included","/apps/app-docs/battery-included","2.Apps/app-docs/battery-included",{"title":546,"path":547,"stem":548},"CCM19","/apps/app-docs/ccm19","2.Apps/app-docs/ccm19",{"title":550,"path":551,"stem":552},"Cookiebot","/apps/app-docs/cookiebot","2.Apps/app-docs/cookiebot",{"title":554,"path":555,"stem":556},"Google Tag Manager (GTM)","/apps/app-docs/gtm","2.Apps/app-docs/gtm",{"title":558,"path":559,"stem":560},"Hygraph","/apps/app-docs/hygraph","2.Apps/app-docs/hygraph",{"title":562,"path":563,"stem":564},"Nimstrata Google Retail API","/apps/app-docs/nimstrata","2.Apps/app-docs/nimstrata",{"title":566,"path":567,"stem":568},"Pimcore","/apps/app-docs/pimcore","2.Apps/app-docs/pimcore",{"title":570,"path":571,"stem":572},"Commercetools","/apps/app-docs/commercetools","2.apps/app-docs/commercetools",{"title":574,"path":575,"stem":576},"Emporix","/apps/app-docs/emporix","2.apps/app-docs/emporix",{"title":578,"path":579,"stem":580},"Klaviyo","/apps/app-docs/klaviyo","2.apps/app-docs/klaviyo",{"title":582,"path":583,"stem":584},"OXID eShop","/apps/app-docs/oxid","2.apps/app-docs/oxid",{"title":586,"path":587,"stem":588},"Shopify","/apps/app-docs/shopify","2.apps/app-docs/shopify",{"title":590,"path":591,"stem":592},"Shopware","/apps/app-docs/shopware","2.apps/app-docs/shopware",{"title":594,"path":595,"stem":596},"Vercel Analytics","/apps/app-docs/vercel-analytics","2.apps/app-docs/vercel-analytics",{"title":598,"path":599,"stem":600},"Vercel Speed Insights","/apps/app-docs/vercel-speed-insights","2.apps/app-docs/vercel-speed-insights",{"title":602,"path":603,"stem":604,"children":605,"page":55},"Essentials","/apps/essentials","2.Apps/essentials",[606,610,614],{"title":607,"path":608,"stem":609},"Legal","/apps/essentials/legal","2.Apps/essentials/legal",{"title":611,"path":612,"stem":613},"Mailer","/apps/essentials/mailer","2.Apps/essentials/mailer",{"title":216,"path":615,"stem":616},"/apps/essentials/seo","2.Apps/essentials/seo",{"title":618,"path":619,"stem":620,"children":621},"Laioutr UI","/laioutr-ui","3.laioutr-ui/0.index",[622,623,655,661,667,853,859,865,919,937,1067],{"title":618,"path":619,"stem":620},{"title":5,"path":624,"stem":625,"children":626},"/laioutr-ui/getting-started","3.laioutr-ui/01.getting-started/0.index",[627,628,632,636,640,644,648,652],{"title":5,"path":624,"stem":625},{"title":629,"path":630,"stem":631},"Browser support","/laioutr-ui/getting-started/browser-support","3.laioutr-ui/01.getting-started/1.browser-support",{"title":633,"path":634,"stem":635},"Common Data","/laioutr-ui/getting-started/common-data","3.laioutr-ui/01.getting-started/99.common-data",{"title":637,"path":638,"stem":639},"CSS Layers","/laioutr-ui/getting-started/css-layers","3.laioutr-ui/01.getting-started/css-layers",{"title":641,"path":642,"stem":643},"Figma Kit","/laioutr-ui/getting-started/figma-kit","3.laioutr-ui/01.getting-started/figma-kit",{"title":645,"path":646,"stem":647},"Surface Tone","/laioutr-ui/getting-started/surface-tone","3.laioutr-ui/01.getting-started/surface-tone",{"title":649,"path":650,"stem":651},"Theming","/laioutr-ui/getting-started/theming","3.laioutr-ui/01.getting-started/theming",{"title":212,"path":653,"stem":654},"/laioutr-ui/getting-started/z-ordering","3.laioutr-ui/01.getting-started/z-ordering",{"title":656,"path":657,"stem":658,"children":659},"B2B","/laioutr-ui/b2b","3.laioutr-ui/b2b/0.index",[660],{"title":656,"path":657,"stem":658},{"title":662,"path":663,"stem":664,"children":665},"Booking","/laioutr-ui/booking","3.laioutr-ui/booking/0.index",[666],{"title":662,"path":663,"stem":664},{"title":668,"path":669,"stem":670,"children":671},"CMS","/laioutr-ui/cms","3.laioutr-ui/cms/0.index",[672,673,698,710,714,718,722,726,730,734,746,767,788,804],{"title":668,"path":669,"stem":670},{"title":674,"path":675,"stem":676,"children":677,"page":55},"Banner","/laioutr-ui/cms/banner","3.laioutr-ui/cms/banner",[678,682,686,690,694],{"title":679,"path":680,"stem":681},"Banner Basic","/laioutr-ui/cms/banner/banner-basic","3.laioutr-ui/cms/banner/banner-basic",{"title":683,"path":684,"stem":685},"Banner Integrated","/laioutr-ui/cms/banner/banner-integrated","3.laioutr-ui/cms/banner/banner-integrated",{"title":687,"path":688,"stem":689},"Banner Showcase","/laioutr-ui/cms/banner/banner-showcase","3.laioutr-ui/cms/banner/banner-showcase",{"title":691,"path":692,"stem":693},"Media + Text","/laioutr-ui/cms/banner/media-text","3.laioutr-ui/cms/banner/media-text",{"title":695,"path":696,"stem":697},"USP Banner","/laioutr-ui/cms/banner/usp-banner","3.laioutr-ui/cms/banner/usp-banner",{"title":421,"path":699,"stem":700,"children":701,"page":55},"/laioutr-ui/cms/blog","3.laioutr-ui/cms/blog",[702,706],{"title":703,"path":704,"stem":705},"Blog Post Detail","/laioutr-ui/cms/blog/blog-post-detail","3.laioutr-ui/cms/blog/blog-post-detail",{"title":707,"path":708,"stem":709},"Blog Post Listing","/laioutr-ui/cms/blog/blog-post-listing","3.laioutr-ui/cms/blog/blog-post-listing",{"title":711,"path":712,"stem":713},"Brand Hero","/laioutr-ui/cms/brand-hero","3.laioutr-ui/cms/brand-hero",{"title":715,"path":716,"stem":717},"Brand List","/laioutr-ui/cms/brand-list","3.laioutr-ui/cms/brand-list",{"title":719,"path":720,"stem":721},"Container","/laioutr-ui/cms/container","3.laioutr-ui/cms/container",{"title":723,"path":724,"stem":725},"Content Grid","/laioutr-ui/cms/content-grid","3.laioutr-ui/cms/content-grid",{"title":727,"path":728,"stem":729},"Editorial Grid","/laioutr-ui/cms/editorial-grid","3.laioutr-ui/cms/editorial-grid",{"title":731,"path":732,"stem":733},"Media Gallery","/laioutr-ui/cms/media-gallery","3.laioutr-ui/cms/media-gallery",{"title":413,"path":735,"stem":736,"children":737,"page":55},"/laioutr-ui/cms/newsletter","3.laioutr-ui/cms/newsletter",[738,742],{"title":739,"path":740,"stem":741},"Email Input Form","/laioutr-ui/cms/newsletter/email-input-form","3.laioutr-ui/cms/newsletter/email-input-form",{"title":743,"path":744,"stem":745},"Newsletter Registration","/laioutr-ui/cms/newsletter/newsletter-registration","3.laioutr-ui/cms/newsletter/newsletter-registration",{"title":747,"path":748,"stem":749,"children":750,"page":55},"Popups","/laioutr-ui/cms/popups","3.laioutr-ui/cms/popups",[751,755,759,763],{"title":752,"path":753,"stem":754},"PopUp","/laioutr-ui/cms/popups/pop-up","3.laioutr-ui/cms/popups/pop-up",{"title":756,"path":757,"stem":758},"PopUp Info","/laioutr-ui/cms/popups/pop-up-info","3.laioutr-ui/cms/popups/pop-up-info",{"title":760,"path":761,"stem":762},"PopUp Newsletter","/laioutr-ui/cms/popups/pop-up-newsletter","3.laioutr-ui/cms/popups/pop-up-newsletter",{"title":764,"path":765,"stem":766},"PopUp Promotion","/laioutr-ui/cms/popups/pop-up-promotion","3.laioutr-ui/cms/popups/pop-up-promotion",{"title":768,"path":769,"stem":770,"children":771,"page":55},"Quotes","/laioutr-ui/cms/quotes","3.laioutr-ui/cms/quotes",[772,776,780,784],{"title":773,"path":774,"stem":775},"Persona Quote","/laioutr-ui/cms/quotes/persona-quote","3.laioutr-ui/cms/quotes/persona-quote",{"title":777,"path":778,"stem":779},"Persona Quote Slider","/laioutr-ui/cms/quotes/persona-quote-slider","3.laioutr-ui/cms/quotes/persona-quote-slider",{"title":781,"path":782,"stem":783},"Quote Card","/laioutr-ui/cms/quotes/quote-card","3.laioutr-ui/cms/quotes/quote-card",{"title":785,"path":786,"stem":787},"Quote Card Slider","/laioutr-ui/cms/quotes/quote-card-slider","3.laioutr-ui/cms/quotes/quote-card-slider",{"title":789,"path":790,"stem":791,"children":792,"page":55},"Reviews","/laioutr-ui/cms/reviews","3.laioutr-ui/cms/reviews",[793,796,800],{"title":353,"path":794,"stem":795},"/laioutr-ui/cms/reviews/review","3.laioutr-ui/cms/reviews/review",{"title":797,"path":798,"stem":799},"Review Form","/laioutr-ui/cms/reviews/review-form","3.laioutr-ui/cms/reviews/review-form",{"title":801,"path":802,"stem":803},"Social Share","/laioutr-ui/cms/reviews/social-share","3.laioutr-ui/cms/reviews/social-share",{"title":805,"path":806,"stem":807,"children":808,"page":55},"Slider","/laioutr-ui/cms/slider","3.laioutr-ui/cms/slider",[809,813,817,821,825,829,833,837,841,845,849],{"title":810,"path":811,"stem":812},"Content Slider","/laioutr-ui/cms/slider/content-slider","3.laioutr-ui/cms/slider/content-slider",{"title":814,"path":815,"stem":816},"Hero Slider","/laioutr-ui/cms/slider/hero-slider","3.laioutr-ui/cms/slider/hero-slider",{"title":818,"path":819,"stem":820},"Logo Grid","/laioutr-ui/cms/slider/logo-grid","3.laioutr-ui/cms/slider/logo-grid",{"title":822,"path":823,"stem":824},"Logo Slider","/laioutr-ui/cms/slider/logo-slider","3.laioutr-ui/cms/slider/logo-slider",{"title":826,"path":827,"stem":828},"Swiper Arrows","/laioutr-ui/cms/slider/swiper-arrows","3.laioutr-ui/cms/slider/swiper-arrows",{"title":830,"path":831,"stem":832},"Swiper Bullets","/laioutr-ui/cms/slider/swiper-bullets","3.laioutr-ui/cms/slider/swiper-bullets",{"title":834,"path":835,"stem":836},"Swiper Chrome","/laioutr-ui/cms/slider/swiper-chrome","3.laioutr-ui/cms/slider/swiper-chrome",{"title":838,"path":839,"stem":840},"Swiper Nav Bar","/laioutr-ui/cms/slider/swiper-nav-bar","3.laioutr-ui/cms/slider/swiper-nav-bar",{"title":842,"path":843,"stem":844},"Swiper Numbers","/laioutr-ui/cms/slider/swiper-numbers","3.laioutr-ui/cms/slider/swiper-numbers",{"title":846,"path":847,"stem":848},"Swiper Scrollbar","/laioutr-ui/cms/slider/swiper-scrollbar","3.laioutr-ui/cms/slider/swiper-scrollbar",{"title":850,"path":851,"stem":852},"Thumbnails Slider","/laioutr-ui/cms/slider/thumbnails-slider","3.laioutr-ui/cms/slider/thumbnails-slider",{"title":854,"path":855,"stem":856,"children":857},"Marketplace","/laioutr-ui/marketplace","3.laioutr-ui/marketplace/0.index",[858],{"title":854,"path":855,"stem":856},{"title":860,"path":861,"stem":862,"children":863},"Multichannel","/laioutr-ui/multichannel","3.laioutr-ui/multichannel/0.index",[864],{"title":860,"path":861,"stem":862},{"title":866,"path":867,"stem":868,"children":869},"Navigation & Headers","/laioutr-ui/navigation","3.laioutr-ui/navigation/0.index",[870,871,875,879,883,887,891,895,899,903,907,911,915],{"title":866,"path":867,"stem":868},{"title":872,"path":873,"stem":874},"Breadcrumbs","/laioutr-ui/navigation/breadcrumbs","3.laioutr-ui/navigation/breadcrumbs",{"title":876,"path":877,"stem":878},"Footer","/laioutr-ui/navigation/footer","3.laioutr-ui/navigation/footer",{"title":880,"path":881,"stem":882},"Footer Menu","/laioutr-ui/navigation/footer-menu","3.laioutr-ui/navigation/footer-menu",{"title":884,"path":885,"stem":886},"Header Basic","/laioutr-ui/navigation/header-basic","3.laioutr-ui/navigation/header-basic",{"title":888,"path":889,"stem":890},"Header Shop","/laioutr-ui/navigation/header-shop","3.laioutr-ui/navigation/header-shop",{"title":892,"path":893,"stem":894},"Mega Menu","/laioutr-ui/navigation/mega-menu","3.laioutr-ui/navigation/mega-menu",{"title":896,"path":897,"stem":898},"Menu Side by Side","/laioutr-ui/navigation/menu-side-by-side","3.laioutr-ui/navigation/menu-side-by-side",{"title":900,"path":901,"stem":902},"Mobile Menu (Basic)","/laioutr-ui/navigation/mobile-menu-basic","3.laioutr-ui/navigation/mobile-menu-basic",{"title":904,"path":905,"stem":906},"Mobile Menu (Shop)","/laioutr-ui/navigation/mobile-menu-shop","3.laioutr-ui/navigation/mobile-menu-shop",{"title":908,"path":909,"stem":910},"Page Not Found","/laioutr-ui/navigation/page-not-found","3.laioutr-ui/navigation/page-not-found",{"title":912,"path":913,"stem":914},"Search Auto-Suggest","/laioutr-ui/navigation/search-auto-suggest","3.laioutr-ui/navigation/search-auto-suggest",{"title":916,"path":917,"stem":918},"Top Bar","/laioutr-ui/navigation/top-bar","3.laioutr-ui/navigation/top-bar",{"title":920,"path":921,"stem":922,"children":923},"SaaS","/laioutr-ui/saas","3.laioutr-ui/saas/0.index",[924,925,929,933],{"title":920,"path":921,"stem":922},{"title":926,"path":927,"stem":928},"Plan Card","/laioutr-ui/saas/plan-card","3.laioutr-ui/saas/plan-card",{"title":930,"path":931,"stem":932},"Plan Card Slider","/laioutr-ui/saas/plan-card-slider","3.laioutr-ui/saas/plan-card-slider",{"title":934,"path":935,"stem":936},"Plan Comparison Table","/laioutr-ui/saas/plan-comparison-table","3.laioutr-ui/saas/plan-comparison-table",{"title":938,"path":939,"stem":940,"children":941},"Shop","/laioutr-ui/shop","3.laioutr-ui/shop/0.index",[942,943,971,975,979,983,987,1043,1047,1051,1055,1059,1063],{"title":938,"path":939,"stem":940},{"title":345,"path":944,"stem":945,"children":946,"page":55},"/laioutr-ui/shop/cart","3.laioutr-ui/shop/cart",[947,951,955,959,963,967],{"title":948,"path":949,"stem":950},"Cart Coupon Code Accordion","/laioutr-ui/shop/cart/cart-coupon-code-accordion","3.laioutr-ui/shop/cart/cart-coupon-code-accordion",{"title":952,"path":953,"stem":954},"Cart List Item","/laioutr-ui/shop/cart/cart-list-item","3.laioutr-ui/shop/cart/cart-list-item",{"title":956,"path":957,"stem":958},"Cart Sheet","/laioutr-ui/shop/cart/cart-sheet","3.laioutr-ui/shop/cart/cart-sheet",{"title":960,"path":961,"stem":962},"Cart Summary Box","/laioutr-ui/shop/cart/cart-summary-box","3.laioutr-ui/shop/cart/cart-summary-box",{"title":964,"path":965,"stem":966},"Empty State Cart","/laioutr-ui/shop/cart/empty-state-cart","3.laioutr-ui/shop/cart/empty-state-cart",{"title":968,"path":969,"stem":970},"Free Delivery Progress","/laioutr-ui/shop/cart/free-delivery-progress","3.laioutr-ui/shop/cart/free-delivery-progress",{"title":972,"path":973,"stem":974},"Category Card Grid","/laioutr-ui/shop/category-card-grid","3.laioutr-ui/shop/category-card-grid",{"title":976,"path":977,"stem":978},"Category Card Slider","/laioutr-ui/shop/category-card-slider","3.laioutr-ui/shop/category-card-slider",{"title":980,"path":981,"stem":982},"Filter Bar","/laioutr-ui/shop/filter-bar","3.laioutr-ui/shop/filter-bar",{"title":984,"path":985,"stem":986},"Filter Off Canvas","/laioutr-ui/shop/filter-off-canvas","3.laioutr-ui/shop/filter-off-canvas",{"title":988,"path":989,"stem":990,"children":991,"page":55},"Product Detail","/laioutr-ui/shop/product-detail","3.laioutr-ui/shop/product-detail",[992,996,1000,1004,1008,1012,1015,1019,1023,1027,1031,1035,1039],{"title":993,"path":994,"stem":995},"Add to Cart","/laioutr-ui/shop/product-detail/add-to-cart","3.laioutr-ui/shop/product-detail/add-to-cart",{"title":997,"path":998,"stem":999},"Benefits Box","/laioutr-ui/shop/product-detail/benefits-box","3.laioutr-ui/shop/product-detail/benefits-box",{"title":1001,"path":1002,"stem":1003},"Coupon Box","/laioutr-ui/shop/product-detail/coupon-box","3.laioutr-ui/shop/product-detail/coupon-box",{"title":1005,"path":1006,"stem":1007},"Energy Label","/laioutr-ui/shop/product-detail/energy-label","3.laioutr-ui/shop/product-detail/energy-label",{"title":1009,"path":1010,"stem":1011},"Price Info","/laioutr-ui/shop/product-detail/price-info","3.laioutr-ui/shop/product-detail/price-info",{"title":988,"path":1013,"stem":1014},"/laioutr-ui/shop/product-detail/product-detail","3.laioutr-ui/shop/product-detail/product-detail",{"title":1016,"path":1017,"stem":1018},"Product Image Gallery","/laioutr-ui/shop/product-detail/product-image-gallery","3.laioutr-ui/shop/product-detail/product-image-gallery",{"title":1020,"path":1021,"stem":1022},"Product Title","/laioutr-ui/shop/product-detail/product-title","3.laioutr-ui/shop/product-detail/product-title",{"title":1024,"path":1025,"stem":1026},"Quantity Discount","/laioutr-ui/shop/product-detail/quantity-discount","3.laioutr-ui/shop/product-detail/quantity-discount",{"title":1028,"path":1029,"stem":1030},"Variant Off Canvas","/laioutr-ui/shop/product-detail/variant-off-canvas","3.laioutr-ui/shop/product-detail/variant-off-canvas",{"title":1032,"path":1033,"stem":1034},"Variant Selector Configurator","/laioutr-ui/shop/product-detail/variant-selector-configurator","3.laioutr-ui/shop/product-detail/variant-selector-configurator",{"title":1036,"path":1037,"stem":1038},"Variant Selector (Multiple)","/laioutr-ui/shop/product-detail/variant-selector-multiple","3.laioutr-ui/shop/product-detail/variant-selector-multiple",{"title":1040,"path":1041,"stem":1042},"Variant Selector Options","/laioutr-ui/shop/product-detail/variant-selector-options","3.laioutr-ui/shop/product-detail/variant-selector-options",{"title":1044,"path":1045,"stem":1046},"Product Listing Grid","/laioutr-ui/shop/product-listing-grid","3.laioutr-ui/shop/product-listing-grid",{"title":1048,"path":1049,"stem":1050},"Product Slider","/laioutr-ui/shop/product-slider","3.laioutr-ui/shop/product-slider",{"title":1052,"path":1053,"stem":1054},"Product Slider Showcase","/laioutr-ui/shop/product-slider-showcase","3.laioutr-ui/shop/product-slider-showcase",{"title":1056,"path":1057,"stem":1058},"Product Tile (Basic)","/laioutr-ui/shop/product-tile-basic","3.laioutr-ui/shop/product-tile-basic",{"title":1060,"path":1061,"stem":1062},"Search Result Hero","/laioutr-ui/shop/search-result-hero","3.laioutr-ui/shop/search-result-hero",{"title":1064,"path":1065,"stem":1066},"Sort Modes","/laioutr-ui/shop/sort-modes","3.laioutr-ui/shop/sort-modes",{"title":1068,"path":1069,"stem":1070,"children":1071},"UI Kit","/laioutr-ui/ui-kit","3.laioutr-ui/ui-kit/0.index",[1072,1073,1217,1241,1262,1275,1312,1421],{"title":1068,"path":1069,"stem":1070},{"title":1074,"path":1075,"stem":1076,"children":1077,"page":55},"General","/laioutr-ui/ui-kit/general","3.laioutr-ui/ui-kit/01.general",[1078,1082,1086,1090,1094,1098,1102,1106,1110,1114,1118,1122,1125,1129,1133,1137,1141,1145,1149,1153,1157,1161,1165,1169,1173,1177,1181,1185,1189,1193,1197,1201,1205,1209,1213],{"title":1079,"path":1080,"stem":1081},"Accordion","/laioutr-ui/ui-kit/general/accordion","3.laioutr-ui/ui-kit/01.general/Accordion",{"title":1083,"path":1084,"stem":1085},"Avatar","/laioutr-ui/ui-kit/general/avatar","3.laioutr-ui/ui-kit/01.general/Avatar",{"title":1087,"path":1088,"stem":1089},"Backdrop","/laioutr-ui/ui-kit/general/backdrop","3.laioutr-ui/ui-kit/01.general/Backdrop",{"title":1091,"path":1092,"stem":1093},"Dropdown Menu","/laioutr-ui/ui-kit/general/dropdownmenu","3.laioutr-ui/ui-kit/01.general/DropdownMenu",{"title":1095,"path":1096,"stem":1097},"Edge Glow","/laioutr-ui/ui-kit/general/edgeglow","3.laioutr-ui/ui-kit/01.general/EdgeGlow",{"title":1099,"path":1100,"stem":1101},"Empty State","/laioutr-ui/ui-kit/general/emptystate","3.laioutr-ui/ui-kit/01.general/EmptyState",{"title":1103,"path":1104,"stem":1105},"Icon","/laioutr-ui/ui-kit/general/icon","3.laioutr-ui/ui-kit/01.general/Icon",{"title":1107,"path":1108,"stem":1109},"Iframe","/laioutr-ui/ui-kit/general/iframe","3.laioutr-ui/ui-kit/01.general/Iframe",{"title":1111,"path":1112,"stem":1113},"Image Contrast Overlay","/laioutr-ui/ui-kit/general/imagecontrastoverlay","3.laioutr-ui/ui-kit/01.general/ImageContrastOverlay",{"title":1115,"path":1116,"stem":1117},"Lightbox","/laioutr-ui/ui-kit/general/lightbox","3.laioutr-ui/ui-kit/01.general/Lightbox",{"title":1119,"path":1120,"stem":1121},"Loading Spinner","/laioutr-ui/ui-kit/general/loadingspinner","3.laioutr-ui/ui-kit/01.general/LoadingSpinner",{"title":381,"path":1123,"stem":1124},"/laioutr-ui/ui-kit/general/media","3.laioutr-ui/ui-kit/01.general/Media",{"title":1126,"path":1127,"stem":1128},"Navigation Bullets","/laioutr-ui/ui-kit/general/navigationbullets","3.laioutr-ui/ui-kit/01.general/NavigationBullets",{"title":1130,"path":1131,"stem":1132},"Placeholder","/laioutr-ui/ui-kit/general/placeholder","3.laioutr-ui/ui-kit/01.general/Placeholder",{"title":1134,"path":1135,"stem":1136},"Progress Bar","/laioutr-ui/ui-kit/general/progressbar","3.laioutr-ui/ui-kit/01.general/ProgressBar",{"title":1138,"path":1139,"stem":1140},"Scrollbar","/laioutr-ui/ui-kit/general/scrollbar","3.laioutr-ui/ui-kit/01.general/Scrollbar",{"title":1142,"path":1143,"stem":1144},"Swatch","/laioutr-ui/ui-kit/general/swatch","3.laioutr-ui/ui-kit/01.general/Swatch",{"title":1146,"path":1147,"stem":1148},"Thumbnail","/laioutr-ui/ui-kit/general/thumbnail","3.laioutr-ui/ui-kit/01.general/Thumbnail",{"title":1150,"path":1151,"stem":1152},"Tooltip","/laioutr-ui/ui-kit/general/tooltip","3.laioutr-ui/ui-kit/01.general/Tooltip",{"title":1154,"path":1155,"stem":1156},"Amount Pill","/laioutr-ui/ui-kit/general/amount-pill","3.laioutr-ui/ui-kit/01.general/amount-pill",{"title":1158,"path":1159,"stem":1160},"Dark Mode Switch","/laioutr-ui/ui-kit/general/dark-mode-switch","3.laioutr-ui/ui-kit/01.general/dark-mode-switch",{"title":1162,"path":1163,"stem":1164},"Language Switcher","/laioutr-ui/ui-kit/general/language-switcher","3.laioutr-ui/ui-kit/01.general/language-switcher",{"title":1166,"path":1167,"stem":1168},"Media Preview","/laioutr-ui/ui-kit/general/media-preview","3.laioutr-ui/ui-kit/01.general/media-preview",{"title":1170,"path":1171,"stem":1172},"Media Stage","/laioutr-ui/ui-kit/general/media-stage","3.laioutr-ui/ui-kit/01.general/media-stage",{"title":1174,"path":1175,"stem":1176},"Nav Link Item","/laioutr-ui/ui-kit/general/nav-link-item","3.laioutr-ui/ui-kit/01.general/nav-link-item",{"title":1178,"path":1179,"stem":1180},"Nav Section Heading","/laioutr-ui/ui-kit/general/nav-section-heading","3.laioutr-ui/ui-kit/01.general/nav-section-heading",{"title":1182,"path":1183,"stem":1184},"OnSurface","/laioutr-ui/ui-kit/general/on-surface","3.laioutr-ui/ui-kit/01.general/on-surface",{"title":1186,"path":1187,"stem":1188},"Rating Progress Bar Filter","/laioutr-ui/ui-kit/general/rating-progress-bar-filter","3.laioutr-ui/ui-kit/01.general/rating-progress-bar-filter",{"title":1190,"path":1191,"stem":1192},"Status Message","/laioutr-ui/ui-kit/general/status-message","3.laioutr-ui/ui-kit/01.general/status-message",{"title":1194,"path":1195,"stem":1196},"Stock Info Summary","/laioutr-ui/ui-kit/general/stock-info-summary","3.laioutr-ui/ui-kit/01.general/stock-info-summary",{"title":1198,"path":1199,"stem":1200},"Swatch Chip","/laioutr-ui/ui-kit/general/swatch-chip","3.laioutr-ui/ui-kit/01.general/swatch-chip",{"title":1202,"path":1203,"stem":1204},"Swatch Option","/laioutr-ui/ui-kit/general/swatch-option","3.laioutr-ui/ui-kit/01.general/swatch-option",{"title":1206,"path":1207,"stem":1208},"Swatch Summary","/laioutr-ui/ui-kit/general/swatch-summary","3.laioutr-ui/ui-kit/01.general/swatch-summary",{"title":1210,"path":1211,"stem":1212},"Zoom Level (Segmented)","/laioutr-ui/ui-kit/general/zoom-level-segmented","3.laioutr-ui/ui-kit/01.general/zoom-level-segmented",{"title":1214,"path":1215,"stem":1216},"Zoom Level (Stepper)","/laioutr-ui/ui-kit/general/zoom-level-stepper","3.laioutr-ui/ui-kit/01.general/zoom-level-stepper",{"title":1218,"path":1219,"stem":1220,"children":1221,"page":55},"Typography","/laioutr-ui/ui-kit/typography","3.laioutr-ui/ui-kit/02.typography",[1222,1226,1229,1233,1237],{"title":1223,"path":1224,"stem":1225},"Icon List","/laioutr-ui/ui-kit/typography/iconlist","3.laioutr-ui/ui-kit/02.typography/IconList",{"title":377,"path":1227,"stem":1228},"/laioutr-ui/ui-kit/typography/link","3.laioutr-ui/ui-kit/02.typography/Link",{"title":1230,"path":1231,"stem":1232},"Rich Content","/laioutr-ui/ui-kit/typography/richcontent","3.laioutr-ui/ui-kit/02.typography/RichContent",{"title":1234,"path":1235,"stem":1236},"Text","/laioutr-ui/ui-kit/typography/text","3.laioutr-ui/ui-kit/02.typography/Text",{"title":1238,"path":1239,"stem":1240},"Text Group","/laioutr-ui/ui-kit/typography/text-group","3.laioutr-ui/ui-kit/02.typography/text-group",{"title":1242,"path":1243,"stem":1244,"children":1245,"page":55},"Layout","/laioutr-ui/ui-kit/layout","3.laioutr-ui/ui-kit/03.layout",[1246,1250,1254,1258],{"title":1247,"path":1248,"stem":1249},"Grid Fill","/laioutr-ui/ui-kit/layout/gridfill","3.laioutr-ui/ui-kit/03.layout/GridFill",{"title":1251,"path":1252,"stem":1253},"Grid Masonry","/laioutr-ui/ui-kit/layout/gridmasonry","3.laioutr-ui/ui-kit/03.layout/GridMasonry",{"title":1255,"path":1256,"stem":1257},"Scroll Area","/laioutr-ui/ui-kit/layout/scrollarea","3.laioutr-ui/ui-kit/03.layout/ScrollArea",{"title":1259,"path":1260,"stem":1261},"Separator","/laioutr-ui/ui-kit/layout/separator","3.laioutr-ui/ui-kit/03.layout/Separator",{"title":1263,"path":1264,"stem":1265,"children":1266,"page":55},"Content","/laioutr-ui/ui-kit/content","3.laioutr-ui/ui-kit/04.content",[1267,1271],{"title":1268,"path":1269,"stem":1270},"Card","/laioutr-ui/ui-kit/content/card","3.laioutr-ui/ui-kit/04.content/Card",{"title":1272,"path":1273,"stem":1274},"Link Tile","/laioutr-ui/ui-kit/content/link-tile","3.laioutr-ui/ui-kit/04.content/link-tile",{"title":1276,"path":1277,"stem":1278,"children":1279,"page":55},"Surfaces","/laioutr-ui/ui-kit/surfaces","3.laioutr-ui/ui-kit/05.surfaces",[1280,1284,1288,1292,1296,1300,1304,1308],{"title":1281,"path":1282,"stem":1283},"Alert Dialog","/laioutr-ui/ui-kit/surfaces/alertdialog","3.laioutr-ui/ui-kit/05.surfaces/AlertDialog",{"title":1285,"path":1286,"stem":1287},"Popover","/laioutr-ui/ui-kit/surfaces/popover","3.laioutr-ui/ui-kit/05.surfaces/Popover",{"title":1289,"path":1290,"stem":1291},"Sheet","/laioutr-ui/ui-kit/surfaces/sheet","3.laioutr-ui/ui-kit/05.surfaces/Sheet",{"title":1293,"path":1294,"stem":1295},"Tabs","/laioutr-ui/ui-kit/surfaces/tabs","3.laioutr-ui/ui-kit/05.surfaces/Tabs",{"title":1297,"path":1298,"stem":1299},"Toast","/laioutr-ui/ui-kit/surfaces/toast","3.laioutr-ui/ui-kit/05.surfaces/Toast",{"title":1301,"path":1302,"stem":1303},"Toaster","/laioutr-ui/ui-kit/surfaces/toaster","3.laioutr-ui/ui-kit/05.surfaces/Toaster",{"title":1305,"path":1306,"stem":1307},"Context Menu","/laioutr-ui/ui-kit/surfaces/context-menu","3.laioutr-ui/ui-kit/05.surfaces/context-menu",{"title":1309,"path":1310,"stem":1311},"Navigation Menu","/laioutr-ui/ui-kit/surfaces/navigation-menu","3.laioutr-ui/ui-kit/05.surfaces/navigation-menu",{"title":1313,"path":1314,"stem":1315,"children":1316,"page":55},"Form","/laioutr-ui/ui-kit/form","3.laioutr-ui/ui-kit/06.form",[1317,1321,1325,1329,1333,1337,1341,1345,1349,1353,1357,1361,1365,1369,1373,1377,1381,1385,1389,1393,1397,1401,1405,1409,1413,1417],{"title":1318,"path":1319,"stem":1320},"Button","/laioutr-ui/ui-kit/form/button","3.laioutr-ui/ui-kit/06.form/Button",{"title":1322,"path":1323,"stem":1324},"Checkbox","/laioutr-ui/ui-kit/form/checkbox","3.laioutr-ui/ui-kit/06.form/Checkbox",{"title":1326,"path":1327,"stem":1328},"Field","/laioutr-ui/ui-kit/form/field","3.laioutr-ui/ui-kit/06.form/Field",{"title":1330,"path":1331,"stem":1332},"Input","/laioutr-ui/ui-kit/form/input","3.laioutr-ui/ui-kit/06.form/Input",{"title":1334,"path":1335,"stem":1336},"Label","/laioutr-ui/ui-kit/form/label","3.laioutr-ui/ui-kit/06.form/Label",{"title":1338,"path":1339,"stem":1340},"Load More","/laioutr-ui/ui-kit/form/loadmore","3.laioutr-ui/ui-kit/06.form/LoadMore",{"title":1342,"path":1343,"stem":1344},"Pagination","/laioutr-ui/ui-kit/form/pagination","3.laioutr-ui/ui-kit/06.form/Pagination",{"title":1346,"path":1347,"stem":1348},"Quantity Picker","/laioutr-ui/ui-kit/form/quantitypicker","3.laioutr-ui/ui-kit/06.form/QuantityPicker",{"title":1350,"path":1351,"stem":1352},"Select","/laioutr-ui/ui-kit/form/select","3.laioutr-ui/ui-kit/06.form/Select",{"title":1354,"path":1355,"stem":1356},"Switch","/laioutr-ui/ui-kit/form/switch","3.laioutr-ui/ui-kit/06.form/Switch",{"title":1358,"path":1359,"stem":1360},"Highlight Toggle","/laioutr-ui/ui-kit/form/highlight-toggle","3.laioutr-ui/ui-kit/06.form/highlight-toggle",{"title":1362,"path":1363,"stem":1364},"Icon Button","/laioutr-ui/ui-kit/form/icon-button","3.laioutr-ui/ui-kit/06.form/icon-button",{"title":1366,"path":1367,"stem":1368},"Input Autocomplete","/laioutr-ui/ui-kit/form/input-autocomplete","3.laioutr-ui/ui-kit/06.form/input-autocomplete",{"title":1370,"path":1371,"stem":1372},"Input Checkbox","/laioutr-ui/ui-kit/form/input-checkbox","3.laioutr-ui/ui-kit/06.form/input-checkbox",{"title":1374,"path":1375,"stem":1376},"Input Combobox","/laioutr-ui/ui-kit/form/input-combobox","3.laioutr-ui/ui-kit/06.form/input-combobox",{"title":1378,"path":1379,"stem":1380},"Input Group","/laioutr-ui/ui-kit/form/input-group","3.laioutr-ui/ui-kit/06.form/input-group",{"title":1382,"path":1383,"stem":1384},"Input Password","/laioutr-ui/ui-kit/form/input-password","3.laioutr-ui/ui-kit/06.form/input-password",{"title":1386,"path":1387,"stem":1388},"Input Pin","/laioutr-ui/ui-kit/form/input-pin","3.laioutr-ui/ui-kit/06.form/input-pin",{"title":1390,"path":1391,"stem":1392},"Input Radio","/laioutr-ui/ui-kit/form/input-radio","3.laioutr-ui/ui-kit/06.form/input-radio",{"title":1394,"path":1395,"stem":1396},"Input Rating","/laioutr-ui/ui-kit/form/input-rating","3.laioutr-ui/ui-kit/06.form/input-rating",{"title":1398,"path":1399,"stem":1400},"Input Search","/laioutr-ui/ui-kit/form/input-search","3.laioutr-ui/ui-kit/06.form/input-search",{"title":1402,"path":1403,"stem":1404},"Input Slider","/laioutr-ui/ui-kit/form/input-slider","3.laioutr-ui/ui-kit/06.form/input-slider",{"title":1406,"path":1407,"stem":1408},"Listbox","/laioutr-ui/ui-kit/form/listbox","3.laioutr-ui/ui-kit/06.form/listbox",{"title":1410,"path":1411,"stem":1412},"Option Tile (Image)","/laioutr-ui/ui-kit/form/option-tile-image","3.laioutr-ui/ui-kit/06.form/option-tile-image",{"title":1414,"path":1415,"stem":1416},"Option Tile (Text)","/laioutr-ui/ui-kit/form/option-tile-text","3.laioutr-ui/ui-kit/06.form/option-tile-text",{"title":1418,"path":1419,"stem":1420},"Variant Selection Card","/laioutr-ui/ui-kit/form/variant-selection-card","3.laioutr-ui/ui-kit/06.form/variant-selection-card",{"title":1422,"path":1423,"stem":1424,"children":1425,"page":55},"Indicators","/laioutr-ui/ui-kit/indicators","3.laioutr-ui/ui-kit/07.indicators",[1426,1430,1434,1438,1442,1446],{"title":1427,"path":1428,"stem":1429},"Badge","/laioutr-ui/ui-kit/indicators/badge","3.laioutr-ui/ui-kit/07.indicators/Badge",{"title":1431,"path":1432,"stem":1433},"Caption Flag","/laioutr-ui/ui-kit/indicators/captionflag","3.laioutr-ui/ui-kit/07.indicators/CaptionFlag",{"title":1435,"path":1436,"stem":1437},"Product Tile Flag","/laioutr-ui/ui-kit/indicators/producttileflag","3.laioutr-ui/ui-kit/07.indicators/ProductTileFlag",{"title":1439,"path":1440,"stem":1441},"Rating Summary","/laioutr-ui/ui-kit/indicators/ratingsummary","3.laioutr-ui/ui-kit/07.indicators/RatingSummary",{"title":1443,"path":1444,"stem":1445},"Stars Rating","/laioutr-ui/ui-kit/indicators/starsrating","3.laioutr-ui/ui-kit/07.indicators/StarsRating",{"title":1447,"path":1448,"stem":1449},"Badge Promotion","/laioutr-ui/ui-kit/indicators/badge-promotion","3.laioutr-ui/ui-kit/07.indicators/badge-promotion",{"title":1451,"path":1452,"stem":1453,"children":1454},"Hosting","/hosting","4.hosting/0.index",[1455,1456,1462,1492],{"title":1451,"path":1452,"stem":1453},{"title":1457,"path":1458,"stem":1459,"children":1460},"Laioutr Cloud","/hosting/laioutr-cloud","4.hosting/0.laioutr-cloud/0.index",[1461],{"title":1457,"path":1458,"stem":1459},{"title":1463,"path":1464,"stem":1465,"children":1466},"Hosting Adapter","/hosting/hosting-adapter","4.hosting/1.hosting-adapter/0.index",[1467,1468,1472,1476,1480,1484,1488],{"title":1463,"path":1464,"stem":1465},{"title":1469,"path":1470,"stem":1471},"AWS Adapter","/hosting/hosting-adapter/aws-adapter","4.hosting/1.hosting-adapter/aws-adapter",{"title":1473,"path":1474,"stem":1475},"Azure Adapter","/hosting/hosting-adapter/azure-adapter","4.hosting/1.hosting-adapter/azure-adapter",{"title":1477,"path":1478,"stem":1479},"Google Adapter","/hosting/hosting-adapter/google-adapter","4.hosting/1.hosting-adapter/google-adapter",{"title":1481,"path":1482,"stem":1483},"Netlify Adapter","/hosting/hosting-adapter/netlify-adapter","4.hosting/1.hosting-adapter/netlify-adapter",{"title":1485,"path":1486,"stem":1487},"Scale Commerce Adapter","/hosting/hosting-adapter/scale-commerce-adapter","4.hosting/1.hosting-adapter/scale-commerce-adapter",{"title":1489,"path":1490,"stem":1491},"Vercel Adapter","/hosting/hosting-adapter/vercel-adapter","4.hosting/1.hosting-adapter/vercel-adapter",{"title":1493,"path":1494,"stem":1495,"children":1496},"Bring Your Own Server (BYOS)","/hosting/bring-your-own-server-byos","4.hosting/2.bring-your-own-server-byos/0.index",[1497,1498,1502,1506,1510,1514,1518],{"title":1493,"path":1494,"stem":1495},{"title":1499,"path":1500,"stem":1501},"BYOS Agent","/hosting/bring-your-own-server-byos/byos-agent","4.hosting/2.bring-your-own-server-byos/byos-agent",{"title":1503,"path":1504,"stem":1505},"Changelog","/hosting/bring-your-own-server-byos/changelog","4.hosting/2.bring-your-own-server-byos/changelog",{"title":1507,"path":1508,"stem":1509},"DevOps Components","/hosting/bring-your-own-server-byos/devops","4.hosting/2.bring-your-own-server-byos/devops",{"title":1511,"path":1512,"stem":1513},"Infrastructure Requirements","/hosting/bring-your-own-server-byos/infrastructure","4.hosting/2.bring-your-own-server-byos/infrastructure",{"title":1515,"path":1516,"stem":1517},"Software Requirements","/hosting/bring-your-own-server-byos/software","4.hosting/2.bring-your-own-server-byos/software",{"title":1519,"path":1520,"stem":1521},"Webhook Configuration","/hosting/bring-your-own-server-byos/webhook-config","4.hosting/2.bring-your-own-server-byos/webhook-config",{"title":1523,"path":1524,"stem":1525,"children":1526},"Checkout","/checkout","5.Checkout/0.index",[1527],{"title":1523,"path":1524,"stem":1525},{"title":1529,"path":1530,"stem":1531,"children":1532},"Larry AI","/larry-ai","6.Larry-AI/0.index",[1533],{"title":1529,"path":1530,"stem":1531},{"title":641,"path":1535,"stem":1536,"children":1537},"/figma-kit","7.Figma Kit/0.index",[1538,1539,1555],{"title":641,"path":1535,"stem":1536},{"title":121,"path":1540,"stem":1541,"children":1542,"page":55},"/figma-kit/introduction","7.Figma Kit/1.Introduction",[1543,1547,1551],{"title":1544,"path":1545,"stem":1546},"How to Start","/figma-kit/introduction/howtostart","7.Figma Kit/1.Introduction/0.howtostart",{"title":1548,"path":1549,"stem":1550},"Figma Variables","/figma-kit/introduction/figma-variables","7.Figma Kit/1.Introduction/figma-variables",{"title":1552,"path":1553,"stem":1554},"Library Connections","/figma-kit/introduction/library-connections","7.Figma Kit/1.Introduction/library-connections",{"title":1556,"path":1557,"stem":1558,"children":1559,"page":55},"Kits","/figma-kit/kits","7.Figma Kit/Kits",[1560,1563,1566,1569,1573,1576,1580,1584,1587,1590],{"title":656,"path":1561,"stem":1562},"/figma-kit/kits/b2b","7.Figma Kit/Kits/b2b",{"title":662,"path":1564,"stem":1565},"/figma-kit/kits/booking","7.Figma Kit/Kits/booking",{"title":668,"path":1567,"stem":1568},"/figma-kit/kits/cms","7.Figma Kit/Kits/cms",{"title":1570,"path":1571,"stem":1572},"Inpage Navigation","/figma-kit/kits/inpage-navigation","7.Figma Kit/Kits/inpage-navigation",{"title":854,"path":1574,"stem":1575},"/figma-kit/kits/marketplace","7.Figma Kit/Kits/marketplace",{"title":1577,"path":1578,"stem":1579},"Retail & Multichannel","/figma-kit/kits/multichannel","7.Figma Kit/Kits/multichannel",{"title":1581,"path":1582,"stem":1583},"Navigation","/figma-kit/kits/navigation","7.Figma Kit/Kits/navigation",{"title":920,"path":1585,"stem":1586},"/figma-kit/kits/saas","7.Figma Kit/Kits/saas",{"title":938,"path":1588,"stem":1589},"/figma-kit/kits/shop","7.Figma Kit/Kits/shop",{"title":1068,"path":1591,"stem":1592},"/figma-kit/kits/ui-kit","7.Figma Kit/Kits/ui-kit",{"title":1594,"path":1595,"stem":1596,"children":1597},"Cockpit","/cockpit","8.Cockpit/0.index",[1598,1599,1629,1646,1663],{"title":1594,"path":1595,"stem":1596},{"title":154,"path":1600,"stem":1601,"children":1602,"page":55},"/cockpit/features","8.Cockpit/1.Features",[1603,1606,1610,1614,1618,1621,1625],{"title":447,"path":1604,"stem":1605},"/cockpit/features/apps","8.Cockpit/1.Features/apps",{"title":1607,"path":1608,"stem":1609},"Content (Collections)","/cockpit/features/content-collections","8.Cockpit/1.Features/content-collections",{"title":1611,"path":1612,"stem":1613},"Deployments","/cockpit/features/deployments","8.Cockpit/1.Features/deployments",{"title":1615,"path":1616,"stem":1617},"Markets","/cockpit/features/markets","8.Cockpit/1.Features/markets",{"title":196,"path":1619,"stem":1620},"/cockpit/features/redirects","8.Cockpit/1.Features/redirects",{"title":1622,"path":1623,"stem":1624},"Studio","/cockpit/features/studio","8.Cockpit/1.Features/studio",{"title":1626,"path":1627,"stem":1628},"Translations","/cockpit/features/translations","8.Cockpit/1.Features/translations",{"title":1630,"path":1631,"stem":1632,"children":1633,"page":55},"Project Settings","/cockpit/project-settings","8.Cockpit/2.Project-Settings",[1634,1638,1642],{"title":1635,"path":1636,"stem":1637},"Delete a project","/cockpit/project-settings/delete-project","8.Cockpit/2.Project-Settings/delete-project",{"title":1639,"path":1640,"stem":1641},"NPM","/cockpit/project-settings/npm","8.Cockpit/2.Project-Settings/npm",{"title":1643,"path":1644,"stem":1645},"Project secret key","/cockpit/project-settings/project-secret-key","8.Cockpit/2.Project-Settings/project-secret-key",{"title":1647,"path":1648,"stem":1649,"children":1650,"page":55},"Account Settings","/cockpit/account-settings","8.Cockpit/3.Account-Settings",[1651,1655,1659],{"title":1652,"path":1653,"stem":1654},"Notifications","/cockpit/account-settings/notifications","8.Cockpit/3.Account-Settings/notifications",{"title":1656,"path":1657,"stem":1658},"Preferences","/cockpit/account-settings/preferences","8.Cockpit/3.Account-Settings/preferences",{"title":1660,"path":1661,"stem":1662},"Security","/cockpit/account-settings/security","8.Cockpit/3.Account-Settings/security",{"title":1664,"path":1665,"stem":1666,"children":1667,"page":55},"Organisation Settings","/cockpit/organisation-settings","8.Cockpit/4.Organisation-Settings",[1668,1672,1676,1680,1684,1688],{"title":1669,"path":1670,"stem":1671},"API keys","/cockpit/organisation-settings/api-keys","8.Cockpit/4.Organisation-Settings/api-keys",{"title":1673,"path":1674,"stem":1675},"Billing","/cockpit/organisation-settings/billing","8.Cockpit/4.Organisation-Settings/billing",{"title":1677,"path":1678,"stem":1679},"General settings","/cockpit/organisation-settings/general-settings","8.Cockpit/4.Organisation-Settings/general-settings",{"title":1681,"path":1682,"stem":1683},"Members","/cockpit/organisation-settings/members","8.Cockpit/4.Organisation-Settings/members",{"title":1685,"path":1686,"stem":1687},"Projects","/cockpit/organisation-settings/projects","8.Cockpit/4.Organisation-Settings/projects",{"title":1689,"path":1690,"stem":1691},"Roles","/cockpit/organisation-settings/roles","8.Cockpit/4.Organisation-Settings/roles",{"title":1693,"path":1694,"stem":1695,"children":1696},"Offering","/offering","9.Offering/0.index",[1697,1698,1730,1743,1756],{"title":1693,"path":1694,"stem":1695},{"title":1699,"path":1700,"stem":1701,"children":1702},"Products","/offering/products","9.Offering/1.Products/0.index",[1703,1704,1709,1714,1719,1725],{"title":1699,"path":1700,"stem":1701},{"title":137,"path":1705,"stem":1706,"children":1707},"/offering/products/frontend","9.Offering/1.Products/1.Frontend/0.index",[1708],{"title":137,"path":1705,"stem":1706},{"title":1594,"path":1710,"stem":1711,"children":1712},"/offering/products/cockpit","9.Offering/1.Products/2.Cockpit/0.index",[1713],{"title":1594,"path":1710,"stem":1711},{"title":1523,"path":1715,"stem":1716,"children":1717},"/offering/products/checkout","9.Offering/1.Products/3.Checkout/0.index",[1718],{"title":1523,"path":1715,"stem":1716},{"title":1720,"path":1721,"stem":1722,"children":1723},"Cloud","/offering/products/cloud","9.Offering/1.Products/4.cloud/0.index",[1724],{"title":1720,"path":1721,"stem":1722},{"title":1529,"path":1726,"stem":1727,"children":1728},"/offering/products/larry-ai","9.Offering/1.Products/5.larry-ai/0.index",[1729],{"title":1529,"path":1726,"stem":1727},{"title":1731,"path":1732,"stem":1733,"children":1734,"page":55},"Service Level Agreement","/offering/service-level-agreement","9.Offering/2.service-level-agreement",[1735,1739],{"title":1736,"path":1737,"stem":1738},"Standard Service Level Agreement Composable Frontend","/offering/service-level-agreement/standard-service-level-agreement","9.Offering/2.service-level-agreement/1.standard-service-level-agreement",{"title":1740,"path":1741,"stem":1742},"Backups","/offering/service-level-agreement/backups","9.Offering/2.service-level-agreement/backups",{"title":1744,"path":1745,"stem":1746,"children":1747,"page":55},"Customer Support","/offering/customer-support","9.Offering/3.customer-support",[1748,1752],{"title":1749,"path":1750,"stem":1751},"Standard Customer Support","/offering/customer-support/standard-customer-support","9.Offering/3.customer-support/1.standard-customer-support",{"title":1753,"path":1754,"stem":1755},"Customer Support Severity Levels of Laioutr products","/offering/customer-support/maximum-serverity-levels","9.Offering/3.customer-support/maximum-serverity-levels",{"title":1757,"path":1758,"stem":1759,"children":1760,"page":55},"Compliance","/offering/compliance","9.Offering/4.Compliance",[1761],{"title":1762,"path":1763,"stem":1764},"Fair usage policy","/offering/compliance/fair-usage-policy","9.Offering/4.Compliance/fair-usage-policy",{"id":1766,"title":465,"aliases":1767,"body":1768,"description":3557,"extension":3558,"meta":3559,"navigation":1961,"path":466,"seo":3560,"sitemap":3563,"stem":467,"__hash__":3569},"docs/2.Apps/app-development/99.guides/schema-components-vs-ui-components.md",[],{"type":1769,"value":1770,"toc":3546},"minimark",[1771,1789,1801,1811,1821,1826,1829,1858,1861,1865,1878,2281,2295,2301,3154,3171,3175,3178,3287,3290,3294,3297,3303,3306,3309,3312,3316,3339,3345,3355,3434,3439,3444,3471,3481,3484,3488,3491,3506,3509,3513,3542],[1772,1773,1774,1775,1779,1780,1783,1784,1788],"p",{},"The ",[1776,1777,1778],"a",{"href":522},"section definitions"," and ",[1776,1781,1782],{"href":494},"block definitions"," pages show the simple case: definition and template live in one ",[1785,1786,1787],"code",{},".vue"," file. That is fine for a one-off section. As soon as your app grows past a handful of sections, or you want to reuse the same visual in two places, or unit-test the visual without touching Studio, keep the two concerns in two files.",[1772,1790,1791,1792,1796,1797,1800],{},"A ",[1793,1794,1795],"strong",{},"schema component"," is a Studio-facing wrapper. Its job is to declare the schema, derive props with ",[1785,1798,1799],{},"definitionToProps",", resolve runtime data (queries, links, entity components), and forward the result to the underlying visual. It owns no layout and no styling.",[1772,1802,1791,1803,1806,1807,1810],{},[1793,1804,1805],{},"UI component"," is a plain Vue component. Its job is to render markup from a typed props interface. It knows nothing about Studio, nothing about ",[1785,1808,1809],{},"defineBlock",", and nothing about query resolution. You could ship it in a component library.",[1812,1813,1819],"pre",{"className":1814,"code":1816,"language":1817,"meta":1818},[1815],"language-text","SectionHeroBanner.vue   ← schema component (thin, schema → props mapping)\n       │\n       ▼\nHeroBanner.vue          ← UI component (markup, styles, props in)\n","text","",[1785,1820,1816],{"__ignoreMap":1818},[1822,1823,1825],"h2",{"id":1824},"the-problem-with-co-located-definitions","The problem with co-located definitions",[1772,1827,1828],{},"When the definition lives in the same file as the template, every change to either side ripples through the other. Three things break in practice:",[1830,1831,1832,1846,1852],"ol",{},[1833,1834,1835,1838,1839,1842,1843,1845],"li",{},[1793,1836,1837],{},"The visual is not reusable."," You can't drop ",[1785,1840,1841],{},"SectionHeroBanner"," into a custom page outside Studio without dragging the whole ",[1785,1844,1799],{}," machinery (and the runtime that resolves it) along with it.",[1833,1847,1848,1851],{},[1793,1849,1850],{},"The visual is not unit-testable in isolation."," Tests have to mock or stub the definition layer, which makes them slow and brittle.",[1833,1853,1854,1857],{},[1793,1855,1856],{},"The schema bloats."," Every visual prop becomes a schema field by reflex, even when the visual prop is internal (a layout variant the editor should not see, a derived value).",[1772,1859,1860],{},"Splitting the two surfaces makes each independently changeable: the schema can grow without touching the visual, and the visual can be redesigned without re-deriving the schema.",[1822,1862,1864],{"id":1863},"the-split","The split",[1772,1866,1867,1868,1871,1872,1871,1874,1877],{},"Start with a pure UI component that takes its data as props. No ",[1785,1869,1870],{},"defineSection",", no ",[1785,1873,1799],{},[1785,1875,1876],{},"useQuery",". Just a typed Props interface and a template.",[1812,1879,1884],{"className":1880,"code":1881,"filename":1882,"language":1883,"meta":1818,"style":1818},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport type { Media } from '@laioutr-core/core-types/common';\n\nexport interface HeroBannerProps {\n  heading: string;\n  body?: string;\n  media?: Media;\n  layout?: 'centered' | 'split';\n}\n\ndefineProps\u003CHeroBannerProps>();\n\u003C/script>\n\n\u003Ctemplate>\n  \u003Csection :class=\"['hero-banner', `hero-banner--${layout ?? 'centered'}`]\">\n    \u003CMedia v-if=\"media\" :media=\"media\" class=\"hero-banner__media\" />\n    \u003Cdiv class=\"hero-banner__content\">\n      \u003Ch1>{{ heading }}\u003C/h1>\n      \u003Cdiv v-if=\"body\" v-html=\"body\" />\n      \u003Cslot />\n    \u003C/div>\n  \u003C/section>\n\u003C/template>\n","components/HeroBanner.vue","vue",[1785,1885,1886,1921,1956,1963,1979,1993,2006,2018,2045,2051,2056,2076,2086,2091,2101,2124,2170,2191,2211,2242,2252,2262,2272],{"__ignoreMap":1818},[1887,1888,1891,1895,1899,1903,1906,1909,1912,1916,1918],"span",{"class":1889,"line":1890},"line",1,[1887,1892,1894],{"class":1893},"sMK4o","\u003C",[1887,1896,1898],{"class":1897},"swJcz","script",[1887,1900,1902],{"class":1901},"spNyl"," setup",[1887,1904,1905],{"class":1901}," lang",[1887,1907,1908],{"class":1893},"=",[1887,1910,1911],{"class":1893},"\"",[1887,1913,1915],{"class":1914},"sfazB","ts",[1887,1917,1911],{"class":1893},[1887,1919,1920],{"class":1893},">\n",[1887,1922,1924,1928,1931,1934,1938,1941,1944,1947,1950,1953],{"class":1889,"line":1923},2,[1887,1925,1927],{"class":1926},"s7zQu","import",[1887,1929,1930],{"class":1926}," type",[1887,1932,1933],{"class":1893}," {",[1887,1935,1937],{"class":1936},"sTEyZ"," Media",[1887,1939,1940],{"class":1893}," }",[1887,1942,1943],{"class":1926}," from",[1887,1945,1946],{"class":1893}," '",[1887,1948,1949],{"class":1914},"@laioutr-core/core-types/common",[1887,1951,1952],{"class":1893},"'",[1887,1954,1955],{"class":1893},";\n",[1887,1957,1959],{"class":1889,"line":1958},3,[1887,1960,1962],{"emptyLinePlaceholder":1961},true,"\n",[1887,1964,1966,1969,1972,1976],{"class":1889,"line":1965},4,[1887,1967,1968],{"class":1926},"export",[1887,1970,1971],{"class":1901}," interface",[1887,1973,1975],{"class":1974},"sBMFI"," HeroBannerProps",[1887,1977,1978],{"class":1893}," {\n",[1887,1980,1982,1985,1988,1991],{"class":1889,"line":1981},5,[1887,1983,1984],{"class":1897},"  heading",[1887,1986,1987],{"class":1893},":",[1887,1989,1990],{"class":1974}," string",[1887,1992,1955],{"class":1893},[1887,1994,1996,1999,2002,2004],{"class":1889,"line":1995},6,[1887,1997,1998],{"class":1897},"  body",[1887,2000,2001],{"class":1893},"?:",[1887,2003,1990],{"class":1974},[1887,2005,1955],{"class":1893},[1887,2007,2009,2012,2014,2016],{"class":1889,"line":2008},7,[1887,2010,2011],{"class":1897},"  media",[1887,2013,2001],{"class":1893},[1887,2015,1937],{"class":1974},[1887,2017,1955],{"class":1893},[1887,2019,2021,2024,2026,2028,2031,2033,2036,2038,2041,2043],{"class":1889,"line":2020},8,[1887,2022,2023],{"class":1897},"  layout",[1887,2025,2001],{"class":1893},[1887,2027,1946],{"class":1893},[1887,2029,2030],{"class":1914},"centered",[1887,2032,1952],{"class":1893},[1887,2034,2035],{"class":1893}," |",[1887,2037,1946],{"class":1893},[1887,2039,2040],{"class":1914},"split",[1887,2042,1952],{"class":1893},[1887,2044,1955],{"class":1893},[1887,2046,2048],{"class":1889,"line":2047},9,[1887,2049,2050],{"class":1893},"}\n",[1887,2052,2054],{"class":1889,"line":2053},10,[1887,2055,1962],{"emptyLinePlaceholder":1961},[1887,2057,2059,2063,2065,2068,2071,2074],{"class":1889,"line":2058},11,[1887,2060,2062],{"class":2061},"s2Zo4","defineProps",[1887,2064,1894],{"class":1893},[1887,2066,2067],{"class":1974},"HeroBannerProps",[1887,2069,2070],{"class":1893},">",[1887,2072,2073],{"class":1936},"()",[1887,2075,1955],{"class":1893},[1887,2077,2079,2082,2084],{"class":1889,"line":2078},12,[1887,2080,2081],{"class":1893},"\u003C/",[1887,2083,1898],{"class":1897},[1887,2085,1920],{"class":1893},[1887,2087,2089],{"class":1889,"line":2088},13,[1887,2090,1962],{"emptyLinePlaceholder":1961},[1887,2092,2094,2096,2099],{"class":1889,"line":2093},14,[1887,2095,1894],{"class":1893},[1887,2097,2098],{"class":1897},"template",[1887,2100,1920],{"class":1893},[1887,2102,2104,2107,2110,2113,2115,2117,2120,2122],{"class":1889,"line":2103},15,[1887,2105,2106],{"class":1893},"  \u003C",[1887,2108,2109],{"class":1897},"section",[1887,2111,2112],{"class":1901}," :class",[1887,2114,1908],{"class":1893},[1887,2116,1911],{"class":1893},[1887,2118,2119],{"class":1914},"['hero-banner', `hero-banner--${layout ?? 'centered'}`]",[1887,2121,1911],{"class":1893},[1887,2123,1920],{"class":1893},[1887,2125,2127,2130,2132,2135,2137,2139,2142,2144,2147,2149,2151,2153,2155,2158,2160,2162,2165,2167],{"class":1889,"line":2126},16,[1887,2128,2129],{"class":1893},"    \u003C",[1887,2131,381],{"class":1897},[1887,2133,2134],{"class":1901}," v-if",[1887,2136,1908],{"class":1893},[1887,2138,1911],{"class":1893},[1887,2140,2141],{"class":1914},"media",[1887,2143,1911],{"class":1893},[1887,2145,2146],{"class":1901}," :media",[1887,2148,1908],{"class":1893},[1887,2150,1911],{"class":1893},[1887,2152,2141],{"class":1914},[1887,2154,1911],{"class":1893},[1887,2156,2157],{"class":1901}," class",[1887,2159,1908],{"class":1893},[1887,2161,1911],{"class":1893},[1887,2163,2164],{"class":1914},"hero-banner__media",[1887,2166,1911],{"class":1893},[1887,2168,2169],{"class":1893}," />\n",[1887,2171,2173,2175,2178,2180,2182,2184,2187,2189],{"class":1889,"line":2172},17,[1887,2174,2129],{"class":1893},[1887,2176,2177],{"class":1897},"div",[1887,2179,2157],{"class":1901},[1887,2181,1908],{"class":1893},[1887,2183,1911],{"class":1893},[1887,2185,2186],{"class":1914},"hero-banner__content",[1887,2188,1911],{"class":1893},[1887,2190,1920],{"class":1893},[1887,2192,2194,2197,2200,2202,2205,2207,2209],{"class":1889,"line":2193},18,[1887,2195,2196],{"class":1893},"      \u003C",[1887,2198,2199],{"class":1897},"h1",[1887,2201,2070],{"class":1893},[1887,2203,2204],{"class":1936},"{{ heading }}",[1887,2206,2081],{"class":1893},[1887,2208,2199],{"class":1897},[1887,2210,1920],{"class":1893},[1887,2212,2214,2216,2218,2220,2222,2224,2227,2229,2232,2234,2236,2238,2240],{"class":1889,"line":2213},19,[1887,2215,2196],{"class":1893},[1887,2217,2177],{"class":1897},[1887,2219,2134],{"class":1901},[1887,2221,1908],{"class":1893},[1887,2223,1911],{"class":1893},[1887,2225,2226],{"class":1914},"body",[1887,2228,1911],{"class":1893},[1887,2230,2231],{"class":1901}," v-html",[1887,2233,1908],{"class":1893},[1887,2235,1911],{"class":1893},[1887,2237,2226],{"class":1914},[1887,2239,1911],{"class":1893},[1887,2241,2169],{"class":1893},[1887,2243,2245,2247,2250],{"class":1889,"line":2244},20,[1887,2246,2196],{"class":1893},[1887,2248,2249],{"class":1897},"slot",[1887,2251,2169],{"class":1893},[1887,2253,2255,2258,2260],{"class":1889,"line":2254},21,[1887,2256,2257],{"class":1893},"    \u003C/",[1887,2259,2177],{"class":1897},[1887,2261,1920],{"class":1893},[1887,2263,2265,2268,2270],{"class":1889,"line":2264},22,[1887,2266,2267],{"class":1893},"  \u003C/",[1887,2269,2109],{"class":1897},[1887,2271,1920],{"class":1893},[1887,2273,2275,2277,2279],{"class":1889,"line":2274},23,[1887,2276,2081],{"class":1893},[1887,2278,2098],{"class":1897},[1887,2280,1920],{"class":1893},[1772,2282,2283,2284,2286,2287,2290,2291,2294],{},"The UI component takes a ",[1785,2285,381],{}," directly and renders it through the platform's ",[1785,2288,2289],{},"\u003CMedia>"," component, which handles responsive sources and nuxt-image providers. No flattening to a raw ",[1785,2292,2293],{},"src"," string.",[1772,2296,2297,2298,2300],{},"Then write a schema component next to it. The schema component owns the ",[1785,2299,1870],{}," call, derives its props from the schema, and renders the UI component.",[1812,2302,2305],{"className":1880,"code":2303,"filename":2304,"language":1883,"meta":1818,"style":1818},"\u003Cscript lang=\"ts\">\nimport { defineSection, definitionToProps } from '#imports';\n\nexport const definition = defineSection({\n  component: 'SectionHeroBanner',\n  studio: {\n    label: 'Hero Banner',\n    description: 'A full-width banner with heading, media, and a call-to-action button.',\n    tags: ['Heroes', 'Banner'],\n  },\n  slots: [{ name: 'default', studio: { label: 'Content' } }],\n  schema: [\n    {\n      label: 'Content',\n      fields: [\n        { type: 'text', name: 'heading', label: 'Heading' },\n        { type: 'richtext', name: 'body', label: 'Body Text' },\n        { type: 'media', name: 'media', label: 'Background Image', allowedTypes: ['image'] },\n      ],\n    },\n    {\n      label: 'Design',\n      defaultOpen: false,\n      fields: [\n        {\n          type: 'select',\n          name: 'variant',\n          label: 'Layout',\n          default: 'centered',\n          options: [\n            { label: 'Centered', value: 'centered' },\n            { label: 'Split', value: 'split' },\n          ],\n        },\n      ],\n    },\n  ],\n});\n\u003C/script>\n\n\u003Cscript setup lang=\"ts\">\nimport HeroBanner from '../components/HeroBanner.vue';\n\nconst props = defineProps(definitionToProps(definition));\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CHeroBanner\n    :heading=\"heading\"\n    :body=\"body\"\n    :media=\"media\"\n    :layout=\"variant\"\n  >\n    \u003Cslot />\n  \u003C/HeroBanner>\n\u003C/template>\n","sections/SectionHeroBanner.vue",[1785,2306,2307,2325,2353,2357,2377,2393,2402,2418,2434,2464,2469,2521,2531,2536,2551,2560,2604,2646,2707,2714,2719,2723,2738,2751,2760,2766,2783,2800,2816,2832,2842,2874,2904,2912,2918,2925,2930,2938,2949,2958,2963,2984,3004,3009,3032,3041,3046,3055,3063,3078,3092,3106,3120,3126,3135,3145],{"__ignoreMap":1818},[1887,2308,2309,2311,2313,2315,2317,2319,2321,2323],{"class":1889,"line":1890},[1887,2310,1894],{"class":1893},[1887,2312,1898],{"class":1897},[1887,2314,1905],{"class":1901},[1887,2316,1908],{"class":1893},[1887,2318,1911],{"class":1893},[1887,2320,1915],{"class":1914},[1887,2322,1911],{"class":1893},[1887,2324,1920],{"class":1893},[1887,2326,2327,2329,2331,2334,2337,2340,2342,2344,2346,2349,2351],{"class":1889,"line":1923},[1887,2328,1927],{"class":1926},[1887,2330,1933],{"class":1893},[1887,2332,2333],{"class":1936}," defineSection",[1887,2335,2336],{"class":1893},",",[1887,2338,2339],{"class":1936}," definitionToProps",[1887,2341,1940],{"class":1893},[1887,2343,1943],{"class":1926},[1887,2345,1946],{"class":1893},[1887,2347,2348],{"class":1914},"#imports",[1887,2350,1952],{"class":1893},[1887,2352,1955],{"class":1893},[1887,2354,2355],{"class":1889,"line":1958},[1887,2356,1962],{"emptyLinePlaceholder":1961},[1887,2358,2359,2361,2364,2367,2369,2371,2374],{"class":1889,"line":1965},[1887,2360,1968],{"class":1926},[1887,2362,2363],{"class":1901}," const",[1887,2365,2366],{"class":1936}," definition ",[1887,2368,1908],{"class":1893},[1887,2370,2333],{"class":2061},[1887,2372,2373],{"class":1936},"(",[1887,2375,2376],{"class":1893},"{\n",[1887,2378,2379,2382,2384,2386,2388,2390],{"class":1889,"line":1981},[1887,2380,2381],{"class":1897},"  component",[1887,2383,1987],{"class":1893},[1887,2385,1946],{"class":1893},[1887,2387,1841],{"class":1914},[1887,2389,1952],{"class":1893},[1887,2391,2392],{"class":1893},",\n",[1887,2394,2395,2398,2400],{"class":1889,"line":1995},[1887,2396,2397],{"class":1897},"  studio",[1887,2399,1987],{"class":1893},[1887,2401,1978],{"class":1893},[1887,2403,2404,2407,2409,2411,2414,2416],{"class":1889,"line":2008},[1887,2405,2406],{"class":1897},"    label",[1887,2408,1987],{"class":1893},[1887,2410,1946],{"class":1893},[1887,2412,2413],{"class":1914},"Hero Banner",[1887,2415,1952],{"class":1893},[1887,2417,2392],{"class":1893},[1887,2419,2420,2423,2425,2427,2430,2432],{"class":1889,"line":2020},[1887,2421,2422],{"class":1897},"    description",[1887,2424,1987],{"class":1893},[1887,2426,1946],{"class":1893},[1887,2428,2429],{"class":1914},"A full-width banner with heading, media, and a call-to-action button.",[1887,2431,1952],{"class":1893},[1887,2433,2392],{"class":1893},[1887,2435,2436,2439,2441,2444,2446,2449,2451,2453,2455,2457,2459,2462],{"class":1889,"line":2047},[1887,2437,2438],{"class":1897},"    tags",[1887,2440,1987],{"class":1893},[1887,2442,2443],{"class":1936}," [",[1887,2445,1952],{"class":1893},[1887,2447,2448],{"class":1914},"Heroes",[1887,2450,1952],{"class":1893},[1887,2452,2336],{"class":1893},[1887,2454,1946],{"class":1893},[1887,2456,674],{"class":1914},[1887,2458,1952],{"class":1893},[1887,2460,2461],{"class":1936},"]",[1887,2463,2392],{"class":1893},[1887,2465,2466],{"class":1889,"line":2053},[1887,2467,2468],{"class":1893},"  },\n",[1887,2470,2471,2474,2476,2478,2481,2484,2486,2488,2491,2493,2495,2498,2500,2502,2505,2507,2509,2511,2513,2515,2517,2519],{"class":1889,"line":2058},[1887,2472,2473],{"class":1897},"  slots",[1887,2475,1987],{"class":1893},[1887,2477,2443],{"class":1936},[1887,2479,2480],{"class":1893},"{",[1887,2482,2483],{"class":1897}," name",[1887,2485,1987],{"class":1893},[1887,2487,1946],{"class":1893},[1887,2489,2490],{"class":1914},"default",[1887,2492,1952],{"class":1893},[1887,2494,2336],{"class":1893},[1887,2496,2497],{"class":1897}," studio",[1887,2499,1987],{"class":1893},[1887,2501,1933],{"class":1893},[1887,2503,2504],{"class":1897}," label",[1887,2506,1987],{"class":1893},[1887,2508,1946],{"class":1893},[1887,2510,1263],{"class":1914},[1887,2512,1952],{"class":1893},[1887,2514,1940],{"class":1893},[1887,2516,1940],{"class":1893},[1887,2518,2461],{"class":1936},[1887,2520,2392],{"class":1893},[1887,2522,2523,2526,2528],{"class":1889,"line":2078},[1887,2524,2525],{"class":1897},"  schema",[1887,2527,1987],{"class":1893},[1887,2529,2530],{"class":1936}," [\n",[1887,2532,2533],{"class":1889,"line":2088},[1887,2534,2535],{"class":1893},"    {\n",[1887,2537,2538,2541,2543,2545,2547,2549],{"class":1889,"line":2093},[1887,2539,2540],{"class":1897},"      label",[1887,2542,1987],{"class":1893},[1887,2544,1946],{"class":1893},[1887,2546,1263],{"class":1914},[1887,2548,1952],{"class":1893},[1887,2550,2392],{"class":1893},[1887,2552,2553,2556,2558],{"class":1889,"line":2103},[1887,2554,2555],{"class":1897},"      fields",[1887,2557,1987],{"class":1893},[1887,2559,2530],{"class":1936},[1887,2561,2562,2565,2567,2569,2571,2573,2575,2577,2579,2581,2583,2586,2588,2590,2592,2594,2596,2599,2601],{"class":1889,"line":2126},[1887,2563,2564],{"class":1893},"        {",[1887,2566,1930],{"class":1897},[1887,2568,1987],{"class":1893},[1887,2570,1946],{"class":1893},[1887,2572,1817],{"class":1914},[1887,2574,1952],{"class":1893},[1887,2576,2336],{"class":1893},[1887,2578,2483],{"class":1897},[1887,2580,1987],{"class":1893},[1887,2582,1946],{"class":1893},[1887,2584,2585],{"class":1914},"heading",[1887,2587,1952],{"class":1893},[1887,2589,2336],{"class":1893},[1887,2591,2504],{"class":1897},[1887,2593,1987],{"class":1893},[1887,2595,1946],{"class":1893},[1887,2597,2598],{"class":1914},"Heading",[1887,2600,1952],{"class":1893},[1887,2602,2603],{"class":1893}," },\n",[1887,2605,2606,2608,2610,2612,2614,2617,2619,2621,2623,2625,2627,2629,2631,2633,2635,2637,2639,2642,2644],{"class":1889,"line":2172},[1887,2607,2564],{"class":1893},[1887,2609,1930],{"class":1897},[1887,2611,1987],{"class":1893},[1887,2613,1946],{"class":1893},[1887,2615,2616],{"class":1914},"richtext",[1887,2618,1952],{"class":1893},[1887,2620,2336],{"class":1893},[1887,2622,2483],{"class":1897},[1887,2624,1987],{"class":1893},[1887,2626,1946],{"class":1893},[1887,2628,2226],{"class":1914},[1887,2630,1952],{"class":1893},[1887,2632,2336],{"class":1893},[1887,2634,2504],{"class":1897},[1887,2636,1987],{"class":1893},[1887,2638,1946],{"class":1893},[1887,2640,2641],{"class":1914},"Body Text",[1887,2643,1952],{"class":1893},[1887,2645,2603],{"class":1893},[1887,2647,2648,2650,2652,2654,2656,2658,2660,2662,2664,2666,2668,2670,2672,2674,2676,2678,2680,2683,2685,2687,2690,2692,2694,2696,2699,2701,2704],{"class":1889,"line":2193},[1887,2649,2564],{"class":1893},[1887,2651,1930],{"class":1897},[1887,2653,1987],{"class":1893},[1887,2655,1946],{"class":1893},[1887,2657,2141],{"class":1914},[1887,2659,1952],{"class":1893},[1887,2661,2336],{"class":1893},[1887,2663,2483],{"class":1897},[1887,2665,1987],{"class":1893},[1887,2667,1946],{"class":1893},[1887,2669,2141],{"class":1914},[1887,2671,1952],{"class":1893},[1887,2673,2336],{"class":1893},[1887,2675,2504],{"class":1897},[1887,2677,1987],{"class":1893},[1887,2679,1946],{"class":1893},[1887,2681,2682],{"class":1914},"Background Image",[1887,2684,1952],{"class":1893},[1887,2686,2336],{"class":1893},[1887,2688,2689],{"class":1897}," allowedTypes",[1887,2691,1987],{"class":1893},[1887,2693,2443],{"class":1936},[1887,2695,1952],{"class":1893},[1887,2697,2698],{"class":1914},"image",[1887,2700,1952],{"class":1893},[1887,2702,2703],{"class":1936},"] ",[1887,2705,2706],{"class":1893},"},\n",[1887,2708,2709,2712],{"class":1889,"line":2213},[1887,2710,2711],{"class":1936},"      ]",[1887,2713,2392],{"class":1893},[1887,2715,2716],{"class":1889,"line":2244},[1887,2717,2718],{"class":1893},"    },\n",[1887,2720,2721],{"class":1889,"line":2254},[1887,2722,2535],{"class":1893},[1887,2724,2725,2727,2729,2731,2734,2736],{"class":1889,"line":2264},[1887,2726,2540],{"class":1897},[1887,2728,1987],{"class":1893},[1887,2730,1946],{"class":1893},[1887,2732,2733],{"class":1914},"Design",[1887,2735,1952],{"class":1893},[1887,2737,2392],{"class":1893},[1887,2739,2740,2743,2745,2749],{"class":1889,"line":2274},[1887,2741,2742],{"class":1897},"      defaultOpen",[1887,2744,1987],{"class":1893},[1887,2746,2748],{"class":2747},"sfNiH"," false",[1887,2750,2392],{"class":1893},[1887,2752,2754,2756,2758],{"class":1889,"line":2753},24,[1887,2755,2555],{"class":1897},[1887,2757,1987],{"class":1893},[1887,2759,2530],{"class":1936},[1887,2761,2763],{"class":1889,"line":2762},25,[1887,2764,2765],{"class":1893},"        {\n",[1887,2767,2769,2772,2774,2776,2779,2781],{"class":1889,"line":2768},26,[1887,2770,2771],{"class":1897},"          type",[1887,2773,1987],{"class":1893},[1887,2775,1946],{"class":1893},[1887,2777,2778],{"class":1914},"select",[1887,2780,1952],{"class":1893},[1887,2782,2392],{"class":1893},[1887,2784,2786,2789,2791,2793,2796,2798],{"class":1889,"line":2785},27,[1887,2787,2788],{"class":1897},"          name",[1887,2790,1987],{"class":1893},[1887,2792,1946],{"class":1893},[1887,2794,2795],{"class":1914},"variant",[1887,2797,1952],{"class":1893},[1887,2799,2392],{"class":1893},[1887,2801,2803,2806,2808,2810,2812,2814],{"class":1889,"line":2802},28,[1887,2804,2805],{"class":1897},"          label",[1887,2807,1987],{"class":1893},[1887,2809,1946],{"class":1893},[1887,2811,1242],{"class":1914},[1887,2813,1952],{"class":1893},[1887,2815,2392],{"class":1893},[1887,2817,2819,2822,2824,2826,2828,2830],{"class":1889,"line":2818},29,[1887,2820,2821],{"class":1897},"          default",[1887,2823,1987],{"class":1893},[1887,2825,1946],{"class":1893},[1887,2827,2030],{"class":1914},[1887,2829,1952],{"class":1893},[1887,2831,2392],{"class":1893},[1887,2833,2835,2838,2840],{"class":1889,"line":2834},30,[1887,2836,2837],{"class":1897},"          options",[1887,2839,1987],{"class":1893},[1887,2841,2530],{"class":1936},[1887,2843,2845,2848,2850,2852,2854,2857,2859,2861,2864,2866,2868,2870,2872],{"class":1889,"line":2844},31,[1887,2846,2847],{"class":1893},"            {",[1887,2849,2504],{"class":1897},[1887,2851,1987],{"class":1893},[1887,2853,1946],{"class":1893},[1887,2855,2856],{"class":1914},"Centered",[1887,2858,1952],{"class":1893},[1887,2860,2336],{"class":1893},[1887,2862,2863],{"class":1897}," value",[1887,2865,1987],{"class":1893},[1887,2867,1946],{"class":1893},[1887,2869,2030],{"class":1914},[1887,2871,1952],{"class":1893},[1887,2873,2603],{"class":1893},[1887,2875,2877,2879,2881,2883,2885,2888,2890,2892,2894,2896,2898,2900,2902],{"class":1889,"line":2876},32,[1887,2878,2847],{"class":1893},[1887,2880,2504],{"class":1897},[1887,2882,1987],{"class":1893},[1887,2884,1946],{"class":1893},[1887,2886,2887],{"class":1914},"Split",[1887,2889,1952],{"class":1893},[1887,2891,2336],{"class":1893},[1887,2893,2863],{"class":1897},[1887,2895,1987],{"class":1893},[1887,2897,1946],{"class":1893},[1887,2899,2040],{"class":1914},[1887,2901,1952],{"class":1893},[1887,2903,2603],{"class":1893},[1887,2905,2907,2910],{"class":1889,"line":2906},33,[1887,2908,2909],{"class":1936},"          ]",[1887,2911,2392],{"class":1893},[1887,2913,2915],{"class":1889,"line":2914},34,[1887,2916,2917],{"class":1893},"        },\n",[1887,2919,2921,2923],{"class":1889,"line":2920},35,[1887,2922,2711],{"class":1936},[1887,2924,2392],{"class":1893},[1887,2926,2928],{"class":1889,"line":2927},36,[1887,2929,2718],{"class":1893},[1887,2931,2933,2936],{"class":1889,"line":2932},37,[1887,2934,2935],{"class":1936},"  ]",[1887,2937,2392],{"class":1893},[1887,2939,2941,2944,2947],{"class":1889,"line":2940},38,[1887,2942,2943],{"class":1893},"}",[1887,2945,2946],{"class":1936},")",[1887,2948,1955],{"class":1893},[1887,2950,2952,2954,2956],{"class":1889,"line":2951},39,[1887,2953,2081],{"class":1893},[1887,2955,1898],{"class":1897},[1887,2957,1920],{"class":1893},[1887,2959,2961],{"class":1889,"line":2960},40,[1887,2962,1962],{"emptyLinePlaceholder":1961},[1887,2964,2966,2968,2970,2972,2974,2976,2978,2980,2982],{"class":1889,"line":2965},41,[1887,2967,1894],{"class":1893},[1887,2969,1898],{"class":1897},[1887,2971,1902],{"class":1901},[1887,2973,1905],{"class":1901},[1887,2975,1908],{"class":1893},[1887,2977,1911],{"class":1893},[1887,2979,1915],{"class":1914},[1887,2981,1911],{"class":1893},[1887,2983,1920],{"class":1893},[1887,2985,2987,2989,2992,2995,2997,3000,3002],{"class":1889,"line":2986},42,[1887,2988,1927],{"class":1926},[1887,2990,2991],{"class":1936}," HeroBanner ",[1887,2993,2994],{"class":1926},"from",[1887,2996,1946],{"class":1893},[1887,2998,2999],{"class":1914},"../components/HeroBanner.vue",[1887,3001,1952],{"class":1893},[1887,3003,1955],{"class":1893},[1887,3005,3007],{"class":1889,"line":3006},43,[1887,3008,1962],{"emptyLinePlaceholder":1961},[1887,3010,3012,3015,3018,3020,3023,3025,3027,3030],{"class":1889,"line":3011},44,[1887,3013,3014],{"class":1901},"const",[1887,3016,3017],{"class":1936}," props ",[1887,3019,1908],{"class":1893},[1887,3021,3022],{"class":2061}," defineProps",[1887,3024,2373],{"class":1936},[1887,3026,1799],{"class":2061},[1887,3028,3029],{"class":1936},"(definition))",[1887,3031,1955],{"class":1893},[1887,3033,3035,3037,3039],{"class":1889,"line":3034},45,[1887,3036,2081],{"class":1893},[1887,3038,1898],{"class":1897},[1887,3040,1920],{"class":1893},[1887,3042,3044],{"class":1889,"line":3043},46,[1887,3045,1962],{"emptyLinePlaceholder":1961},[1887,3047,3049,3051,3053],{"class":1889,"line":3048},47,[1887,3050,1894],{"class":1893},[1887,3052,2098],{"class":1897},[1887,3054,1920],{"class":1893},[1887,3056,3058,3060],{"class":1889,"line":3057},48,[1887,3059,2106],{"class":1893},[1887,3061,3062],{"class":1897},"HeroBanner\n",[1887,3064,3066,3069,3071,3073,3075],{"class":1889,"line":3065},49,[1887,3067,3068],{"class":1901},"    :heading",[1887,3070,1908],{"class":1893},[1887,3072,1911],{"class":1893},[1887,3074,2585],{"class":1914},[1887,3076,3077],{"class":1893},"\"\n",[1887,3079,3081,3084,3086,3088,3090],{"class":1889,"line":3080},50,[1887,3082,3083],{"class":1901},"    :body",[1887,3085,1908],{"class":1893},[1887,3087,1911],{"class":1893},[1887,3089,2226],{"class":1914},[1887,3091,3077],{"class":1893},[1887,3093,3095,3098,3100,3102,3104],{"class":1889,"line":3094},51,[1887,3096,3097],{"class":1901},"    :media",[1887,3099,1908],{"class":1893},[1887,3101,1911],{"class":1893},[1887,3103,2141],{"class":1914},[1887,3105,3077],{"class":1893},[1887,3107,3109,3112,3114,3116,3118],{"class":1889,"line":3108},52,[1887,3110,3111],{"class":1901},"    :layout",[1887,3113,1908],{"class":1893},[1887,3115,1911],{"class":1893},[1887,3117,2795],{"class":1914},[1887,3119,3077],{"class":1893},[1887,3121,3123],{"class":1889,"line":3122},53,[1887,3124,3125],{"class":1893},"  >\n",[1887,3127,3129,3131,3133],{"class":1889,"line":3128},54,[1887,3130,2129],{"class":1893},[1887,3132,2249],{"class":1897},[1887,3134,2169],{"class":1893},[1887,3136,3138,3140,3143],{"class":1889,"line":3137},55,[1887,3139,2267],{"class":1893},[1887,3141,3142],{"class":1897},"HeroBanner",[1887,3144,1920],{"class":1893},[1887,3146,3148,3150,3152],{"class":1889,"line":3147},56,[1887,3149,2081],{"class":1893},[1887,3151,2098],{"class":1897},[1887,3153,1920],{"class":1893},[1772,3155,3156,3157,3160,3161,3163,3164,3167,3168,3170],{},"The schema component is now a ",[1793,3158,3159],{},"mapping layer",": schema-shaped data goes in, UI-component props come out. It is the only place that knows about runtime fallbacks, query resolution, or renaming a canonical schema field to the UI component's prop name (here, ",[1785,3162,2795],{}," from the schema becomes ",[1785,3165,3166],{},"layout"," on the UI component). Everything visual is delegated to ",[1785,3169,3142],{},".",[1822,3172,3174],{"id":3173},"what-goes-where","What goes where",[1772,3176,3177],{},"The split is sharper than it looks at first. Keep this checklist in mind:",[3179,3180,3181,3196],"table",{},[3182,3183,3184],"thead",{},[3185,3186,3187,3191,3194],"tr",{},[3188,3189,3190],"th",{},"Concern",[3188,3192,3193],{},"Schema component",[3188,3195,1805],{},[3197,3198,3199,3215,3225,3234,3243,3256,3265,3278],"tbody",{},[3185,3200,3201,3210,3213],{},[3202,3203,3204,3206,3207,3209],"td",{},[1785,3205,1870],{}," / ",[1785,3208,1809],{}," call",[3202,3211,3212],{},"✓",[3202,3214],{},[3185,3216,3217,3221,3223],{},[3202,3218,3219],{},[1785,3220,1799],{},[3202,3222,3212],{},[3202,3224],{},[3185,3226,3227,3230,3232],{},[3202,3228,3229],{},"Renaming canonical schema fields to UI props",[3202,3231,3212],{},[3202,3233],{},[3185,3235,3236,3239,3241],{},[3202,3237,3238],{},"Resolving runtime data (queries, link helpers)",[3202,3240,3212],{},[3202,3242],{},[3185,3244,3245,3252,3254],{},[3202,3246,3247,3248,3251],{},"Vue ",[1785,3249,3250],{},"\u003Ctemplate>"," markup, classes, styles",[3202,3253],{},[3202,3255,3212],{},[3185,3257,3258,3261,3263],{},[3202,3259,3260],{},"Layout variants, slots, sub-components",[3202,3262],{},[3202,3264,3212],{},[3185,3266,3267,3274,3276],{},[3202,3268,3269,3270,3273],{},"CSS (",[1785,3271,3272],{},"@layer",", BEM blocks, tokens)",[3202,3275],{},[3202,3277,3212],{},[3185,3279,3280,3283,3285],{},[3202,3281,3282],{},"Storybook stories",[3202,3284],{},[3202,3286,3212],{},[1772,3288,3289],{},"A useful heuristic: if you could not write a Storybook story for a piece of behavior, it does not belong in the UI component.",[1822,3291,3293],{"id":3292},"why-this-pays-off","Why this pays off",[1772,3295,3296],{},"The UI component can render anywhere: a custom checkout page, an internal admin tool, an email preview. None of those need the Studio runtime in scope.",[1772,3298,3299,3300,3302],{},"You can test the visual in isolation. Mount ",[1785,3301,3142],{}," in a Vitest + Vue Test Utils setup with plain props. No Studio, no Frontend Core, no mocks.",[1772,3304,3305],{},"The visual API stays stable. When you redesign the UI component you change one file. The schema component is untouched as long as the props interface holds. When the schema grows a new field, the UI component does not see it until you wire it through.",[1772,3307,3308],{},"Internal layout knobs (think: \"tablet breakpoint for the column gap\") stay as defaults on the UI component instead of leaking into Studio as fields no editor should ever touch.",[1772,3310,3311],{},"Designers and contributors less familiar with Laioutr can iterate on the UI component without learning the schema system.",[1822,3313,3315],{"id":3314},"file-conventions","File conventions",[1772,3317,3318,3319,3322,3323,3326,3327,3330,3331,3334,3335,3338],{},"Both files live in your app's ",[1785,3320,3321],{},"runtime/app/"," tree. Keep schema components in ",[1785,3324,3325],{},"sections/"," or ",[1785,3328,3329],{},"blocks/"," (this is what gets registered with ",[1785,3332,3333],{},"registerLaioutrApp","), and keep UI components in a sibling ",[1785,3336,3337],{},"components/"," directory:",[1812,3340,3343],{"className":3341,"code":3342,"language":1817,"meta":1818},[1815],"src/runtime/app/\n  components/\n    HeroBanner.vue\n    ProductCard.vue\n  sections/\n    SectionHeroBanner.vue\n  blocks/\n    BlockProductCard.vue\n",[1785,3344,3342],{"__ignoreMap":1818},[1772,3346,3347,3348,1779,3350,3352,3353,1987],{},"Only the ",[1785,3349,3325],{},[1785,3351,3329],{}," directories are passed to ",[1785,3354,3333],{},[1812,3356,3360],{"className":3357,"code":3358,"filename":3359,"language":1915,"meta":1818,"style":1818},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","registerLaioutrApp({\n  sections: [resolve('./runtime/app/sections')],\n  blocks: [resolve('./runtime/app/blocks')],\n  // components/ is intentionally not registered. It is imported directly.\n});\n","module.ts",[1785,3361,3362,3370,3396,3420,3426],{"__ignoreMap":1818},[1887,3363,3364,3366,3368],{"class":1889,"line":1890},[1887,3365,3333],{"class":2061},[1887,3367,2373],{"class":1936},[1887,3369,2376],{"class":1893},[1887,3371,3372,3375,3377,3379,3382,3384,3386,3389,3391,3394],{"class":1889,"line":1923},[1887,3373,3374],{"class":1897},"  sections",[1887,3376,1987],{"class":1893},[1887,3378,2443],{"class":1936},[1887,3380,3381],{"class":2061},"resolve",[1887,3383,2373],{"class":1936},[1887,3385,1952],{"class":1893},[1887,3387,3388],{"class":1914},"./runtime/app/sections",[1887,3390,1952],{"class":1893},[1887,3392,3393],{"class":1936},")]",[1887,3395,2392],{"class":1893},[1887,3397,3398,3401,3403,3405,3407,3409,3411,3414,3416,3418],{"class":1889,"line":1958},[1887,3399,3400],{"class":1897},"  blocks",[1887,3402,1987],{"class":1893},[1887,3404,2443],{"class":1936},[1887,3406,3381],{"class":2061},[1887,3408,2373],{"class":1936},[1887,3410,1952],{"class":1893},[1887,3412,3413],{"class":1914},"./runtime/app/blocks",[1887,3415,1952],{"class":1893},[1887,3417,3393],{"class":1936},[1887,3419,2392],{"class":1893},[1887,3421,3422],{"class":1889,"line":1965},[1887,3423,3425],{"class":3424},"sHwdD","  // components/ is intentionally not registered. It is imported directly.\n",[1887,3427,3428,3430,3432],{"class":1889,"line":1981},[1887,3429,2943],{"class":1893},[1887,3431,2946],{"class":1936},[1887,3433,1955],{"class":1893},[1772,3435,1774,3436,3438],{},[1785,3437,3337],{}," directory is for your own internal imports. It is not auto-discovered, and it is not exposed to Studio.",[3440,3441,3443],"h3",{"id":3442},"naming","Naming",[1772,3445,3446,3447,3326,3450,3453,3454,3457,3458,3461,3462,3465,3466,3206,3468,3470],{},"Schema components keep the ",[1785,3448,3449],{},"Section",[1785,3451,3452],{},"Block"," prefix: ",[1785,3455,3456],{},"SectionHeroBanner.vue",", ",[1785,3459,3460],{},"BlockProductCard.vue",". The ",[1785,3463,3464],{},"component"," string passed to ",[1785,3467,1870],{},[1785,3469,1809],{}," must match the filename verbatim.",[1772,3472,3473,3474,3457,3477,3480],{},"UI components drop the prefix: ",[1785,3475,3476],{},"HeroBanner.vue",[1785,3478,3479],{},"ProductCard.vue",". The name describes the visual, not the Studio role.",[1772,3482,3483],{},"A 1:1 correspondence between a schema component and its UI component is the default. If you find one schema component pulling in several UI components, look closely. You may be hiding a layout decision in the wrapper that belongs in a new UI component.",[1822,3485,3487],{"id":3486},"when-not-to-split","When not to split",[1772,3489,3490],{},"The split is not free. If your section has no real visual logic (a divider, a fixed-content footer, a thin wrapper around a single ui-kit primitive), co-locating the definition and the template in one file is fine. Reach for the split when at least one of these is true:",[3492,3493,3494,3497,3500,3503],"ul",{},[1833,3495,3496],{},"You want to reuse the visual outside Studio.",[1833,3498,3499],{},"You want Storybook stories or unit tests for the visual.",[1833,3501,3502],{},"The template is more than a handful of lines of markup, or it pulls in multiple sub-components.",[1833,3504,3505],{},"The schema has internal layout knobs that should not be editor-facing.",[1772,3507,3508],{},"Co-located definitions are a starting point, not the destination. When a section earns the split, do it. The cost of leaving it co-located grows faster than the cost of the refactor.",[1822,3510,3512],{"id":3511},"related","Related",[3492,3514,3515,3525,3532,3537],{},[1833,3516,3517,3519,3520,1779,3522,3524],{},[1776,3518,521],{"href":522}," for the ",[1785,3521,1870],{},[1785,3523,1799],{}," reference.",[1833,3526,3527,3519,3529,3531],{},[1776,3528,493],{"href":494},[1785,3530,1809],{}," reference and the standalone / non-standalone distinction.",[1833,3533,3534,3536],{},[1776,3535,517],{"href":518}," for the full field-type catalog the schema component declares.",[1833,3538,3539,3541],{},[1776,3540,497],{"href":498}," for naming, file layout, and registration conventions.",[3543,3544,3545],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}",{"title":1818,"searchDepth":1923,"depth":1923,"links":3547},[3548,3549,3550,3551,3552,3555,3556],{"id":1824,"depth":1923,"text":1825},{"id":1863,"depth":1923,"text":1864},{"id":3173,"depth":1923,"text":3174},{"id":3292,"depth":1923,"text":3293},{"id":3314,"depth":1923,"text":3315,"children":3553},[3554],{"id":3442,"depth":1958,"text":3443},{"id":3486,"depth":1923,"text":3487},{"id":3511,"depth":1923,"text":3512},"Split the Studio-facing schema wrapper (defineSection / defineBlock) from the visual Vue component that paints pixels. Two files, two responsibilities, fewer regressions.","md",{},{"title":3561,"description":3562},"Schema components vs UI components | Laioutr","Why and how to separate Laioutr schema definitions from the underlying Vue UI components in your app.",{"loc":466,"lastmod":3564,"changefreq":3565,"priority":3566,"videos":3567,"images":3568},"2026-05-15","monthly",0.9,[],[],"AFeSjsekLikGXP1l9UxyVq9XjTGHMXVvkVJHDMbkEjA",[3571,3573],{"title":459,"path":460,"stem":461,"description":3572,"children":-1},"Opinionated guides for building Laioutr apps. Each guide captures one pattern, gotcha, or architectural decision that earned its keep in real apps.",{"title":469,"path":470,"stem":471,"description":3574,"children":-1},"A canonical sidebar layout and field-naming convention for every section and block. Same ordering and the same names everywhere, so editors learn one app and know them all.",1779266525758]