@empty-complete-org/medusa-product-attributes 0.10.0

package/dist/service.d.ts

@@ -0,0 +1,223 @@
+declare const CustomAttributeService_base: import("@medusajs/framework/utils").MedusaServiceReturnType<import("@medusajs/framework/utils").ModelConfigurationsToConfigTemplate<{
+    CategoryCustomAttribute: import("@medusajs/framework/utils").DmlEntity<import("@medusajs/framework/utils").DMLEntitySchemaBuilder<{
+        id: import("@medusajs/framework/utils").PrimaryKeyModifier<string, import("@medusajs/framework/utils").IdProperty>;
+        key: import("@medusajs/framework/utils").TextProperty;
+        type: import("@medusajs/framework/utils").TextProperty;
+        label: import("@medusajs/framework/utils").TextProperty;
+        unit: import("@medusajs/framework/utils").NullableModifier<string, import("@medusajs/framework/utils").TextProperty>;
+        sort_order: import("@medusajs/framework/utils").NumberProperty;
+        category_id: import("@medusajs/framework/utils").TextProperty;
+        is_standard: import("@medusajs/framework/utils").BooleanProperty;
+        product_custom_attributes: import("@medusajs/framework/utils").HasMany<() => import("@medusajs/framework/utils").DmlEntity<import("@medusajs/framework/utils").DMLEntitySchemaBuilder<{
+            id: import("@medusajs/framework/utils").PrimaryKeyModifier<string, import("@medusajs/framework/utils").IdProperty>;
+            product_id: import("@medusajs/framework/utils").TextProperty;
+            value: import("@medusajs/framework/utils").TextProperty;
+            value_numeric: import("@medusajs/framework/utils").NullableModifier<number, import("@medusajs/framework/utils").NumberProperty>;
+            value_file: import("@medusajs/framework/utils").NullableModifier<string, import("@medusajs/framework/utils").TextProperty>;
+            category_custom_attribute: import("@medusajs/framework/utils").BelongsTo<() => import("@medusajs/framework/utils").DmlEntity<import("@medusajs/framework/utils").DMLEntitySchemaBuilder</*elided*/ any>, "category_custom_attribute">, undefined>;
+        }>, "product_custom_attribute">>;
+    }>, "category_custom_attribute">;
+    ProductCustomAttribute: import("@medusajs/framework/utils").DmlEntity<import("@medusajs/framework/utils").DMLEntitySchemaBuilder<{
+        id: import("@medusajs/framework/utils").PrimaryKeyModifier<string, import("@medusajs/framework/utils").IdProperty>;
+        product_id: import("@medusajs/framework/utils").TextProperty;
+        value: import("@medusajs/framework/utils").TextProperty;
+        value_numeric: import("@medusajs/framework/utils").NullableModifier<number, import("@medusajs/framework/utils").NumberProperty>;
+        value_file: import("@medusajs/framework/utils").NullableModifier<string, import("@medusajs/framework/utils").TextProperty>;
+        category_custom_attribute: import("@medusajs/framework/utils").BelongsTo<() => import("@medusajs/framework/utils").DmlEntity<import("@medusajs/framework/utils").DMLEntitySchemaBuilder<{
+            id: import("@medusajs/framework/utils").PrimaryKeyModifier<string, import("@medusajs/framework/utils").IdProperty>;
+            key: import("@medusajs/framework/utils").TextProperty;
+            type: import("@medusajs/framework/utils").TextProperty;
+            label: import("@medusajs/framework/utils").TextProperty;
+            unit: import("@medusajs/framework/utils").NullableModifier<string, import("@medusajs/framework/utils").TextProperty>;
+            sort_order: import("@medusajs/framework/utils").NumberProperty;
+            category_id: import("@medusajs/framework/utils").TextProperty;
+            is_standard: import("@medusajs/framework/utils").BooleanProperty;
+            product_custom_attributes: import("@medusajs/framework/utils").HasMany<() => import("@medusajs/framework/utils").DmlEntity<import("@medusajs/framework/utils").DMLEntitySchemaBuilder</*elided*/ any>, "product_custom_attribute">>;
+        }>, "category_custom_attribute">, undefined>;
+    }>, "product_custom_attribute">;
+}>>;
+declare class CustomAttributeService extends CustomAttributeService_base {
+    getCategoryAttributes(categoryId: string): Promise<{
+        id: string;
+        key: string;
+        type: string;
+        label: string;
+        unit: string | null;
+        sort_order: number;
+        category_id: string;
+        is_standard: boolean;
+        product_custom_attributes: {
+            id: string;
+            product_id: string;
+            value: string;
+            value_numeric: number | null;
+            value_file: string | null;
+            category_custom_attribute: /*elided*/ any;
+            raw_value_numeric: Record<string, unknown> | null;
+            created_at: Date;
+            updated_at: Date;
+            deleted_at: Date | null;
+            category_custom_attribute_id: string;
+        }[];
+        created_at: Date;
+        updated_at: Date;
+        deleted_at: Date | null;
+    }[]>;
+    createCategoryAttribute(data: {
+        label: string;
+        type: string;
+        unit?: string | null;
+        category_id: string;
+        is_standard?: boolean;
+        sort_order?: number;
+    }): Promise<{
+        id: string;
+        key: string;
+        type: string;
+        label: string;
+        unit: string | null;
+        sort_order: number;
+        category_id: string;
+        is_standard: boolean;
+        product_custom_attributes: {
+            id: string;
+            product_id: string;
+            value: string;
+            value_numeric: number | null;
+            value_file: string | null;
+            category_custom_attribute: /*elided*/ any;
+            raw_value_numeric: Record<string, unknown> | null;
+            created_at: Date;
+            updated_at: Date;
+            deleted_at: Date | null;
+            category_custom_attribute_id: string;
+        }[];
+        created_at: Date;
+        updated_at: Date;
+        deleted_at: Date | null;
+    }>;
+    updateCategoryAttribute(id: string, data: {
+        label?: string;
+        type?: string;
+        unit?: string | null;
+        sort_order?: number;
+        deleted_at?: string;
+    }): Promise<{
+        id: string;
+        key: string;
+        type: string;
+        label: string;
+        unit: string | null;
+        sort_order: number;
+        category_id: string;
+        is_standard: boolean;
+        product_custom_attributes: {
+            id: string;
+            product_id: string;
+            value: string;
+            value_numeric: number | null;
+            value_file: string | null;
+            category_custom_attribute: /*elided*/ any;
+            raw_value_numeric: Record<string, unknown> | null;
+            created_at: Date;
+            updated_at: Date;
+            deleted_at: Date | null;
+            category_custom_attribute_id: string;
+        }[];
+        created_at: Date;
+        updated_at: Date;
+        deleted_at: Date | null;
+    }[]>;
+    createProductAttribute(data: {
+        product_id: string;
+        category_custom_attribute_id: string;
+        value: string;
+        value_numeric?: number | null;
+        value_file?: string | null;
+    }): Promise<{
+        id: string;
+        product_id: string;
+        value: string;
+        value_numeric: number | null;
+        value_file: string | null;
+        category_custom_attribute: {
+            id: string;
+            key: string;
+            type: string;
+            label: string;
+            unit: string | null;
+            sort_order: number;
+            category_id: string;
+            is_standard: boolean;
+            product_custom_attributes: /*elided*/ any[];
+            created_at: Date;
+            updated_at: Date;
+            deleted_at: Date | null;
+        };
+        raw_value_numeric: Record<string, unknown> | null;
+        created_at: Date;
+        updated_at: Date;
+        deleted_at: Date | null;
+        category_custom_attribute_id: string;
+    }>;
+    updateProductAttribute(id: string, data: {
+        value?: string;
+        value_numeric?: number | null;
+        value_file?: string | null;
+        deleted_at?: string;
+    }): Promise<{
+        id: string;
+        product_id: string;
+        value: string;
+        value_numeric: number | null;
+        value_file: string | null;
+        category_custom_attribute: {
+            id: string;
+            key: string;
+            type: string;
+            label: string;
+            unit: string | null;
+            sort_order: number;
+            category_id: string;
+            is_standard: boolean;
+            product_custom_attributes: /*elided*/ any[];
+            created_at: Date;
+            updated_at: Date;
+            deleted_at: Date | null;
+        };
+        raw_value_numeric: Record<string, unknown> | null;
+        created_at: Date;
+        updated_at: Date;
+        deleted_at: Date | null;
+        category_custom_attribute_id: string;
+    }[]>;
+    getProductAttributes(productId: string): Promise<{
+        id: string;
+        product_id: string;
+        value: string;
+        value_numeric: number | null;
+        value_file: string | null;
+        category_custom_attribute: {
+            id: string;
+            key: string;
+            type: string;
+            label: string;
+            unit: string | null;
+            sort_order: number;
+            category_id: string;
+            is_standard: boolean;
+            product_custom_attributes: /*elided*/ any[];
+            created_at: Date;
+            updated_at: Date;
+            deleted_at: Date | null;
+        };
+        raw_value_numeric: Record<string, unknown> | null;
+        created_at: Date;
+        updated_at: Date;
+        deleted_at: Date | null;
+        category_custom_attribute_id: string;
+    }[]>;
+    private generateKey;
+}
+export default CustomAttributeService;
+//# sourceMappingURL=service.d.ts.map

package/dist/service.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"service.d.ts","sourceRoot":"","sources":["../src/service.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYA,cAAM,sBAAuB,SAAQ,2BAAqB;IAClD,qBAAqB,CAAC,UAAU,EAAE,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;IAQxC,uBAAuB,CAAC,IAAI,EAAE;QAClC,KAAK,EAAE,MAAM,CAAA;QACb,IAAI,EAAE,MAAM,CAAA;QACZ,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;QACpB,WAAW,EAAE,MAAM,CAAA;QACnB,WAAW,CAAC,EAAE,OAAO,CAAA;QACrB,UAAU,CAAC,EAAE,MAAM,CAAA;KACpB;;;;;;;;;;;;;;;;;;;;;;;;;;IAYK,uBAAuB,CAC3B,EAAE,EAAE,MAAM,EACV,IAAI,EAAE;QACJ,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,IAAI,CAAC,EAAE,MAAM,CAAA;QACb,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;QACpB,UAAU,CAAC,EAAE,MAAM,CAAA;QACnB,UAAU,CAAC,EAAE,MAAM,CAAA;KACpB;;;;;;;;;;;;;;;;;;;;;;;;;;IAUG,sBAAsB,CAAC,IAAI,EAAE;QACjC,UAAU,EAAE,MAAM,CAAA;QAClB,4BAA4B,EAAE,MAAM,CAAA;QACpC,KAAK,EAAE,MAAM,CAAA;QACb,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;QAC7B,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;KAC3B;;;;;;;;;;;;;;;;;;;;;;;;;;IAKK,sBAAsB,CAC1B,EAAE,EAAE,MAAM,EACV,IAAI,EAAE;QACJ,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;QAC7B,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;QAC1B,UAAU,CAAC,EAAE,MAAM,CAAA;KACpB;;;;;;;;;;;;;;;;;;;;;;;;;;IAMG,oBAAoB,CAAC,SAAS,EAAE,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;IAU5C,OAAO,CAAC,WAAW;CAMpB;AAED,eAAe,sBAAsB,CAAA"}

package/dist/service.js

@@ -0,0 +1,66 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const utils_1 = require("@medusajs/framework/utils");
+const category_custom_attribute_1 = __importDefault(require("./models/category-custom-attribute"));
+const product_custom_attribute_1 = __importDefault(require("./models/product-custom-attribute"));
+const models = {
+    CategoryCustomAttribute: category_custom_attribute_1.default,
+    ProductCustomAttribute: product_custom_attribute_1.default,
+};
+// @ts-ignore - MedusaService dynamically generates methods based on models
+class CustomAttributeService extends (0, utils_1.MedusaService)(models) {
+    async getCategoryAttributes(categoryId) {
+        // @ts-ignore - method generated by MedusaService
+        return await this.listCategoryCustomAttributes({
+            category_id: categoryId,
+            deleted_at: null,
+        });
+    }
+    async createCategoryAttribute(data) {
+        const key = this.generateKey(data.label);
+        // @ts-ignore - method generated by MedusaService
+        return await this.createCategoryCustomAttributes({
+            ...data,
+            key,
+            unit: data.unit ?? null,
+            is_standard: data.is_standard ?? false,
+            sort_order: data.sort_order ?? 0,
+        });
+    }
+    async updateCategoryAttribute(id, data) {
+        const updateData = { ...data };
+        if (data.label) {
+            updateData.key = this.generateKey(data.label);
+        }
+        // @ts-ignore - method generated by MedusaService
+        return await this.updateCategoryCustomAttributes([{ id, ...updateData }]);
+    }
+    async createProductAttribute(data) {
+        // @ts-ignore - method generated by MedusaService
+        return await this.createProductCustomAttributes(data);
+    }
+    async updateProductAttribute(id, data) {
+        // @ts-ignore - method generated by MedusaService
+        return await this.updateProductCustomAttributes([{ id, ...data }]);
+    }
+    async getProductAttributes(productId) {
+        // @ts-ignore - method generated by MedusaService
+        return await this.listProductCustomAttributes({
+            product_id: productId,
+            deleted_at: null,
+        }, {
+            relations: ["category_custom_attribute"],
+        });
+    }
+    generateKey(label) {
+        return label
+            .toLowerCase()
+            .replace(/[^a-z0-9]+/g, "_")
+            .replace(/^_|_$/g, "");
+    }
+}
+exports.default = CustomAttributeService;
+//# sourceMappingURL=service.js.map

package/dist/service.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"service.js","sourceRoot":"","sources":["../src/service.ts"],"names":[],"mappings":";;;;;AAAA,qDAAyD;AACzD,mGAAwE;AACxE,iGAAsE;AAEtE,MAAM,MAAM,GAAG;IACb,uBAAuB,EAAvB,mCAAuB;IACvB,sBAAsB,EAAtB,kCAAsB;CACvB,CAAA;AAID,2EAA2E;AAC3E,MAAM,sBAAuB,SAAQ,IAAA,qBAAa,EAAC,MAAM,CAAC;IACxD,KAAK,CAAC,qBAAqB,CAAC,UAAkB;QAC5C,iDAAiD;QACjD,OAAO,MAAM,IAAI,CAAC,4BAA4B,CAAC;YAC7C,WAAW,EAAE,UAAU;YACvB,UAAU,EAAE,IAAI;SACjB,CAAC,CAAA;IACJ,CAAC;IAED,KAAK,CAAC,uBAAuB,CAAC,IAO7B;QACC,MAAM,GAAG,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACxC,iDAAiD;QACjD,OAAO,MAAM,IAAI,CAAC,8BAA8B,CAAC;YAC/C,GAAG,IAAI;YACP,GAAG;YACH,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,IAAI;YACvB,WAAW,EAAE,IAAI,CAAC,WAAW,IAAI,KAAK;YACtC,UAAU,EAAE,IAAI,CAAC,UAAU,IAAI,CAAC;SACjC,CAAC,CAAA;IACJ,CAAC;IAED,KAAK,CAAC,uBAAuB,CAC3B,EAAU,EACV,IAMC;QAED,MAAM,UAAU,GAAwB,EAAE,GAAG,IAAI,EAAE,CAAA;QACnD,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,UAAU,CAAC,GAAG,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QAC/C,CAAC;QACD,iDAAiD;QACjD,OAAO,MAAM,IAAI,CAAC,8BAA8B,CAAC,CAAC,EAAE,EAAE,EAAE,GAAG,UAAU,EAAE,CAAC,CAAC,CAAA;IAC3E,CAAC;IAED,KAAK,CAAC,sBAAsB,CAAC,IAM5B;QACC,iDAAiD;QACjD,OAAO,MAAM,IAAI,CAAC,6BAA6B,CAAC,IAAI,CAAC,CAAA;IACvD,CAAC;IAED,KAAK,CAAC,sBAAsB,CAC1B,EAAU,EACV,IAKC;QAED,iDAAiD;QACjD,OAAO,MAAM,IAAI,CAAC,6BAA6B,CAAC,CAAC,EAAE,EAAE,EAAE,GAAG,IAAI,EAAE,CAAC,CAAC,CAAA;IACpE,CAAC;IAED,KAAK,CAAC,oBAAoB,CAAC,SAAiB;QAC1C,iDAAiD;QACjD,OAAO,MAAM,IAAI,CAAC,2BAA2B,CAAC;YAC5C,UAAU,EAAE,SAAS;YACrB,UAAU,EAAE,IAAI;SACjB,EAAE;YACD,SAAS,EAAE,CAAC,2BAA2B,CAAC;SACzC,CAAC,CAAA;IACJ,CAAC;IAEO,WAAW,CAAC,KAAa;QAC/B,OAAO,KAAK;aACT,WAAW,EAAE;aACb,OAAO,CAAC,aAAa,EAAE,GAAG,CAAC;aAC3B,OAAO,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAA;IAC1B,CAAC;CACF;AAED,kBAAe,sBAAsB,CAAA"}

package/package.json

@@ -0,0 +1,70 @@
+{
+  "name": "@empty-complete-org/medusa-product-attributes",
+  "version": "0.10.0",
+  "description": "Custom attributes module for Medusa v2 with support for text, number, file types and units of measurement",
+  "author": "empty-complete",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/empty-complete/medusa-product-attributes.git"
+  },
+  "keywords": [
+    "medusa",
+    "medusajs-v2",
+    "medusa-module",
+    "custom-attributes",
+    "product-attributes",
+    "ecommerce",
+    "typescript",
+    "product"
+  ],
+  "files": [
+    "dist",
+    "src/admin",
+    "src/api"
+  ],
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "require": "./dist/index.js"
+    },
+    "./models/*": "./dist/models/*.js",
+    "./service": "./dist/service.js",
+    "./admin/*": "./src/admin/*.tsx",
+    "./api/*": "./src/api/*"
+  },
+  "scripts": {
+    "build": "tsc",
+    "clean": "rm -rf dist",
+    "prepublishOnly": "npm run clean && npm run build",
+    "test": "jest",
+    "test:watch": "jest --watch",
+    "test:coverage": "jest --coverage",
+    "version:inc": "node -e \"const p=require('./package.json'),v=p.version.split('.').map(Number),n=process.argv[2]||'patch';if(n==='major'){v[0]++;v[1]=0;v[2]=0}else if(n==='minor'){v[1]++;v[2]=0}else{v[2]++};p.version=v.join('.');require('fs').writeFileSync('package.json',JSON.stringify(p,null,2))\"",
+    "prepare": "husky"
+  },
+  "peerDependencies": {
+    "@medusajs/framework": "^2.0.0",
+    "@medusajs/admin-sdk": "^2.0.0",
+    "@medusajs/ui": "^4.0.0",
+    "@medusajs/js-sdk": "^2.0.0",
+    "@tanstack/react-query": "^5.0.0",
+    "react": "^18.0.0 || ^19.0.0"
+  },
+  "devDependencies": {
+    "@jest/globals": "^30.0.0",
+    "@medusajs/framework": "^2.13.1",
+    "@types/jest": "^30.0.0",
+    "@types/node": "^20.0.0",
+    "husky": "^9.1.7",
+    "jest": "^30.3.0",
+    "ts-jest": "^29.4.6",
+    "typescript": "^5.0.0"
+  },
+  "engines": {
+    "node": ">=20"
+  },
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org"
+  }
+}

package/src/admin/lib/sdk.ts

@@ -0,0 +1,9 @@
+import Medusa from "@medusajs/js-sdk"
+
+export const sdk = new Medusa({
+  baseUrl: import.meta.env.VITE_BACKEND_URL || "/",
+  debug: import.meta.env.DEV,
+  auth: {
+    type: "session",
+  },
+})

package/src/admin/widgets/category-attribute-templates.tsx

@@ -0,0 +1,237 @@
+import { defineWidgetConfig } from "@medusajs/admin-sdk"
+import {
+  DetailWidgetProps,
+  AdminProductCategory,
+} from "@medusajs/framework/types"
+import { Container, Heading, Button, Input, Text, Badge } from "@medusajs/ui"
+import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query"
+import { useState } from "react"
+import { sdk } from "../lib/sdk"
+
+type CategoryCustomAttribute = {
+  id: string
+  label: string
+  type: "text" | "number" | "file" | "boolean"
+  category_id: string
+}
+
+type FormState = {
+  label: string
+  type: "text" | "number"
+}
+
+const emptyForm = (): FormState => ({ label: "", type: "text" })
+
+const CategoryAttributeTemplatesWidget = ({
+  data,
+}: DetailWidgetProps<AdminProductCategory>) => {
+  const categoryId = data.id
+  const qc = useQueryClient()
+  const queryKey = ["category-custom-attributes", categoryId]
+
+  const [showAddForm, setShowAddForm] = useState(false)
+  const [addForm, setAddForm] = useState<FormState>(emptyForm())
+  const [confirmDeleteId, setConfirmDeleteId] = useState<string | null>(null)
+  const [mutationError, setMutationError] = useState<string | null>(null)
+
+  const {
+    data: result,
+    isLoading,
+    isError,
+  } = useQuery<{
+    category_custom_attributes: CategoryCustomAttribute[]
+  }>({
+    queryKey,
+    queryFn: () =>
+      sdk.client.fetch(`/admin/category/${categoryId}/custom-attributes`),
+  })
+
+  const attributes = result?.category_custom_attributes ?? []
+
+  const createMutation = useMutation({
+    mutationFn: (body: { label: string; type: string }) =>
+      sdk.client.fetch(`/admin/category/${categoryId}/custom-attributes`, {
+        method: "POST",
+        body,
+      }),
+    onSuccess: () => {
+      qc.invalidateQueries({ queryKey })
+      setShowAddForm(false)
+      setAddForm(emptyForm())
+      setMutationError(null)
+    },
+    onError: (err: any) => {
+      setMutationError(err?.message || "Ошибка при создании атрибута")
+    },
+  })
+
+  const deleteMutation = useMutation({
+    mutationFn: (id: string) =>
+      sdk.client.fetch(`/admin/category/${categoryId}/custom-attributes`, {
+        method: "PATCH",
+        body: { id, deleted_at: new Date().toISOString() },
+      }),
+    onSuccess: () => {
+      qc.invalidateQueries({ queryKey })
+      setConfirmDeleteId(null)
+    },
+  })
+
+  const handleAdd = () => {
+    if (!addForm.label.trim()) return
+    createMutation.mutate({
+      label: addForm.label.trim(),
+      type: addForm.type,
+    })
+  }
+
+  return (
+    <Container className="divide-y p-0">
+      <div className="flex items-center justify-between px-6 py-4">
+        <Heading level="h2">Атрибуты</Heading>
+        {!showAddForm && (
+          <Button
+            variant="secondary"
+            size="small"
+            onClick={() => setShowAddForm(true)}
+          >
+            + Добавить
+          </Button>
+        )}
+      </div>
+
+      {isLoading && (
+        <div className="px-6 py-4">
+          <Text className="text-ui-fg-muted text-sm">Загрузка…</Text>
+        </div>
+      )}
+
+      {isError && (
+        <div className="px-6 py-4">
+          <Text className="text-ui-fg-error text-sm">
+            Не удалось загрузить атрибуты.
+          </Text>
+        </div>
+      )}
+
+      {!isLoading && !isError && attributes.length === 0 && !showAddForm && (
+        <div className="px-6 py-4">
+          <Text className="text-ui-fg-muted text-sm">
+            Нет атрибутов. Добавьте первый.
+          </Text>
+        </div>
+      )}
+
+      {attributes.length > 0 && (
+        <div className="divide-y">
+          {attributes.map((attr) =>
+            confirmDeleteId === attr.id ? (
+              <div
+                key={attr.id}
+                className="flex items-center gap-3 px-6 py-3 text-sm"
+              >
+                <span className="flex-1 text-ui-fg-base">
+                  Удалить «{attr.label}»?
+                </span>
+                <Button
+                  size="small"
+                  variant="danger"
+                  onClick={() => deleteMutation.mutate(attr.id)}
+                  isLoading={deleteMutation.isPending}
+                >
+                  Удалить
+                </Button>
+                <Button
+                  size="small"
+                  variant="secondary"
+                  onClick={() => setConfirmDeleteId(null)}
+                >
+                  Отмена
+                </Button>
+              </div>
+            ) : (
+              <div
+                key={attr.id}
+                className="flex items-center gap-3 px-6 py-3"
+              >
+                <span className="flex-1 text-sm text-ui-fg-base">
+                  {attr.label}
+                </span>
+                <Badge size="2xsmall" color="grey">
+                  {attr.type === "text"
+                    ? "Текст"
+                    : attr.type === "number"
+                      ? "Число"
+                      : attr.type}
+                </Badge>
+                <button
+                  onClick={() => setConfirmDeleteId(attr.id)}
+                  className="text-xs text-ui-fg-error hover:underline"
+                >
+                  Удалить
+                </button>
+              </div>
+            )
+          )}
+        </div>
+      )}
+
+      {showAddForm && (
+        <div className="flex items-center gap-2 px-6 py-3">
+          <Input
+            value={addForm.label}
+            onChange={(e) =>
+              setAddForm((f) => ({ ...f, label: e.target.value }))
+            }
+            placeholder="Название атрибута"
+            className="flex-1 h-8 text-sm"
+            autoFocus
+          />
+          <select
+            value={addForm.type}
+            onChange={(e) =>
+              setAddForm((f) => ({
+                ...f,
+                type: e.target.value as "text" | "number",
+              }))
+            }
+            className="h-8 rounded border border-ui-border-base bg-ui-bg-base px-2 text-sm"
+          >
+            <option value="text">Текст</option>
+            <option value="number">Число</option>
+          </select>
+          <Button
+            size="small"
+            onClick={handleAdd}
+            isLoading={createMutation.isPending}
+          >
+            Добавить
+          </Button>
+          <Button
+            variant="secondary"
+            size="small"
+            onClick={() => {
+              setShowAddForm(false)
+              setAddForm(emptyForm())
+              setMutationError(null)
+            }}
+          >
+            Отмена
+          </Button>
+        </div>
+      )}
+
+      {mutationError && (
+        <div className="px-6 py-2">
+          <Text className="text-ui-fg-error text-sm">{mutationError}</Text>
+        </div>
+      )}
+    </Container>
+  )
+}
+
+export const config = defineWidgetConfig({
+  zone: "product_category.details.after",
+})
+
+export default CategoryAttributeTemplatesWidget