@sealcode/sealgen 0.15.24 → 0.15.26

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 (8) hide show
  1. package/@types/src/page/sealious-list.d.ts +2 -1
  2. package/lib/forms/controls/checkboxed-list-input.js +29 -16
  3. package/lib/page/sealious-list.js +4 -0
  4. package/lib/templates/list.js +2 -1
  5. package/package.json +1 -1
  6. package/src/forms/controls/checkboxed-list-input.ts +37 -24
  7. package/src/page/sealious-list.ts +5 -1
  8. package/src/templates/list.ts +2 -1
package/@types/src/page/sealious-list.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { Context } from "koa";
2
2
  import { BaseListPageFields, ListPage } from "./list.js";
3
3
  import { Collection, CollectionItem, ItemList, Context as SealiousContext } from "sealious";
4
- import { FlatTemplatable } from "tempstream";
4
+ import { FlatTemplatable, Templatable } from "tempstream";
5
5
  export declare abstract class SealiousItemListPage<C extends Collection, F extends typeof BaseListPageFields> extends ListPage<CollectionItem<C>, F> {
6
6
  collection: C;
7
7
  constructor(collection: C);
@@ -11,6 +11,7 @@ export declare abstract class SealiousItemListPage<C extends Collection, F exten
11
11
  makeQuery(ctx: Context): Promise<ItemList<C>>;
12
12
  getItems(ctx: Context, page: number, itemsPerPage: number | null): Promise<CollectionItem<C>[]>;
13
13
  getFilterValues(ctx: Context): Promise<Record<string, string | undefined>>;
14
+ renderListContainer(_: Context, content: Templatable): FlatTemplatable;
14
15
  renderItem(_: Context, item: CollectionItem<C>, _index: number): Promise<FlatTemplatable>;
15
16
  canAccess: (ctx: Context) => Promise<{
16
17
  canAccess: boolean;
package/lib/forms/controls/checkboxed-list-input.js CHANGED
@@ -21,29 +21,42 @@ class CheckboxedListInput extends FormFieldControl {
21
21
  const { name, required } = this.field;
22
22
  return inputWrapper(
23
23
  "checkboxed-list",
24
- [name, getRequiredClass(required)],
24
+ [
25
+ name,
26
+ getRequiredClass(required),
27
+ "options-count--" + options.length.toString(),
28
+ ...options.length >= 5 ? ["options-count--5-or-more"] : [],
29
+ ...options.length >= 10 ? ["options-count--10-or-more"] : [],
30
+ ...options.length >= 15 ? ["options-count--15-or-more"] : [],
31
+ ...options.length >= 20 ? ["options-count--20-or-more"] : []
32
+ ],
25
33
  tempstream`<label
26
34
  >${this.options.label || this.field.name}</label
27
- >${isVisible ? options.map(
28
- ({ value, label }) => inputWrapper(
35
+ >
36
+ ${~valid && fctx.validate ? `<div class="input__error">${message}</div>` : ""}
37
+ <ul>
38
+ ${isVisible ? options.map(
39
+ ({ value, label }) => tempstream`<li>
40
+ ${inputWrapper(
29
41
  "checkbox",
30
42
  [name],
31
43
  /* HTML */
32
44
  `
33
- <input
34
- type="checkbox"
35
- id="${name}.${value}"
36
- name="${name}.${value}"
37
- ${pickedValues.includes(value) ? "checked" : ""}
38
- form=${fctx.form_id}
39
- />
40
- <label for="${name}.${value}"
41
- >${label || value}</label
42
- >
43
- `
44
- )
45
+ <input
46
+ type="checkbox"
47
+ id="${name}.${value}"
48
+ name="${name}.${value}"
49
+ ${pickedValues.includes(value) ? "checked" : ""}
50
+ form=${fctx.form_id}
51
+ />
52
+ <label for="${name}.${value}"
53
+ >${label || value}</label
54
+ >
55
+ `
56
+ )}
57
+ </li>`
45
58
  ) : ""}
46
- ${~valid && fctx.validate ? `<div class="input__error">${message}</div>` : ""}`
59
+ </ul>`
47
60
  );
48
61
  }
49
62
  }
package/lib/page/sealious-list.js CHANGED
@@ -2,6 +2,7 @@ import {
2
2
  DEFAULT_ITEMS_PER_PAGE,
3
3
  ListPage
4
4
  } from "./list.js";
5
+ import { tempstream } from "tempstream";
5
6
  import { peopleWhoCan } from "./access-control.js";
6
7
  import qs from "qs";
7
8
  import { is, predicates } from "@sealcode/ts-predicates";
@@ -54,6 +55,9 @@ class SealiousItemListPage extends ListPage {
54
55
  ) ? _filter_values : {};
55
56
  return filter_values;
56
57
  }
58
+ renderListContainer(_, content) {
59
+ return tempstream`<div class="sealgen-sealious-list-container">${content}</div>`;
60
+ }
57
61
  async renderItem(_, item, _index) {
58
62
  return `<div>${item.id}</div>`;
59
63
  }
package/lib/templates/list.js CHANGED
@@ -6,6 +6,7 @@ import { extractCollectionClassname } from "../generate-collections.js";
6
6
  import extract_fields_from_collection from "../utils/extract-fields-from-collection.js";
7
7
  import { DefaultListFilters } from "../page/default-list-filters.js";
8
8
  import { formatWithPrettier } from "../utils/prettier.js";
9
+ import { toKebabCase } from "js-convert-case";
9
10
  const target_locreq = _locreq(process.cwd());
10
11
  const listTemplate = async (action_name, newfilefullpath) => {
11
12
  const response = await prompts({
@@ -147,7 +148,7 @@ export default new (class ${action_name}Page extends SealiousItemListPage<
147
148
  return html(
148
149
  ctx,
149
150
  "${action_name}",
150
- <div>
151
+ <div class="sealious-list-wrapper ${toKebabCase(action_name)}--wrapper">
151
152
  <h2>${action_name} List</h2>
152
153
  <table class="sealious-list">
153
154
  {this.renderTableHead(ctx, displayFields)}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sealcode/sealgen",
3
- "version": "0.15.24",
3
+ "version": "0.15.26",
4
4
  "description": "Module to automate adding routes and collections to a sealious application",
5
5
  "main": "lib/index.js",
6
6
  "type": "module",
package/src/forms/controls/checkboxed-list-input.ts CHANGED
@@ -29,34 +29,47 @@ export class CheckboxedListInput extends FormFieldControl {
29
29
  const { name, required } = this.field;
30
30
  return inputWrapper(
31
31
  "checkboxed-list",
32
- [name, getRequiredClass(required)],
32
+ [
33
+ name,
34
+ getRequiredClass(required),
35
+ "options-count--" + options.length.toString(),
36
+ ...(options.length >= 5 ? ["options-count--5-or-more"] : []),
37
+ ...(options.length >= 10 ? ["options-count--10-or-more"] : []),
38
+ ...(options.length >= 15 ? ["options-count--15-or-more"] : []),
39
+ ...(options.length >= 20 ? ["options-count--20-or-more"] : []),
40
+ ],
33
41
  tempstream/* HTML */ `<label
34
42
  >${this.options.label || this.field.name}</label
35
- >${isVisible
36
- ? options.map(({ value, label }) =>
37
- inputWrapper(
38
- "checkbox",
39
- [name],
40
- /* HTML */ `
41
- <input
42
- type="checkbox"
43
- id="${name}.${value}"
44
- name="${name}.${value}"
45
- ${pickedValues.includes(value)
46
- ? "checked"
47
- : ""}
48
- form=${fctx.form_id}
49
- />
50
- <label for="${name}.${value}"
51
- >${label || value}</label
52
- >
53
- `
54
- )
55
- )
56
- : ""}
43
+ >
57
44
  ${~valid && fctx.validate
58
45
  ? `<div class="input__error">${message}</div>`
59
- : ""}`
46
+ : ""}
47
+ <ul>
48
+ ${isVisible
49
+ ? options.map(
50
+ ({ value, label }) => tempstream/* HTML */ `<li>
51
+ ${inputWrapper(
52
+ "checkbox",
53
+ [name],
54
+ /* HTML */ `
55
+ <input
56
+ type="checkbox"
57
+ id="${name}.${value}"
58
+ name="${name}.${value}"
59
+ ${pickedValues.includes(value)
60
+ ? "checked"
61
+ : ""}
62
+ form=${fctx.form_id}
63
+ />
64
+ <label for="${name}.${value}"
65
+ >${label || value}</label
66
+ >
67
+ `
68
+ )}
69
+ </li>`
70
+ )
71
+ : ""}
72
+ </ul>`
60
73
  );
61
74
  }
62
75
  }
package/src/page/sealious-list.ts CHANGED
@@ -11,7 +11,7 @@ import {
11
11
  Context as SealiousContext,
12
12
  CollectionInput,
13
13
  } from "sealious";
14
- import { FlatTemplatable } from "tempstream";
14
+ import { FlatTemplatable, Templatable, tempstream } from "tempstream";
15
15
  import { peopleWhoCan } from "./access-control.js";
16
16
  import qs from "qs";
17
17
  import { is, predicates } from "@sealcode/ts-predicates";
@@ -83,6 +83,10 @@ export abstract class SealiousItemListPage<
83
83
  return filter_values;
84
84
  }
85
85
 
86
+ renderListContainer(_: Context, content: Templatable): FlatTemplatable {
87
+ return tempstream`<div class="sealgen-sealious-list-container">${content}</div>`;
88
+ }
89
+
86
90
  async renderItem(
87
91
  _: Context,
88
92
  item: CollectionItem<C>,
package/src/templates/list.ts CHANGED
@@ -6,6 +6,7 @@ import { extractCollectionClassname } from "../generate-collections.js";
6
6
  import extract_fields_from_collection from "../utils/extract-fields-from-collection.js";
7
7
  import { DefaultListFilters } from "../page/default-list-filters.js";
8
8
  import { formatWithPrettier } from "../utils/prettier.js";
9
+ import { toKebabCase } from "js-convert-case";
9
10
  const target_locreq = _locreq(process.cwd());
10
11
 
11
12
  export const listTemplate = async (
@@ -162,7 +163,7 @@ export default new (class ${action_name}Page extends SealiousItemListPage<
162
163
  return html(
163
164
  ctx,
164
165
  "${action_name}",
165
- <div>
166
+ <div class="sealious-list-wrapper ${toKebabCase(action_name)}--wrapper">
166
167
  <h2>${action_name} List</h2>
167
168
  <table class="sealious-list">
168
169
  {this.renderTableHead(ctx, displayFields)}