rimecms 0.26.0 → 0.26.2

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 (12) hide show
  1. package/dist/fields/email/component/Email.svelte +1 -9
  2. package/dist/fields/relation/component/upload/Browse.svelte +70 -22
  3. package/dist/fields/text/component/Text.svelte +1 -14
  4. package/dist/panel/components/sections/collection/Empty.svelte +6 -6
  5. package/dist/panel/components/sections/collection/Empty.svelte.d.ts +2 -2
  6. package/dist/panel/components/sections/collection/grid/CollectionGrid.svelte +1 -1
  7. package/dist/panel/components/sections/collection/list/CollectionList.svelte +1 -1
  8. package/dist/panel/components/sections/collection/tree/CollectionTree.svelte +1 -1
  9. package/dist/panel/components/ui/dialog/dialog-content.css +2 -2
  10. package/dist/panel/components/ui/dialog/dialog-content.svelte +0 -4
  11. package/dist/panel/components/ui/input/input.svelte +1 -1
  12. package/package.json +1 -1
package/dist/fields/email/component/Email.svelte CHANGED
@@ -29,8 +29,8 @@
29
29
  >
30
30
  <Field.Label {config} for={path || config.name} />
31
31
  <div class="rz-email-field-wrapper">
32
- <Mail class="rz-email-field__icon" size="12" />
33
32
  <Input
33
+ icon={Mail}
34
34
  id={path || config.name}
35
35
  name={path || config.name}
36
36
  autocomplete="off"
@@ -63,19 +63,11 @@
63
63
  position: relative;
64
64
  display: flex;
65
65
  align-items: center;
66
- --rz-input-padding-x: 2rem;
67
66
 
68
67
  :global(.rz-button) {
69
68
  position: absolute;
70
69
  right: var(--rz-size-1-5);
71
70
  top: var(--rz-size-1-5);
72
71
  }
73
-
74
- :global(.rz-email-field__icon) {
75
- opacity: 0.37;
76
- position: absolute;
77
- left: 0.75rem;
78
- top: calc(50% - 6px);
79
- }
80
72
  }
81
73
  </style>
package/dist/fields/relation/component/upload/Browse.svelte CHANGED
@@ -3,6 +3,7 @@
3
3
  import type { Directory } from '../../../../core/collections/upload/upload';
4
4
  import { t__ } from '../../../../core/i18n/index.js';
5
5
  import { withDirectoriesSuffix } from '../../../../core/naming.js';
6
+ import Empty from '../../../../panel/components/sections/collection/Empty.svelte';
6
7
  import Folder from '../../../../panel/components/sections/collection/folder/Folder.svelte';
7
8
  import Button from '../../../../panel/components/ui/button/button.svelte';
8
9
  import CardDocument from '../../../../panel/components/ui/card-document/card-document.svelte';
@@ -119,60 +120,107 @@
119
120
  </div>
120
121
 
121
122
  <!-- Grid -->
122
- <div class="rz-relation-browse__grid">
123
- {#if parentPath}
124
- <button class="rz-browse__folder" onclick={() => (path = parentPath)}>
125
- <Folder>...</Folder>
126
- </button>
127
- {/if}
128
-
129
- {#if !isFiltered}
130
- {#if folders.data}
131
- {#each folders.data.docs as doc (doc.id)}
132
- <button class="rz-browse__folder" onclick={() => (path = doc.id)}>
133
- <Folder>{doc.name}</Folder>
134
- </button>
135
- {/each}
123
+ <div class="rz-relation-browse__grid-wrapper">
124
+ <div class="rz-relation-browse__grid">
125
+ {#if isFiltered && files.data?.docs.length === 0}
126
+ <Empty {config} />
136
127
  {/if}
137
- {/if}
138
128
 
139
- {#if files.data}
140
- {#each files.data.docs as doc (doc.id)}
141
- <button onclick={() => addValue(doc.id)}>
142
- <CardDocument {doc} />
129
+ {#if parentPath}
130
+ <button class="rz-browse__folder" onclick={() => (path = parentPath)}>
131
+ <Folder>...</Folder>
143
132
  </button>
144
- {/each}
145
- {/if}
133
+ {/if}
134
+
135
+ {#if !isFiltered}
136
+ {#if folders.data}
137
+ {#each folders.data.docs as doc (doc.id)}
138
+ <button class="rz-browse__folder" onclick={() => (path = doc.id)}>
139
+ <Folder>{doc.name}</Folder>
140
+ </button>
141
+ {/each}
142
+ {/if}
143
+ {/if}
144
+
145
+ {#if files.data}
146
+ {#each files.data.docs as doc (doc.id)}
147
+ <button onclick={() => addValue(doc.id)}>
148
+ <CardDocument {doc} />
149
+ </button>
150
+ {/each}
151
+ {/if}
152
+ </div>
146
153
  </div>
147
154
  </div>
148
155
  </Dialog.Content>
149
156
  </Dialog.Root>
150
157
 
151
158
  <style>
159
+ .rz-relation-browse {
160
+ display: flex;
161
+ flex-direction: column;
162
+ height: 100%;
163
+ min-height: 0;
164
+
165
+ :global {
166
+ .rz-no-document {
167
+ grid-column: 1 / -1;
168
+ }
169
+ }
170
+ }
171
+
152
172
  .rz-relation-browse__header {
173
+ flex-shrink: 0;
153
174
  display: flex;
154
175
  align-items: center;
155
176
  gap: var(--rz-size-4);
156
177
  padding-bottom: var(--rz-size-4);
157
178
  border-bottom: var(--rz-border);
158
- margin-bottom: var(--rz-size-4);
179
+
180
+ padding-right: var(--rz-size-8);
181
+ position: sticky;
182
+ top: 0;
183
+ background-color: hsl(var(--rz-color-bg));
184
+ z-index: 10;
159
185
 
160
186
  :global {
161
187
  .rz-dropdown-item {
162
188
  padding: var(--rz-size-3) var(--rz-size-3);
163
189
  }
190
+ .rz-input-wrapper {
191
+ max-width: 50%;
192
+ }
164
193
  .rz-input {
165
194
  height: var(--rz-size-9);
166
195
  }
167
196
  }
168
197
  }
169
198
 
199
+ .rz-relation-browse__grid-wrapper {
200
+ overflow-y: scroll;
201
+ flex: 1;
202
+ min-height: 0;
203
+ }
204
+
170
205
  .rz-relation-browse__grid {
206
+ padding-top: var(--rz-size-4);
171
207
  display: grid;
172
208
  align-self: start;
173
209
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
174
210
  grid-auto-rows: auto;
175
211
  gap: var(--rz-size-4);
212
+ width: 100%;
213
+
214
+ &::after {
215
+ content: '';
216
+ height: 5rem;
217
+ position: absolute;
218
+ left: 0;
219
+ bottom: 0;
220
+ right: 0;
221
+ z-index: 2;
222
+ background-image: linear-gradient(to top, hsl(var(--rz-color-bg)), transparent);
223
+ }
176
224
  }
177
225
 
178
226
  .rz-browse__folder {
package/dist/fields/text/component/Text.svelte CHANGED
@@ -21,11 +21,9 @@
21
21
  >
22
22
  <Field.Label {config} for={path || config.name} />
23
23
  <div class="rz-text-field__input-wrapper">
24
- {#if Icon}
25
- <Icon size="12" />
26
- {/if}
27
24
  <Input
28
25
  id={path || config.name}
26
+ icon={Icon}
29
27
  autocomplete="off"
30
28
  name={path || config.name}
31
29
  placeholder={config.placeholder || capitalize(config.name)}
@@ -59,22 +57,11 @@
59
57
  display: flex;
60
58
  align-items: center;
61
59
 
62
- :global(.rz-input) {
63
- padding: 0 0 0 2rem;
64
- }
65
-
66
60
  :global(.rz-button) {
67
61
  position: absolute;
68
62
  right: var(--rz-size-1-5);
69
63
  top: var(--rz-size-1-5);
70
64
  }
71
-
72
- :global(svg) {
73
- opacity: 0.5;
74
- position: absolute;
75
- left: 0.75rem;
76
- top: calc(50% - 6px);
77
- }
78
65
  }
79
66
  }
80
67
  </style>
package/dist/panel/components/sections/collection/Empty.svelte CHANGED
@@ -1,21 +1,21 @@
1
1
  <script lang="ts">
2
- import type { CollectionContext } from '../../../context/collection.svelte.js';
2
+ import type { BuiltCollection } from '../../../../types';
3
3
  import { t__ } from '../../../../core/i18n/index.js';
4
4
 
5
- type Props = { collection: CollectionContext };
6
- const { collection }: Props = $props();
5
+ type Props = { config: BuiltCollection };
6
+ const { config }: Props = $props();
7
7
  </script>
8
8
 
9
- <div class="rz-page-collection__empty">
9
+ <div class="rz-no-document">
10
10
  <div>
11
11
  <span>
12
- {collection.config.label.none || t__(`common.no_document`, collection.config.label.singular)}
12
+ {config.label.none || t__(`common.no_document`, config.label.singular)}
13
13
  </span>
14
14
  </div>
15
15
  </div>
16
16
 
17
17
  <style>
18
- .rz-page-collection__empty {
18
+ .rz-no-document {
19
19
  height: var(--rz-input-height);
20
20
  background-color: light-dark(hsl(var(--rz-gray-16)), hsl(var(--rz-gray-3)));
21
21
  display: flex;
package/dist/panel/components/sections/collection/Empty.svelte.d.ts CHANGED
@@ -1,6 +1,6 @@
1
- import type { CollectionContext } from '../../../context/collection.svelte.js';
1
+ import type { BuiltCollection } from '../../../../types';
2
2
  type Props = {
3
- collection: CollectionContext;
3
+ config: BuiltCollection;
4
4
  };
5
5
  declare const Empty: import("svelte").Component<Props, {}, "">;
6
6
  type Empty = ReturnType<typeof Empty>;
package/dist/panel/components/sections/collection/grid/CollectionGrid.svelte CHANGED
@@ -99,7 +99,7 @@
99
99
  </div>
100
100
  </div>
101
101
  {:else}
102
- <Empty {collection} />
102
+ <Empty config={collection.config} />
103
103
  {/if}
104
104
 
105
105
  <style>
package/dist/panel/components/sections/collection/list/CollectionList.svelte CHANGED
@@ -48,7 +48,7 @@
48
48
  {/each}
49
49
  </div>
50
50
  {:else}
51
- <Empty {collection} />
51
+ <Empty config={collection.config} />
52
52
  {/if}
53
53
 
54
54
  <style>
package/dist/panel/components/sections/collection/tree/CollectionTree.svelte CHANGED
@@ -104,7 +104,7 @@
104
104
  {/each}
105
105
  </div>
106
106
  {:else}
107
- <Empty {collection} />
107
+ <Empty config={collection.config} />
108
108
  {/if}
109
109
  {/key}
110
110
 
package/dist/panel/components/ui/dialog/dialog-content.css CHANGED
@@ -17,8 +17,8 @@
17
17
 
18
18
  &.rz-dialog-content--xl {
19
19
  height: calc(100vh - 4 * var(--gutter));
20
- overflow-y: auto;
21
20
  top: 50%;
21
+ grid-template-rows: 1fr;
22
22
  }
23
23
  }
24
24
 
@@ -45,11 +45,11 @@
45
45
  border-radius: var(--rz-radius-sm);
46
46
  opacity: 0.7;
47
47
  transition: opacity 0.2s;
48
+ z-index: 20;
48
49
  }
49
50
 
50
51
  [data-dialog-close]:focus {
51
52
  outline: none;
52
- /* --rz-ring-offset-2: 2px; */
53
53
  box-shadow:
54
54
  0 0 0 var(--rz-ring-offset, 0px) hsl(var(--rz-ring-offset-bg, var(--rz-gray-6)) / 1),
55
55
  0 0 0 calc(var(--rz-ring-offset, 0px) + 1px) hsl(var(--rz-color-ring) / var(--rz-ring-opacity, 1));
package/dist/panel/components/ui/dialog/dialog-content.svelte CHANGED
@@ -1,5 +1,4 @@
1
1
  <script lang="ts">
2
- import { X } from '@lucide/svelte';
3
2
  import {
4
3
  Dialog as DialogPrimitive,
5
4
  type DialogContentSnippetProps,
@@ -35,9 +34,6 @@
35
34
  class="rz-dialog-content rz-dialog-content--{size} {className}"
36
35
  {...restProps}
37
36
  >
38
- <Dialog.Close>
39
- <X size="18" />
40
- </Dialog.Close>
41
37
  {@render children?.()}
42
38
  </DialogPrimitive.Content>
43
39
  </Dialog.Portal>
package/dist/panel/components/ui/input/input.svelte CHANGED
@@ -99,7 +99,6 @@ input.rz-input:is(:-webkit-autofill, :autofill):focus {
99
99
 
100
100
  .rz-input:focus-visible {
101
101
  outline: none;
102
- /* --rz-ring-offset: 1px; */
103
102
  box-shadow:
104
103
  0 0 0 var(--rz-ring-offset, 0px) hsl(var(--rz-ring-offset-bg, var(--rz-gray-6)) / 1),
105
104
  0 0 0 calc(var(--rz-ring-offset, 0px) + 1px) hsl(var(--rz-color-ring) / var(--rz-ring-opacity, 1));
@@ -114,6 +113,7 @@ input.rz-input:is(:-webkit-autofill, :autofill):focus {
114
113
 
115
114
  .rz-input-wrapper {
116
115
  position: relative;
116
+ width: 100%;
117
117
 
118
118
  .rz-input__icon {
119
119
  position: absolute;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "rimecms",
3
- "version": "0.26.0",
3
+ "version": "0.26.2",
4
4
  "homepage": "https://github.com/bienbiendev/rime",
5
5
  "scripts": {
6
6
  "dev": "vite dev",