npm - aizek-chatbot - Versions diffs - 1.0.13 → 1.0.14 - Mend

aizek-chatbot 1.0.13 → 1.0.14

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 (7) hide show

package/dist/index.css CHANGED Viewed

@@ -58,7 +58,10 @@
 }
 .markdown-content {
   line-height: 1.6;
-  margin-bottom: 6px;
+  word-break: break-word;
+}
+.markdown-content + .generative-ui-container {
+  margin-top: 16px;
 }
 .markdown-content p {
   margin: 0 0 12px 0;
@@ -67,101 +70,123 @@
 .markdown-content p:last-child {
   margin-bottom: 0;
 }
+.markdown-content p:first-child {
+  margin-top: 0;
+}
+.markdown-content a {
+  color: #667eea;
+  text-decoration: none;
+  transition: all 0.15s ease;
+  font-weight: 500;
+  border-bottom: 1px solid transparent;
+}
+.markdown-content a:hover {
+  color: #764ba2;
+  border-bottom-color: #764ba2;
+}
+.markdown-content ul,
+.markdown-content ol {
+  margin: 12px 0;
+  padding-left: 20px;
+}
 .markdown-content ul {
-  margin: 12px 0 16px 0;
-  padding-left: 0;
   list-style: none;
+  padding-left: 0;
+}
+.markdown-content ol {
+  list-style: decimal;
 }
 .markdown-content li {
-  margin-bottom: 12px;
+  margin-bottom: 8px;
   line-height: 1.6;
-  padding: 12px 16px;
-  border-radius: 12px;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
   position: relative;
-  transition: all 0.2s ease;
-  overflow: hidden;
+  padding-left: 20px;
 }
-.markdown-content li:hover {
-  transform: translateY(-1px);
-  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+.markdown-content li:last-child {
+  margin-bottom: 0;
 }
 .markdown-content li::before {
   content: "\2022";
-  font-weight: bold;
-  font-size: 18px;
   position: absolute;
-  left: -8px;
-  top: 12px;
-}
-.markdown-content li::after {
-  content: "";
-  position: absolute;
-  top: 0;
   left: 0;
-  width: 4px;
-  height: 100%;
-  border-radius: 0 2px 2px 0;
-  transition: all 0.2s ease;
-}
-.markdown-content li:hover::after {
-  width: 6px;
-}
-.markdown-content li strong {
-  display: block;
-  font-size: 15px;
-  margin-bottom: 4px;
+  color: #667eea;
+  font-weight: bold;
+  font-size: 16px;
 }
-.markdown-content li em {
-  display: block;
-  font-size: 13px;
-  opacity: 0.8;
+.markdown-content li ul,
+.markdown-content li ol {
   margin-top: 4px;
+  margin-bottom: 4px;
 }
-.markdown-content strong {
-  font-weight: 600;
+.markdown-content ol li {
+  padding-left: 0;
 }
-.markdown-content em {
-  font-style: italic;
-  opacity: 0.9;
+.markdown-content ol li::before {
+  content: none;
 }
 .markdown-content code {
-  background: #f1f5f9;
+  background: rgba(102, 126, 234, 0.1);
+  color: #764ba2;
   padding: 2px 6px;
   border-radius: 4px;
   font-family:
     "Monaco",
     "Menlo",
     "Ubuntu Mono",
+    "Courier New",
     monospace;
-  font-size: 13px;
+  font-size: 0.9em;
+  border: 1px solid rgba(102, 126, 234, 0.2);
 }
 .markdown-content pre {
   background: #f8fafc;
-  padding: 12px;
+  padding: 12px 16px;
   border-radius: 8px;
   overflow-x: auto;
-  margin: 8px 0;
+  margin: 12px 0;
   border: 1px solid #e2e8f0;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
 }
 .markdown-content pre code {
   background: none;
   padding: 0;
+  border: none;
+  color: #1e293b;
+  font-size: 12px;
+  line-height: 1.5;
 }
-.markdown-content blockquote {
-  border-left: 3px solid #cbd5e1;
-  padding-left: 12px;
-  margin: 8px 0;
-  opacity: 0.8;
+.markdown-content strong,
+.markdown-content b {
+  font-weight: 600;
+  color: inherit;
+}
+.markdown-content em,
+.markdown-content i {
+  font-style: italic;
 }
 .markdown-content h1,
 .markdown-content h2,
-.markdown-content h3 {
+.markdown-content h3,
+.markdown-content h4,
+.markdown-content h5,
+.markdown-content h6 {
   margin: 16px 0 8px 0;
   font-weight: 600;
+  line-height: 1.4;
+  color: inherit;
+}
+.markdown-content h1:first-child,
+.markdown-content h2:first-child,
+.markdown-content h3:first-child,
+.markdown-content h4:first-child,
+.markdown-content h5:first-child,
+.markdown-content h6:first-child {
+  margin-top: 0;
 }
 .markdown-content h1 {
   font-size: 18px;
+  border-bottom: 2px solid #e2e8f0;
+  padding-bottom: 8px;
 }
 .markdown-content h2 {
   font-size: 16px;
@@ -169,104 +194,171 @@
 .markdown-content h3 {
   font-size: 15px;
 }
+.markdown-content h4,
+.markdown-content h5,
+.markdown-content h6 {
+  font-size: 14px;
+}
+.markdown-content blockquote {
+  border-left: 3px solid #667eea;
+  padding-left: 12px;
+  margin: 12px 0;
+  color: inherit;
+  opacity: 0.9;
+  font-style: italic;
+  background: rgba(102, 126, 234, 0.05);
+  padding: 8px 12px;
+  border-radius: 0 4px 4px 0;
+}
+.markdown-content blockquote p {
+  margin: 0;
+}
+.markdown-content hr {
+  border: none;
+  border-top: 1px solid #e2e8f0;
+  margin: 16px 0;
+}
 .markdown-content table {
   border-collapse: collapse;
   width: 100%;
-  margin: 8px 0;
+  margin: 12px 0;
+  font-size: 12px;
+  border-radius: 8px;
+  overflow: hidden;
+  border: 1px solid #e2e8f0;
 }
 .markdown-content th,
 .markdown-content td {
-  border: 1px solid #e2e8f0;
-  padding: 8px 12px;
+  padding: 10px 12px;
   text-align: left;
+  border-bottom: 1px solid #e2e8f0;
 }
 .markdown-content th {
-  background: #f8fafc;
+  background: #f1f5f9;
   font-weight: 600;
+  color: #1e293b;
+  border-bottom: 2px solid #cbd5e1;
 }
-.message-bubble.user .markdown-content li {
-  background: rgba(255, 255, 255, 0.1);
-  border: 1px solid rgba(255, 255, 255, 0.2);
+.markdown-content tr:last-child td {
+  border-bottom: none;
 }
-.message-bubble.user .markdown-content li::before {
-  color: #ffffff;
+.markdown-content tbody tr {
+  transition: background-color 0.15s ease;
 }
-.message-bubble.user .markdown-content li::after {
-  background:
-    linear-gradient(
-      135deg,
-      #ffffff,
-      rgba(255, 255, 255, 0.5));
+.markdown-content tbody tr:hover {
+  background-color: rgba(102, 126, 234, 0.05);
 }
-.message-bubble.user .markdown-content li:hover::after {
-  background:
-    linear-gradient(
-      135deg,
-      #ffffff,
-      #ffffff);
+.markdown-content img {
+  max-width: 100%;
+  height: auto;
+  border-radius: 8px;
+  margin: 8px 0;
+}
+.markdown-content input[type=checkbox] {
+  margin-right: 6px;
+}
+.message-bubble.user .markdown-content {
+  color: #ffffff;
 }
-.message-bubble.user .markdown-content li strong {
+.message-bubble.user .markdown-content a {
   color: #ffffff;
+  border-bottom-color: rgba(255, 255, 255, 0.4);
+  font-weight: 600;
+}
+.message-bubble.user .markdown-content a:hover {
+  border-bottom-color: #ffffff;
 }
-.message-bubble.user .markdown-content strong {
+.message-bubble.user .markdown-content li::before {
   color: #ffffff;
 }
 .message-bubble.user .markdown-content code {
   background: rgba(255, 255, 255, 0.2);
+  color: #ffffff;
+  border-color: rgba(255, 255, 255, 0.3);
 }
 .message-bubble.user .markdown-content pre {
   background: rgba(255, 255, 255, 0.1);
-  border: 1px solid rgba(255, 255, 255, 0.2);
+  border-color: rgba(255, 255, 255, 0.2);
+}
+.message-bubble.user .markdown-content pre code {
+  color: #ffffff;
+}
+.message-bubble.user .markdown-content h1 {
+  border-bottom-color: rgba(255, 255, 255, 0.3);
 }
 .message-bubble.user .markdown-content blockquote {
-  border-left-color: rgba(255, 255, 255, 0.5);
+  border-left-color: #ffffff;
+  background: rgba(255, 255, 255, 0.1);
+  color: #ffffff;
 }
-.message-bubble.user .markdown-content table th,
-.message-bubble.user .markdown-content table td {
+.message-bubble.user .markdown-content hr {
+  border-top-color: rgba(255, 255, 255, 0.3);
+}
+.message-bubble.user .markdown-content table {
   border-color: rgba(255, 255, 255, 0.3);
 }
-.message-bubble.user .markdown-content table th {
-  background: rgba(255, 255, 255, 0.1);
+.message-bubble.user .markdown-content th,
+.message-bubble.user .markdown-content td {
+  border-bottom-color: rgba(255, 255, 255, 0.2);
 }
-.message-bubble.assistant .markdown-content li {
-  background: #ffffff;
-  border: 1px solid #e2e8f0;
+.message-bubble.user .markdown-content th {
+  background: rgba(255, 255, 255, 0.15);
+  color: #ffffff;
+  border-bottom-color: rgba(255, 255, 255, 0.3);
+}
+.message-bubble.user .markdown-content tbody tr:hover {
+  background-color: rgba(255, 255, 255, 0.1);
+}
+.message-bubble.assistant .markdown-content {
+  color: #334155;
+}
+.message-bubble.assistant .markdown-content a {
+  color: #667eea;
+}
+.message-bubble.assistant .markdown-content a:hover {
+  color: #764ba2;
 }
 .message-bubble.assistant .markdown-content li::before {
   color: #667eea;
 }
-.message-bubble.assistant .markdown-content li::after {
-  background:
-    linear-gradient(
-      135deg,
-      #667eea,
-      #764ba2);
+.message-bubble.assistant .markdown-content code {
+  background: rgba(102, 126, 234, 0.1);
+  color: #764ba2;
+  border-color: rgba(102, 126, 234, 0.2);
 }
-.message-bubble.assistant .markdown-content li:hover::after {
-  background:
-    linear-gradient(
-      135deg,
-      #667eea,
-      #764ba2);
+.message-bubble.assistant .markdown-content pre {
+  background: #ffffff;
+  border-color: #e2e8f0;
 }
-.message-bubble.assistant .markdown-content li strong {
+.message-bubble.assistant .markdown-content pre code {
   color: #1e293b;
 }
-.message-bubble.assistant .markdown-content strong {
+.message-bubble.assistant .markdown-content h1,
+.message-bubble.assistant .markdown-content h2,
+.message-bubble.assistant .markdown-content h3,
+.message-bubble.assistant .markdown-content h4,
+.message-bubble.assistant .markdown-content h5,
+.message-bubble.assistant .markdown-content h6 {
   color: #1e293b;
 }
-.message-bubble.assistant .markdown-content li strong:first-child {
+.message-bubble.assistant .markdown-content h1 {
+  border-bottom-color: #e2e8f0;
+}
+.message-bubble.assistant .markdown-content strong,
+.message-bubble.assistant .markdown-content b {
+  color: #0f172a;
+}
+.message-bubble.assistant .markdown-content blockquote {
+  border-left-color: #667eea;
+  background: rgba(102, 126, 234, 0.05);
+  color: #334155;
+}
+.message-bubble.assistant .markdown-content th {
+  background: #f1f5f9;
   color: #1e293b;
-  font-size: 16px;
-  font-weight: 700;
-  display: block;
-  margin-bottom: 8px;
 }
-.message-bubble.assistant .markdown-content li strong:not(:first-child) {
-  color: #059669;
-  font-size: 13px;
-  font-weight: 600;
-  margin-right: 8px;
+.message-bubble.assistant .markdown-content tbody tr:hover {
+  background-color: rgba(102, 126, 234, 0.05);
 }
 .input-container {
   display: flex;
@@ -366,17 +458,17 @@
   font-size: 12px;
   opacity: 0.8;
 }
-.button-sizes.sm {
+.button-sizes.small {
   width: 50px;
   height: 50px;
   font-size: 20px;
 }
-.button-sizes.md {
+.button-sizes.medium {
   width: 60px;
   height: 60px;
   font-size: 24px;
 }
-.button-sizes.lg {
+.button-sizes.large {
   width: 70px;
   height: 70px;
   font-size: 28px;
@@ -1052,486 +1144,236 @@
   margin: 0;
   padding-left: 16px;
 }
-.rui-btn {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: 12px;
-  font-weight: 600;
-  line-height: 1;
-  transition:
-    background-color 0.2s ease,
-    color 0.2s ease,
-    border-color 0.2s ease;
-  outline: none;
-  cursor: pointer;
-  border: 1px solid transparent;
-}
-.rui-btn.sm {
-  height: 36px;
-  padding: 0 12px;
-  font-size: 14px;
+.generative-ui-container {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  width: 100%;
 }
-.rui-btn.md {
-  height: 40px;
-  padding: 0 16px;
-  font-size: 16px;
+.generative-ui-header {
+  margin-bottom: 12px;
 }
-.rui-btn.lg {
-  height: 44px;
-  padding: 0 20px;
+.generative-ui-title {
   font-size: 18px;
+  font-weight: 600;
+  color: #0f172a;
+  margin: 0 0 8px 0;
 }
-.rui-btn.primary {
-  background: #2563eb;
-  color: #ffffff;
-  border-color: transparent;
-}
-.rui-btn.primary:hover {
-  background: #1d4ed8;
-}
-.rui-btn.outline {
-  background: transparent;
-  color: #2563eb;
-  border-color: #2563eb;
-}
-.rui-btn.outline:hover {
-  border-color: #1d4ed8;
-}
-.rui-btn.ghost {
-  background: transparent;
-  color: #2563eb;
-  border-color: transparent;
+.generative-ui-description {
+  font-size: 14px;
+  color: #475569;
+  margin: 0;
+  line-height: 1.5;
 }
-.rui-btn.ghost:hover {
-  background: rgba(37, 99, 235, 0.08);
+.gen-ui-text {
+  font-size: 13px;
+  color: #1e293b;
+  line-height: 1.6;
+  margin: 0;
 }
-/* src/styles/uiRenderer.scss */
-.ui-renderer {
+.gen-ui-input-wrapper {
   display: flex;
   flex-direction: column;
-  gap: 16px;
-  width: 100%;
+  gap: 8px;
 }
-.form-component {
+.gen-ui-input-label {
+  font-size: 12px;
+  font-weight: 500;
+  color: #334155;
+  margin: 0;
+}
+.gen-ui-input,
+.gen-ui-textarea {
   width: 100%;
-  max-width: 500px;
-  border: 1px solid #e0e0e0;
-  border-radius: 12px;
-  padding: 24px;
+  padding: 10px 12px;
+  border: 1px solid #cbd5e1;
+  border-radius: 8px;
+  font-size: 13px;
+  color: #0f172a;
   background-color: #ffffff;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
-  font-family:
-    -apple-system,
-    BlinkMacSystemFont,
-    "Segoe UI",
-    Roboto,
-    "Helvetica Neue",
-    Arial,
-    sans-serif;
+  outline: none;
+  transition: border-color 0.2s ease, box-shadow 0.2s ease;
+  font-family: inherit;
 }
-.form-title {
-  font-weight: 600;
-  font-size: 16px;
-  margin-bottom: 20px;
-  color: #1a1a1a;
-  margin-top: 0;
+.gen-ui-input::placeholder,
+.gen-ui-textarea::placeholder {
+  color: #94a3b8;
 }
-.form-fields {
-  display: flex;
-  flex-direction: column;
-  gap: 20px;
+.gen-ui-input:focus,
+.gen-ui-textarea:focus {
+  border-color: #3b82f6;
+  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
 }
-.form-field {
+.gen-ui-input:disabled,
+.gen-ui-textarea:disabled {
+  background-color: #f1f5f9;
+  cursor: not-allowed;
+  opacity: 0.6;
+}
+.gen-ui-textarea {
+  min-height: 80px;
+  resize: vertical;
+}
+.gen-ui-select-wrapper {
   display: flex;
   flex-direction: column;
   gap: 8px;
 }
-.form-label {
-  font-weight: 500;
-  font-size: 13px;
-  color: #475569;
-  display: flex;
-  align-items: center;
-  gap: 4px;
-}
-.form-label span {
-  color: #ef4444;
+.gen-ui-select-label {
   font-size: 12px;
+  font-weight: 500;
+  color: #334155;
+  margin: 0;
 }
-.form-input,
-.form-select {
-  border: 1px solid #d1d5db;
-  border-radius: 8px;
+.gen-ui-select {
+  width: 100%;
   padding: 10px 12px;
+  border: 1px solid #cbd5e1;
+  border-radius: 8px;
   font-size: 13px;
-  color: #1a1a1a;
+  color: #0f172a;
   background-color: #ffffff;
-  font-family: inherit;
   outline: none;
-  transition: border-color 0.15s ease, box-shadow 0.15s ease;
+  transition: border-color 0.2s ease, box-shadow 0.2s ease;
   cursor: pointer;
+  font-family: inherit;
 }
-.form-input:focus,
-.form-select:focus {
+.gen-ui-select:focus {
   border-color: #3b82f6;
   box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
 }
-.form-select {
-  cursor: pointer;
+.gen-ui-select:disabled {
+  background-color: #f1f5f9;
+  cursor: not-allowed;
+  opacity: 0.6;
 }
-.form-submit-button {
-  margin-top: 24px;
+.gen-ui-button {
   display: inline-flex;
   align-items: center;
   justify-content: center;
+  padding: 10px 16px;
   border-radius: 8px;
-  padding: 12px 24px;
   font-size: 13px;
   font-weight: 500;
-  background-color: #3b82f6;
-  color: #ffffff;
   border: none;
   cursor: pointer;
-  transition: background-color 0.15s ease, transform 0.1s ease;
+  transition: all 0.2s ease;
   font-family: inherit;
-}
-.form-submit-button:hover {
-  background-color: #2563eb;
-}
-.form-submit-button:active {
-  transform: scale(0.98);
-}
-.buttons-component {
-  display: flex;
-  gap: 12px;
-  flex-wrap: wrap;
-}
-.button-component {
-  border-radius: 8px;
-  padding: 10px 20px;
-  font-size: 13px;
-  font-weight: 500;
-  border: 1px solid #e0e0e0;
-  background-color: #ffffff;
-  color: #475569;
-  cursor: pointer;
-  transition: all 0.15s ease;
-  font-family:
-    -apple-system,
-    BlinkMacSystemFont,
-    "Segoe UI",
-    Roboto,
-    "Helvetica Neue",
-    Arial,
-    sans-serif;
   outline: none;
-}
-.button-component.primary {
-  background-color: #3b82f6;
-  color: #ffffff;
-  border-color: #3b82f6;
-}
-.button-component.primary:hover {
-  background-color: #2563eb;
-  border-color: #2563eb;
-}
-.button-component.secondary {
-  background-color: #f3f4f6;
-  color: #475569;
-  border-color: #d1d5db;
-}
-.button-component.secondary:hover {
-  background-color: #e5e7eb;
-  border-color: #9ca3af;
-}
-.button-component.danger {
-  background-color: #ef4444;
+  background: #2563eb;
   color: #ffffff;
-  border-color: #ef4444;
 }
-.button-component.danger:hover {
-  background-color: #dc2626;
-  border-color: #dc2626;
+.gen-ui-button:hover {
+  background: #1d4ed8;
 }
-.button-component:not(.primary):not(.secondary):not(.danger):hover {
-  background-color: #f9fafb;
-  border-color: #d1d5db;
+.gen-ui-button:active {
+  transform: scale(0.98);
 }
-.button-component:active {
-  transform: scale(0.97);
+.gen-ui-button:disabled {
+  background: #cbd5e1;
+  cursor: not-allowed;
+  opacity: 0.6;
 }
-.table-component {
-  border: 1px solid #e0e0e0;
+.gen-ui-card {
+  border: 1px solid #e2e8f0;
   border-radius: 12px;
-  overflow: hidden;
-  font-size: 13px;
+  padding: 16px;
   background-color: #ffffff;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
-  font-family:
-    -apple-system,
-    BlinkMacSystemFont,
-    "Segoe UI",
-    Roboto,
-    "Helvetica Neue",
-    Arial,
-    sans-serif;
-}
-.table-caption {
-  padding: 16px 20px;
-  font-weight: 600;
-  font-size: 14px;
-  border-bottom: 1px solid #e0e0e0;
-  background-color: #f8f9fa;
-  color: #1a1a1a;
-}
-.table-wrapper {
-  overflow-x: auto;
-}
-.table {
-  width: 100%;
-  border-collapse: collapse;
-  min-width: 100%;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+  transition: box-shadow 0.2s ease;
 }
-.table-header {
-  background-color: #f8f9fa;
+.gen-ui-card:hover {
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
 }
-.table-th {
-  border-bottom: 2px solid #e0e0e0;
-  padding: 14px 20px;
-  text-align: left;
+.gen-ui-card-title {
+  font-size: 16px;
   font-weight: 600;
-  font-size: 12px;
-  color: #4a5568;
-  text-transform: uppercase;
-  letter-spacing: 0.5px;
-  white-space: nowrap;
-}
-.table-tbody tr {
-  background-color: #ffffff;
-  transition: background-color 0.15s ease;
-}
-.table-tbody tr:nth-child(even) {
-  background-color: #fafbfc;
-}
-.table-tbody tr:hover {
-  background-color: #f0f4f8;
+  color: #0f172a;
+  margin: 0 0 8px 0;
 }
-.table-td {
-  border-bottom: 1px solid #e8e8e8;
-  padding: 16px 20px;
+.gen-ui-card-content {
   font-size: 13px;
-  vertical-align: middle;
-}
-.table-td > span {
-  color: #a0a0a0;
-  font-style: italic;
-}
-.table-cell-image {
-  display: flex;
-  align-items: center;
-}
-.table-image {
-  width: 40px;
-  height: 40px;
-  border-radius: 8px;
-  object-fit: cover;
-  border: 1px solid #e0e0e0;
-}
-.table-cell-text {
-  color: #2d3748;
+  color: #334155;
+  margin: 0;
   line-height: 1.5;
 }
-.table-empty {
-  padding: 40px;
-  text-align: center;
-  color: #9ca3af;
-  font-size: 13px;
-}
-.card-component {
-  border: 1px solid #e5e7eb;
-  border-radius: 16px;
-  padding: 16px;
-  background-color: #ffffff;
-  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
-  overflow: hidden;
-  margin-bottom: 12px;
-}
-.card-content {
-  display: flex;
-  gap: 12px;
-}
-.card-image {
-  width: 64px;
-  height: 64px;
-  border-radius: 8px;
-  object-fit: cover;
-  flex-shrink: 0;
-}
-.card-info {
-  flex: 1;
-  min-width: 0;
-}
-.card-title {
-  font-weight: 600;
-  font-size: 14px;
-  margin-bottom: 8px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-.card-subtitle {
-  color: #64748b;
-  font-size: 12px;
-  margin-bottom: 4px;
+.gen-ui-list {
+  list-style-type: disc;
+  padding-left: 20px;
   margin: 0;
 }
-.card-status {
-  display: flex;
-  gap: 8px;
-  font-size: 12px;
+.gen-ui-list-item {
+  font-size: 13px;
+  color: #1e293b;
+  line-height: 1.6;
   margin-bottom: 4px;
 }
-.card-status-label {
-  color: #64748b;
-  font-weight: 500;
-}
-.card-status-value {
-  color: #475569;
-}
-.card-fields {
-  display: flex;
-  flex-direction: column;
-  gap: 4px;
+.gen-ui-list-item:last-child {
+  margin-bottom: 0;
 }
-.card-field {
-  display: flex;
-  gap: 8px;
-  font-size: 12px;
+.gen-ui-image {
+  max-width: 100%;
+  height: auto;
+  border-radius: 8px;
+  display: block;
 }
-.card-field-label {
-  color: #64748b;
-  font-weight: 500;
+.gen-ui-link {
+  color: #2563eb;
+  text-decoration: none;
+  font-size: 13px;
+  transition: color 0.2s ease;
 }
-.card-field-value {
-  color: #475569;
+.gen-ui-link:hover {
+  color: #1d4ed8;
+  text-decoration: underline;
 }
-.card-description {
-  color: #64748b;
-  font-size: 12px;
-  margin-top: 8px;
-  margin: 0;
+.gen-ui-link:visited {
+  color: #2563eb;
 }
-.card-list {
+.gen-ui-table-wrapper {
   width: 100%;
-}
-.card-list-title {
-  font-weight: 600;
-  margin-bottom: 12px;
-  font-size: 14px;
-  color: #1a1a1a;
-  margin-top: 0;
-}
-.card-list-description {
-  color: #64748b;
-  margin-bottom: 12px;
-  font-size: 12px;
-  margin-top: 0;
-}
-.card-grid {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
-  gap: 12px;
-}
-.card-item {
-  font-size: 12px;
-  border: 1px solid #e0e0e0;
+  overflow-x: auto;
+  border: 1px solid #e2e8f0;
   border-radius: 12px;
-  padding: 16px;
   background-color: #ffffff;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
-  overflow: hidden;
-}
-.card-item-content {
-  display: flex;
-  gap: 12px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
 }
-.card-item-image {
-  width: 64px;
-  height: 64px;
-  border-radius: 8px;
-  object-fit: cover;
-  flex-shrink: 0;
+.gen-ui-table {
+  width: 100%;
+  border-collapse: collapse;
+  min-width: 100%;
 }
-.card-item-info {
-  flex: 1;
-  min-width: 0;
+.gen-ui-table-header {
+  background-color: #f8fafc;
 }
-.card-item-title {
+.gen-ui-table-th {
+  padding: 12px 16px;
+  text-align: left;
+  font-size: 12px;
   font-weight: 600;
-  font-size: 14px;
-  margin-bottom: 4px;
-  overflow: hidden;
-  text-overflow: ellipsis;
+  color: #334155;
+  border-bottom: 2px solid #e2e8f0;
   white-space: nowrap;
-  color: #1a1a1a;
-  margin-top: 0;
 }
-.card-item-subtitle {
-  color: #64748b;
-  font-size: 12px;
-  margin: 0;
+.gen-ui-table-body tr {
+  transition: background-color 0.2s ease;
 }
-.card-item-legacy {
-  display: flex;
-  justify-content: space-between;
-  gap: 8px;
-  font-size: 12px;
+.gen-ui-table-body tr:hover {
+  background-color: #f8fafc;
 }
-.card-item-legacy-label {
-  color: #64748b;
-  margin: 0;
+.gen-ui-table-body tr:not(:last-child) {
+  border-bottom: 1px solid #e2e8f0;
 }
-.card-item-legacy-value {
-  font-weight: 500;
-  color: #1a1a1a;
-  margin: 0;
-}
-.field-image {
-  width: 24px;
-  height: 24px;
-  border-radius: 999px;
-  object-fit: cover;
-}
-.field-link {
-  text-decoration: underline;
-}
-.field-badge {
-  display: inline-block;
-  padding: 2px 6px;
-  border-radius: 999px;
-  font-size: 10px;
-  font-weight: 500;
-}
-.field-badge.success {
-  background-color: #e0fce5;
-  color: #1a7f36;
-}
-.field-badge.warning {
-  background-color: #fff7d6;
-  color: #8a6a00;
-}
-.field-badge.danger {
-  background-color: #ffe4e4;
-  color: #b42318;
-}
-.field-badge:not(.success):not(.warning):not(.danger) {
-  background-color: #f2f2f2;
-  color: #333;
+.gen-ui-table-td {
+  padding: 12px 16px;
+  font-size: 13px;
+  color: #1e293b;
+  vertical-align: middle;
 }
-.field-list {
-  margin: 0;
-  padding-left: 16px;
+.gen-ui-form {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  width: 100%;
 }
 /*# sourceMappingURL=index.css.map */