fuma 0.3.48 → 0.3.51

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.
@@ -3,59 +3,51 @@ import { slide } from "svelte/transition";
3
3
  import { mdiChevronRight } from "@mdi/js";
4
4
  import { Icon } from "../icon/index.js";
5
5
  import { urlParam } from "../../store/index.js";
6
+ import { goto } from "$app/navigation";
6
7
  export let value;
7
8
  let klass = "";
8
9
  export { klass as class };
10
+ export let classHeader = "";
11
+ export let classBody = "";
12
+ export let classTitle = "";
9
13
  $:
10
14
  isOpen = $urlParam.hasValue("section", value);
11
- let card;
12
15
  let timeout;
13
- function handleClick() {
14
- timeout = setTimeout(() => {
15
- if (!card)
16
- return;
17
- const bound = card.getBoundingClientRect();
18
- window.scrollTo({ top: bound.top, behavior: "smooth" });
19
- }, 250);
16
+ async function handleClick() {
17
+ await goto($urlParam.toggle({ section: value }), { noScroll: true, keepFocus: true });
20
18
  }
21
19
  onDestroy(() => {
22
20
  clearTimeout(timeout);
23
21
  });
24
22
  </script>
25
23
 
26
- <div class="card bordered border bg-base-100 shadow-md {klass}" bind:this={card}>
27
- <div class="flex gap-2">
28
- <slot name="logo" />
29
-
30
- <a
31
- id={value}
32
- class="min-w-0 grow p-2 md:p-8 {$$slots.logo ? 'pl-0 md:pl-0' : ''}"
33
- href={$urlParam.toggle({ section: value })}
34
- data-sveltekit-noscroll
35
- data-sveltekit-replacestate
36
- on:click={handleClick}
37
- >
24
+ <section class="card bordered border bg-base-100 shadow-md {klass}">
25
+ <div
26
+ id={value}
27
+ tabindex="0"
28
+ class="min-w-0 grow cursor-pointer p-2 sm:px-5 sm:py-3 {classHeader}"
29
+ role="link"
30
+ on:click={handleClick}
31
+ on:keydown={(e) => e.key === ' ' && handleClick()}
32
+ >
33
+ <slot name="header">
38
34
  <div class="flex gap-2">
39
- <div class="title min-w-0 overflow-hidden text-ellipsis">
35
+ <div class="min-w-0 overflow-hidden text-ellipsis font-medium {classTitle}">
40
36
  <slot name="title" />
41
37
  </div>
42
38
  <Icon
43
39
  path={mdiChevronRight}
44
- class="ml-auto transition-transform {isOpen ? 'rotate-90' : ''}"
40
+ class="ml-auto opacity-80 transition-transform {isOpen ? 'rotate-90' : ''}"
45
41
  />
46
42
  </div>
47
43
 
48
- {#if $$slots.subtitle}
49
- <div class="mt-2 text-sm opacity-80">
50
- <slot name="subtitle" />
51
- </div>
52
- {/if}
53
- </a>
44
+ <slot name="subtitle" />
45
+ </slot>
54
46
  </div>
55
47
 
56
48
  {#if isOpen}
57
- <div class="card-body p-4 pt-0 md:p-8 md:pt-0" transition:slide={{ duration: 200 }}>
49
+ <div class="card-body p-4 pt-0 md:p-8 md:pt-0 {classBody}" transition:slide={{ duration: 200 }}>
58
50
  <slot />
59
51
  </div>
60
52
  {/if}
61
- </div>
53
+ </section>
@@ -3,12 +3,15 @@ declare const __propDef: {
3
3
  props: {
4
4
  value: string;
5
5
  class?: string | undefined;
6
+ classHeader?: string | undefined;
7
+ classBody?: string | undefined;
8
+ classTitle?: string | undefined;
6
9
  };
7
10
  events: {
8
11
  [evt: string]: CustomEvent<any>;
9
12
  };
10
13
  slots: {
11
- logo: {};
14
+ header: {};
12
15
  title: {};
13
16
  subtitle: {};
14
17
  default: {};
@@ -34,7 +34,6 @@ async function initTimePicker() {
34
34
  setup: (picker2) => {
35
35
  picker2.on("selected", (date1, date2) => {
36
36
  const start = `${getAbsoluteDate(date1.dateInstance)}T${getAbsoluteTime(period?.start)}`;
37
- console.log(start);
38
37
  period = {
39
38
  start: /* @__PURE__ */ new Date(
40
39
  `${getAbsoluteDate(date1.dateInstance)}T${getAbsoluteTime(period?.start)}`
@@ -43,7 +42,6 @@ async function initTimePicker() {
43
42
  `${getAbsoluteDate(date2.dateInstance)}T${getAbsoluteTime(period?.end, "23:59:00")}`
44
43
  )
45
44
  };
46
- console.log(period);
47
45
  dispatch("change", period);
48
46
  });
49
47
  }
@@ -53,7 +51,6 @@ const getAbsoluteDate = (date) => [date.getFullYear(), date.getMonth() + 1, date
53
51
  const getAbsoluteTime = (date, defaultTime = "00:00:00") => {
54
52
  if (!date)
55
53
  return defaultTime;
56
- console.log(date.getHours());
57
54
  return [date.getHours(), date.getMinutes(), date.getSeconds()].map((n) => n.toString().padStart(2, "0")).join(":");
58
55
  };
59
56
  </script>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "fuma",
3
- "version": "0.3.48",
3
+ "version": "0.3.51",
4
4
  "description": "My fullstack material build with sveltekit, daisyui, zod, prisma, lucia",
5
5
  "author": {
6
6
  "name": "Jonas Voisard",