@loom-framework/core 0.1.0-alpha.19 → 0.1.0-alpha.191

package/dist/cli/templates/system-settings-page.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"system-settings-page.js","sourceRoot":"","sources":["../../../src/cli/templates/system-settings-page.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,yBAAyB;AAEzB,MAAM,UAAU,2BAA2B;IACzC,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+RR,CAAC;AACF,CAAC;AAED,yBAAyB;AAEzB,MAAM,UAAU,2BAA2B;IACzC,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAidR,CAAC;AACF,CAAC"}

package/dist/cli/templates/tsconfig.d.ts

@@ -0,0 +1,6 @@
+/**
+ * tsconfig.json and frontend/tsconfig.json templates
+ */
+export declare function createTsconfig(): object;
+export declare function createFrontendTsconfig(): string;
+//# sourceMappingURL=tsconfig.d.ts.map

package/dist/cli/templates/tsconfig.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tsconfig.d.ts","sourceRoot":"","sources":["../../../src/cli/templates/tsconfig.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,wBAAgB,cAAc,IAAI,MAAM,CAgBvC;AAED,wBAAgB,sBAAsB,IAAI,MAAM,CAmB/C"}

package/dist/cli/templates/tsconfig.js

@@ -0,0 +1,41 @@
+/**
+ * tsconfig.json and frontend/tsconfig.json templates
+ */
+export function createTsconfig() {
+    return {
+        compilerOptions: {
+            target: 'ES2022',
+            module: 'Node16',
+            moduleResolution: 'Node16',
+            strict: true,
+            esModuleInterop: true,
+            skipLibCheck: true,
+            forceConsistentCasingInFileNames: true,
+            resolveJsonModule: true,
+            declaration: true,
+            sourceMap: true,
+        },
+        exclude: ['node_modules', 'dist', 'frontend'],
+    };
+}
+export function createFrontendTsconfig() {
+    return `{
+  "compilerOptions": {
+    "target": "ES2022",
+    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "jsx": "react-jsx",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true
+  },
+  "include": ["src"]
+}
+`;
+}
+//# sourceMappingURL=tsconfig.js.map

package/dist/cli/templates/tsconfig.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tsconfig.js","sourceRoot":"","sources":["../../../src/cli/templates/tsconfig.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,MAAM,UAAU,cAAc;IAC5B,OAAO;QACL,eAAe,EAAE;YACf,MAAM,EAAE,QAAQ;YAChB,MAAM,EAAE,QAAQ;YAChB,gBAAgB,EAAE,QAAQ;YAC1B,MAAM,EAAE,IAAI;YACZ,eAAe,EAAE,IAAI;YACrB,YAAY,EAAE,IAAI;YAClB,gCAAgC,EAAE,IAAI;YACtC,iBAAiB,EAAE,IAAI;YACvB,WAAW,EAAE,IAAI;YACjB,SAAS,EAAE,IAAI;SAChB;QACD,OAAO,EAAE,CAAC,cAAc,EAAE,MAAM,EAAE,UAAU,CAAC;KAC9C,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,sBAAsB;IACpC,OAAO;;;;;;;;;;;;;;;;;CAiBR,CAAC;AACF,CAAC"}

package/dist/cli/templates/user-management-page.d.ts

@@ -0,0 +1,8 @@
+/**
+ * User Management page template
+ *
+ * GENERATED by scripts/generate-templates.ts — v0.1.0-alpha.191 — DO NOT EDIT MANUALLY.
+ * Source: packages/frontend-antd/src/auth/user-management-page.tsx
+ */
+export declare function userManagementPageTemplate(): string;
+//# sourceMappingURL=user-management-page.d.ts.map

package/dist/cli/templates/user-management-page.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"user-management-page.d.ts","sourceRoot":"","sources":["../../../src/cli/templates/user-management-page.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,wBAAgB,0BAA0B,IAAI,MAAM,CAyenD"}

package/dist/cli/templates/user-management-page.js

@@ -0,0 +1,497 @@
+/**
+ * User Management page template
+ *
+ * GENERATED by scripts/generate-templates.ts — v0.1.0-alpha.191 — DO NOT EDIT MANUALLY.
+ * Source: packages/frontend-antd/src/auth/user-management-page.tsx
+ */
+export function userManagementPageTemplate() {
+    return `/**
+ * UserManagementPage - Admin user & role management
+ *
+ * Users tab: user list + add/delete/edit + role assignment
+ * Roles tab: role list + add/edit/delete with permission configuration
+ * Uses useUsers and useRoles hooks.
+ */
+
+import React, { useState, useCallback, useEffect } from 'react';
+import { Table, Button, Modal, Form, Input, Select, Space, message, Popconfirm, Tag, Typography, theme, Breadcrumb, Flex, Tabs, Card } from 'antd';
+import { PlusOutlined, EditOutlined, DeleteOutlined, UserOutlined, HomeOutlined, SafetyOutlined } from '@ant-design/icons';
+import { useUsers, useRoles, useLocale, registerMessages, useAppShell } from '@loom-framework/frontend-antd';
+
+registerMessages('zh-CN', {
+  'user.title': '用户管理',
+  'user.addUser': '添加用户',
+  'user.editUser': '编辑用户',
+  'user.username': '用户名',
+  'user.password': '密码',
+  'user.newPassword': '新密码',
+  'user.role': '角色',
+  'user.createdAt': '创建时间',
+  'user.action': '操作',
+  'user.deleteConfirm': '确认删除用户 "{name}"？',
+  'user.userAdded': '用户已添加',
+  'user.userAddFailed': '添加用户失败',
+  'user.userUpdated': '用户已更新',
+  'user.userUpdateFailed': '更新用户失败',
+  'user.userDeleted': '用户已删除',
+  'user.userDeleteFailed': '删除用户失败',
+  'user.usernameRequired': '请输入用户名',
+  'user.passwordRequired': '请输入密码',
+  'user.passwordMin': '密码至少8位',
+  'user.leaveBlankToKeep': '留空则保持不变',
+  'user.permissions': '权限',
+  'user.users': '用户',
+  'user.roles': '角色',
+  'user.addRole': '添加角色',
+  'user.editRole': '编辑角色',
+  'user.roleName': '角色名称',
+  'user.roleNameInvalid': '角色名必须以小写字母开头，只能包含小写字母、数字、连字符或下划线（2-32位）',
+  'user.roleExists': '角色名已存在',
+  'user.roleCreated': '角色已创建',
+  'user.roleCreateFailed': '创建角色失败',
+  'user.roleUpdated': '角色已更新',
+  'user.roleUpdateFailed': '更新角色失败',
+  'user.roleDeleted': '角色已删除',
+  'user.deleteRoleConfirm': '确认删除角色 "{name}"？',
+  'user.deleteRoleInUse': '角色 "{name}" 下有 {count} 位用户，无法删除',
+  'user.cannotDeleteLastAdmin': '无法删除最后一个管理员角色',
+  'user.model': '模型',
+  'user.level': '级别',
+  'user.wildcard': '全部模型',
+  'user.permissionLevel': '权限级别',
+  'user.defaultPermissions': '默认权限',
+  'user.namePlaceholder': '例如 editor',
+});
+
+registerMessages('en-US', {
+  'user.title': 'User Management',
+  'user.addUser': 'Add User',
+  'user.editUser': 'Edit User',
+  'user.username': 'Username',
+  'user.password': 'Password',
+  'user.newPassword': 'New Password',
+  'user.role': 'Role',
+  'user.createdAt': 'Created At',
+  'user.action': 'Action',
+  'user.deleteConfirm': 'Delete user "{name}"?',
+  'user.userAdded': 'User added',
+  'user.userAddFailed': 'Failed to add user',
+  'user.userUpdated': 'User updated',
+  'user.userUpdateFailed': 'Failed to update user',
+  'user.userDeleted': 'User deleted',
+  'user.userDeleteFailed': 'Failed to delete user',
+  'user.usernameRequired': 'Username is required',
+  'user.passwordRequired': 'Password is required',
+  'user.passwordMin': 'Password must be at least 8 characters',
+  'user.leaveBlankToKeep': 'Leave blank to keep current',
+  'user.permissions': 'Permissions',
+  'user.users': 'Users',
+  'user.roles': 'Roles',
+  'user.addRole': 'Add Role',
+  'user.editRole': 'Edit Role',
+  'user.roleName': 'Role Name',
+  'user.roleNameInvalid': 'Role name must start with a lowercase letter and contain only lowercase letters, digits, hyphens, or underscores (2-32 chars)',
+  'user.roleExists': 'Role name already exists',
+  'user.roleCreated': 'Role created',
+  'user.roleCreateFailed': 'Failed to create role',
+  'user.roleUpdated': 'Role updated',
+  'user.roleUpdateFailed': 'Failed to update role',
+  'user.roleDeleted': 'Role deleted',
+  'user.deleteRoleConfirm': 'Delete role "{name}"?',
+  'user.deleteRoleInUse': 'Role "{name}" has {count} user(s), cannot delete',
+  'user.cannotDeleteLastAdmin': 'Cannot delete the last admin role',
+  'user.model': 'Model',
+  'user.level': 'Level',
+  'user.wildcard': 'All Models',
+  'user.permissionLevel': 'Permission Level',
+  'user.defaultPermissions': 'Default Permissions',
+  'user.namePlaceholder': 'e.g. editor',
+});
+
+const LEVEL_COLORS: Record<string, string> = {
+  admin: 'red',
+  write: 'blue',
+  read: 'green',
+  none: 'default',
+};
+
+const LEVEL_OPTIONS = [
+  { value: 'none', label: 'None' },
+  { value: 'read', label: 'Read' },
+  { value: 'write', label: 'Write' },
+  { value: 'admin', label: 'Admin' },
+];
+
+function UserManagementPage() {
+  const { t } = useLocale();
+  const { breadcrumbs, onNavClick } = useAppShell();
+  const [activeTab, setActiveTab] = useState('users');
+  const [addUserModalOpen, setAddUserModalOpen] = useState(false);
+  const [addRoleModalOpen, setAddRoleModalOpen] = useState(false);
+
+  const handleTabChange = (key: string) => {
+    setActiveTab(key);
+    setAddUserModalOpen(false);
+    setAddRoleModalOpen(false);
+  };
+
+  return (
+    <div style={{ display: 'flex', flexDirection: 'column', flex: 1, minHeight: 0 }}>
+      <Flex justify="space-between" align="center" style={{ marginBottom: 12 }}>
+        <Breadcrumb items={[{ title: <HomeOutlined onClick={() => onNavClick?.('')} style={{ cursor: 'pointer' }} /> }, ...(breadcrumbs || []).map((b: { title: string; path?: string }) => ({ title: b.path ? <a onClick={() => onNavClick?.(b.path!)}>{b.title}</a> : b.title }))]} />
+      </Flex>
+      <Tabs
+        activeKey={activeTab}
+        onChange={handleTabChange}
+        destroyInactiveTabPane
+        animated={{ inkBar: true, tabPane: false }}
+        tabBarStyle={{ marginLeft: 12 }}
+        tabBarExtraContent={activeTab === 'users'
+          ? <Button type="primary" icon={<PlusOutlined />} onClick={() => setAddUserModalOpen(true)}>{t('user.addUser') || 'Add User'}</Button>
+          : <Button type="primary" icon={<SafetyOutlined />} onClick={() => setAddRoleModalOpen(true)}>{t('user.addRole') || 'Add Role'}</Button>
+        }
+        items={[
+          { key: 'users', label: t('user.users') || 'Users', children: <div style={{ animation: 'loom-page-enter 0.25s ease both' }}><UsersTab addUserModalOpen={addUserModalOpen} onAddUserModalClose={() => setAddUserModalOpen(false)} /></div> },
+          { key: 'roles', label: t('user.roles') || 'Roles', children: <div style={{ animation: 'loom-page-enter 0.25s ease both' }}><RolesTab addRoleModalOpen={addRoleModalOpen} onAddRoleModalClose={() => setAddRoleModalOpen(false)} /></div> },
+        ]}
+      />
+    </div>
+  );
+}
+
+function UsersTab({ addUserModalOpen, onAddUserModalClose }: { addUserModalOpen: boolean; onAddUserModalClose: () => void }) {
+  const { token } = theme.useToken();
+  const { t } = useLocale();
+  const { users, loading, addUser, deleteUser, updateUser } = useUsers();
+  const { rolesData } = useRoles();
+  const [editModalOpen, setEditModalOpen] = useState(false);
+  const [editingUser, setEditingUser] = useState<{ userId: string; username: string; role: string } | null>(null);
+  const [addForm] = Form.useForm();
+  const [editForm] = Form.useForm();
+
+  const roleOptions = rolesData
+    ? rolesData.roles.map(r => ({ value: r.role, label: r.role }))
+    : [];
+
+  const handleAdd = async (values: { username: string; password: string; role: string }) => {
+    const result = await addUser(values.username, values.password, values.role);
+    if (result) {
+      message.success(t('user.userAdded') || 'User added');
+      onAddUserModalClose();
+      addForm.resetFields();
+    } else {
+      message.error(t('user.userAddFailed') || 'Failed to add user');
+    }
+  };
+
+  const handleEdit = async (values: { role: string; password?: string }) => {
+    if (!editingUser) return;
+    const updates: Partial<{ username: string; password: string; role: string }> = { role: values.role };
+    if (values.password) updates.password = values.password;
+    const result = await updateUser(editingUser.userId, updates);
+    if (result) {
+      message.success(t('user.userUpdated') || 'User updated');
+      setEditModalOpen(false);
+      setEditingUser(null);
+    } else {
+      message.error(t('user.userUpdateFailed') || 'Failed to update user');
+    }
+  };
+
+  const columns = [
+    {
+      title: t('user.username') || 'Username',
+      dataIndex: 'username',
+      key: 'username',
+      render: (name: string) => <span style={{ fontWeight: token.fontWeightStrong }}>{name}</span>,
+    },
+    {
+      title: t('user.role') || 'Role',
+      dataIndex: 'role',
+      key: 'role',
+      width: 120,
+      render: (role: string) => <Tag color={LEVEL_COLORS[role] || 'default'}>{role}</Tag>,
+    },
+    {
+      title: t('user.createdAt') || 'Created At',
+      dataIndex: 'createdAt',
+      key: 'createdAt',
+      width: 180,
+      render: (val: string) => val ? <Typography.Text type="secondary" style={{ fontSize: token.fontSizeSM }}>{new Date(val).toLocaleString()}</Typography.Text> : '-',
+    },
+    {
+      title: t('user.action') || 'Action',
+      key: 'action',
+      width: 120,
+      render: (_: unknown, record: { userId: string; username: string; role: string }) => (
+        <Space size={0}>
+          <Button type="text" size="small" icon={<EditOutlined />} onClick={() => {
+            setEditingUser(record);
+            editForm.setFieldsValue({ role: record.role });
+            setEditModalOpen(true);
+          }} />
+          <Popconfirm
+            title={t('user.deleteConfirm')?.replace('{name}', record.username) || \`Delete user "\${record.username}"?\`}
+            onConfirm={async () => {
+              const ok = await deleteUser(record.userId);
+              if (ok) message.success(t('user.userDeleted') || 'User deleted');
+              else message.error(t('user.userDeleteFailed') || 'Failed to delete user');
+            }}
+          >
+            <Button type="text" size="small" danger icon={<DeleteOutlined />} />
+          </Popconfirm>
+        </Space>
+      ),
+    },
+  ];
+
+  return (
+    <>
+      <Card>
+        <Table dataSource={users} columns={columns} rowKey="userId" loading={loading} pagination={false} size="small" />
+      </Card>
+
+      <Modal
+        title={t('user.addUser') || 'Add User'}
+        open={addUserModalOpen}
+        onOk={() => addForm.submit()}
+        onCancel={() => { onAddUserModalClose(); addForm.resetFields(); }}
+        okText={t('common.save') || 'Save'}
+        cancelText={t('common.cancel') || 'Cancel'}
+        destroyOnHidden
+      >
+        <Form form={addForm} onFinish={handleAdd} layout="vertical" style={{ marginTop: token.marginMD }}>
+          <Form.Item name="username" label={t('user.username') || 'Username'} rules={[{ required: true, message: t('user.usernameRequired') || 'Username is required' }]}>
+            <Input />
+          </Form.Item>
+          <Form.Item name="password" label={t('user.password') || 'Password'} rules={[{ required: true, min: 8, message: t('user.passwordMin') || 'Password must be at least 8 characters' }]}>
+            <Input.Password />
+          </Form.Item>
+          <Form.Item name="role" label={t('user.role') || 'Role'} initialValue={roleOptions.length > 0 ? roleOptions[roleOptions.length - 1]?.value : undefined}>
+            <Select options={roleOptions} />
+          </Form.Item>
+        </Form>
+      </Modal>
+
+      <Modal
+        title={t('user.editUser') || 'Edit User'}
+        open={editModalOpen}
+        onOk={() => editForm.submit()}
+        onCancel={() => { setEditModalOpen(false); setEditingUser(null); }}
+        okText={t('common.save') || 'Save'}
+        cancelText={t('common.cancel') || 'Cancel'}
+        destroyOnHidden
+      >
+        <Form form={editForm} onFinish={handleEdit} layout="vertical" style={{ marginTop: token.marginMD }}>
+          <Form.Item name="role" label={t('user.role') || 'Role'}>
+            <Select options={roleOptions} />
+          </Form.Item>
+          <Form.Item name="password" label={t('user.newPassword') || 'New Password'}>
+            <Input.Password placeholder={t('user.leaveBlankToKeep') || 'Leave blank to keep current'} />
+          </Form.Item>
+        </Form>
+      </Modal>
+    </>
+  );
+}
+
+function RolesTab({ addRoleModalOpen, onAddRoleModalClose }: { addRoleModalOpen: boolean; onAddRoleModalClose: () => void }) {
+  const { token } = theme.useToken();
+  const { t } = useLocale();
+  const { users } = useUsers();
+  const { rolesData, loading, createRole, updateRole, deleteRole } = useRoles();
+  const [editModalOpen, setEditModalOpen] = useState(false);
+  const [editingRole, setEditingRole] = useState<{ role: string; permissions: Array<{ model: string; level: string }> } | null>(null);
+  const [roleForm] = Form.useForm();
+  const [permRows, setPermRows] = useState<Array<{ model: string; level: string }>>([]);
+
+  const buildPermRows = useCallback((permissions: Array<{ model: string; level: string }>, models: string[]) => {
+    const rows: Array<{ model: string; level: string }> = [];
+    const covered = new Set(permissions.map(p => p.model));
+    for (const m of models) {
+      const existing = permissions.find(p => p.model === m);
+      rows.push({ model: m, level: existing?.level || 'none' });
+    }
+    if (!covered.has('*')) {
+      rows.push({ model: '*', level: permissions.find(p => p.model === '*')?.level || 'none' });
+    } else {
+      rows.push({ model: '*', level: permissions.find(p => p.model === '*')?.level || 'none' });
+    }
+    return rows;
+  }, []);
+
+  const handleAddRole = async (values: { role: string }) => {
+    const permissions = permRows.filter(p => p.level !== 'none');
+    const result = await createRole(values.role, permissions);
+    if (result) {
+      message.success(t('user.roleCreated') || 'Role created');
+      onAddRoleModalClose();
+      roleForm.resetFields();
+    }
+  };
+
+  const handleEditRole = async () => {
+    if (!editingRole) return;
+    const newName = roleForm.getFieldValue('role') as string;
+    const permissions = permRows.filter(p => p.level !== 'none');
+    const updates: { role?: string; permissions?: Array<{ model: string; level: string }> } = {};
+    if (newName !== editingRole.role) updates.role = newName;
+    updates.permissions = permissions;
+    const result = await updateRole(editingRole.role, updates);
+    if (result) {
+      message.success(t('user.roleUpdated') || 'Role updated');
+      setEditModalOpen(false);
+      setEditingRole(null);
+    }
+  };
+
+  const handleDelete = async (roleName: string) => {
+    const result = await deleteRole(roleName);
+    if (result.success) {
+      message.success(t('user.roleDeleted') || 'Role deleted');
+    } else if (result.affectedUsers && result.affectedUsers.length > 0) {
+      message.error(t('user.deleteRoleInUse')?.replace('{name}', roleName).replace('{count}', String(result.affectedUsers.length)) || \`Role "\${roleName}" has users, cannot delete\`);
+    } else {
+      message.error(result.error || t('user.cannotDeleteLastAdmin') || 'Cannot delete role');
+    }
+  };
+
+  const openAddModal = () => {
+    roleForm.resetFields();
+    const initPerms = rolesData ? buildPermRows([], rolesData.models) : [];
+    setPermRows(initPerms.map(p => ({ ...p, level: 'read' })));
+  };
+
+  useEffect(() => {
+    if (addRoleModalOpen) openAddModal();
+  }, [addRoleModalOpen]);
+
+  const openEditModal = (roleInfo: { role: string; permissions: Array<{ model: string; level: string }> }) => {
+    setEditingRole(roleInfo);
+    roleForm.setFieldsValue({ role: roleInfo.role });
+    const rows = rolesData ? buildPermRows(roleInfo.permissions, rolesData.models) : [];
+    setPermRows(rows);
+    setEditModalOpen(true);
+  };
+
+  const updatePermLevel = (model: string, level: string) => {
+    setPermRows(prev => prev.map(p => p.model === model ? { ...p, level } : p));
+  };
+
+  const roleColumns = [
+    {
+      title: t('user.roleName') || 'Role Name',
+      dataIndex: 'role',
+      key: 'role',
+      width: 150,
+      render: (role: string) => <Tag color={LEVEL_COLORS[role] || 'default'} style={{ fontSize: token.fontSizeSM }}>{role}</Tag>,
+    },
+    {
+      title: t('user.permissions') || 'Permissions',
+      key: 'permissions',
+      render: (_: unknown, record: { role: string; permissions: Array<{ model: string; level: string }> }) => (
+        <Space size={4} wrap>
+          {record.permissions.map(p => (
+            <Tag key={\`\${p.model}-\${p.level}\`} color={LEVEL_COLORS[p.level] || 'default'}>
+              {p.model === '*' ? (t('user.wildcard') || 'All') : p.model}: {p.level}
+            </Tag>
+          ))}
+        </Space>
+      ),
+    },
+    {
+      title: t('user.users') || 'Users',
+      key: 'userCount',
+      width: 80,
+      render: (_: unknown, record: { role: string }) => users.filter(u => u.role === record.role).length,
+    },
+    {
+      title: t('user.action') || 'Action',
+      key: 'action',
+      width: 100,
+      render: (_: unknown, record: { role: string; permissions: Array<{ model: string; level: string }> }) => (
+        <Space size={0}>
+          <Button type="text" size="small" icon={<EditOutlined />} onClick={() => openEditModal(record as { role: string; permissions: Array<{ model: string; level: string }> })} />
+          <Popconfirm
+            title={t('user.deleteRoleConfirm')?.replace('{name}', record.role) || \`Delete role "\${record.role}"?\`}
+            onConfirm={() => handleDelete(record.role)}
+          >
+            <Button type="text" size="small" danger icon={<DeleteOutlined />} />
+          </Popconfirm>
+        </Space>
+      ),
+    },
+  ];
+
+  const permColumns = [
+    {
+      title: t('user.model') || 'Model',
+      dataIndex: 'model',
+      key: 'model',
+      width: 200,
+      render: (model: string) => model === '*' ? <Tag>{t('user.wildcard') || 'All Models'}</Tag> : model,
+    },
+    {
+      title: t('user.level') || 'Level',
+      dataIndex: 'level',
+      key: 'level',
+      width: 150,
+      render: (level: string, record: { model: string }) => (
+        <Select value={level} onChange={v => updatePermLevel(record.model, v)} options={LEVEL_OPTIONS} style={{ width: 120 }} />
+      ),
+    },
+  ];
+
+  return (
+    <>
+      <Card>
+        <Table dataSource={rolesData?.roles || []} columns={roleColumns} rowKey="role" loading={loading} pagination={false} size="small" />
+      </Card>
+
+      <Modal
+        title={t('user.addRole') || 'Add Role'}
+        open={addRoleModalOpen}
+        onOk={() => roleForm.submit()}
+        onCancel={() => { onAddRoleModalClose(); roleForm.resetFields(); }}
+        okText={t('common.save') || 'Save'}
+        cancelText={t('common.cancel') || 'Cancel'}
+        destroyOnHidden
+        width={560}
+      >
+        <Form form={roleForm} onFinish={handleAddRole} layout="vertical" style={{ marginTop: token.marginMD }}>
+          <Form.Item name="role" label={t('user.roleName') || 'Role Name'} rules={[{ required: true, message: t('user.roleNameInvalid') || 'Invalid role name' }]}>
+            <Input placeholder={t('user.namePlaceholder') || 'e.g. editor'} />
+          </Form.Item>
+          <Form.Item label={t('user.permissionLevel') || 'Permission Level'}>
+            <Table dataSource={permRows} columns={permColumns} rowKey="model" pagination={false} size="small" />
+          </Form.Item>
+        </Form>
+      </Modal>
+
+      <Modal
+        title={t('user.editRole') || 'Edit Role'}
+        open={editModalOpen}
+        onOk={handleEditRole}
+        onCancel={() => { setEditModalOpen(false); setEditingRole(null); }}
+        okText={t('common.save') || 'Save'}
+        cancelText={t('common.cancel') || 'Cancel'}
+        destroyOnHidden
+        width={560}
+      >
+        <Form form={roleForm} layout="vertical" style={{ marginTop: token.marginMD }}>
+          <Form.Item name="role" label={t('user.roleName') || 'Role Name'} rules={[{ required: true }]}>
+            <Input />
+          </Form.Item>
+          <Form.Item label={t('user.permissionLevel') || 'Permission Level'}>
+            <Table dataSource={permRows} columns={permColumns} rowKey="model" pagination={false} size="small" />
+          </Form.Item>
+        </Form>
+      </Modal>
+    </>
+  );
+}
+
+export default UserManagementPage;
+`;
+}
+//# sourceMappingURL=user-management-page.js.map

package/dist/cli/templates/user-management-page.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"user-management-page.js","sourceRoot":"","sources":["../../../src/cli/templates/user-management-page.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,MAAM,UAAU,0BAA0B;IACxC,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAueR,CAAC;AACF,CAAC"}

package/dist/cli/templates/vite-config.d.ts

@@ -0,0 +1,9 @@
+/**
+ * vite.config.ts template
+ */
+export interface ViteConfigOptions {
+    frontendPort?: number;
+    backendPort?: number;
+}
+export declare function createViteConfig(options?: ViteConfigOptions): string;
+//# sourceMappingURL=vite-config.d.ts.map

package/dist/cli/templates/vite-config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"vite-config.d.ts","sourceRoot":"","sources":["../../../src/cli/templates/vite-config.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,MAAM,WAAW,iBAAiB;IAChC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,wBAAgB,gBAAgB,CAAC,OAAO,CAAC,EAAE,iBAAiB,GAAG,MAAM,CAsBpE"}

package/dist/cli/templates/vite-config.js

@@ -0,0 +1,26 @@
+/**
+ * vite.config.ts template
+ */
+export function createViteConfig(options) {
+    const frontendPort = options?.frontendPort ?? 5173;
+    const backendPort = options?.backendPort ?? 3000;
+    return `import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+
+export default defineConfig({
+  plugins: [react()],
+  root: 'frontend',
+  build: {
+    outDir: '../dist/frontend',
+    emptyOutDir: true,
+  },
+  server: {
+    port: ${frontendPort},
+    proxy: {
+      '/api': 'http://localhost:${backendPort}',
+    },
+  },
+});
+`;
+}
+//# sourceMappingURL=vite-config.js.map

package/dist/cli/templates/vite-config.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vite-config.js","sourceRoot":"","sources":["../../../src/cli/templates/vite-config.ts"],"names":[],"mappings":"AAAA;;GAEG;AAOH,MAAM,UAAU,gBAAgB,CAAC,OAA2B;IAC1D,MAAM,YAAY,GAAG,OAAO,EAAE,YAAY,IAAI,IAAI,CAAC;IACnD,MAAM,WAAW,GAAG,OAAO,EAAE,WAAW,IAAI,IAAI,CAAC;IAEjD,OAAO;;;;;;;;;;;YAWG,YAAY;;kCAEU,WAAW;;;;CAI5C,CAAC;AACF,CAAC"}

package/dist/cli/utils.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Shared CLI utilities
+ */
+/**
+ * Resolve the project root directory.
+ * Walks up from CWD looking for loom.config.ts or loom.config.js.
+ * Falls back to CWD if no config found.
+ */
+export declare function resolveProjectRoot(): Promise<string>;
+//# sourceMappingURL=utils.d.ts.map

package/dist/cli/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/cli/utils.ts"],"names":[],"mappings":"AAAA;;GAEG;AAKH;;;;GAIG;AACH,wBAAsB,kBAAkB,IAAI,OAAO,CAAC,MAAM,CAAC,CAoB1D"}

package/dist/cli/utils.js

@@ -0,0 +1,31 @@
+/**
+ * Shared CLI utilities
+ */
+import { promises as fs } from 'fs';
+import path from 'path';
+/**
+ * Resolve the project root directory.
+ * Walks up from CWD looking for loom.config.ts or loom.config.js.
+ * Falls back to CWD if no config found.
+ */
+export async function resolveProjectRoot() {
+    let current = process.cwd();
+    for (let i = 0; i < 20; i++) {
+        for (const candidate of ['loom.config.ts', 'loom.config.js']) {
+            try {
+                await fs.access(path.join(current, candidate));
+                return current;
+            }
+            catch {
+                continue;
+            }
+        }
+        const parent = path.dirname(current);
+        if (parent === current)
+            break; // reached root
+        current = parent;
+    }
+    // Fallback to CWD
+    return process.cwd();
+}
+//# sourceMappingURL=utils.js.map