django-agent-studio 0.3.3__py3-none-any.whl → 0.3.4__py3-none-any.whl

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (22) hide show
  1. django_agent_studio/agents/dynamic.py +164 -4
  2. django_agent_studio/api/serializers.py +27 -8
  3. django_agent_studio/branding.py +103 -0
  4. django_agent_studio/static/agent-frontend/chat-widget.css +52 -0
  5. django_agent_studio/static/agent-frontend/chat-widget.js +222 -206
  6. django_agent_studio/static/django_agent_studio/js/builder.js +58 -58
  7. django_agent_studio/static/django_agent_studio/js/builder.js.map +1 -1
  8. django_agent_studio/static/django_agent_studio/js/style.css +1 -1
  9. django_agent_studio/templates/django_agent_studio/agent_list.html +31 -28
  10. django_agent_studio/templates/django_agent_studio/base.html +116 -28
  11. django_agent_studio/templates/django_agent_studio/builder.html +1 -1
  12. django_agent_studio/templates/django_agent_studio/collaborators.html +83 -95
  13. django_agent_studio/templates/django_agent_studio/home.html +66 -48
  14. django_agent_studio/templates/django_agent_studio/system_create.html +22 -24
  15. django_agent_studio/templates/django_agent_studio/system_list.html +38 -30
  16. django_agent_studio/templates/django_agent_studio/system_test.html +27 -21
  17. django_agent_studio/templates/django_agent_studio/test.html +22 -17
  18. {django_agent_studio-0.3.3.dist-info → django_agent_studio-0.3.4.dist-info}/METADATA +1 -1
  19. {django_agent_studio-0.3.3.dist-info → django_agent_studio-0.3.4.dist-info}/RECORD +22 -21
  20. {django_agent_studio-0.3.3.dist-info → django_agent_studio-0.3.4.dist-info}/WHEEL +0 -0
  21. {django_agent_studio-0.3.3.dist-info → django_agent_studio-0.3.4.dist-info}/licenses/LICENSE +0 -0
  22. {django_agent_studio-0.3.3.dist-info → django_agent_studio-0.3.4.dist-info}/top_level.txt +0 -0
@@ -1,22 +1,22 @@
1
1
  {% extends "django_agent_studio/base.html" %}
2
2
 
3
- {% block title %}My Agents - Agent Studio{% endblock %}
3
+ {% block title %}My Agents - {{ studio_app_name }}{% endblock %}
4
4
 
5
5
  {% block breadcrumbs %}
6
6
  <nav class="flex items-center space-x-2 ml-4 text-sm">
7
- <span class="text-gray-400">/</span>
8
- <span class="text-gray-600">My Agents</span>
7
+ <span class="text-white/40">/</span>
8
+ <span class="text-white/70">My Agents</span>
9
9
  </nav>
10
10
  {% endblock %}
11
11
 
12
12
  {% block content %}
13
- <div class="h-full p-6 overflow-auto">
13
+ <div class="h-full p-6 overflow-auto bg-gradient-to-br from-slate-50 to-slate-100">
14
14
  <div class="max-w-6xl mx-auto">
15
15
  <!-- Header -->
16
16
  <div class="flex items-center justify-between mb-6">
17
- <h1 class="text-2xl font-bold text-gray-900">My Agents</h1>
17
+ <h1 class="text-2xl font-bold text-navy">My Agents</h1>
18
18
  <a href="{% url 'agent_studio:agent_create' %}"
19
- class="bg-primary-600 hover:bg-primary-700 text-white px-4 py-2 rounded-lg flex items-center space-x-2 transition-colors">
19
+ class="bg-cyan hover:bg-cyan-dark text-navy px-4 py-2 rounded-xl flex items-center space-x-2 transition-all hover:shadow-lg hover:-translate-y-0.5 font-medium">
20
20
  <i class="pi pi-plus"></i>
21
21
  <span>New Agent</span>
22
22
  </a>
@@ -26,51 +26,53 @@
26
26
  <!-- Agent Grid -->
27
27
  <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
28
28
  {% for agent in agents %}
29
- <div class="bg-white border border-gray-200 rounded-lg overflow-hidden hover:border-primary-300 hover:shadow-md transition-all">
30
- <div class="p-4">
29
+ <div class="bg-white border border-slate-200 rounded-xl overflow-hidden hover:border-cyan hover:shadow-md transition-all group">
30
+ <div class="p-5">
31
31
  <div class="flex items-center justify-between mb-3">
32
32
  <div class="flex items-center space-x-3">
33
- <span class="text-2xl">{{ agent.icon|default:"🤖" }}</span>
33
+ <div class="w-10 h-10 bg-cyan/10 rounded-lg flex items-center justify-center group-hover:bg-cyan/20 transition-colors">
34
+ <span class="text-xl">{{ agent.icon|default:"🤖" }}</span>
35
+ </div>
34
36
  <div>
35
- <h3 class="font-semibold text-gray-800">{{ agent.name }}</h3>
36
- <span class="text-xs text-gray-400">{{ agent.slug }}</span>
37
+ <h3 class="font-semibold text-navy">{{ agent.name }}</h3>
38
+ <span class="text-xs text-slate-400 font-mono">{{ agent.slug }}</span>
37
39
  </div>
38
40
  </div>
39
41
  <div class="flex items-center space-x-1">
40
42
  {% if agent.is_active %}
41
- <span class="w-2 h-2 bg-green-500 rounded-full" title="Active"></span>
43
+ <span class="w-2 h-2 bg-cyan rounded-full" title="Active"></span>
42
44
  {% else %}
43
- <span class="w-2 h-2 bg-gray-300 rounded-full" title="Inactive"></span>
45
+ <span class="w-2 h-2 bg-slate-300 rounded-full" title="Inactive"></span>
44
46
  {% endif %}
45
47
  </div>
46
48
  </div>
47
- <p class="text-sm text-gray-500 line-clamp-2 mb-4">{{ agent.description|default:"No description" }}</p>
48
- <div class="flex items-center justify-between text-xs text-gray-400">
49
+ <p class="text-sm text-slate-500 line-clamp-2 mb-4">{{ agent.description|default:"No description" }}</p>
50
+ <div class="flex items-center justify-between text-xs text-slate-400">
49
51
  <span>Updated {{ agent.updated_at|timesince }} ago</span>
50
52
  <div class="flex items-center space-x-2">
51
53
  {% if agent.is_public %}
52
- <span class="bg-blue-100 text-blue-700 px-2 py-0.5 rounded">Public</span>
54
+ <span class="bg-cyan/10 text-navy px-2 py-0.5 rounded-full font-medium">Public</span>
53
55
  {% endif %}
54
56
  {% if agent.is_template %}
55
- <span class="bg-purple-100 text-purple-700 px-2 py-0.5 rounded">Template</span>
57
+ <span class="bg-navy/10 text-navy px-2 py-0.5 rounded-full font-medium">Template</span>
56
58
  {% endif %}
57
59
  </div>
58
60
  </div>
59
61
  </div>
60
- <div class="border-t border-gray-100 px-4 py-3 bg-gray-50 flex items-center justify-between">
61
- <div class="flex items-center space-x-3">
62
+ <div class="border-t border-slate-100 px-5 py-3 bg-slate-50/50 flex items-center justify-between">
63
+ <div class="flex items-center space-x-4">
62
64
  <a href="{% url 'agent_studio:agent_edit' agent.id %}"
63
- class="text-primary-600 hover:text-primary-700 text-sm font-medium">
65
+ class="text-navy hover:text-cyan text-sm font-medium transition-colors">
64
66
  Edit
65
67
  </a>
66
68
  <a href="{% url 'agent_studio:agent_collaborators' agent.id %}"
67
- class="text-gray-500 hover:text-gray-700 text-sm"
69
+ class="text-slate-400 hover:text-navy text-sm transition-colors"
68
70
  title="Manage collaborators">
69
71
  <i class="pi pi-users"></i>
70
72
  </a>
71
73
  </div>
72
74
  <a href="{% url 'agent_studio:agent_test' agent.id %}"
73
- class="text-gray-600 hover:text-gray-700 text-sm">
75
+ class="text-cyan hover:text-cyan-dark text-sm font-medium transition-colors">
74
76
  Test →
75
77
  </a>
76
78
  </div>
@@ -79,12 +81,14 @@
79
81
  </div>
80
82
  {% else %}
81
83
  <!-- Empty State -->
82
- <div class="text-center py-12">
83
- <div class="text-6xl mb-4">🤖</div>
84
- <h3 class="text-xl font-semibold text-gray-800 mb-2">No agents yet</h3>
85
- <p class="text-gray-500 mb-6">Create your first AI agent to get started</p>
84
+ <div class="text-center py-16 bg-white rounded-xl border border-slate-200 border-dashed">
85
+ <div class="w-16 h-16 bg-cyan/10 rounded-2xl flex items-center justify-center mx-auto mb-4">
86
+ <span class="text-4xl">🤖</span>
87
+ </div>
88
+ <h3 class="text-xl font-semibold text-navy mb-2">No agents yet</h3>
89
+ <p class="text-slate-500 mb-6">Create your first AI agent to get started</p>
86
90
  <a href="{% url 'agent_studio:agent_create' %}"
87
- class="bg-primary-600 hover:bg-primary-700 text-white px-6 py-3 rounded-lg inline-flex items-center space-x-2 transition-colors">
91
+ class="bg-cyan hover:bg-cyan-dark text-navy px-6 py-3 rounded-xl inline-flex items-center space-x-2 transition-all hover:shadow-lg font-medium">
88
92
  <i class="pi pi-plus"></i>
89
93
  <span>Create Your First Agent</span>
90
94
  </a>
@@ -105,4 +109,3 @@ createApp({
105
109
  }).use(primevue.config.default).mount('#app');
106
110
  </script>
107
111
  {% endblock %}
108
-
@@ -4,7 +4,8 @@
4
4
  <head>
5
5
  <meta charset="UTF-8">
6
6
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
- <title>{% block title %}Agent Studio{% endblock %}</title>
7
+ <meta name="csrf-token" content="{{ csrf_token }}">
8
+ <title>{% block title %}{{ studio_app_name }}{% endblock %}</title>
8
9
 
9
10
  <!-- Tailwind CSS -->
10
11
  <script src="https://cdn.tailwindcss.com"></script>
@@ -14,14 +15,45 @@
14
15
  theme: {
15
16
  extend: {
16
17
  colors: {
17
- primary: {"50":"#eff6ff","100":"#dbeafe","200":"#bfdbfe","300":"#93c5fd","400":"#60a5fa","500":"#3b82f6","600":"#2563eb","700":"#1d4ed8","800":"#1e40af","900":"#1e3a8a","950":"#172554"}
18
+ // Brand Colors (from Django settings)
19
+ primary: {
20
+ "50": "#e6f7fc",
21
+ "100": "#cceff9",
22
+ "200": "#99dff3",
23
+ "300": "#66cfed",
24
+ "400": "{{ studio_colors.accent }}",
25
+ "500": "#33b5e7",
26
+ "600": "#2691b9",
27
+ "700": "#1a6d8b",
28
+ "800": "#0d495c",
29
+ "900": "{{ studio_colors.primary }}",
30
+ "950": "{{ studio_colors.primary_dark }}"
31
+ },
32
+ navy: {
33
+ "DEFAULT": "{{ studio_colors.primary }}",
34
+ "light": "{{ studio_colors.primary_light }}",
35
+ "dark": "{{ studio_colors.primary_dark }}"
36
+ },
37
+ cyan: {
38
+ "DEFAULT": "{{ studio_colors.accent }}",
39
+ "light": "{{ studio_colors.accent_light }}",
40
+ "dark": "{{ studio_colors.accent_dark }}"
41
+ },
42
+ slate: {
43
+ "DEFAULT": "{{ studio_colors.secondary }}",
44
+ "light": "{{ studio_colors.secondary_light }}",
45
+ "dark": "{{ studio_colors.secondary_dark }}"
46
+ }
47
+ },
48
+ fontFamily: {
49
+ sans: ['system-ui', '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'sans-serif'],
18
50
  }
19
51
  }
20
52
  }
21
53
  }
22
54
  </script>
23
55
 
24
- <!-- PrimeVue -->
56
+ <!-- PrimeVue with custom theme overrides -->
25
57
  <link rel="stylesheet" href="https://unpkg.com/primevue@3/resources/themes/lara-light-blue/theme.css">
26
58
  <link rel="stylesheet" href="https://unpkg.com/primevue@3/resources/primevue.min.css">
27
59
  <link rel="stylesheet" href="https://unpkg.com/primeicons/primeicons.css">
@@ -42,44 +74,82 @@
42
74
  <script src="https://unpkg.com/primevue@3/tabview/tabview.min.js"></script>
43
75
  <script src="https://unpkg.com/primevue@3/tabpanel/tabpanel.min.js"></script>
44
76
 
45
- <!-- Agent Frontend (for chat widgets)
46
- Local development: Files are in django_agent_studio/static/agent-frontend/
47
- To update after changes to agent-frontend/dist/:
48
- cp agent-frontend/dist/chat-widget.* django_agent_studio/static/agent-frontend/
49
- For production, switch to unpkg CDN:
50
- https://unpkg.com/@makemore/agent-frontend/dist/chat-widget.css
51
- https://unpkg.com/@makemore/agent-frontend/dist/chat-widget.js
52
- -->
77
+ <!-- Agent Frontend -->
53
78
  <link rel="stylesheet" href="{% static 'agent-frontend/chat-widget.css' %}">
54
79
  <script src="{% static 'agent-frontend/chat-widget.js' %}"></script>
55
80
 
56
- <!-- Enhanced Markdown Support for Chat Widget -->
57
- <!-- Syntax highlighting theme -->
81
+ <!-- Enhanced Markdown Support -->
58
82
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.9.0/build/styles/github-dark.min.css">
59
- <!-- Marked.js for markdown parsing -->
60
83
  <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
61
- <!-- Highlight.js - use the pre-bundled version with common languages included -->
62
84
  <script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.9.0/build/highlight.min.js"></script>
63
- <!-- Chat widget markdown addon (must be after chat-widget.js and marked.js) -->
64
85
  <script src="{% static 'agent-frontend/chat-widget-markdown.js' %}"></script>
65
86
 
66
87
  <style>
67
88
  [v-cloak] { display: none; }
68
89
 
90
+ /* ===== Brand Color Variables (from Django settings) ===== */
91
+ :root {
92
+ --studio-primary: {{ studio_colors.primary }};
93
+ --studio-primary-light: {{ studio_colors.primary_light }};
94
+ --studio-primary-dark: {{ studio_colors.primary_dark }};
95
+ --studio-accent: {{ studio_colors.accent }};
96
+ --studio-accent-light: {{ studio_colors.accent_light }};
97
+ --studio-accent-dark: {{ studio_colors.accent_dark }};
98
+ --studio-secondary: {{ studio_colors.secondary }};
99
+ --studio-secondary-light: {{ studio_colors.secondary_light }};
100
+ --studio-secondary-dark: {{ studio_colors.secondary_dark }};
101
+ }
102
+
103
+ /* Override PrimeVue primary color */
104
+ .p-button {
105
+ background: var(--studio-primary) !important;
106
+ border-color: var(--studio-primary) !important;
107
+ }
108
+ .p-button:hover {
109
+ background: var(--studio-secondary) !important;
110
+ border-color: var(--studio-secondary) !important;
111
+ }
112
+ .p-button:focus {
113
+ box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--studio-accent) !important;
114
+ }
115
+ .p-button.p-button-success {
116
+ background: var(--studio-accent) !important;
117
+ border-color: var(--studio-accent) !important;
118
+ color: var(--studio-primary) !important;
119
+ }
120
+ .p-button.p-button-success:hover {
121
+ background: var(--studio-accent-dark) !important;
122
+ border-color: var(--studio-accent-dark) !important;
123
+ }
124
+ .p-button.p-button-text {
125
+ background: transparent !important;
126
+ color: var(--studio-primary) !important;
127
+ }
128
+ .p-button.p-button-text:hover {
129
+ background: rgba(0, 20, 46, 0.08) !important;
130
+ }
131
+
132
+ /* Focus rings */
133
+ .p-dropdown:focus,
134
+ .p-inputtext:focus {
135
+ border-color: var(--studio-accent) !important;
136
+ box-shadow: 0 0 0 1px var(--studio-accent) !important;
137
+ }
138
+
69
139
  /* Custom scrollbar */
70
140
  .custom-scrollbar::-webkit-scrollbar {
71
141
  width: 6px;
72
142
  }
73
143
  .custom-scrollbar::-webkit-scrollbar-track {
74
- background: #f1f1f1;
144
+ background: #f1f5f9;
75
145
  border-radius: 3px;
76
146
  }
77
147
  .custom-scrollbar::-webkit-scrollbar-thumb {
78
- background: #c1c1c1;
148
+ background: #cbd5e1;
79
149
  border-radius: 3px;
80
150
  }
81
151
  .custom-scrollbar::-webkit-scrollbar-thumb:hover {
82
- background: #a1a1a1;
152
+ background: #94a3b8;
83
153
  }
84
154
 
85
155
  /* Override agent-frontend styles for embedded mode */
@@ -109,27 +179,46 @@
109
179
  min-height: 0 !important;
110
180
  overflow-y: auto !important;
111
181
  }
182
+
183
+ /* Logo styling */
184
+ .studio-logo {
185
+ display: flex;
186
+ align-items: center;
187
+ gap: 0.75rem;
188
+ }
189
+ .studio-logo svg {
190
+ height: 28px;
191
+ width: auto;
192
+ }
193
+
194
+ /* Custom CSS from settings */
195
+ {{ studio_custom_css|safe }}
112
196
  </style>
113
197
 
114
198
  {% block extra_head %}{% endblock %}
115
199
  </head>
116
- <body class="h-full bg-gray-50">
200
+ <body class="h-full bg-slate-50">
117
201
  <div id="app" v-cloak class="h-full flex flex-col">
118
202
  <!-- Header -->
119
- <header class="bg-white border-b border-gray-200 px-4 py-3 flex items-center justify-between">
120
- <div class="flex items-center space-x-4">
121
- <a href="{% url 'agent_studio:home' %}" class="flex items-center space-x-2">
122
- <span class="text-2xl">🤖</span>
123
- <span class="text-xl font-semibold text-gray-800">Agent Studio</span>
203
+ <header class="bg-navy text-white px-4 py-3 flex items-center justify-between shadow-lg">
204
+ <div class="flex items-center space-x-6">
205
+ <a href="{% url 'agent_studio:home' %}" class="studio-logo">
206
+ <!-- Logo from settings -->
207
+ {{ studio_logo_svg|safe }}
208
+ {% if studio_show_app_name %}
209
+ <div class="flex items-center">
210
+ <span class="text-lg font-semibold text-white/90">{{ studio_app_name }}</span>
211
+ </div>
212
+ {% endif %}
124
213
  </a>
125
214
  {% block breadcrumbs %}{% endblock %}
126
215
  </div>
127
216
  <div class="flex items-center space-x-4">
128
217
  {% if request.user.is_authenticated %}
129
- <span class="text-sm text-gray-600">{{ request.user.email|default:request.user }}</span>
218
+ <span class="text-sm text-white/70">{{ request.user.email|default:request.user }}</span>
130
219
  <form method="post" action="{% url 'agent_studio:logout' %}" class="inline">
131
220
  {% csrf_token %}
132
- <button type="submit" class="text-sm text-gray-500 hover:text-gray-700">Logout</button>
221
+ <button type="submit" class="text-sm text-white/60 hover:text-white transition-colors">Logout</button>
133
222
  </form>
134
223
  {% endif %}
135
224
  </div>
@@ -147,4 +236,3 @@
147
236
  {% block extra_js %}{% endblock %}
148
237
  </body>
149
238
  </html>
150
-
@@ -4,7 +4,7 @@
4
4
  <head>
5
5
  <meta charset="UTF-8">
6
6
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
- <title>{% if is_new %}Create Agent{% else %}Edit {{ agent.name }}{% endif %} - Agent Studio</title>
7
+ <title>{% if is_new %}Create Agent{% else %}Edit {{ agent.name }}{% endif %} - {{ studio_app_name }}</title>
8
8
 
9
9
  <!-- Built Vue app styles (PrimeVue + custom) -->
10
10
  <link rel="stylesheet" href="{% static 'django_agent_studio/js/style.css' %}">