accomadesc 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.
|
@@ -18,6 +18,7 @@
|
|
|
18
18
|
import Button from '../basic/Button.svelte';
|
|
19
19
|
import { browser } from '$app/environment';
|
|
20
20
|
import Spinner from '../basic/Spinner.svelte';
|
|
21
|
+
import { randomID } from '../names/gen.ts';
|
|
21
22
|
|
|
22
23
|
let {
|
|
23
24
|
url,
|
|
@@ -49,6 +50,8 @@
|
|
|
49
50
|
maxWidth?: string;
|
|
50
51
|
} = $props();
|
|
51
52
|
|
|
53
|
+
const id = randomID();
|
|
54
|
+
|
|
52
55
|
const oStateID = `i-${url}-${OCCUPATION_STATE}`;
|
|
53
56
|
let occupationState: OccupationState = $state(getContext(oStateID));
|
|
54
57
|
$effect(() => {
|
|
@@ -172,6 +175,7 @@
|
|
|
172
175
|
<div class="month">
|
|
173
176
|
<header class="month-header">{monthHeader(m.month as MonthNumbers, m.year)}</header>
|
|
174
177
|
<div
|
|
178
|
+
id={`${m.year}-${m.month}-${id}`}
|
|
175
179
|
style="
|
|
176
180
|
grid-template-columns: {monthGridTemplateColumns};
|
|
177
181
|
grid-template-rows: {monthGridTemplateRows(m)};
|
|
@@ -202,6 +206,7 @@
|
|
|
202
206
|
|
|
203
207
|
{#each days(m) as d (`${d.year}-${d.month}-${d.day}`)}
|
|
204
208
|
<div
|
|
209
|
+
id={`${m.year}-${m.month}-${m.day}-${id}`}
|
|
205
210
|
class:weekend={[6, 7].includes(d.weekday)}
|
|
206
211
|
class:other-month={m.month !== d.month}
|
|
207
212
|
class="day"
|
|
@@ -220,6 +225,7 @@
|
|
|
220
225
|
|
|
221
226
|
{#each weeks(m) as w (`${w.year}-${w.month}-${w.weekNumber}`)}
|
|
222
227
|
<div
|
|
228
|
+
id={`${w.year}-${w.month}-${w.weekNumber}-${id}`}
|
|
223
229
|
class:hidden={hiddenWeekNum(m, w)}
|
|
224
230
|
class="week-number"
|
|
225
231
|
style="grid-area: w{w.weekNumber} / rowLegend / w{w.weekNumber} / rowLegend;"
|
|
@@ -17,6 +17,7 @@
|
|
|
17
17
|
import { browser } from '$app/environment';
|
|
18
18
|
import { getContext, setContext } from 'svelte';
|
|
19
19
|
import Spinner from '../basic/Spinner.svelte';
|
|
20
|
+
import { randomID } from '../names/gen.ts';
|
|
20
21
|
|
|
21
22
|
let {
|
|
22
23
|
url,
|
|
@@ -45,6 +46,8 @@
|
|
|
45
46
|
maxWidth?: string;
|
|
46
47
|
} = $props();
|
|
47
48
|
|
|
49
|
+
const id = randomID();
|
|
50
|
+
|
|
48
51
|
const oStateID = `i-${url}-${OCCUPATION_STATE}`;
|
|
49
52
|
let occupationState: OccupationState = $state(getContext(oStateID));
|
|
50
53
|
$effect(() => {
|
|
@@ -182,6 +185,7 @@
|
|
|
182
185
|
</div>
|
|
183
186
|
{/if}
|
|
184
187
|
<div
|
|
188
|
+
id={`${m.year}-${m.month}-${id}`}
|
|
185
189
|
class="month-label"
|
|
186
190
|
style="grid-area: m{m.month}y{m.year} / rowLegend / m{m.month}y{m.year} / rowLegend;"
|
|
187
191
|
>
|
|
@@ -192,6 +196,7 @@
|
|
|
192
196
|
{#if occupationState}
|
|
193
197
|
{#each days as d (`${d.year}-${d.month}-${d.day}`)}
|
|
194
198
|
<div
|
|
199
|
+
id={`${d.year}-${d.month}-${d.day}-${id}`}
|
|
195
200
|
class="day"
|
|
196
201
|
style="
|
|
197
202
|
outline: var(--occuplan-grid-border);
|