@postxl/generators 0.2.2

package/dist/frontend-core/template/.storybook/main.ts

@@ -0,0 +1,27 @@
+import type { StorybookConfig } from '@storybook/react-vite'
+
+const config: StorybookConfig = {
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+  addons: [
+    '@chromatic-com/storybook',
+    '@storybook/addon-docs',
+    '@storybook/addon-onboarding',
+    '@storybook/addon-vitest',
+  ],
+  framework: {
+    name: '@storybook/react-vite',
+    options: {},
+  },
+  docs: {
+    docsMode: false,
+  },
+  typescript: {
+    reactDocgen: 'react-docgen-typescript',
+    reactDocgenTypescriptOptions: {
+      shouldExtractLiteralValuesFromEnum: true,
+      propFilter: (prop) => (prop.parent ? !/node_modules/.test(prop.parent.fileName) : true),
+    },
+  },
+}
+
+export default config

package/dist/frontend-core/template/.storybook/preview.ts

@@ -0,0 +1,16 @@
+import '../src/styles/styles.css'
+
+import type { Preview } from '@storybook/react-vite'
+
+const preview: Preview = {
+  parameters: {
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/i,
+      },
+    },
+  },
+}
+
+export default preview

package/dist/frontend-core/template/.storybook/vitest.setup.ts

@@ -0,0 +1,18 @@
+import { setProjectAnnotations } from '@storybook/react-vite'
+
+import { afterEach, beforeEach } from 'vitest'
+
+import * as projectAnnotations from './preview'
+
+// This is an important step to apply the right configuration when testing your stories.
+// More info at: https://storybook.js.org/docs/api/portable-stories/portable-stories-vitest#setprojectannotations
+setProjectAnnotations([projectAnnotations])
+
+beforeEach(async () => {
+  // Setup code if needed
+})
+
+afterEach(async () => {
+  // Ensure proper cleanup
+  await new Promise((resolve) => setTimeout(resolve, 100))
+})

package/dist/frontend-core/template/README.md

@@ -0,0 +1,488 @@
+# Template Frontend
+
+This folder contains the frontend application for the PostXL template project. It is a full-stack React application built with Vite + React + TypeScript and uses TanStack Router for file-based routing, TanStack Query for data fetching, tRPC for type-safe APIs, Tailwind CSS for styling, and shadcn/ui-based components (Radix primitives).
+
+> **Note**: This is a code-generated project from PostXL. Most files are automatically generated from `postxl-schema.json` using the PostXL generator framework. See the main project [CLAUDE.md](/Users/henk/Work/Projects/PostXL/PXL/CLAUDE.md) for details on the generation workflow.
+
+
+## Table of Contents
+- [Overview](#overview)
+- [Prerequisites](#prerequisites)
+- [Getting Started](#getting-started)
+  - [Initial Setup](#1-initial-setup)
+  - [Environment Variables](#2-environment-variables)
+  - [Run Development Server](#3-run-development-server)
+  - [Build & Preview Production](#4-build--preview-production)
+- [Available Scripts](#available-scripts)
+- [Architecture & Libraries](#architecture--libraries)
+  - [Routing (TanStack Router)](#routing-tanstack-router-v1)
+  - [Data Fetching (tRPC + TanStack Query)](#data-fetching-trpc--tanstack-query)
+  - [Authentication (Keycloak)](#authentication--keycloak)
+  - [UI Components (shadcn/ui + Radix)](#ui-components-shadcnui--radix)
+  - [Styling (Tailwind CSS)](#styling-tailwind-css)
+  - [Testing (Vitest + Storybook)](#testing-vitest--storybook)
+- [Route Guards](#route-guards)
+- [Development Conventions](#development-conventions)
+- [Troubleshooting](#troubleshooting)
+
+
+## Overview
+
+**Key Technologies:**
+- **React 19** with React 19 DOM for modern React features
+- **Vite 7** for fast dev builds, HMR, and optimized production builds
+- **TypeScript 5.8** with strict type checking (`pnpm run test:types`)
+- **TanStack Router v1** with file-based routing and automatic code-splitting
+- **TanStack Query** for server state management and caching
+- **tRPC 11** integrated with TanStack Query for end-to-end type-safe API calls
+- **Tailwind CSS v4** with utility-first styling and the new Vite plugin
+- **shadcn/ui** components built on Radix UI primitives, class-variance-authority, and tailwind-merge
+- **Keycloak** for enterprise-grade authentication and authorization
+- **Vitest** for unit and component testing with browser mode
+- **Storybook 9** for component development and documentation
+
+
+## Prerequisites
+
+**Required:**
+- **Node.js 22+** (see `.nvmrc` - use `nvm use` to switch to the correct version)
+- **pnpm 10.8.0+** (package manager - this project does not support npm or yarn)
+
+**Optional:**
+- Backend API running (usually at `http://localhost:3001`)
+- Keycloak instance for authentication (usually at `http://localhost:8080`)
+- Docker and Docker Compose for running backend services
+
+
+## Getting Started
+
+### 1. Initial Setup
+
+**IMPORTANT:** Always use the correct Node.js version before running any commands:
+
+```bash
+# Switch to the correct Node.js version (22+)
+nvm use
+```
+
+If you see warnings like `WARN Unsupported engine: wanted: {"node":">=22"}`, you MUST run `nvm use` immediately.
+
+**Installation:**
+
+```bash
+# From the monorepo root, install all dependencies
+pnpm install
+
+# Navigate to the frontend directory (if not already there)
+cd projects/template/frontend
+```
+
+### 2. Environment Variables
+
+The app is configured via Vite environment variables (see `src/lib/config.ts`). Create a `.env.local` file in the frontend directory with the following variables:
+
+**Core Configuration:**
+- `VITE_PUBLIC_API_URL` - Base API URL (default: `http://localhost:3001`)
+- `VITE_PUBLIC_BASE_URL` - Public base URL of the frontend (default: `http://localhost:3000`)
+
+**Authentication (Keycloak):**
+- `VITE_PUBLIC_KEYCLOAK_URL` - Keycloak server URL (e.g., `http://localhost:8080`)
+- `VITE_PUBLIC_KEYCLOAK_REALM` - Keycloak realm name
+- `VITE_PUBLIC_KEYCLOAK_CLIENT_ID` - Keycloak client ID
+- `VITE_PUBLIC_CHECK_LOGIN_IFRAME` - Enable/disable iframe-based session checks (boolean)
+- `VITE_AUTH` - Enable/disable authentication entirely (boolean, useful for local development)
+
+**Development:**
+- `VITE_ENABLE_DEV_TOOLS` - Enable TanStack Router and Query DevTools (boolean, auto-enabled with `pnpm dev`)
+
+**Testing & E2E:**
+- `VITE_PUBLIC_MAPBOX_DISABLE_TRANSITIONS` - Disable map transitions for E2E tests (boolean)
+- `VITE_PUBLIC_USE_TEST_ASSETS` - Use test assets instead of production assets (boolean)
+
+**Analytics (Optional):**
+- `VITE_PUBLIC_ENABLE_ANALYTICS` - Enable analytics tracking (boolean)
+- `VITE_PUBLIC_ANALYTICS_SCRIPT_URL` - Analytics script URL (string)
+
+**Example `.env.local`** (do not commit secrets):
+
+```bash
+# API Configuration
+VITE_PUBLIC_API_URL=http://localhost:3001
+VITE_PUBLIC_BASE_URL=http://localhost:3000
+
+# Keycloak Authentication
+VITE_PUBLIC_KEYCLOAK_URL=http://localhost:8080
+VITE_PUBLIC_KEYCLOAK_REALM=template
+VITE_PUBLIC_KEYCLOAK_CLIENT_ID=template-frontend
+VITE_PUBLIC_CHECK_LOGIN_IFRAME=false
+
+# Development
+VITE_AUTH=true
+VITE_ENABLE_DEV_TOOLS=true
+
+# Analytics (optional)
+VITE_PUBLIC_ENABLE_ANALYTICS=false
+```
+
+> **Note:** Boolean environment variables are parsed in `src/lib/config.ts` via JSON parsing and support special Docker placeholders. See the config file for implementation details.
+
+### 3. Run Development Server
+
+```bash
+# Start dev server with DevTools enabled
+pnpm dev
+
+# Start dev server without authentication (useful for local development)
+pnpm dev:noAuth
+```
+
+The application will be available at `http://localhost:3000` (or the port specified in `VITE_PUBLIC_BASE_URL`).
+
+### 4. Build & Preview Production
+
+```bash
+# Type-check and build for production
+pnpm build
+
+# Preview the production build locally
+pnpm preview
+```
+
+
+## Available Scripts
+
+**Development:**
+- `pnpm dev` - Start development server with DevTools enabled
+- `pnpm dev:noAuth` - Start development server with authentication disabled
+
+**Building:**
+- `pnpm build` - Type-check and build for production
+- `pnpm build:analyze` - Build with bundle analysis (skips type-check)
+- `pnpm debug` - Build with Vite debug logging enabled
+- `pnpm preview` - Preview production build locally
+
+**Testing:**
+- `pnpm test:types` - Run TypeScript type checking
+- `pnpm test:storybook` - Run Storybook component tests with Vitest
+
+**Linting:**
+- `pnpm lint` - Run ESLint on the codebase
+
+**Storybook:**
+- `pnpm storybook:start` - Start Storybook dev server on port 6006
+- `pnpm storybook:build` - Build Storybook for production
+
+**E2E Support:**
+- `pnpm e2e:build` - Build for E2E tests with test-friendly configuration
+- `pnpm e2e:ci` - Build for CI E2E tests
+
+
+## Architecture & Libraries
+
+### Routing (TanStack Router v1)
+
+This project uses **file-based routing** powered by `@tanstack/router-plugin`. Route modules live in `src/routes/` and the plugin automatically generates `routeTree.gen.ts` used by the router configuration.
+
+**Key Concepts:**
+- **File-based routing**: Routes are defined by the file structure in `src/routes/`
+- **Lazy loading**: Use `.lazy.tsx` files for route components that should be code-split and loaded on-demand
+- **Type-safe navigation**: Full TypeScript support for route paths, params, and search params
+- **Nested layouts**: Support for nested route layouts with `_layout` files
+
+**Important Files:**
+- `src/lib/router.tsx` - Router configuration, context setup (auth), error/not-found components
+- `src/routes/__root.tsx` - Root route with typed context and `<RootDocument>` shell component
+- `src/routes/routeTree.gen.ts` - Auto-generated route tree (do not edit manually)
+
+**Resources:**
+- [File-based routing docs](https://tanstack.com/router/v1/docs/framework/react/routing/file-based-routing)
+- [File naming conventions](https://tanstack.com/router/v1/docs/framework/react/routing/file-naming-conventions)
+- [Code-splitting guide](https://tanstack.com/router/v1/docs/framework/react/guide/code-splitting)
+
+### Data Fetching (tRPC + TanStack Query)
+
+This project uses **tRPC** for end-to-end type-safe API calls, integrated with **TanStack Query** for powerful data fetching, caching, and state management.
+
+**Key Features:**
+- **Type safety**: Full TypeScript inference from backend to frontend - no manual type definitions needed
+- **Automatic serialization**: Uses `superjson` for handling complex types (Date, Map, Set, etc.)
+- **Caching & optimistic updates**: Built on TanStack Query for intelligent caching and UI updates
+- **Queries and mutations**: Colocated with components for easy data management
+
+**Important Files:**
+- `src/lib/trpc.ts` - tRPC client configuration and React hooks setup
+
+**Usage Example:**
+```typescript
+import { trpc } from '@lib/trpc'
+
+function MyComponent() {
+  // Type-safe query
+  const { data, isLoading } = trpc.users.list.useQuery()
+
+  // Type-safe mutation
+  const createUser = trpc.users.create.useMutation()
+
+  return (
+    <button onClick={() => createUser.mutate({ name: 'John' })}>
+      Create User
+    </button>
+  )
+}
+```
+
+**Resources:**
+- [tRPC documentation](https://trpc.io/docs)
+- [tRPC + TanStack Query integration](https://trpc.io/docs/client/react/integration/tanstack-query)
+- [TanStack Query documentation](https://tanstack.com/query/latest)
+
+### Authentication (Keycloak)
+
+Authentication is handled by **Keycloak** using the `keycloak-js` library, wrapped in a custom React context for easy access throughout the application.
+
+**Key Features:**
+- **SSO support**: Single sign-on across multiple applications
+- **Role-based access control**: User roles and permissions from Keycloak
+- **Token management**: Automatic token refresh and session management
+- **Optional auth**: Can be disabled via `VITE_AUTH=false` for local development
+
+**Important Files:**
+- `src/contextProviders/authContextProvider.tsx` - Authentication context and hooks
+- `src/contextProviders/themeContextProvider.tsx` - Theme management (light/dark mode)
+- `src/pages/login/login.page.tsx` - Login page and redirect handling
+
+### UI Components (shadcn/ui + Radix)
+
+This project follows the **shadcn/ui** approach, using **Radix UI** primitives combined with **Tailwind CSS** and **class-variance-authority** for composable, accessible components.
+
+**Key Characteristics:**
+- **Copy-paste components**: Components are part of your codebase, not a package dependency
+- **Radix primitives**: Built on Radix UI for accessibility and headless UI patterns
+- **Tailwind styling**: Utility-first CSS with Tailwind v4
+- **Variants**: Uses `class-variance-authority` (CVA) for component variants
+
+**Component Location:**
+- `src/components/ui/` - Base UI components (button, dialog, dropdown, etc.)
+
+**Example Components:**
+- `src/components/ui/button/Button.tsx` - Button component with variants
+- `src/components/ui/dialog/Dialog.tsx` - Modal dialog
+- `src/components/ui/checkbox/ShadcnCheckbox.tsx` - Checkbox with Radix
+- `src/components/ui/calendar/Calendar.tsx` - Date picker calendar
+
+**Resources:**
+- [shadcn/ui documentation](https://ui.shadcn.com/docs)
+- [Radix UI primitives](https://www.radix-ui.com/primitives)
+- [class-variance-authority](https://cva.style/docs)
+
+### Styling (Tailwind CSS)
+
+This project uses **Tailwind CSS v4** with the new **@tailwindcss/vite** plugin for utility-first styling.
+
+**Key Features:**
+- **Utility-first**: Compose designs using utility classes
+- **Custom theme**: Extended theme in `tailwind.config.js` or CSS variables
+- **Dark mode**: Built-in dark mode support with `class` strategy
+- **Responsive design**: Mobile-first responsive utilities
+
+**Utility Functions:**
+- `src/lib/utils.ts` - Contains the `cn()` utility function that combines `clsx` and `tailwind-merge` for conditional class names
+
+**Usage Example:**
+```typescript
+import { cn } from '@lib/utils'
+
+<div className={cn(
+  "px-4 py-2 rounded-lg",
+  isActive && "bg-blue-500",
+  isDisabled && "opacity-50"
+)}>
+  Content
+</div>
+```
+
+**Resources:**
+- [Tailwind CSS documentation](https://tailwindcss.com/docs)
+- [Utility classes reference](https://tailwindcss.com/docs/styling-with-utility-classes)
+- [Responsive design guide](https://tailwindcss.com/docs/responsive-design)
+
+### Testing (Vitest + Storybook)
+
+This project uses **Vitest** for unit and component testing, and **Storybook** for component development and documentation.
+
+**Vitest:**
+- **Browser mode**: Tests run in a real browser environment using Playwright
+- **Component testing**: Test React components with `vitest-browser-react`
+- **Coverage**: V8 coverage reports with `@vitest/coverage-v8`
+- **Fast**: Powered by Vite for instant feedback
+
+**Storybook:**
+- **Component development**: Develop components in isolation
+- **Documentation**: Auto-generated docs with `@storybook/addon-docs`
+- **Testing**: Integration with Vitest via `@storybook/addon-vitest`
+- **Visual testing**: Ready for Chromatic integration
+
+**Configuration Files:**
+- `vite.config.ts` - Vitest configuration
+- `.storybook/main.ts` - Storybook configuration
+- `.storybook/preview.ts` - Storybook preview settings
+
+**Resources:**
+- [Vitest documentation](https://vitest.dev/)
+- [Storybook documentation](https://storybook.js.org/docs)
+
+
+## Route Guards
+
+Route guards are implemented via the `beforeLoad` hook in route files. Guards can redirect users, throw errors, or prevent navigation based on authentication state or user permissions.
+
+**Authentication Guards:**
+
+The main authentication guard is implemented in `src/routes/_authRoutes.tsx` and applies to all routes nested under it:
+- If the user is not authenticated, they are redirected to `/login` with a `redirectUrl` search parameter to restore their location after login
+- After successful login, users are automatically redirected back to their original destination
+
+**Route Structure:**
+
+```
+/                          → Redirects to /dashboard (src/routes/index.tsx)
+/login                     → Login page (src/pages/login/login.page.tsx)
+/unauthorized              → Unauthorized access page
+/_authRoutes/*             → Protected routes requiring authentication
+  /dashboard               → Main dashboard (default landing page)
+  /[other-routes]          → Other authenticated routes
+```
+
+**Implementing Custom Guards:**
+
+To add custom guards to a route, use the `beforeLoad` hook:
+
+```typescript
+// src/routes/admin.tsx
+export const Route = createFileRoute('/admin')({
+  beforeLoad: async ({ context }) => {
+    if (!context.auth.isAuthenticated) {
+      throw redirect({ to: '/login' })
+    }
+
+    if (context.auth.user?.role !== 'admin') {
+      throw redirect({ to: '/unauthorized' })
+    }
+  },
+})
+```
+
+
+## Development Conventions
+
+### File Organization
+
+- **Routes**: Place route files in `src/routes/` following TanStack Router file naming conventions
+- **Components**:
+  - UI components: `src/components/ui/`
+  - Feature components: `src/components/[feature-name]/`
+- **Pages**: Page components in `src/pages/[route-name]/` (lazy-loaded by routes)
+- **Lib/Utils**: Shared utilities and configurations in `src/lib/`
+- **Types**: Type definitions in `src/types/`
+
+### Import Aliases
+
+This project uses path aliases configured via `vite-tsconfig-paths`:
+
+```typescript
+import { Button } from '@components/ui/button/Button'
+import { trpc } from '@lib/trpc'
+import { useAuth } from '@contextProviders/authContextProvider'
+```
+
+Available aliases:
+- `@` - Points to `src/`
+
+### Code Splitting
+
+- Use `.lazy.tsx` files for route components that should be lazy-loaded to keep initial bundle size small
+- Heavy components or libraries should be dynamically imported where possible
+- The build automatically code-splits routes for optimal loading performance
+
+### State Management
+
+- **Server state**: Use tRPC queries and mutations with TanStack Query
+- **Client state**: Use React hooks (`useState`, `useReducer`) and context providers
+- **Form state**: Use `react-hook-form` with Zod validation
+- **URL state**: Use TanStack Router's search params for shareable state
+
+### Styling Conventions
+
+- **Prefer utility classes**: Use Tailwind utilities over custom CSS
+- **Use the `cn()` utility**: For conditional and merged class names (from `src/lib/utils.ts`)
+- **Component variants**: Use `class-variance-authority` for component variant systems
+- **Consistency**: Follow existing component patterns from `src/components/ui/`
+
+### TypeScript
+
+- **Strict mode**: TypeScript strict mode is enabled - address all type errors
+- **Type inference**: Let TypeScript infer types where possible, explicit types for public APIs
+- **tRPC types**: Never manually define backend types - they're automatically inferred from tRPC
+- **Zod schemas**: Use Zod for runtime validation and type generation
+
+### Generated Code
+
+**IMPORTANT:** This project uses PostXL code generation:
+
+- Most application files are auto-generated from `postxl-schema.json`
+- To regenerate code after schema changes: `pnpm run generate` (from project root)
+- To force regeneration: `pnpm run generate -f`
+- Generated files should not be manually edited unless you "eject" them (modify them to take ownership)
+- See the main [CLAUDE.md](../../../CLAUDE.md) for generator development workflow
+
+
+## Troubleshooting
+
+### Common Issues
+
+**Authentication redirect loop:**
+- Ensure `VITE_PUBLIC_KEYCLOAK_URL`, `VITE_PUBLIC_KEYCLOAK_REALM`, and `VITE_PUBLIC_KEYCLOAK_CLIENT_ID` are correct
+- Check that Keycloak is running and reachable at the specified URL
+- For local development without auth, set `VITE_AUTH=false`
+- Try clearing browser cookies and localStorage
+
+**Type errors:**
+- Run `pnpm test:types` to see all TypeScript errors
+- Ensure all dependencies are installed: `pnpm install`
+- If using tRPC, ensure the backend is built and types are generated
+- Check that `routeTree.gen.ts` is up to date (generated automatically on dev server start)
+
+**Build failures:**
+- Ensure you're using Node.js 22+: Run `nvm use`
+- Clear build cache: `rm -rf node_modules/.vite`
+- Rebuild from monorepo root: `pnpm run build`
+- Check for TypeScript errors: `pnpm test:types`
+
+**HMR (Hot Module Replacement) not working:**
+- Check that no errors are logged in the browser console
+- Try restarting the Vite dev server
+- Clear browser cache and reload
+- On macOS, you may need to increase file watch limits (see main project README)
+
+**Storybook issues:**
+- Ensure Storybook dependencies are installed: `pnpm install`
+- Clear Storybook cache: `rm -rf node_modules/.cache/storybook`
+- Restart Storybook: `pnpm storybook:start`
+
+**Port already in use:**
+- Frontend default port is 3000
+- Change port with: `pnpm dev -- --port 3001`
+- Or kill the process using the port: `lsof -ti:3000 | xargs kill -9` (macOS/Linux)
+
+**Environment variables not loading:**
+- Ensure `.env.local` is in the frontend directory (not the project root)
+- Restart the dev server after changing environment variables
+- Remember: Only `VITE_*` prefixed variables are exposed to the client
+- Check `src/lib/config.ts` for how environment variables are parsed
+
+### Getting Help
+
+- Check the [PostXL CLAUDE.md](../../../CLAUDE.md) for monorepo-level documentation
+- Review TanStack Router docs: https://tanstack.com/router/latest
+- Review tRPC docs: https://trpc.io/docs
+- Check Vite documentation: https://vite.dev/

package/dist/frontend-core/template/components.json

@@ -0,0 +1,21 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "new-york",
+  "rsc": false,
+  "tsx": true,
+  "tailwind": {
+    "config": "",
+    "css": "src/styles/styles.css",
+    "baseColor": "neutral",
+    "cssVariables": false,
+    "prefix": ""
+  },
+  "aliases": {
+    "components": "@components",
+    "utils": "@lib/utils",
+    "ui": "@components/ui",
+    "lib": "@lib",
+    "hooks": "@hooks"
+  },
+  "iconLibrary": "lucide"
+}

package/dist/frontend-core/template/index.html

@@ -0,0 +1,11 @@
+<!doctype html>
+<html lang="en">
+<head>
+    <!-- set at the __root.tsx-->
+	<title>template</title>
+</head>
+<body>
+<div id="root"></div>
+<script type="module" src="/src/main.tsx"></script>
+</body>
+</html>

package/dist/frontend-core/template/public/flags/AC.svg

@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342">
+<rect fill="#0052B4" width="513" height="342"/>
+<g>
+	<path fill="#FFFFFF" d="M440.1,181.1c-0.1,39.2-6.4,81.4-57.4,101.5c-51.1-20.1-57.3-62.3-57.4-101.5L440.1,181.1L440.1,181.1z"/>
+	<path fill="#29DBFF" d="M439.6,197.7c-2.8,34.9-12.4,67.4-57,85c-44.4-17.6-54.5-51.2-56.9-84.9"/>
+	<path fill="#FFFFFF" d="M437.8,214.1c-3.2,24.3-16.7,53.5-55.1,68.6c-38.4-15.1-50.5-42.5-55.1-68.4"/>
+	<path fill="#29DBFF" d="M434.2,230.3c-5.7,17.7-19.3,39.4-51.3,52.8c-32-12.6-45.2-33.8-51.4-53"/>
+	<path fill="#FFFFFF" d="M426.7,246.9c-6.5,11.3-17.7,25.4-44,35.9c-27.5-11.5-37.4-25.3-44-36.1"/>
+	<path fill="#29DBFF" d="M412.4,265.1c-8.1,7.2-12,11.2-29.6,17.9c-20.1-7.9-22.6-11.6-29.2-17.5"/>
+	<path fill="#5CC85C" d="M383.3,231.6c-0.2-0.2-27.9,35.7-27.9,35.7c-1.8-1.3-10-9.5-13.3-15l41.3-50.1l40.2,49.7
+		c-3.9,6.5-11.4,13.6-13.2,15"/>
+</g>
+<polygon fill="#5CC85C" points="382.6,85.3 356.1,130.3 409.1,130.3 409.1,130.3 "/>
+<ellipse transform="matrix(0.134 -0.991 0.991 0.134 28.7247 484.2523)" fill="#F7A226" cx="291.4" cy="225.7" rx="48.7" ry="15.7"/>
+<ellipse transform="matrix(0.373 -0.9278 0.9278 0.373 37.247 384.4472)" fill="#DDC7AB" cx="303.1" cy="164.7" rx="11.7" ry="7.2"/>
+<ellipse transform="matrix(0.1437 -0.9896 0.9896 0.1437 -19.091 521.3171)" fill="#DDC7AB" cx="291.7" cy="271.7" rx="11.4" ry="3.3"/>
+<ellipse transform="matrix(0.9986 -5.352928e-02 5.352928e-02 0.9986 -13.9925 16.4237)" fill="#DDC7AB" cx="299.6" cy="269.4" rx="3.3" ry="11"/>
+<ellipse transform="matrix(0.9303 -0.3668 0.3668 0.9303 -51.8254 129.3871)" fill="#DDC7AB" cx="314.5" cy="201.1" rx="4.1" ry="13.7"/>
+<ellipse transform="matrix(0.9303 -0.3668 0.3668 0.9303 -43.1881 128.875)" fill="#DDC7AB" cx="317.5" cy="178.1" rx="13.7" ry="4.1"/>
+<ellipse transform="matrix(0.991 -0.134 0.134 0.991 -26.0008 65.5194)" fill="#F7A226" cx="473.6" cy="225.9" rx="15.7" ry="48.7"/>
+<ellipse transform="matrix(0.9278 -0.373 0.373 0.9278 -28.1478 184.2457)" fill="#DDC7AB" cx="462" cy="164.9" rx="7.2" ry="11.7"/>
+<ellipse transform="matrix(0.9896 -0.1437 0.1437 0.9896 -34.1512 70.8368)" fill="#DDC7AB" cx="473.4" cy="271.9" rx="3.3" ry="11.4"/>
+<ellipse transform="matrix(5.352928e-02 -0.9986 0.9986 5.352928e-02 171.3404 719.9983)" fill="#DDC7AB" cx="465.5" cy="269.6" rx="11" ry="3.3"/>
+<ellipse transform="matrix(0.3668 -0.9303 0.9303 0.3668 98.0689 546.5782)" fill="#DDC7AB" cx="450.6" cy="201.2" rx="13.7" ry="4.1"/>
+<ellipse transform="matrix(0.3668 -0.9303 0.9303 0.3668 117.5679 529.2617)" fill="#DDC7AB" cx="447.6" cy="178.3" rx="4.1" ry="13.7"/>
+<polygon fill="#B0C6CC" points="373.3,130.3 356.1,155 373.9,181.1 396,181.1 400.7,155.7 395.3,130.3 "/>
+<polygon fill="#FFFFFF" points="256,0 256,117.4 209.9,117.4 256,148.1 256,170.7 233.4,170.7 160,121.8 160,170.7 96,170.7 96,121.8
+	22.6,170.7 0,170.7 0,148.1 46.1,117.4 0,117.4 0,53.4 46.1,53.4 0,22.7 0,0 22.6,0 96,48.9 96,0 160,0 160,48.9 233.4,0 "/>
+<polygon fill="#D80027" points="144,0 112,0 112,69.4 0,69.4 0,101.4 112,101.4 112,170.7 144,170.7 144,101.4 256,101.4 256,69.4
+	144,69.4 "/>
+<polygon fill="#2E52B2" points="256,22.7 256,53.4 209.9,53.4 "/>
+<g>
+	<polygon fill="#D80027" points="0,170.7 0,159.7 62.5,117.4 85.1,117.4 7.3,170.7 	"/>
+</g>
+<polygon fill="#D80027" points="7.3,0.1 85.1,53.3 62.5,53.3 0,11.1 0,0.1 "/>
+<polygon fill="#D80027" points="256,0.1 256,11.1 193.5,53.4 170.9,53.4 248.7,0.1 "/>
+<polygon fill="#D80027" points="248.7,170.7 170.9,117.4 193.5,117.4 256,159.7 256,170.7 "/>
+</svg>

package/dist/frontend-core/template/public/flags/AD.svg

@@ -0,0 +1,32 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 342">
+<style type="text/css">
+	.st0{fill:#FFDA44;}
+	.st1{fill:#0052B4;}
+	.st2{fill:#D80027;}
+	.st3{fill:none;stroke:#D80027;stroke-width:7;stroke-miterlimit:10;}
+	.st4{fill:none;stroke:#D80027;stroke-width:4;stroke-miterlimit:10;}
+	.st5{fill:#BC8B00;}
+</style>
+<rect fill="#FFDA44" width="513" height="342"/>
+<rect fill="#0052B4" width="171" height="342"/>
+<rect x="342" fill="#D80027" width="171" height="342"/>
+<rect x="198.9" y="113.6" fill="#D80027" width="57.1" height="64.8"/>
+<g stroke="#D80027" stroke-width="7">
+  <line x1="267.6" y1="113.6" x2="267.6" y2="178.3"/>
+  <line x1="284.2" y1="113.6" x2="284.2" y2="178.3"/>
+  <line x1="300.8" y1="113.6" x2="300.8" y2="178.3"/>
+</g>
+<g stroke="#D80027" stroke-width="5">
+  <line x1="247.4" y1="178.4" x2="247.4" y2="243.1"/>
+  <line x1="234.1" y1="178.4" x2="234.1" y2="243.1"/>
+  <line x1="220.8" y1="178.5" x2="220.8" y2="232.4"/>
+  <line x1="207.1" y1="178.5" x2="207.1" y2="225.6"/>
+</g>
+<polygon fill="#FFDA44" points="199.9,146 227.5,113.6 256,145.9 227.9,178.3 "/>
+<path fill="#BC8B00" d="M182.2,95.9v92.2c0,34.3,27.3,54.2,48.6,64.5c-0.8,1.4,25.1,8.3,25.1,8.3s25.9-6.9,25.1-8.3
+	c21.4-10.3,48.6-30.1,48.6-64.5V95.9H182.2z M312.1,188.1c0,16.9-10,29.4-32.8,43.9c-8.6,5.5-17.5,9-23.3,11
+	c-5.8-2-14.7-5.5-23.3-11c-22.8-14.5-32.8-28-32.8-43.9v-74.5h112.2L312.1,188.1z"/>
+<rect x="264.4" y="188.9" fill="#D80027" width="29.5" height="8.6"/>
+<rect x="264.4" y="206.5" fill="#D80027" width="29.5" height="8.6"/>
+</svg>