lutra 0.1.46 → 0.1.47

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 (7) hide show
  1. package/dist/components/Dialog.svelte +8 -3
  2. package/dist/components/Modal.svelte +8 -3
  3. package/dist/components/ModalContent.svelte +8 -2
  4. package/dist/components/Popover.svelte +0 -1
  5. package/dist/components/ToastContainer.svelte +6 -6
  6. package/dist/css/2-base.css +0 -1
  7. package/package.json +1 -1
package/dist/components/Dialog.svelte CHANGED
@@ -60,14 +60,19 @@
60
60
  <style>
61
61
  .Dialog {
62
62
  margin: auto;
63
- inset: 1rem;
64
63
  padding: 0;
65
64
  border: var(--modal-border-size) var(--modal-border-style) var(--modal-border-color);
66
65
  border-radius: var(--modal-border-radius, var(--surface-border-radius));
67
66
  background: var(--modal-background, var(--surface-background));
68
67
  color: var(--text-color-p);
69
- max-width: min(calc(100vw - 2rem), 32rem);
70
- max-height: min(calc(100vh - 2rem), 80vh);
68
+ max-width: min(
69
+ var(--modal-max-width, 40rem),
70
+ calc(100vw - 2rem - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px))
71
+ );
72
+ max-height: min(
73
+ var(--modal-max-height, 80vh),
74
+ calc(100vh - 2rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px))
75
+ );
71
76
  box-shadow: var(--modal-shadow, var(--surface-shadow));
72
77
  }
73
78
 
package/dist/components/Modal.svelte CHANGED
@@ -213,15 +213,20 @@
213
213
 
214
214
  dialog.Modal {
215
215
  margin: auto;
216
- inset: 1rem;
217
216
  border: none;
218
217
  padding: 0;
219
218
  background: var(--modal-background, var(--surface-background));
220
219
  border-radius: var(--modal-border-radius, var(--surface-border-radius));
221
220
  box-shadow: var(--modal-shadow, var(--surface-shadow));
222
221
  width: var(--modal-width, fit-content);
223
- max-width: min(var(--modal-max-width, 40rem), calc(100vw - 2rem));
224
- max-height: min(var(--modal-max-height, 80vh), calc(100vh - 2rem));
222
+ max-width: min(
223
+ var(--modal-max-width, 40rem),
224
+ calc(100vw - 2rem - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px))
225
+ );
226
+ max-height: min(
227
+ var(--modal-max-height, 80vh),
228
+ calc(100vh - 2rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px))
229
+ );
225
230
  overflow: hidden;
226
231
  gap: var(--modal-gap);
227
232
  }
package/dist/components/ModalContent.svelte CHANGED
@@ -112,8 +112,14 @@
112
112
  grid-template-rows: 1fr auto;
113
113
  gap: var(--modal-gap);
114
114
  width: var(--modal-width, fit-content);
115
- max-width: min(var(--modal-max-width, 40rem), calc(100svw - 2rem));
116
- max-height: min(var(--modal-max-height, 80svh), calc(100svh - 2rem));
115
+ max-width: min(
116
+ var(--modal-max-width, 40rem),
117
+ calc(100svw - 2rem - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px))
118
+ );
119
+ max-height: min(
120
+ var(--modal-max-height, 80svh),
121
+ calc(100svh - 2rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px))
122
+ );
117
123
  background: var(--modal-background, var(--surface-background));
118
124
  border: var(--modal-border-size) var(--modal-border-style) var(--modal-border-color);
119
125
  border-radius: var(--modal-border-radius, var(--surface-border-radius));
package/dist/components/Popover.svelte CHANGED
@@ -66,7 +66,6 @@
66
66
  const anchorName = `--anchor-${id}`;
67
67
 
68
68
  let popoverEl: HTMLDivElement | null = $state(null);
69
- let triggerWrapperEl: HTMLElement | null = $state(null);
70
69
 
71
70
  // Handle external anchor (not using trigger snippet)
72
71
  $effect(() => {
package/dist/components/ToastContainer.svelte CHANGED
@@ -81,26 +81,26 @@
81
81
  }
82
82
 
83
83
  .top-left {
84
- inset: var(--toast-offset, 1rem) auto auto var(--toast-offset, 1rem);
84
+ inset: calc(var(--toast-offset, 1rem) + env(safe-area-inset-top, 0px)) auto auto calc(var(--toast-offset, 1rem) + env(safe-area-inset-left, 0px));
85
85
  }
86
86
  .top-center {
87
- inset: var(--toast-offset, 1rem) auto auto 50%;
87
+ inset: calc(var(--toast-offset, 1rem) + env(safe-area-inset-top, 0px)) auto auto 50%;
88
88
  translate: -50% 0;
89
89
  }
90
90
  .top-right {
91
- inset: var(--toast-offset, 1rem) var(--toast-offset, 1rem) auto auto;
91
+ inset: calc(var(--toast-offset, 1rem) + env(safe-area-inset-top, 0px)) calc(var(--toast-offset, 1rem) + env(safe-area-inset-right, 0px)) auto auto;
92
92
  }
93
93
  .bottom-left {
94
- inset: auto auto var(--toast-offset, 1rem) var(--toast-offset, 1rem);
94
+ inset: auto auto calc(var(--toast-offset, 1rem) + env(safe-area-inset-bottom, 0px)) calc(var(--toast-offset, 1rem) + env(safe-area-inset-left, 0px));
95
95
  flex-direction: column-reverse;
96
96
  }
97
97
  .bottom-center {
98
- inset: auto auto var(--toast-offset, 1rem) 50%;
98
+ inset: auto auto calc(var(--toast-offset, 1rem) + env(safe-area-inset-bottom, 0px)) 50%;
99
99
  translate: -50% 0;
100
100
  flex-direction: column-reverse;
101
101
  }
102
102
  .bottom-right {
103
- inset: auto var(--toast-offset, 1rem) var(--toast-offset, 1rem) auto;
103
+ inset: auto calc(var(--toast-offset, 1rem) + env(safe-area-inset-right, 0px)) calc(var(--toast-offset, 1rem) + env(safe-area-inset-bottom, 0px)) auto;
104
104
  flex-direction: column-reverse;
105
105
  }
106
106
 
package/dist/css/2-base.css CHANGED
@@ -364,7 +364,6 @@ input:disabled, textarea:disabled, select:disabled {
364
364
  */
365
365
  dialog.ProgrammaticModal {
366
366
  margin: auto;
367
- inset: 1rem;
368
367
  border: none;
369
368
  padding: 0;
370
369
  background: transparent;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "lutra",
3
- "version": "0.1.46",
3
+ "version": "0.1.47",
4
4
  "scripts": {
5
5
  "dev": "vite dev",
6
6
  "bump-and-publish:patch": "pnpm version:patch && pnpm build && npm publish",