includio-cms 0.14.6 → 0.15.0

package/dist/admin/components/fields/shop-field.svelte

@@ -0,0 +1,298 @@
+<script lang="ts">
+	import { getContext } from 'svelte';
+	import { Button } from '../../../components/ui/button/index.js';
+	import { Switch } from '../../../components/ui/switch/index.js';
+	import TrashIcon from '@tabler/icons-svelte/icons/trash';
+	import PlusIcon from '@tabler/icons-svelte/icons/plus';
+	import BuildingStoreIcon from '@tabler/icons-svelte/icons/building-store';
+	import { getRemotes } from '../../../sveltekit/index.js';
+	import type { ShopField } from '../../../types/fields.js';
+
+	type Props = { field: ShopField };
+	const { field }: Props = $props();
+
+	const entryId = getContext<string>('cms-entry-id');
+	const remotes = getRemotes();
+	const dataQuery = $derived(remotes.getShopDataForEntry(entryId));
+	const configQuery = $derived(remotes.getShopConfig());
+
+	type InputMode = 'net' | 'gross';
+	let inputMode = $state<InputMode>('gross');
+	let inputPrice = $state('0.00');
+	let vatRate = $state<number | string>(23);
+	let isActive = $state(true);
+	let variants = $state<
+		Array<{
+			id?: string;
+			sku: string;
+			name: string;
+			priceDelta: string;
+			stock: string;
+		}>
+	>([]);
+
+	let loaded = $state(false);
+	let saving = $state(false);
+	let errorMessage = $state<string | null>(null);
+	let successMessage = $state<string | null>(null);
+
+	const inputPriceCents = $derived(Math.round(parseFloat(inputPrice || '0') * 100));
+	const vat = $derived(Number(vatRate) || 0);
+	const netCents = $derived(
+		inputMode === 'net' ? inputPriceCents : Math.round(inputPriceCents / (1 + vat / 100))
+	);
+	const grossCents = $derived(
+		inputMode === 'gross' ? inputPriceCents : Math.round(inputPriceCents * (1 + vat / 100))
+	);
+	const vatCents = $derived(grossCents - netCents);
+
+	function formatCents(cents: number) {
+		return (cents / 100).toFixed(2);
+	}
+
+	function switchMode(newMode: InputMode) {
+		if (newMode === inputMode) return;
+		// Preserve economic value — if user typed gross, switch shows net (computed) in the input, and vice versa.
+		const preservedCents = newMode === 'net' ? netCents : grossCents;
+		inputMode = newMode;
+		inputPrice = formatCents(preservedCents);
+	}
+
+	$effect(() => {
+		if (!loaded && dataQuery.ready && configQuery.ready) {
+			const shop = dataQuery.current;
+			if (shop) {
+				// Shop storage is always net — default UI to net when hydrating existing data.
+				inputMode = 'net';
+				inputPrice = (shop.basePrice / 100).toFixed(2);
+				vatRate = shop.vatRate;
+				isActive = shop.isActive;
+				variants = shop.variants.map((v) => ({
+					id: v.id,
+					sku: v.sku ?? '',
+					name:
+						typeof v.name === 'object' && v.name !== null
+							? String(
+									Object.values(v.name as Record<string, string>)[0] ?? ''
+								)
+							: '',
+					priceDelta: (v.priceDelta / 100).toFixed(2),
+					stock: v.stock == null ? '' : String(v.stock)
+				}));
+			} else {
+				const defaultVat = configQuery.current?.vatRates[0] ?? 23;
+				vatRate = defaultVat;
+			}
+			loaded = true;
+		}
+	});
+
+	function addVariant() {
+		variants.push({
+			id: undefined,
+			sku: '',
+			name: '',
+			priceDelta: '0.00',
+			stock: ''
+		});
+	}
+
+	function removeVariant(i: number) {
+		variants.splice(i, 1);
+	}
+
+	async function save() {
+		if (!entryId) {
+			errorMessage = 'Brak ID wpisu — zapisz najpierw wpis, potem dane sklepu.';
+			return;
+		}
+		saving = true;
+		errorMessage = null;
+		successMessage = null;
+		try {
+			const stockEnabled = configQuery.current?.features.stock ?? false;
+			const variantsEnabled = configQuery.current?.features.variants ?? false;
+			await remotes.upsertShopDataForEntry({
+				entryId,
+				data: {
+					basePrice: netCents,
+					vatRate: Number(vatRate),
+					isActive
+				},
+				variants: variantsEnabled
+					? variants.map((v) => ({
+							id: v.id,
+							sku: v.sku || null,
+							name: v.name ? { pl: v.name } : null,
+							priceDelta: Math.round(parseFloat(v.priceDelta || '0') * 100),
+							stock: stockEnabled && v.stock !== '' ? parseInt(v.stock, 10) : null,
+							attributes: null
+						}))
+					: []
+			});
+			await dataQuery.refresh();
+			successMessage = 'Zapisano dane sklepu.';
+		} catch (err) {
+			errorMessage = err instanceof Error ? err.message : 'Nie udało się zapisać';
+		} finally {
+			saving = false;
+		}
+	}
+</script>
+
+<section class="border-border bg-card space-y-4 rounded-xl border p-5">
+	<header class="flex items-center justify-between">
+		<div class="flex items-center gap-2">
+			<BuildingStoreIcon class="text-primary size-5" />
+			<h3 class="text-base font-bold">Sklep</h3>
+		</div>
+		<label class="flex items-center gap-2 text-sm">
+			<Switch bind:checked={isActive} />
+			<span>Aktywny</span>
+		</label>
+	</header>
+
+	{#if !configQuery.ready || !dataQuery.ready}
+		<p class="text-muted-foreground text-sm">Ładowanie…</p>
+	{:else if !configQuery.current}
+		<p class="text-muted-foreground text-sm">Sklep nie jest skonfigurowany.</p>
+	{:else}
+		{@const config = configQuery.current}
+
+		<div class="space-y-3">
+			<div class="grid grid-cols-[1fr_auto] gap-3">
+				<label class="block">
+					<div class="mb-1 flex items-center justify-between">
+						<span class="text-muted-foreground text-xs font-semibold">
+							Cena bazowa ({inputMode === 'net' ? 'netto' : 'brutto'}, PLN)
+						</span>
+						<div class="bg-muted inline-flex rounded-md p-0.5 text-xs">
+							<button
+								type="button"
+								class="rounded px-2 py-0.5 {inputMode === 'net'
+									? 'bg-background text-primary font-semibold shadow-sm'
+									: 'text-muted-foreground'}"
+								onclick={() => switchMode('net')}
+							>
+								Netto
+							</button>
+							<button
+								type="button"
+								class="rounded px-2 py-0.5 {inputMode === 'gross'
+									? 'bg-background text-primary font-semibold shadow-sm'
+									: 'text-muted-foreground'}"
+								onclick={() => switchMode('gross')}
+							>
+								Brutto
+							</button>
+						</div>
+					</div>
+					<input
+						type="number"
+						step="0.01"
+						min="0"
+						bind:value={inputPrice}
+						class="border-border w-full rounded-lg border px-3 py-2"
+					/>
+				</label>
+				<label class="block">
+					<span class="text-muted-foreground mb-1 block text-xs font-semibold">VAT</span>
+					<select
+						bind:value={vatRate}
+						class="border-border w-full rounded-lg border px-3 py-2"
+					>
+						{#each config.vatRates as r (r)}
+							<option value={r}>{r}%</option>
+						{/each}
+					</select>
+				</label>
+			</div>
+			<div class="bg-muted/40 border-border grid grid-cols-3 gap-2 rounded-lg border p-2.5 text-center text-xs">
+				<div>
+					<div class="text-muted-foreground font-semibold uppercase tracking-wide">Netto</div>
+					<div class="text-sm font-bold tabular-nums">{formatCents(netCents)} zł</div>
+				</div>
+				<div class="border-border border-x">
+					<div class="text-muted-foreground font-semibold uppercase tracking-wide">VAT</div>
+					<div class="text-sm font-bold tabular-nums">{formatCents(vatCents)} zł</div>
+				</div>
+				<div>
+					<div class="text-muted-foreground font-semibold uppercase tracking-wide">Brutto</div>
+					<div class="text-primary text-sm font-bold tabular-nums">{formatCents(grossCents)} zł</div>
+				</div>
+			</div>
+		</div>
+
+		{#if config.features.variants}
+			<div class="border-border space-y-3 rounded-lg border-t pt-4">
+				<div class="flex items-center justify-between">
+					<h4 class="text-sm font-bold">Warianty</h4>
+					<Button type="button" variant="outline" size="sm" onclick={addVariant}>
+						<PlusIcon class="mr-1 size-4" /> Dodaj wariant
+					</Button>
+				</div>
+				{#if variants.length === 0}
+					<p class="text-muted-foreground text-xs">Brak wariantów — zostanie użyta cena bazowa.</p>
+				{/if}
+				{#each variants as v, i (i)}
+					<div class="border-border grid grid-cols-2 gap-2 rounded-lg border p-3">
+						<label class="block">
+							<span class="text-muted-foreground mb-0.5 block text-xs">Nazwa</span>
+							<input
+								type="text"
+								bind:value={v.name}
+								class="border-border w-full rounded border px-2 py-1 text-sm"
+							/>
+						</label>
+						<label class="block">
+							<span class="text-muted-foreground mb-0.5 block text-xs">SKU</span>
+							<input
+								type="text"
+								bind:value={v.sku}
+								class="border-border w-full rounded border px-2 py-1 font-mono text-sm"
+							/>
+						</label>
+						<label class="block">
+							<span class="text-muted-foreground mb-0.5 block text-xs">Zmiana ceny (PLN)</span>
+							<input
+								type="number"
+								step="0.01"
+								bind:value={v.priceDelta}
+								class="border-border w-full rounded border px-2 py-1 text-sm"
+							/>
+						</label>
+						{#if config.features.stock}
+							<label class="block">
+								<span class="text-muted-foreground mb-0.5 block text-xs">Stock (puste = ∞)</span>
+								<input
+									type="number"
+									min="0"
+									bind:value={v.stock}
+									class="border-border w-full rounded border px-2 py-1 text-sm"
+								/>
+							</label>
+						{/if}
+						<div class="col-span-2 flex justify-end">
+							<Button type="button" variant="ghost" size="sm" onclick={() => removeVariant(i)}>
+								<TrashIcon class="size-4" />
+							</Button>
+						</div>
+					</div>
+				{/each}
+			</div>
+		{/if}
+
+		{#if errorMessage}
+			<div class="rounded-lg bg-red-50 p-2.5 text-xs text-red-800">{errorMessage}</div>
+		{/if}
+		{#if successMessage}
+			<div class="rounded-lg bg-green-50 p-2.5 text-xs text-green-800">{successMessage}</div>
+		{/if}
+
+		<div class="flex justify-end">
+			<Button type="button" onclick={save} disabled={saving}>
+				{saving ? 'Zapisywanie…' : 'Zapisz dane sklepu'}
+			</Button>
+		</div>
+	{/if}
+</section>

package/dist/admin/components/fields/shop-field.svelte.d.ts

@@ -0,0 +1,7 @@
+import type { ShopField } from '../../../types/fields.js';
+type Props = {
+    field: ShopField;
+};
+declare const ShopField: import("svelte").Component<Props, {}, "">;
+type ShopField = ReturnType<typeof ShopField>;
+export default ShopField;

package/dist/admin/components/layout/app-sidebar.svelte

@@ -6,6 +6,7 @@
 	import NavCollections from './nav-collections.svelte';
 	import NavFooter from './nav-footer.svelte';
 	import NavForms from './nav-forms.svelte';
+	import NavShop from './nav-shop.svelte';
 	import NavSearch from './nav-search.svelte';
 	import { resolve } from '$app/paths';
 	let { ...restProps }: ComponentProps<typeof Sidebar.Root> = $props();
@@ -34,6 +35,7 @@
 			<NavSingletons />
 			<NavCollections />
 			<NavForms />
+			<NavShop />
 		</div>
 	</Sidebar.Content>
 	<Sidebar.Footer class="p-0">

package/dist/admin/components/layout/lang.d.ts

@@ -19,6 +19,12 @@ export declare const sidebarLang: Record<string, {
     forms: {
         title: string;
     };
+    shop: {
+        title: string;
+        products: string;
+        orders: string;
+        shipping: string;
+    };
     footer: {
         help: string;
     };

package/dist/admin/components/layout/lang.js

@@ -20,6 +20,12 @@ export const sidebarLang = {
         forms: {
             title: 'Formularze'
         },
+        shop: {
+            title: 'Sklep',
+            products: 'Produkty',
+            orders: 'Zamówienia',
+            shipping: 'Metody wysyłki'
+        },
         footer: {
             help: 'Pomoc'
         },
@@ -53,6 +59,12 @@ export const sidebarLang = {
         forms: {
             title: 'Forms'
         },
+        shop: {
+            title: 'Shop',
+            products: 'Products',
+            orders: 'Orders',
+            shipping: 'Shipping methods'
+        },
         footer: {
             help: 'Help'
         },

package/dist/admin/components/layout/nav-shop.svelte

@@ -0,0 +1,55 @@
+<script lang="ts">
+	import { useInterfaceLanguage } from '../../state/interface-language.svelte.js';
+	import * as Sidebar from '../../../components/ui/sidebar/index.js';
+	import { sidebarLang } from './lang.js';
+	import { getRemotes } from '../../../sveltekit/index.js';
+	import PackageIcon from '@tabler/icons-svelte/icons/package';
+	import ShoppingCartIcon from '@tabler/icons-svelte/icons/shopping-cart';
+	import TruckIcon from '@tabler/icons-svelte/icons/truck';
+	import BuildingStoreIcon from '@tabler/icons-svelte/icons/building-store';
+	import { page } from '$app/state';
+
+	const interfaceLanguage = useInterfaceLanguage();
+	const lang = $derived(sidebarLang[interfaceLanguage.current].shop);
+	const remotes = getRemotes();
+	const enabledQuery = $derived(remotes.getShopEnabled());
+
+	function isActive(url: string) {
+		const pathname = page.url.pathname;
+		return pathname === url || pathname.startsWith(url + '/');
+	}
+
+	const items = $derived([
+		{ title: lang.products, url: '/admin/shop/products', icon: PackageIcon },
+		{ title: lang.orders, url: '/admin/shop/orders', icon: ShoppingCartIcon },
+		{ title: lang.shipping, url: '/admin/shop/shipping-methods', icon: TruckIcon }
+	]);
+</script>
+
+{#if enabledQuery.ready && enabledQuery.current}
+	<Sidebar.Group class="border-sidebar-border mt-1 border-t px-0 pt-2 pb-1">
+		<Sidebar.GroupLabel class="group-data-[collapsible=icon]:hidden">
+			<BuildingStoreIcon class="mr-1 size-3.5" />
+			{lang.title}
+		</Sidebar.GroupLabel>
+		<Sidebar.Menu>
+			{#each items as item (item.url)}
+				{@const active = isActive(item.url)}
+				<Sidebar.MenuItem>
+					<Sidebar.MenuButton isActive={active} tooltipContent={item.title}>
+						{#snippet child({ props })}
+							<a {...props} href={item.url}>
+								<item.icon
+									class="size-5! shrink-0 {active ? 'text-primary' : 'text-muted-foreground'}"
+								/>
+								<span class="flex-1 truncate {active ? 'text-primary' : 'text-muted-foreground'}">
+									{item.title}
+								</span>
+							</a>
+						{/snippet}
+					</Sidebar.MenuButton>
+				</Sidebar.MenuItem>
+			{/each}
+		</Sidebar.Menu>
+	</Sidebar.Group>
+{/if}

package/dist/admin/components/layout/nav-shop.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const NavShop: import("svelte").Component<Record<string, never>, {}, "">;
+type NavShop = ReturnType<typeof NavShop>;
+export default NavShop;

package/dist/admin/remote/index.d.ts

@@ -8,3 +8,4 @@ export * from './form.remote.js';
 export * from './ai.remote.js';
 export * from './preview.remote.js';
 export * from './email.remote.js';
+export * from './shop.remote.js';

package/dist/admin/remote/index.js

@@ -8,3 +8,4 @@ export * from './form.remote.js';
 export * from './ai.remote.js';
 export * from './preview.remote.js';
 export * from './email.remote.js';
+export * from './shop.remote.js';

package/dist/admin/remote/shop.remote.d.ts

@@ -0,0 +1,244 @@
+export declare const getShopEnabled: import("@sveltejs/kit").RemoteQueryFunction<void, boolean>;
+export declare const getShopConfig: import("@sveltejs/kit").RemoteQueryFunction<void, {
+    currency: "PLN";
+    vatRates: number[];
+    features: Required<import("../../shop/types.js").ShopFeatures>;
+    languages: import("../../types/languages.js").Language[];
+} | null>;
+export declare const listShopProductEntries: import("@sveltejs/kit").RemoteQueryFunction<void, import("../../shop/server/shop-data.js").ShopEntryListItem[]>;
+export declare const getShopDataForEntry: import("@sveltejs/kit").RemoteQueryFunction<string, import("../../shop/server/shop-data.js").ShopDataWithVariants | null>;
+export declare const upsertShopDataForEntry: import("@sveltejs/kit").RemoteCommand<{
+    entryId: string;
+    data: {
+        basePrice: number;
+        vatRate: number;
+        isActive?: boolean | undefined;
+        sortOrder?: number | null | undefined;
+    };
+    variants?: {
+        id?: string | undefined;
+        sku?: string | null | undefined;
+        name?: Record<string, string> | null | undefined;
+        priceDelta?: number | undefined;
+        stock?: number | null | undefined;
+        attributes?: Record<string, string> | null | undefined;
+    }[] | undefined;
+}, Promise<import("../../shop/server/shop-data.js").ShopDataWithVariants>>;
+export declare const deleteShopDataForEntry: import("@sveltejs/kit").RemoteCommand<string, Promise<{
+    success: boolean;
+}>>;
+export declare const listShippingMethodsAdmin: import("@sveltejs/kit").RemoteQueryFunction<void, {
+    id: string;
+    name: Record<string, string>;
+    createdAt: Date;
+    sortOrder: number | null;
+    description: Record<string, string> | null;
+    vatRate: number;
+    isActive: boolean;
+    price: number;
+    carrierType: string;
+    conditions: {
+        freeAbove?: number;
+    } | null;
+}[]>;
+export declare const getShippingMethodForAdmin: import("@sveltejs/kit").RemoteQueryFunction<string, {
+    id: string;
+    name: Record<string, string>;
+    createdAt: Date;
+    sortOrder: number | null;
+    description: Record<string, string> | null;
+    vatRate: number;
+    isActive: boolean;
+    price: number;
+    carrierType: string;
+    conditions: {
+        freeAbove?: number;
+    } | null;
+} | null>;
+export declare const createShippingMethodCmd: import("@sveltejs/kit").RemoteCommand<{
+    name: Record<string, string>;
+    price: number;
+    vatRate: number;
+    description?: Record<string, string> | null | undefined;
+    carrierType?: string | undefined;
+    conditions?: {
+        freeAbove?: number | undefined;
+    } | null | undefined;
+    isActive?: boolean | undefined;
+    sortOrder?: number | null | undefined;
+}, Promise<{
+    id: string;
+    name: Record<string, string>;
+    createdAt: Date;
+    sortOrder: number | null;
+    description: Record<string, string> | null;
+    vatRate: number;
+    isActive: boolean;
+    price: number;
+    carrierType: string;
+    conditions: {
+        freeAbove?: number;
+    } | null;
+}>>;
+export declare const updateShippingMethodCmd: import("@sveltejs/kit").RemoteCommand<{
+    id: string;
+    input: {
+        name?: Record<string, string> | undefined;
+        description?: Record<string, string> | null | undefined;
+        price?: number | undefined;
+        vatRate?: number | undefined;
+        carrierType?: string | undefined;
+        conditions?: {
+            freeAbove?: number | undefined;
+        } | null | undefined;
+        isActive?: boolean | undefined;
+        sortOrder?: number | null | undefined;
+    };
+}, Promise<{
+    id: string;
+    name: Record<string, string>;
+    createdAt: Date;
+    sortOrder: number | null;
+    description: Record<string, string> | null;
+    vatRate: number;
+    isActive: boolean;
+    price: number;
+    carrierType: string;
+    conditions: {
+        freeAbove?: number;
+    } | null;
+}>>;
+export declare const deleteShippingMethodCmd: import("@sveltejs/kit").RemoteCommand<string, Promise<{
+    success: boolean;
+}>>;
+export declare const reorderShippingMethodsCmd: import("@sveltejs/kit").RemoteCommand<string[], Promise<{
+    success: boolean;
+}>>;
+export declare const listOrdersAdmin: import("@sveltejs/kit").RemoteQueryFunction<{
+    status?: "done" | "new" | "awaitingPayment" | "paid" | "preparing" | "sent" | "cancelled" | "paymentRejected" | undefined;
+    email?: string | undefined;
+    limit?: number | undefined;
+    offset?: number | undefined;
+} | undefined, {
+    number: string;
+    id: string;
+    status: import("../../shop/types.js").OrderStatus;
+    createdAt: Date;
+    updatedAt: Date;
+    language: string | null;
+    consents: {
+        id: string;
+        accepted: boolean;
+        label: string;
+    }[] | null;
+    carrierType: string | null;
+    currency: string;
+    customerEmail: string;
+    customerName: string | null;
+    customerPhone: string | null;
+    shippingAddress: Record<string, string> | null;
+    totalNet: number;
+    totalGross: number;
+    vatAmount: number;
+    shippingNet: number;
+    shippingGross: number;
+    shippingMethodId: string | null;
+    carrierRef: string | null;
+    paymentMethod: string | null;
+    notes: string | null;
+}[]>;
+export declare const getOrderForAdmin: import("@sveltejs/kit").RemoteQueryFunction<string, {
+    order: {
+        number: string;
+        id: string;
+        status: import("../../shop/types.js").OrderStatus;
+        createdAt: Date;
+        updatedAt: Date;
+        language: string | null;
+        consents: {
+            id: string;
+            accepted: boolean;
+            label: string;
+        }[] | null;
+        carrierType: string | null;
+        currency: string;
+        customerEmail: string;
+        customerName: string | null;
+        customerPhone: string | null;
+        shippingAddress: Record<string, string> | null;
+        totalNet: number;
+        totalGross: number;
+        vatAmount: number;
+        shippingNet: number;
+        shippingGross: number;
+        shippingMethodId: string | null;
+        carrierRef: string | null;
+        paymentMethod: string | null;
+        notes: string | null;
+    };
+    items: {
+        id: string;
+        vatRate: number;
+        productId: string | null;
+        orderId: string;
+        variantId: string | null;
+        nameSnapshot: Record<string, string>;
+        skuSnapshot: string | null;
+        priceNetSnapshot: number;
+        priceGrossSnapshot: number;
+        qty: number;
+    }[];
+    history: {
+        id: string;
+        note: string | null;
+        status: import("../../shop/types.js").OrderStatus;
+        orderId: string;
+        changedBy: string | null;
+        changedAt: Date;
+    }[];
+} | null>;
+export declare const updateOrderStatusCmd: import("@sveltejs/kit").RemoteCommand<{
+    orderId: string;
+    status: "done" | "new" | "awaitingPayment" | "paid" | "preparing" | "sent" | "cancelled" | "paymentRejected";
+    note?: string | undefined;
+}, Promise<{
+    number: string;
+    id: string;
+    status: import("../../shop/types.js").OrderStatus;
+    createdAt: Date;
+    updatedAt: Date;
+    language: string | null;
+    consents: {
+        id: string;
+        accepted: boolean;
+        label: string;
+    }[] | null;
+    carrierType: string | null;
+    currency: string;
+    customerEmail: string;
+    customerName: string | null;
+    customerPhone: string | null;
+    shippingAddress: Record<string, string> | null;
+    totalNet: number;
+    totalGross: number;
+    vatAmount: number;
+    shippingNet: number;
+    shippingGross: number;
+    shippingMethodId: string | null;
+    carrierRef: string | null;
+    paymentMethod: string | null;
+    notes: string | null;
+}>>;
+export declare const resendOrderEmailCmd: import("@sveltejs/kit").RemoteCommand<{
+    orderId: string;
+    status: "done" | "new" | "awaitingPayment" | "paid" | "preparing" | "sent" | "cancelled" | "paymentRejected";
+}, Promise<{
+    success: boolean;
+}>>;
+export declare const listShopableCollections: import("@sveltejs/kit").RemoteQueryFunction<void, {
+    slug: string;
+    labels: {
+        singular?: import("../../types/languages.js").Localized;
+        plural?: import("../../types/languages.js").Localized;
+    } | undefined;
+}[]>;