https://g-next.netlify.app/assets/page-CcKSC9-H.js

1var __defProp = Object.defineProperty;
2var __typeError = (msg) => {
3  throw TypeError(msg);
4};
5var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
6var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
8var _a, _b, _editing, _c, _d, _canToggle, _e, _f;
9import { C as Component, n as $template, $ as $_GET_ARGS, m as $args, g as $_tag, D as cellFor, O as $__if, l as $_fin, E as tracked, u as $_if, v as $_ucw, F as $_each, j as $_c, k as $_args, h as $_edp } from "./NestedRouter-DSD8lkzG.js";
10import { r as repo } from "./main-98EdBHJO.js";
11function isBlank(el) {
12  return el.trim().length === 0;
13}
14const _TodoItem = class _TodoItem extends (_b = Component, _a = $template, _b) {
15  constructor() {
16    super(...arguments);
17    __publicField(this, _a, function() {
18      $_GET_ARGS(this, arguments);
19      const $a = this[$args];
20      const roots = [
21        $_tag(
22          "li",
23          [
24            [
25              ["", () => $__if(() => this.isCompleted, "completed")],
26              ["", () => $__if(() => this.editing, "editing")]
27            ],
28            [],
29            []
30          ],
31          this,
32          [
33            $_tag(
34              "div",
35              [
36                [["", "view"]],
37                [],
38                []
39              ],
40              this,
41              [
42                $_tag(
43                  "input",
44                  [
45                    [
46                      ["checked", () => this.isCompleted],
47                      ["", "toggle"]
48                    ],
49                    [
50                      ["type", "checkbox"],
51                      ["aria-label", "Toggle the completion state of this todo"]
52                    ],
53                    [["change", ($e, $n) => this.toggleCompleted($e, $n)]]
54                  ],
55                  this
56                ),
57                $_tag(
58                  "label",
59                  [
60                    [],
61                    [],
62                    [
63                      ["dblclick", ($e, $n) => this.startEditing($e, $n)],
64                      ["1", () => cellFor($a.todo, "title")]
65                    ]
66                  ],
67                  this
68                ),
69                $_tag(
70                  "button",
71                  [
72                    [["", "destroy"]],
73                    [
74                      ["type", "button"],
75                      ["aria-label", "Delete this todo"]
76                    ],
77                    [["click", ($e, $n) => this.removeTodo($e, $n)]]
78                  ],
79                  this
80                )
81              ]
82            ),
83            $_tag(
84              "input",
85              [
86                [
87                  ["value", () => {
88                    var _a2;
89                    return (_a2 = $a.todo) == null ? void 0 : _a2.title;
90                  }],
91                  ["autofocus", true],
92                  ["", "edit"]
93                ],
94                [],
95                [
96                  ["blur", ($e, $n) => this.doneEditing($e, $n)],
97                  ["keydown", ($e, $n) => this.handleKeydown($e, $n)]
98                ]
99              ],
100              this
101            )
102          ]
103        )
104      ];
105      return $_fin(roots, this);
106    });
107    __publicField(this, "repo", repo);
108    __privateAdd(this, _editing, (dt7948.i(this, "editing"), void 0));
109    __publicField(this, "removeTodo", () => this.repo.delete(this.args.todo));
110    __publicField(this, "toggleCompleted", (event) => {
111      this.args.todo.completed = event.target.checked;
112      this.repo.persist();
113    });
114    __publicField(this, "handleKeydown", (event) => {
115      if (event.keyCode === 13) {
116        event.target.blur();
117      } else if (event.keyCode === 27) {
118        this.editing = false;

119      }
120    });
121    __publicField(this, "startEditing", (event) => {
122      var _a2;
123      this.args.onStartEdit();
124      this.editing = true;
125      (_a2 = event.target.closest("li")) == null ? void 0 : _a2.querySelector("input.edit").focus();
126    });
127    __publicField(this, "doneEditing", (event) => {
128      if (!this.editing) {
129        return;
130      }
131      let todoTitle = event.target.value.trim();
132      if (isBlank(todoTitle)) {
133        this.removeTodo();
134      } else {
135        this.args.todo.title = todoTitle;
136        this.editing = false;
137        this.args.onEndEdit();
138      }
139    });
140  }
141  get isCompleted() {
142    return cellFor(this.args.todo, "completed");
143  }
144};
145_editing = new WeakMap();
146dt7948.g(_TodoItem.prototype, "editing", [tracked], function() {
147  return false;
148});
149let TodoItem = _TodoItem;
150const _TodoList = class _TodoList extends (_d = Component, _c = $template, _d) {
151  constructor() {
152    super(...arguments);
153    __publicField(this, _c, function() {
154      $_GET_ARGS(this, arguments);
155      const $a = this[$args];
156      const roots = [
157        $_tag(
158          "section",
159          [
160            [["", "main"]],
161            [],
162            []
163          ],
164          this,
165          [
166            $_if(
167              () => {
168                var _a2;
169                return (_a2 = $a.todos) == null ? void 0 : _a2.length;
170              },
171              (ctx0) => $_ucw((ctx1) => [
172                $_if(
173                  () => this.canToggle,
174                  (ctx2) => $_ucw((ctx3) => [
175                    $_tag(
176                      "input",
177                      [
178                        [
179                          ["checked", () => this.areViewableCompleted],
180                          ["", "toggle-all"]
181                        ],
182                        [
183                          ["id", "toggle-all"],
184                          ["type", "checkbox"]
185                        ],
186                        [["change", ($e, $n) => this.toggleAll($e, $n)]]
187                      ],
188                      ctx3
189                    ),
190                    $_tag(
191                      "label",
192                      [
193                        [],
194                        [["for", "toggle-all"]],
195                        [["1", "Mark all as complete"]]
196                      ],
197                      ctx3
198                    )
199                  ], ctx2),
200                  (ctx2) => [],
201                  this
202                ),
203                $_tag(
204                  "ul",
205                  [
206                    [["", "todo-list"]],
207                    [],
208                    []
209                  ],
210                  ctx1,
211                  [
212                    $_each(
213                      () => $a.todos,
214                      (todo, $index, ctx4) => $_c(
215                        TodoItem,
216                        $_args(
217                          {
218                            todo: () => todo,
219                            onStartEdit: () => this.disableToggle,
220                            onEndEdit: () => this.enableToggle
221                          },
222                          {},
223                          $_edp
224                        ),
225                        ctx4
226                      ),
227                      null,
228                      this
229                    )
230                  ]
231                )
232              ], ctx0),
233              (ctx0) => [],
234              this
235            )
236          ]
237        )
238      ];
239      return $_fin(roots, this);
240    });
241    __publicField(this, "repo", repo);
242    __privateAdd(this, _canToggle, (dt7948.i(this, "canToggle"), void 0));
243    __publicField(this, "toggleAll", () => {
244      let allCompleted = this.areViewableCompleted;
245      this.args.todos.forEach((todo) => todo.completed = !allCompleted);
246      this.repo.persist();
247    });
248    __publicField(this, "enableToggle", () => this.canToggle = true);
249    __publicField(this, "disableToggle", () => this.canToggle = false);
250  }
251  get areViewableCompleted() {
252    return this.args.todos.filter((todo) => todo.completed).length === this.args.todos.length;
253  }
254};
255_canToggle = new WeakMap();
256dt7948.g(_TodoList.prototype, "canToggle", [tracked], function() {
257  return true;
258});
259let TodoList = _TodoList;
260class Page extends (_f = Component, _e = $template, _f) {
261  constructor() {
262    super(...arguments);
263    __publicField(this, _e, function() {
264      $_GET_ARGS(this, arguments);
265      const $a = this[$args];
266      const roots = [
267        $_c(
268          TodoList,
269          $_args(
270            { todos: () => {
271              var _a2;
272              return (_a2 = $a.model) == null ? void 0 : _a2.model;
273            } },

274            {},
275            $_edp
276          ),
277          this
278        )
279      ];
280      return $_fin(roots, this);
281    });
282  }
283}
284export {
285  Page as default
286};