mountain-ui 1.0.154 → 1.0.155
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.
- package/package.json +1 -1
- package/src/lib/registry/entityRegistry/components/FieldInput.svelte +3 -2
- package/src/lib/registry/fieldTypeRegistry/fieldTypes/Lines/Input.svelte +208 -98
- package/src/lib/registry/fieldTypeRegistry/fieldTypes/text/TextTextarea/Input.svelte +2 -1
- package/src/lib/registry/fieldTypeRegistry/fieldTypes/text/varchar/TextVarcharDefault/Input.svelte +2 -2
- package/src/lib/registry/fieldTypeRegistry/fieldTypes/text/varchar/TextVarcharEmail/Input.svelte +2 -2
- package/src/lib/registry/fieldTypeRegistry/fieldTypes/text/varchar/TextVarcharPassword/Input.svelte +2 -2
- package/src/lib/registry/fieldTypeRegistry/fieldTypes/text/varchar/TextVarcharPhone/Input.svelte +2 -2
- package/src/lib/registry/fieldTypeRegistry/fieldTypes/text/varchar/TextVarcharUrl/Input.svelte +2 -2
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "mountain-ui",
|
|
3
3
|
"private": false,
|
|
4
|
-
"version": "1.0.
|
|
4
|
+
"version": "1.0.155",
|
|
5
5
|
"description": "A comprehensive UI component library for ERP systems with field types, entities, and registry management built with Svelte",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"module": "index.js",
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import FieldTypeInput from '../../fieldTypeRegistry/components/FieldTypeInput.svelte';
|
|
3
3
|
import { entityRegistry } from '../registry.svelte';
|
|
4
4
|
|
|
5
|
-
let { id, entityId = null, onChange = () => {}, onChangeDetails = () => {}, ...props } = $props();
|
|
5
|
+
let { id, entityId = null, onChange = () => {}, onChangeDetails = () => {}, hideLabel = false, ...props } = $props();
|
|
6
6
|
|
|
7
7
|
const field = $derived(entityRegistry.selectField(id, entityId));
|
|
8
8
|
|
|
@@ -22,7 +22,8 @@
|
|
|
22
22
|
{...props}
|
|
23
23
|
id={$field.id}
|
|
24
24
|
entity_id={$field.entity_id}
|
|
25
|
-
label={$field.name}
|
|
25
|
+
label={hideLabel ? null : $field.name}
|
|
26
|
+
{...(hideLabel ? {placeholder:$field.name} : {})}
|
|
26
27
|
{...$field.props}
|
|
27
28
|
onChange={handleChange}
|
|
28
29
|
onChangeDetails={handleChangeDetails}
|
|
@@ -8,12 +8,17 @@
|
|
|
8
8
|
let {
|
|
9
9
|
value = $bindable(null),
|
|
10
10
|
label = '',
|
|
11
|
+
placeholder = '',
|
|
12
|
+
depth = 0,
|
|
11
13
|
required = false,
|
|
12
14
|
unique = false,
|
|
13
15
|
secret = false,
|
|
14
16
|
compact = false,
|
|
15
17
|
linkId = null,
|
|
16
18
|
columns = [],
|
|
19
|
+
headerIsHidden = false,
|
|
20
|
+
labelIsHidden = false,
|
|
21
|
+
number = false,
|
|
17
22
|
onChange = () => {},
|
|
18
23
|
onChangeDetails = () => {},
|
|
19
24
|
...props
|
|
@@ -162,12 +167,7 @@
|
|
|
162
167
|
|
|
163
168
|
<div class="table">
|
|
164
169
|
<div class="title">
|
|
165
|
-
<Label {label} {required} {secret} {unique}></Label>
|
|
166
|
-
|
|
167
170
|
<div class="right">
|
|
168
|
-
<Button onClick={handleAddLine}>
|
|
169
|
-
<h5>ajouter une rangée</h5>
|
|
170
|
-
</Button>
|
|
171
171
|
<IconButton size="24px" variant="ghost" onClick={handleToggleVisibility}>
|
|
172
172
|
<svg
|
|
173
173
|
width="24"
|
|
@@ -182,10 +182,32 @@
|
|
|
182
182
|
/>
|
|
183
183
|
</svg>
|
|
184
184
|
</IconButton>
|
|
185
|
+
<Label label={label ?? placeholder} {required} {secret} {unique}></Label>
|
|
186
|
+
</div>
|
|
187
|
+
|
|
188
|
+
<div class="right">
|
|
189
|
+
<IconButton onClick={handleAddLine}>
|
|
190
|
+
<svg
|
|
191
|
+
width="24"
|
|
192
|
+
height="24"
|
|
193
|
+
viewBox="0 0 24 24"
|
|
194
|
+
fill="none"
|
|
195
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
196
|
+
>
|
|
197
|
+
<path
|
|
198
|
+
d="M18 12.75H6C5.59 12.75 5.25 12.41 5.25 12C5.25 11.59 5.59 11.25 6 11.25H18C18.41 11.25 18.75 11.59 18.75 12C18.75 12.41 18.41 12.75 18 12.75Z"
|
|
199
|
+
fill="#292D32"
|
|
200
|
+
/>
|
|
201
|
+
<path
|
|
202
|
+
d="M12 18.75C11.59 18.75 11.25 18.41 11.25 18V6C11.25 5.59 11.59 5.25 12 5.25C12.41 5.25 12.75 5.59 12.75 6V18C12.75 18.41 12.41 18.75 12 18.75Z"
|
|
203
|
+
fill="#292D32"
|
|
204
|
+
/>
|
|
205
|
+
</svg>
|
|
206
|
+
</IconButton>
|
|
185
207
|
</div>
|
|
186
208
|
</div>
|
|
187
209
|
<div class="table-container" style="--column-number:{columns.length};" class:hidden={isHidden}>
|
|
188
|
-
{#if columns.length > 0 && columns.find(c=>(c.name??false) !== false)}
|
|
210
|
+
{#if !headerIsHidden && columns.length > 0 && columns.find((c) => (c.name ?? false) !== false)}
|
|
189
211
|
<div class="header">
|
|
190
212
|
{#each columns as column, columnIndex}
|
|
191
213
|
<div class="header-cell">
|
|
@@ -199,68 +221,123 @@
|
|
|
199
221
|
{#each table as line, lineIndex (line.id)}
|
|
200
222
|
<div class="line">
|
|
201
223
|
{#each columns as column, columnIndex}
|
|
202
|
-
<div class="cell">
|
|
224
|
+
<div class="cell" style="--depth:{depth};">
|
|
203
225
|
{#each column.rows as row, rowIndex}
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
226
|
+
{#if row.fieldId}
|
|
227
|
+
{#if number && rowIndex === 0 && columnIndex === 0}
|
|
228
|
+
<div class="cell-start">
|
|
229
|
+
<div class="number">
|
|
230
|
+
<h4>{lineIndex + 1}</h4>
|
|
231
|
+
</div>
|
|
232
|
+
<FieldInput
|
|
233
|
+
compact
|
|
234
|
+
hideLabel={labelIsHidden}
|
|
235
|
+
detailsCtx={table[lineIndex].detailsCtx}
|
|
236
|
+
ctx={table[lineIndex].ctx}
|
|
237
|
+
onChangeDetails={(value) => {
|
|
238
|
+
handleChangeDetails(lineIndex, row.fieldId, value);
|
|
239
|
+
}}
|
|
240
|
+
onChange={(value) => {
|
|
241
|
+
handleChange(lineIndex, row.fieldId, value);
|
|
242
|
+
}}
|
|
243
|
+
changeCtx={(fieldId, value) => {
|
|
244
|
+
handleChange(lineIndex, fieldId, value);
|
|
245
|
+
}}
|
|
246
|
+
id={row.fieldId}
|
|
247
|
+
value={table[lineIndex].ctx?.[row.fieldId] ?? null}
|
|
248
|
+
registerCalculation={(config) => {
|
|
249
|
+
handleRegisterCalculation(lineIndex, config);
|
|
250
|
+
}}
|
|
251
|
+
depth={depth+1}
|
|
252
|
+
></FieldInput>
|
|
253
|
+
</div>
|
|
254
|
+
{:else if rowIndex === 0 && columnIndex + 1 === columns.length}
|
|
255
|
+
<div class="cell-delete">
|
|
256
|
+
<FieldInput
|
|
257
|
+
compact
|
|
258
|
+
hideLabel={labelIsHidden}
|
|
259
|
+
detailsCtx={table[lineIndex].detailsCtx}
|
|
260
|
+
ctx={table[lineIndex].ctx}
|
|
261
|
+
onChangeDetails={(value) => {
|
|
262
|
+
handleChangeDetails(lineIndex, row.fieldId, value);
|
|
263
|
+
}}
|
|
264
|
+
onChange={(value) => {
|
|
265
|
+
handleChange(lineIndex, row.fieldId, value);
|
|
266
|
+
}}
|
|
267
|
+
changeCtx={(fieldId, value) => {
|
|
268
|
+
handleChange(lineIndex, fieldId, value);
|
|
269
|
+
}}
|
|
270
|
+
id={row.fieldId}
|
|
271
|
+
value={table[lineIndex].ctx?.[row.fieldId] ?? null}
|
|
272
|
+
registerCalculation={(config) => {
|
|
273
|
+
handleRegisterCalculation(lineIndex, config);
|
|
274
|
+
}}
|
|
275
|
+
depth={depth+1}
|
|
276
|
+
></FieldInput>
|
|
277
|
+
<div class="delete">
|
|
278
|
+
<IconButton
|
|
279
|
+
avoidRipple
|
|
280
|
+
variant="destructive"
|
|
281
|
+
onClick={() => {
|
|
282
|
+
handleDeleteLine(lineIndex);
|
|
283
|
+
}}
|
|
284
|
+
>
|
|
285
|
+
<svg
|
|
286
|
+
width="24"
|
|
287
|
+
height="24"
|
|
288
|
+
viewBox="0 0 24 24"
|
|
289
|
+
fill="none"
|
|
290
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
291
|
+
>
|
|
292
|
+
<path
|
|
293
|
+
d="M20.9997 6.72998C20.9797 6.72998 20.9497 6.72998 20.9197 6.72998C15.6297 6.19998 10.3497 5.99998 5.11967 6.52998L3.07967 6.72998C2.65967 6.76998 2.28967 6.46998 2.24967 6.04998C2.20967 5.62998 2.50967 5.26998 2.91967 5.22998L4.95967 5.02998C10.2797 4.48998 15.6697 4.69998 21.0697 5.22998C21.4797 5.26998 21.7797 5.63998 21.7397 6.04998C21.7097 6.43998 21.3797 6.72998 20.9997 6.72998Z"
|
|
294
|
+
fill="#292D32"
|
|
295
|
+
/>
|
|
296
|
+
<path
|
|
297
|
+
d="M8.50074 5.72C8.46074 5.72 8.42074 5.72 8.37074 5.71C7.97074 5.64 7.69074 5.25 7.76074 4.85L7.98074 3.54C8.14074 2.58 8.36074 1.25 10.6907 1.25H13.3107C15.6507 1.25 15.8707 2.63 16.0207 3.55L16.2407 4.85C16.3107 5.26 16.0307 5.65 15.6307 5.71C15.2207 5.78 14.8307 5.5 14.7707 5.1L14.5507 3.8C14.4107 2.93 14.3807 2.76 13.3207 2.76H10.7007C9.64074 2.76 9.62074 2.9 9.47074 3.79L9.24074 5.09C9.18074 5.46 8.86074 5.72 8.50074 5.72Z"
|
|
298
|
+
fill="#292D32"
|
|
299
|
+
/>
|
|
300
|
+
<path
|
|
301
|
+
d="M15.2104 22.7501H8.79039C5.30039 22.7501 5.16039 20.8201 5.05039 19.2601L4.40039 9.19007C4.37039 8.78007 4.69039 8.42008 5.10039 8.39008C5.52039 8.37008 5.87039 8.68008 5.90039 9.09008L6.55039 19.1601C6.66039 20.6801 6.70039 21.2501 8.79039 21.2501H15.2104C17.3104 21.2501 17.3504 20.6801 17.4504 19.1601L18.1004 9.09008C18.1304 8.68008 18.4904 8.37008 18.9004 8.39008C19.3104 8.42008 19.6304 8.77007 19.6004 9.19007L18.9504 19.2601C18.8404 20.8201 18.7004 22.7501 15.2104 22.7501Z"
|
|
302
|
+
fill="#292D32"
|
|
303
|
+
/>
|
|
304
|
+
<path
|
|
305
|
+
d="M13.6601 17.25H10.3301C9.92008 17.25 9.58008 16.91 9.58008 16.5C9.58008 16.09 9.92008 15.75 10.3301 15.75H13.6601C14.0701 15.75 14.4101 16.09 14.4101 16.5C14.4101 16.91 14.0701 17.25 13.6601 17.25Z"
|
|
306
|
+
fill="#292D32"
|
|
307
|
+
/>
|
|
308
|
+
<path
|
|
309
|
+
d="M14.5 13.25H9.5C9.09 13.25 8.75 12.91 8.75 12.5C8.75 12.09 9.09 11.75 9.5 11.75H14.5C14.91 11.75 15.25 12.09 15.25 12.5C15.25 12.91 14.91 13.25 14.5 13.25Z"
|
|
310
|
+
fill="#292D32"
|
|
311
|
+
/>
|
|
312
|
+
</svg>
|
|
313
|
+
</IconButton>
|
|
314
|
+
</div>
|
|
315
|
+
</div>
|
|
316
|
+
{:else}
|
|
317
|
+
<FieldInput
|
|
318
|
+
compact
|
|
319
|
+
hideLabel={labelIsHidden}
|
|
320
|
+
detailsCtx={table[lineIndex].detailsCtx}
|
|
321
|
+
ctx={table[lineIndex].ctx}
|
|
322
|
+
onChangeDetails={(value) => {
|
|
323
|
+
handleChangeDetails(lineIndex, row.fieldId, value);
|
|
324
|
+
}}
|
|
325
|
+
onChange={(value) => {
|
|
326
|
+
handleChange(lineIndex, row.fieldId, value);
|
|
327
|
+
}}
|
|
328
|
+
changeCtx={(fieldId, value) => {
|
|
329
|
+
handleChange(lineIndex, fieldId, value);
|
|
330
|
+
}}
|
|
331
|
+
id={row.fieldId}
|
|
332
|
+
value={table[lineIndex].ctx?.[row.fieldId] ?? null}
|
|
333
|
+
registerCalculation={(config) => {
|
|
334
|
+
handleRegisterCalculation(lineIndex, config);
|
|
335
|
+
}}
|
|
336
|
+
depth={depth+1}
|
|
337
|
+
></FieldInput>
|
|
338
|
+
{/if}
|
|
339
|
+
{/if}
|
|
223
340
|
{/each}
|
|
224
|
-
{#if columnIndex + 1 === columns.length}
|
|
225
|
-
<div class="delete">
|
|
226
|
-
<IconButton
|
|
227
|
-
avoidRipple
|
|
228
|
-
variant="destructive"
|
|
229
|
-
onClick={() => {
|
|
230
|
-
handleDeleteLine(lineIndex);
|
|
231
|
-
}}
|
|
232
|
-
>
|
|
233
|
-
<svg
|
|
234
|
-
width="24"
|
|
235
|
-
height="24"
|
|
236
|
-
viewBox="0 0 24 24"
|
|
237
|
-
fill="none"
|
|
238
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
239
|
-
>
|
|
240
|
-
<path
|
|
241
|
-
d="M20.9997 6.72998C20.9797 6.72998 20.9497 6.72998 20.9197 6.72998C15.6297 6.19998 10.3497 5.99998 5.11967 6.52998L3.07967 6.72998C2.65967 6.76998 2.28967 6.46998 2.24967 6.04998C2.20967 5.62998 2.50967 5.26998 2.91967 5.22998L4.95967 5.02998C10.2797 4.48998 15.6697 4.69998 21.0697 5.22998C21.4797 5.26998 21.7797 5.63998 21.7397 6.04998C21.7097 6.43998 21.3797 6.72998 20.9997 6.72998Z"
|
|
242
|
-
fill="#292D32"
|
|
243
|
-
/>
|
|
244
|
-
<path
|
|
245
|
-
d="M8.50074 5.72C8.46074 5.72 8.42074 5.72 8.37074 5.71C7.97074 5.64 7.69074 5.25 7.76074 4.85L7.98074 3.54C8.14074 2.58 8.36074 1.25 10.6907 1.25H13.3107C15.6507 1.25 15.8707 2.63 16.0207 3.55L16.2407 4.85C16.3107 5.26 16.0307 5.65 15.6307 5.71C15.2207 5.78 14.8307 5.5 14.7707 5.1L14.5507 3.8C14.4107 2.93 14.3807 2.76 13.3207 2.76H10.7007C9.64074 2.76 9.62074 2.9 9.47074 3.79L9.24074 5.09C9.18074 5.46 8.86074 5.72 8.50074 5.72Z"
|
|
246
|
-
fill="#292D32"
|
|
247
|
-
/>
|
|
248
|
-
<path
|
|
249
|
-
d="M15.2104 22.7501H8.79039C5.30039 22.7501 5.16039 20.8201 5.05039 19.2601L4.40039 9.19007C4.37039 8.78007 4.69039 8.42008 5.10039 8.39008C5.52039 8.37008 5.87039 8.68008 5.90039 9.09008L6.55039 19.1601C6.66039 20.6801 6.70039 21.2501 8.79039 21.2501H15.2104C17.3104 21.2501 17.3504 20.6801 17.4504 19.1601L18.1004 9.09008C18.1304 8.68008 18.4904 8.37008 18.9004 8.39008C19.3104 8.42008 19.6304 8.77007 19.6004 9.19007L18.9504 19.2601C18.8404 20.8201 18.7004 22.7501 15.2104 22.7501Z"
|
|
250
|
-
fill="#292D32"
|
|
251
|
-
/>
|
|
252
|
-
<path
|
|
253
|
-
d="M13.6601 17.25H10.3301C9.92008 17.25 9.58008 16.91 9.58008 16.5C9.58008 16.09 9.92008 15.75 10.3301 15.75H13.6601C14.0701 15.75 14.4101 16.09 14.4101 16.5C14.4101 16.91 14.0701 17.25 13.6601 17.25Z"
|
|
254
|
-
fill="#292D32"
|
|
255
|
-
/>
|
|
256
|
-
<path
|
|
257
|
-
d="M14.5 13.25H9.5C9.09 13.25 8.75 12.91 8.75 12.5C8.75 12.09 9.09 11.75 9.5 11.75H14.5C14.91 11.75 15.25 12.09 15.25 12.5C15.25 12.91 14.91 13.25 14.5 13.25Z"
|
|
258
|
-
fill="#292D32"
|
|
259
|
-
/>
|
|
260
|
-
</svg>
|
|
261
|
-
</IconButton>
|
|
262
|
-
</div>
|
|
263
|
-
{/if}
|
|
264
341
|
</div>
|
|
265
342
|
{/each}
|
|
266
343
|
</div>
|
|
@@ -359,25 +436,40 @@
|
|
|
359
436
|
.table {
|
|
360
437
|
width: 100%;
|
|
361
438
|
height: fit-content;
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
border-left:
|
|
439
|
+
}
|
|
440
|
+
|
|
441
|
+
.table:global(:has(.table) .table) {
|
|
442
|
+
border-left: 0px;
|
|
443
|
+
border-radius: 0px;
|
|
444
|
+
border: 0px;
|
|
445
|
+
border-top: 1px solid var(--stroke);
|
|
446
|
+
}
|
|
447
|
+
|
|
448
|
+
.table:global(:has(.table) .table) .title {
|
|
449
|
+
padding-left: var(--pad-xxl);
|
|
450
|
+
}
|
|
451
|
+
.table:global(:has(.table) .table) .body {
|
|
452
|
+
padding-left: var(--pad-xxl);
|
|
366
453
|
}
|
|
367
454
|
|
|
368
455
|
.title {
|
|
369
456
|
display: flex;
|
|
370
457
|
align-items: center;
|
|
371
458
|
justify-content: space-between;
|
|
372
|
-
padding: var(--pad-
|
|
459
|
+
padding: var(--pad-s);
|
|
373
460
|
width: 100%;
|
|
374
461
|
}
|
|
375
|
-
|
|
462
|
+
.table:has( .hidden) .title {
|
|
376
463
|
border-bottom: 1px solid var(--bg-blur);
|
|
377
|
-
|
|
378
|
-
|
|
464
|
+
}
|
|
465
|
+
|
|
466
|
+
.table-container:global( .title) {
|
|
379
467
|
background-color: var(--bg-1);
|
|
380
|
-
|
|
468
|
+
position: sticky;
|
|
469
|
+
top: 45px;
|
|
470
|
+
z-index: 3;
|
|
471
|
+
border-bottom: 1px solid var(--bg-blur);
|
|
472
|
+
}
|
|
381
473
|
|
|
382
474
|
.right {
|
|
383
475
|
display: flex;
|
|
@@ -385,14 +477,6 @@
|
|
|
385
477
|
column-gap: var(--pad-m);
|
|
386
478
|
}
|
|
387
479
|
|
|
388
|
-
:global(.table-container .line:has(> .cell > .delete .button:hover)) {
|
|
389
|
-
background-color: var(--red-b);
|
|
390
|
-
}
|
|
391
|
-
|
|
392
|
-
:global(.table-container:not(:has(.line:nth-child(2)))) .delete {
|
|
393
|
-
display: none;
|
|
394
|
-
}
|
|
395
|
-
|
|
396
480
|
.delete {
|
|
397
481
|
display: flex;
|
|
398
482
|
justify-content: end;
|
|
@@ -401,30 +485,56 @@
|
|
|
401
485
|
|
|
402
486
|
.table-container.hidden {
|
|
403
487
|
display: none;
|
|
404
|
-
|
|
488
|
+
overflow: hidden;
|
|
405
489
|
}
|
|
406
490
|
|
|
407
491
|
.header {
|
|
408
492
|
display: grid;
|
|
409
493
|
grid-template-columns: repeat(var(--column-number), 1fr);
|
|
410
|
-
|
|
411
|
-
padding: var(--pad-m);
|
|
494
|
+
padding: var(--pad-m);
|
|
412
495
|
}
|
|
413
496
|
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
497
|
+
.body {
|
|
498
|
+
display: flex;
|
|
499
|
+
flex-direction: column;
|
|
500
|
+
row-gap: var(--pad-s);
|
|
501
|
+
}
|
|
419
502
|
|
|
420
|
-
|
|
421
|
-
|
|
503
|
+
.line {
|
|
504
|
+
display: grid;
|
|
422
505
|
grid-template-columns: repeat(var(--column-number), 1fr);
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
506
|
+
border-bottom: 1px solid var(--stroke);
|
|
507
|
+
padding-top: var(--pad-xs);
|
|
508
|
+
border-radius: var(--radius-m);
|
|
509
|
+
overflow: clip;
|
|
510
|
+
border: 1px solid var(--stroke);
|
|
511
|
+
border-left: 3px solid var(--accent);
|
|
512
|
+
}
|
|
513
|
+
|
|
514
|
+
:global(.line:has(> .cell > .cell-delete .delete .button:hover)) {
|
|
515
|
+
background-color: var(--red-b);
|
|
516
|
+
}
|
|
517
|
+
|
|
518
|
+
.table .body .line:global(:has(.table) .table .body .line) {
|
|
519
|
+
border: 0px;
|
|
520
|
+
}
|
|
521
|
+
|
|
522
|
+
.cell-delete {
|
|
523
|
+
display: grid;
|
|
524
|
+
grid-template-columns: 1fr 45px;
|
|
525
|
+
}
|
|
526
|
+
|
|
527
|
+
.cell-start {
|
|
528
|
+
display: grid;
|
|
529
|
+
grid-template-columns: 24px 1fr;
|
|
428
530
|
}
|
|
429
531
|
|
|
532
|
+
.number {
|
|
533
|
+
display: flex;
|
|
534
|
+
align-items: center;
|
|
535
|
+
justify-content: center;
|
|
536
|
+
}
|
|
537
|
+
.number h4 {
|
|
538
|
+
color: hsl(calc(var(--depth) * 45), 70%, 60%);
|
|
539
|
+
}
|
|
430
540
|
</style>
|
|
@@ -11,11 +11,12 @@
|
|
|
11
11
|
required,
|
|
12
12
|
defaultValue = '',
|
|
13
13
|
value = defaultValue,
|
|
14
|
+
placeholder = "votre texte",
|
|
14
15
|
...props
|
|
15
16
|
} = $props();
|
|
16
17
|
</script>
|
|
17
18
|
|
|
18
19
|
<Line {compact}>
|
|
19
20
|
<Label {unique} {secret} {label} {required}></Label>
|
|
20
|
-
<TextArea {...props} placeholder
|
|
21
|
+
<TextArea {...props} {placeholder} bind:value {required}></TextArea>
|
|
21
22
|
</Line>
|
package/src/lib/registry/fieldTypeRegistry/fieldTypes/text/varchar/TextVarcharDefault/Input.svelte
CHANGED
|
@@ -3,12 +3,12 @@
|
|
|
3
3
|
import Line from '../../../../components/Line.svelte';
|
|
4
4
|
import FieldTypeInputText from '../FieldTypeInputText.svelte';
|
|
5
5
|
|
|
6
|
-
let { label, unique = false, secret = false, compact = false, required, ...props } = $props();
|
|
6
|
+
let { label, unique = false, secret = false, compact = false, placeholder = "votre texte", required, ...props } = $props();
|
|
7
7
|
</script>
|
|
8
8
|
|
|
9
9
|
<Line {compact}>
|
|
10
10
|
{#if label}
|
|
11
11
|
<Label {unique} {secret} {label} {required}></Label>
|
|
12
12
|
{/if}
|
|
13
|
-
<FieldTypeInputText {...props} placeholder
|
|
13
|
+
<FieldTypeInputText {...props} {placeholder} {required}></FieldTypeInputText>
|
|
14
14
|
</Line>
|
package/src/lib/registry/fieldTypeRegistry/fieldTypes/text/varchar/TextVarcharEmail/Input.svelte
CHANGED
|
@@ -2,12 +2,12 @@
|
|
|
2
2
|
import Label from '../../../../components/Label.svelte';
|
|
3
3
|
import Line from '../../../../components/Line.svelte';
|
|
4
4
|
import FieldTypeInputText from '../FieldTypeInputText.svelte';
|
|
5
|
-
let { label, unique = false, secret = false, compact = false, required, ...props } = $props();
|
|
5
|
+
let { label, unique = false, secret = false, compact = false, placeholder="votre texte", required, ...props } = $props();
|
|
6
6
|
</script>
|
|
7
7
|
|
|
8
8
|
<Line {compact}>
|
|
9
9
|
{#if label}
|
|
10
10
|
<Label {unique} {secret} {label} {required}></Label>
|
|
11
11
|
{/if}
|
|
12
|
-
<FieldTypeInputText {...props} placeholder
|
|
12
|
+
<FieldTypeInputText {...props} {placeholder} {required}></FieldTypeInputText>
|
|
13
13
|
</Line>
|
package/src/lib/registry/fieldTypeRegistry/fieldTypes/text/varchar/TextVarcharPassword/Input.svelte
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
import Line from '../../../../components/Line.svelte';
|
|
4
4
|
import { Input } from 'hamzus-ui';
|
|
5
5
|
|
|
6
|
-
let { label, unique = false, secret = false, compact = false, required, ...props } = $props();
|
|
6
|
+
let { label, unique = false, secret = false, compact = false, placeholder="Exemple1234.", required, ...props } = $props();
|
|
7
7
|
</script>
|
|
8
8
|
|
|
9
9
|
<Line {compact}>
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
]}
|
|
36
36
|
{...props}
|
|
37
37
|
type="password"
|
|
38
|
-
placeholder
|
|
38
|
+
{placeholder}
|
|
39
39
|
{required}
|
|
40
40
|
></Input>
|
|
41
41
|
</Line>
|
package/src/lib/registry/fieldTypeRegistry/fieldTypes/text/varchar/TextVarcharPhone/Input.svelte
CHANGED
|
@@ -2,12 +2,12 @@
|
|
|
2
2
|
import Label from '../../../../components/Label.svelte';
|
|
3
3
|
import Line from '../../../../components/Line.svelte';
|
|
4
4
|
import FieldTypeInputText from '../FieldTypeInputText.svelte';
|
|
5
|
-
let { label, unique = false, secret = false, compact = false, required, ...props } = $props();
|
|
5
|
+
let { label, unique = false, secret = false, compact = false, placeholder="votre texte", required, ...props } = $props();
|
|
6
6
|
</script>
|
|
7
7
|
|
|
8
8
|
<Line {compact}>
|
|
9
9
|
{#if label}
|
|
10
10
|
<Label {unique} {secret} {label} {required}></Label>
|
|
11
11
|
{/if}
|
|
12
|
-
<FieldTypeInputText {...props} placeholder
|
|
12
|
+
<FieldTypeInputText {...props} {placeholder} {required}></FieldTypeInputText>
|
|
13
13
|
</Line>
|
package/src/lib/registry/fieldTypeRegistry/fieldTypes/text/varchar/TextVarcharUrl/Input.svelte
CHANGED
|
@@ -2,12 +2,12 @@
|
|
|
2
2
|
import Label from '../../../../components/Label.svelte';
|
|
3
3
|
import Line from '../../../../components/Line.svelte';
|
|
4
4
|
import FieldTypeInputText from '../FieldTypeInputText.svelte';
|
|
5
|
-
let { label, unique = false, secret = false, compact = false, required, ...props } = $props();
|
|
5
|
+
let { label, unique = false, secret = false, compact = false, placeholder ="votre texte", required, ...props } = $props();
|
|
6
6
|
</script>
|
|
7
7
|
|
|
8
8
|
<Line {compact}>
|
|
9
9
|
{#if label}
|
|
10
10
|
<Label {unique} {secret} {label} {required}></Label>
|
|
11
11
|
{/if}
|
|
12
|
-
<FieldTypeInputText {...props} placeholder
|
|
12
|
+
<FieldTypeInputText {...props} {placeholder} {required}></FieldTypeInputText>
|
|
13
13
|
</Line>
|