brizzle 0.2.7 → 0.2.9
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.
- package/README.md +18 -0
- package/dist/index.js +60 -38
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -181,6 +181,24 @@ Next steps:
|
|
|
181
181
|
- Next.js project with App Router
|
|
182
182
|
- Drizzle ORM configured
|
|
183
183
|
|
|
184
|
+
## Roadmap
|
|
185
|
+
|
|
186
|
+
- [ ] **Drizzle init** - `brizzle init` to set up Drizzle ORM, database config, and db connection
|
|
187
|
+
- [ ] **Authentication** - `brizzle auth` to generate [better-auth](https://www.better-auth.com/) setup with user model and sign-in/sign-up pages
|
|
188
|
+
- [ ] **Zod schemas** - Generate validation schemas for forms and API routes
|
|
189
|
+
- [ ] **Indexes** - Support for `name:string:index` field modifier
|
|
190
|
+
- [ ] **Default values** - Support for `status:string:default:active`
|
|
191
|
+
- [ ] **Soft deletes** - Add `--soft-delete` flag for `deletedAt` timestamp
|
|
192
|
+
- [ ] **Pagination** - Add pagination to list pages and API routes
|
|
193
|
+
- [ ] **Search & filtering** - Generate search/filter UI for list pages
|
|
194
|
+
- [ ] **Seed generator** - `brizzle seed <model>` to generate seed data files
|
|
195
|
+
- [ ] **Relations helper** - Better syntax for has-many/belongs-to relationships
|
|
196
|
+
- [ ] **Custom templates** - Allow overriding templates via `.brizzle/` directory
|
|
197
|
+
- [ ] **Interactive mode** - `brizzle new` wizard for step-by-step model creation
|
|
198
|
+
- [ ] **Import cleanup** - Remove unused imports when destroying models
|
|
199
|
+
|
|
200
|
+
Have a feature request? [Open an issue](https://github.com/mantaskaveckas/brizzle/issues)
|
|
201
|
+
|
|
184
202
|
## License
|
|
185
203
|
|
|
186
204
|
MIT
|
package/dist/index.js
CHANGED
|
@@ -506,6 +506,24 @@ function getTimestampColumns(dialect, noTimestamps = false) {
|
|
|
506
506
|
.$defaultFn(() => new Date())`;
|
|
507
507
|
}
|
|
508
508
|
}
|
|
509
|
+
function extractImportsFromSchema(content) {
|
|
510
|
+
const importMatch = content.match(/import\s*\{([^}]+)\}\s*from\s*["']drizzle-orm\/[^"']+["']/);
|
|
511
|
+
if (!importMatch) {
|
|
512
|
+
return [];
|
|
513
|
+
}
|
|
514
|
+
return importMatch[1].split(",").map((s) => s.trim()).filter((s) => s.length > 0);
|
|
515
|
+
}
|
|
516
|
+
function updateSchemaImports(content, newImports, dialect) {
|
|
517
|
+
const existingImports = extractImportsFromSchema(content);
|
|
518
|
+
const mergedImports = Array.from(/* @__PURE__ */ new Set([...existingImports, ...newImports]));
|
|
519
|
+
const drizzleImport = getDrizzleImport(dialect);
|
|
520
|
+
const newImportLine = `import { ${mergedImports.join(", ")} } from "${drizzleImport}";`;
|
|
521
|
+
const importRegex = /import\s*\{[^}]+\}\s*from\s*["']drizzle-orm\/[^"']+["'];?/;
|
|
522
|
+
if (importRegex.test(content)) {
|
|
523
|
+
return content.replace(importRegex, newImportLine);
|
|
524
|
+
}
|
|
525
|
+
return newImportLine + "\n" + content;
|
|
526
|
+
}
|
|
509
527
|
function getRequiredImports(fields, dialect, options = {}) {
|
|
510
528
|
const types = /* @__PURE__ */ new Set();
|
|
511
529
|
types.add(getTableFunction(dialect));
|
|
@@ -782,17 +800,21 @@ function generateEnumField(field, columnName, dialect) {
|
|
|
782
800
|
}
|
|
783
801
|
function appendToSchema(schemaPath, modelName, tableName, fields, dialect, options) {
|
|
784
802
|
const existingContent = readFile(schemaPath);
|
|
803
|
+
const newImports = getRequiredImports(fields, dialect, options);
|
|
804
|
+
const updatedContent = updateSchemaImports(existingContent, newImports, dialect);
|
|
785
805
|
const enumDefinitions = generateEnumDefinitions(fields, dialect);
|
|
786
806
|
const tableDefinition = generateTableDefinition(modelName, tableName, fields, dialect, options);
|
|
787
|
-
const newContent =
|
|
807
|
+
const newContent = updatedContent + enumDefinitions + "\n" + tableDefinition + "\n";
|
|
788
808
|
writeFile(schemaPath, newContent, { force: true, dryRun: options.dryRun });
|
|
789
809
|
}
|
|
790
810
|
function replaceInSchema(schemaPath, modelName, tableName, fields, dialect, options) {
|
|
791
811
|
const existingContent = readFile(schemaPath);
|
|
792
812
|
const cleanedContent = removeModelFromSchemaContent(existingContent, tableName);
|
|
813
|
+
const newImports = getRequiredImports(fields, dialect, options);
|
|
814
|
+
const updatedContent = updateSchemaImports(cleanedContent, newImports, dialect);
|
|
793
815
|
const enumDefinitions = generateEnumDefinitions(fields, dialect);
|
|
794
816
|
const tableDefinition = generateTableDefinition(modelName, tableName, fields, dialect, options);
|
|
795
|
-
const newContent =
|
|
817
|
+
const newContent = updatedContent.trimEnd() + "\n" + enumDefinitions + "\n" + tableDefinition + "\n";
|
|
796
818
|
writeFile(schemaPath, newContent, { force: true, dryRun: options.dryRun });
|
|
797
819
|
}
|
|
798
820
|
|
|
@@ -923,31 +945,31 @@ export default async function ${pascalPlural}Page() {
|
|
|
923
945
|
return (
|
|
924
946
|
<div className="mx-auto max-w-3xl px-6 py-12">
|
|
925
947
|
<div className="mb-10 flex items-center justify-between">
|
|
926
|
-
<h1 className="text-2xl font-semibold text-
|
|
948
|
+
<h1 className="text-2xl font-semibold tracking-tight text-zinc-900 dark:text-zinc-50">${pascalPlural}</h1>
|
|
927
949
|
<Link
|
|
928
950
|
href="/${kebabPlural}/new"
|
|
929
|
-
className="rounded-
|
|
951
|
+
className="flex h-10 items-center rounded-full bg-zinc-900 px-4 text-sm font-medium text-white transition-colors hover:bg-zinc-700 dark:bg-zinc-50 dark:text-zinc-900 dark:hover:bg-zinc-200"
|
|
930
952
|
>
|
|
931
953
|
New ${pascalName}
|
|
932
954
|
</Link>
|
|
933
955
|
</div>
|
|
934
956
|
|
|
935
957
|
{${camelName}s.length === 0 ? (
|
|
936
|
-
<p className="text-
|
|
958
|
+
<p className="text-zinc-500 dark:text-zinc-400">No ${camelName}s yet.</p>
|
|
937
959
|
) : (
|
|
938
|
-
<div className="divide-y divide-
|
|
960
|
+
<div className="divide-y divide-zinc-100 dark:divide-zinc-800">
|
|
939
961
|
{${camelName}s.map((${camelName}) => (
|
|
940
962
|
<div
|
|
941
963
|
key={${camelName}.id}
|
|
942
964
|
className="flex items-center justify-between py-4"
|
|
943
965
|
>
|
|
944
|
-
<Link href={\`/${kebabPlural}/\${${camelName}.id}\`} className="font-medium text-
|
|
966
|
+
<Link href={\`/${kebabPlural}/\${${camelName}.id}\`} className="font-medium text-zinc-900 hover:text-zinc-600 dark:text-zinc-50 dark:hover:text-zinc-300">
|
|
945
967
|
{${camelName}.${displayField}}
|
|
946
968
|
</Link>
|
|
947
969
|
<div className="flex gap-4 text-sm">
|
|
948
970
|
<Link
|
|
949
971
|
href={\`/${kebabPlural}/\${${camelName}.id}/edit\`}
|
|
950
|
-
className="text-
|
|
972
|
+
className="text-zinc-500 hover:text-zinc-900 dark:text-zinc-400 dark:hover:text-zinc-50"
|
|
951
973
|
>
|
|
952
974
|
Edit
|
|
953
975
|
</Link>
|
|
@@ -957,7 +979,7 @@ export default async function ${pascalPlural}Page() {
|
|
|
957
979
|
await delete${pascalName}(${camelName}.id);
|
|
958
980
|
}}
|
|
959
981
|
>
|
|
960
|
-
<button type="submit" className="text-
|
|
982
|
+
<button type="submit" className="text-zinc-500 hover:text-red-600 dark:text-zinc-400 dark:hover:text-red-400">
|
|
961
983
|
Delete
|
|
962
984
|
</button>
|
|
963
985
|
</form>
|
|
@@ -989,7 +1011,7 @@ ${fields.map((f) => ` ${f.name}: ${formDataValue(f)},`).join("\n")}
|
|
|
989
1011
|
|
|
990
1012
|
return (
|
|
991
1013
|
<div className="mx-auto max-w-xl px-6 py-12">
|
|
992
|
-
<h1 className="mb-8 text-2xl font-semibold text-
|
|
1014
|
+
<h1 className="mb-8 text-2xl font-semibold tracking-tight text-zinc-900 dark:text-zinc-50">New ${pascalName}</h1>
|
|
993
1015
|
|
|
994
1016
|
<form action={handleCreate} className="space-y-5">
|
|
995
1017
|
${fields.map((f) => generateFormField(f, camelName)).join("\n\n")}
|
|
@@ -997,13 +1019,13 @@ ${fields.map((f) => generateFormField(f, camelName)).join("\n\n")}
|
|
|
997
1019
|
<div className="flex gap-3 pt-4">
|
|
998
1020
|
<button
|
|
999
1021
|
type="submit"
|
|
1000
|
-
className="rounded-
|
|
1022
|
+
className="flex h-10 items-center rounded-full bg-zinc-900 px-4 text-sm font-medium text-white transition-colors hover:bg-zinc-700 dark:bg-zinc-50 dark:text-zinc-900 dark:hover:bg-zinc-200"
|
|
1001
1023
|
>
|
|
1002
1024
|
Create ${pascalName}
|
|
1003
1025
|
</button>
|
|
1004
1026
|
<Link
|
|
1005
1027
|
href="/${kebabPlural}"
|
|
1006
|
-
className="rounded-
|
|
1028
|
+
className="flex h-10 items-center rounded-full border border-zinc-200 px-4 text-sm font-medium text-zinc-600 transition-colors hover:bg-zinc-50 dark:border-zinc-700 dark:text-zinc-300 dark:hover:bg-zinc-800"
|
|
1007
1029
|
>
|
|
1008
1030
|
Cancel
|
|
1009
1031
|
</Link>
|
|
@@ -1041,33 +1063,33 @@ export default async function ${pascalName}Page({
|
|
|
1041
1063
|
return (
|
|
1042
1064
|
<div className="mx-auto max-w-xl px-6 py-12">
|
|
1043
1065
|
<div className="mb-8 flex items-center justify-between">
|
|
1044
|
-
<h1 className="text-2xl font-semibold text-
|
|
1066
|
+
<h1 className="text-2xl font-semibold tracking-tight text-zinc-900 dark:text-zinc-50">${pascalName}</h1>
|
|
1045
1067
|
<div className="flex gap-3">
|
|
1046
1068
|
<Link
|
|
1047
1069
|
href={\`/${kebabPlural}/\${${camelName}.id}/edit\`}
|
|
1048
|
-
className="rounded-
|
|
1070
|
+
className="flex h-10 items-center rounded-full bg-zinc-900 px-4 text-sm font-medium text-white transition-colors hover:bg-zinc-700 dark:bg-zinc-50 dark:text-zinc-900 dark:hover:bg-zinc-200"
|
|
1049
1071
|
>
|
|
1050
1072
|
Edit
|
|
1051
1073
|
</Link>
|
|
1052
1074
|
<Link
|
|
1053
1075
|
href="/${kebabPlural}"
|
|
1054
|
-
className="rounded-
|
|
1076
|
+
className="flex h-10 items-center rounded-full border border-zinc-200 px-4 text-sm font-medium text-zinc-600 transition-colors hover:bg-zinc-50 dark:border-zinc-700 dark:text-zinc-300 dark:hover:bg-zinc-800"
|
|
1055
1077
|
>
|
|
1056
1078
|
Back
|
|
1057
1079
|
</Link>
|
|
1058
1080
|
</div>
|
|
1059
1081
|
</div>
|
|
1060
1082
|
|
|
1061
|
-
<dl className="divide-y divide-
|
|
1083
|
+
<dl className="divide-y divide-zinc-100 dark:divide-zinc-800">
|
|
1062
1084
|
${fields.map(
|
|
1063
1085
|
(f) => ` <div className="py-3">
|
|
1064
|
-
<dt className="text-sm text-
|
|
1065
|
-
<dd className="mt-1 text-
|
|
1086
|
+
<dt className="text-sm text-zinc-500 dark:text-zinc-400">${toPascalCase(f.name)}</dt>
|
|
1087
|
+
<dd className="mt-1 text-zinc-900 dark:text-zinc-50">{${camelName}.${f.name}}</dd>
|
|
1066
1088
|
</div>`
|
|
1067
1089
|
).join("\n")}${options.noTimestamps ? "" : `
|
|
1068
1090
|
<div className="py-3">
|
|
1069
|
-
<dt className="text-sm text-
|
|
1070
|
-
<dd className="mt-1 text-
|
|
1091
|
+
<dt className="text-sm text-zinc-500 dark:text-zinc-400">Created At</dt>
|
|
1092
|
+
<dd className="mt-1 text-zinc-900 dark:text-zinc-50">{${camelName}.createdAt.toLocaleString()}</dd>
|
|
1071
1093
|
</div>`}
|
|
1072
1094
|
</dl>
|
|
1073
1095
|
</div>
|
|
@@ -1112,7 +1134,7 @@ ${fields.map((f) => ` ${f.name}: ${formDataValue(f)},`).join("\n")}
|
|
|
1112
1134
|
|
|
1113
1135
|
return (
|
|
1114
1136
|
<div className="mx-auto max-w-xl px-6 py-12">
|
|
1115
|
-
<h1 className="mb-8 text-2xl font-semibold text-
|
|
1137
|
+
<h1 className="mb-8 text-2xl font-semibold tracking-tight text-zinc-900 dark:text-zinc-50">Edit ${pascalName}</h1>
|
|
1116
1138
|
|
|
1117
1139
|
<form action={handleUpdate} className="space-y-5">
|
|
1118
1140
|
${fields.map((f) => generateFormField(f, camelName, true)).join("\n\n")}
|
|
@@ -1120,13 +1142,13 @@ ${fields.map((f) => generateFormField(f, camelName, true)).join("\n\n")}
|
|
|
1120
1142
|
<div className="flex gap-3 pt-4">
|
|
1121
1143
|
<button
|
|
1122
1144
|
type="submit"
|
|
1123
|
-
className="rounded-
|
|
1145
|
+
className="flex h-10 items-center rounded-full bg-zinc-900 px-4 text-sm font-medium text-white transition-colors hover:bg-zinc-700 dark:bg-zinc-50 dark:text-zinc-900 dark:hover:bg-zinc-200"
|
|
1124
1146
|
>
|
|
1125
1147
|
Update ${pascalName}
|
|
1126
1148
|
</button>
|
|
1127
1149
|
<Link
|
|
1128
1150
|
href="/${kebabPlural}"
|
|
1129
|
-
className="rounded-
|
|
1151
|
+
className="flex h-10 items-center rounded-full border border-zinc-200 px-4 text-sm font-medium text-zinc-600 transition-colors hover:bg-zinc-50 dark:border-zinc-700 dark:text-zinc-300 dark:hover:bg-zinc-800"
|
|
1130
1152
|
>
|
|
1131
1153
|
Cancel
|
|
1132
1154
|
</Link>
|
|
@@ -1141,7 +1163,7 @@ function createFieldContext(field, camelName, withDefault) {
|
|
|
1141
1163
|
return {
|
|
1142
1164
|
field,
|
|
1143
1165
|
label: toPascalCase(field.name),
|
|
1144
|
-
optionalLabel: field.nullable ? ` <span className="text-
|
|
1166
|
+
optionalLabel: field.nullable ? ` <span className="text-zinc-400 dark:text-zinc-500">(optional)</span>` : "",
|
|
1145
1167
|
required: field.nullable ? "" : " required",
|
|
1146
1168
|
defaultValue: withDefault ? ` defaultValue={${camelName}.${field.name}}` : ""
|
|
1147
1169
|
};
|
|
@@ -1151,14 +1173,14 @@ function generateTextareaField(ctx) {
|
|
|
1151
1173
|
const rows = field.type === "json" ? 6 : 4;
|
|
1152
1174
|
const placeholder = field.type === "json" ? ` placeholder="{}"` : "";
|
|
1153
1175
|
return ` <div>
|
|
1154
|
-
<label htmlFor="${field.name}" className="block text-sm font-medium text-
|
|
1176
|
+
<label htmlFor="${field.name}" className="block text-sm font-medium text-zinc-700 dark:text-zinc-300">
|
|
1155
1177
|
${label}${optionalLabel}
|
|
1156
1178
|
</label>
|
|
1157
1179
|
<textarea
|
|
1158
1180
|
id="${field.name}"
|
|
1159
1181
|
name="${field.name}"
|
|
1160
1182
|
rows={${rows}}
|
|
1161
|
-
className="mt-1.5 block w-full rounded-lg border border-
|
|
1183
|
+
className="mt-1.5 block w-full rounded-lg border border-zinc-200 bg-white px-3 py-2 text-zinc-900 placeholder:text-zinc-400 focus:border-zinc-400 focus:outline-none dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-50 dark:placeholder:text-zinc-500 dark:focus:border-zinc-500 resize-none"${defaultValue}${placeholder}${required}
|
|
1162
1184
|
/>
|
|
1163
1185
|
</div>`;
|
|
1164
1186
|
}
|
|
@@ -1170,9 +1192,9 @@ function generateCheckboxField(ctx, camelName, withDefault) {
|
|
|
1170
1192
|
type="checkbox"
|
|
1171
1193
|
id="${field.name}"
|
|
1172
1194
|
name="${field.name}"
|
|
1173
|
-
className="h-4 w-4 rounded border-
|
|
1195
|
+
className="h-4 w-4 rounded border-zinc-300 text-zinc-900 focus:ring-0 focus:ring-offset-0 dark:border-zinc-600 dark:bg-zinc-800 dark:text-zinc-50"${defaultChecked}
|
|
1174
1196
|
/>
|
|
1175
|
-
<label htmlFor="${field.name}" className="text-sm font-medium text-
|
|
1197
|
+
<label htmlFor="${field.name}" className="text-sm font-medium text-zinc-700 dark:text-zinc-300">
|
|
1176
1198
|
${label}
|
|
1177
1199
|
</label>
|
|
1178
1200
|
</div>`;
|
|
@@ -1182,14 +1204,14 @@ function generateNumberField(ctx, step) {
|
|
|
1182
1204
|
const stepAttr = step ? `
|
|
1183
1205
|
step="${step}"` : "";
|
|
1184
1206
|
return ` <div>
|
|
1185
|
-
<label htmlFor="${field.name}" className="block text-sm font-medium text-
|
|
1207
|
+
<label htmlFor="${field.name}" className="block text-sm font-medium text-zinc-700 dark:text-zinc-300">
|
|
1186
1208
|
${label}${optionalLabel}
|
|
1187
1209
|
</label>
|
|
1188
1210
|
<input
|
|
1189
1211
|
type="number"${stepAttr}
|
|
1190
1212
|
id="${field.name}"
|
|
1191
1213
|
name="${field.name}"
|
|
1192
|
-
className="mt-1.5 block w-full rounded-lg border border-
|
|
1214
|
+
className="mt-1.5 block w-full rounded-lg border border-zinc-200 bg-white px-3 py-2 text-zinc-900 placeholder:text-zinc-400 focus:border-zinc-400 focus:outline-none dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-50 dark:placeholder:text-zinc-500 dark:focus:border-zinc-500"${defaultValue}${required}
|
|
1193
1215
|
/>
|
|
1194
1216
|
</div>`;
|
|
1195
1217
|
}
|
|
@@ -1197,14 +1219,14 @@ function generateDateField(ctx, camelName, withDefault) {
|
|
|
1197
1219
|
const { field, label, optionalLabel, required } = ctx;
|
|
1198
1220
|
const dateDefault = withDefault ? ` defaultValue={${camelName}.${field.name}?.toISOString().split("T")[0]}` : "";
|
|
1199
1221
|
return ` <div>
|
|
1200
|
-
<label htmlFor="${field.name}" className="block text-sm font-medium text-
|
|
1222
|
+
<label htmlFor="${field.name}" className="block text-sm font-medium text-zinc-700 dark:text-zinc-300">
|
|
1201
1223
|
${label}${optionalLabel}
|
|
1202
1224
|
</label>
|
|
1203
1225
|
<input
|
|
1204
1226
|
type="date"
|
|
1205
1227
|
id="${field.name}"
|
|
1206
1228
|
name="${field.name}"
|
|
1207
|
-
className="mt-1.5 block w-full rounded-lg border border-
|
|
1229
|
+
className="mt-1.5 block w-full rounded-lg border border-zinc-200 bg-white px-3 py-2 text-zinc-900 placeholder:text-zinc-400 focus:border-zinc-400 focus:outline-none dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-50 dark:placeholder:text-zinc-500 dark:focus:border-zinc-500"${dateDefault}${required}
|
|
1208
1230
|
/>
|
|
1209
1231
|
</div>`;
|
|
1210
1232
|
}
|
|
@@ -1212,14 +1234,14 @@ function generateDatetimeField(ctx, camelName, withDefault) {
|
|
|
1212
1234
|
const { field, label, optionalLabel, required } = ctx;
|
|
1213
1235
|
const dateDefault = withDefault ? ` defaultValue={${camelName}.${field.name}?.toISOString().slice(0, 16)}` : "";
|
|
1214
1236
|
return ` <div>
|
|
1215
|
-
<label htmlFor="${field.name}" className="block text-sm font-medium text-
|
|
1237
|
+
<label htmlFor="${field.name}" className="block text-sm font-medium text-zinc-700 dark:text-zinc-300">
|
|
1216
1238
|
${label}${optionalLabel}
|
|
1217
1239
|
</label>
|
|
1218
1240
|
<input
|
|
1219
1241
|
type="datetime-local"
|
|
1220
1242
|
id="${field.name}"
|
|
1221
1243
|
name="${field.name}"
|
|
1222
|
-
className="mt-1.5 block w-full rounded-lg border border-
|
|
1244
|
+
className="mt-1.5 block w-full rounded-lg border border-zinc-200 bg-white px-3 py-2 text-zinc-900 placeholder:text-zinc-400 focus:border-zinc-400 focus:outline-none dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-50 dark:placeholder:text-zinc-500 dark:focus:border-zinc-500"${dateDefault}${required}
|
|
1223
1245
|
/>
|
|
1224
1246
|
</div>`;
|
|
1225
1247
|
}
|
|
@@ -1227,13 +1249,13 @@ function generateSelectField(ctx) {
|
|
|
1227
1249
|
const { field, label, optionalLabel, required, defaultValue } = ctx;
|
|
1228
1250
|
const options = field.enumValues.map((v) => ` <option value="${escapeString(v)}">${toPascalCase(v)}</option>`).join("\n");
|
|
1229
1251
|
return ` <div>
|
|
1230
|
-
<label htmlFor="${field.name}" className="block text-sm font-medium text-
|
|
1252
|
+
<label htmlFor="${field.name}" className="block text-sm font-medium text-zinc-700 dark:text-zinc-300">
|
|
1231
1253
|
${label}${optionalLabel}
|
|
1232
1254
|
</label>
|
|
1233
1255
|
<select
|
|
1234
1256
|
id="${field.name}"
|
|
1235
1257
|
name="${field.name}"
|
|
1236
|
-
className="mt-1.5 block w-full rounded-lg border border-
|
|
1258
|
+
className="mt-1.5 block w-full rounded-lg border border-zinc-200 bg-white px-3 py-2 text-zinc-900 focus:border-zinc-400 focus:outline-none dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-50 dark:focus:border-zinc-500"${defaultValue}${required}
|
|
1237
1259
|
>
|
|
1238
1260
|
${options}
|
|
1239
1261
|
</select>
|
|
@@ -1242,14 +1264,14 @@ ${options}
|
|
|
1242
1264
|
function generateTextField(ctx) {
|
|
1243
1265
|
const { field, label, optionalLabel, required, defaultValue } = ctx;
|
|
1244
1266
|
return ` <div>
|
|
1245
|
-
<label htmlFor="${field.name}" className="block text-sm font-medium text-
|
|
1267
|
+
<label htmlFor="${field.name}" className="block text-sm font-medium text-zinc-700 dark:text-zinc-300">
|
|
1246
1268
|
${label}${optionalLabel}
|
|
1247
1269
|
</label>
|
|
1248
1270
|
<input
|
|
1249
1271
|
type="text"
|
|
1250
1272
|
id="${field.name}"
|
|
1251
1273
|
name="${field.name}"
|
|
1252
|
-
className="mt-1.5 block w-full rounded-lg border border-
|
|
1274
|
+
className="mt-1.5 block w-full rounded-lg border border-zinc-200 bg-white px-3 py-2 text-zinc-900 placeholder:text-zinc-400 focus:border-zinc-400 focus:outline-none dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-50 dark:placeholder:text-zinc-500 dark:focus:border-zinc-500"${defaultValue}${required}
|
|
1253
1275
|
/>
|
|
1254
1276
|
</div>`;
|
|
1255
1277
|
}
|