@mhmo91/schmancy 0.5.31 → 0.5.33
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/ai/navigation-rail.md +104 -21
- package/dist/ai/navigation-rail.md +104 -21
- package/dist/{avatar-DVvQCuqb.cjs → avatar-8TnYDr70.cjs} +2 -2
- package/dist/{avatar-DVvQCuqb.cjs.map → avatar-8TnYDr70.cjs.map} +1 -1
- package/dist/{avatar-vN5sPaPb.js → avatar-D2FqPXk4.js} +2 -2
- package/dist/{avatar-vN5sPaPb.js.map → avatar-D2FqPXk4.js.map} +1 -1
- package/dist/badge.cjs +1 -1
- package/dist/badge.js +1 -1
- package/dist/content-drawer.cjs +1 -1
- package/dist/content-drawer.js +1 -1
- package/dist/{icon-B72X_AQX.js → icon-CCMpTJTp.js} +8 -9
- package/dist/icon-CCMpTJTp.js.map +1 -0
- package/dist/icon-DebIySqv.cjs +49 -0
- package/dist/icon-DebIySqv.cjs.map +1 -0
- package/dist/icons.cjs +1 -1
- package/dist/icons.js +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.js +2 -2
- package/dist/nav-drawer.cjs +1 -1
- package/dist/nav-drawer.js +1 -1
- package/dist/navigation-bar.cjs +1 -1
- package/dist/navigation-bar.js +1 -1
- package/dist/teleport.cjs +1 -1
- package/dist/teleport.js +1 -1
- package/package.json +1 -1
- package/types/src/icons/icon.d.ts +3 -0
- package/dist/icon-B72X_AQX.js.map +0 -1
- package/dist/icon-DbIBlAjy.cjs +0 -49
- package/dist/icon-DbIBlAjy.cjs.map +0 -1
package/ai/navigation-rail.md
CHANGED
|
@@ -50,6 +50,7 @@ import { SchmancyNavigationRail, SchmancyNavigationRailItem } from '@schmancy'
|
|
|
50
50
|
| `alignment` | `'top' \| 'center' \| 'bottom'` | `'top'` | Vertical alignment of navigation items |
|
|
51
51
|
| `showTooltips` | `boolean` | `true` | Show tooltips when labels are hidden |
|
|
52
52
|
| `keyboardNavigation` | `boolean` | `true` | Enable keyboard navigation with arrow keys |
|
|
53
|
+
| `expanded` | `boolean` | `false` | Whether the navigation rail is expanded |
|
|
53
54
|
|
|
54
55
|
### Slots
|
|
55
56
|
|
|
@@ -73,14 +74,25 @@ import { SchmancyNavigationRail, SchmancyNavigationRailItem } from '@schmancy'
|
|
|
73
74
|
|
|
74
75
|
| Property | Default | Description |
|
|
75
76
|
|----------|---------|-------------|
|
|
76
|
-
| `--rail-width` | `80px` | Fixed width of the rail |
|
|
77
|
-
| `--rail-width-mobile` | `56px` | Width on mobile devices |
|
|
77
|
+
| `--rail-width` | `80px` (collapsed) / `240px` (expanded) | Fixed width of the rail |
|
|
78
|
+
| `--rail-width-mobile` | `56px` (collapsed) / `200px` (expanded) | Width on mobile devices |
|
|
79
|
+
|
|
80
|
+
### CSS Parts
|
|
81
|
+
|
|
82
|
+
| Part | Description |
|
|
83
|
+
|------|-------------|
|
|
84
|
+
| `rail` | The main rail container |
|
|
85
|
+
| `header` | The header section containing FAB and menu |
|
|
86
|
+
| `nav` | The navigation items container |
|
|
87
|
+
| `footer` | The footer section |
|
|
78
88
|
|
|
79
89
|
### Methods
|
|
80
90
|
|
|
81
91
|
| Method | Description |
|
|
82
92
|
|--------|-------------|
|
|
83
|
-
|
|
|
93
|
+
| `expand()` | Programmatically expand the navigation rail |
|
|
94
|
+
| `collapse()` | Programmatically collapse the navigation rail |
|
|
95
|
+
| `toggle()` | Toggle between expanded and collapsed states |
|
|
84
96
|
|
|
85
97
|
## Navigation Rail Item Component
|
|
86
98
|
|
|
@@ -116,12 +128,18 @@ import { SchmancyNavigationRail, SchmancyNavigationRailItem } from '@schmancy'
|
|
|
116
128
|
|
|
117
129
|
### CSS Custom Properties
|
|
118
130
|
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
|
124
|
-
|
|
131
|
+
Navigation rail items use the Schmancy design token system and do not expose custom properties for theming.
|
|
132
|
+
|
|
133
|
+
### CSS Parts
|
|
134
|
+
|
|
135
|
+
| Part | Description |
|
|
136
|
+
|------|-------------|
|
|
137
|
+
| `container` | The main item container |
|
|
138
|
+
| `indicator` | The active indicator behind the icon |
|
|
139
|
+
| `icon` | The icon container |
|
|
140
|
+
| `icon-text` | The icon text element |
|
|
141
|
+
| `label` | The label text |
|
|
142
|
+
| `badge` | The badge element |
|
|
125
143
|
|
|
126
144
|
## Examples
|
|
127
145
|
|
|
@@ -131,7 +149,7 @@ import { SchmancyNavigationRail, SchmancyNavigationRailItem } from '@schmancy'
|
|
|
131
149
|
<schmancy-navigation-rail
|
|
132
150
|
activeIndex="0"
|
|
133
151
|
labelVisibility="selected"
|
|
134
|
-
@
|
|
152
|
+
@navigate=${this.handleNavigation}
|
|
135
153
|
@fab-click=${this.handleFabClick}
|
|
136
154
|
@menu-click=${this.handleMenuClick}
|
|
137
155
|
>
|
|
@@ -268,7 +286,7 @@ class MyApp extends LitElement {
|
|
|
268
286
|
}
|
|
269
287
|
|
|
270
288
|
// Handle navigation
|
|
271
|
-
|
|
289
|
+
handleNavigate(event: CustomEvent<string>) {
|
|
272
290
|
const value = event.detail
|
|
273
291
|
console.log(`Navigated to: ${value}`)
|
|
274
292
|
|
|
@@ -276,6 +294,19 @@ class MyApp extends LitElement {
|
|
|
276
294
|
this.router.navigate(value)
|
|
277
295
|
}
|
|
278
296
|
|
|
297
|
+
// Expand/collapse rail
|
|
298
|
+
expandRail() {
|
|
299
|
+
this.navigationRail.expand()
|
|
300
|
+
}
|
|
301
|
+
|
|
302
|
+
collapseRail() {
|
|
303
|
+
this.navigationRail.collapse()
|
|
304
|
+
}
|
|
305
|
+
|
|
306
|
+
toggleRail() {
|
|
307
|
+
this.navigationRail.toggle()
|
|
308
|
+
}
|
|
309
|
+
|
|
279
310
|
// Change label visibility programmatically
|
|
280
311
|
toggleLabels() {
|
|
281
312
|
this.navigationRail.labelVisibility =
|
|
@@ -294,6 +325,44 @@ class MyApp extends LitElement {
|
|
|
294
325
|
}
|
|
295
326
|
```
|
|
296
327
|
|
|
328
|
+
### With Expanded State
|
|
329
|
+
|
|
330
|
+
```html
|
|
331
|
+
<schmancy-navigation-rail
|
|
332
|
+
expanded
|
|
333
|
+
activeIndex="0"
|
|
334
|
+
>
|
|
335
|
+
<schmancy-button slot="menu" variant="text" @click=${this.toggleRail}>
|
|
336
|
+
<schmancy-icon>menu</schmancy-icon>
|
|
337
|
+
</schmancy-button>
|
|
338
|
+
|
|
339
|
+
<schmancy-navigation-rail-item
|
|
340
|
+
icon="home"
|
|
341
|
+
label="Home"
|
|
342
|
+
value="/home"
|
|
343
|
+
></schmancy-navigation-rail-item>
|
|
344
|
+
|
|
345
|
+
<schmancy-navigation-rail-item
|
|
346
|
+
icon="dashboard"
|
|
347
|
+
label="Dashboard"
|
|
348
|
+
value="/dashboard"
|
|
349
|
+
></schmancy-navigation-rail-item>
|
|
350
|
+
|
|
351
|
+
<schmancy-navigation-rail-item
|
|
352
|
+
icon="analytics"
|
|
353
|
+
label="Analytics"
|
|
354
|
+
value="/analytics"
|
|
355
|
+
></schmancy-navigation-rail-item>
|
|
356
|
+
</schmancy-navigation-rail>
|
|
357
|
+
|
|
358
|
+
<script>
|
|
359
|
+
function toggleRail() {
|
|
360
|
+
const rail = document.querySelector('schmancy-navigation-rail')
|
|
361
|
+
rail.toggle()
|
|
362
|
+
}
|
|
363
|
+
</script>
|
|
364
|
+
```
|
|
365
|
+
|
|
297
366
|
### With Router Integration
|
|
298
367
|
|
|
299
368
|
```typescript
|
|
@@ -372,24 +441,33 @@ The navigation rail adapts to different screen sizes:
|
|
|
372
441
|
|
|
373
442
|
## Theming
|
|
374
443
|
|
|
375
|
-
The navigation rail uses Schmancy
|
|
444
|
+
The navigation rail uses Schmancy design tokens:
|
|
376
445
|
|
|
377
446
|
```css
|
|
378
447
|
/* Custom theming */
|
|
379
448
|
schmancy-navigation-rail {
|
|
380
|
-
/* Colors */
|
|
381
|
-
--schmancy-sys-color-surface-
|
|
382
|
-
--schmancy-sys-color-
|
|
449
|
+
/* Colors - Surface and backgrounds */
|
|
450
|
+
--schmancy-sys-color-surface-default: #ffffff;
|
|
451
|
+
--schmancy-sys-color-surface-on: #1c1b1f;
|
|
452
|
+
--schmancy-sys-color-surface-containerHighest: #e6e0e9;
|
|
453
|
+
|
|
454
|
+
/* Colors - Active state */
|
|
455
|
+
--schmancy-sys-color-secondary-container: #e8def8;
|
|
456
|
+
--schmancy-sys-color-secondary-onContainer: #1d192b;
|
|
383
457
|
|
|
384
|
-
/*
|
|
385
|
-
--
|
|
386
|
-
--rail-width-mobile: 56px;
|
|
458
|
+
/* Colors - Inactive state */
|
|
459
|
+
--schmancy-sys-color-surface-onVariant: #49454f;
|
|
387
460
|
}
|
|
388
461
|
|
|
389
462
|
/* Dark theme */
|
|
390
463
|
@media (prefers-color-scheme: dark) {
|
|
391
464
|
schmancy-navigation-rail {
|
|
392
|
-
--schmancy-sys-color-surface-
|
|
465
|
+
--schmancy-sys-color-surface-default: #1c1b1f;
|
|
466
|
+
--schmancy-sys-color-surface-on: #e6e0e9;
|
|
467
|
+
--schmancy-sys-color-surface-containerHighest: #36343b;
|
|
468
|
+
--schmancy-sys-color-secondary-container: #4a4458;
|
|
469
|
+
--schmancy-sys-color-secondary-onContainer: #e8def8;
|
|
470
|
+
--schmancy-sys-color-surface-onVariant: #cac4d0;
|
|
393
471
|
}
|
|
394
472
|
}
|
|
395
473
|
```
|
|
@@ -402,8 +480,13 @@ schmancy-navigation-rail {
|
|
|
402
480
|
4. **Hierarchy**: Place most important items at the top
|
|
403
481
|
5. **Badges**: Use sparingly for important notifications
|
|
404
482
|
6. **FAB**: Only include if there's a clear primary action
|
|
405
|
-
7. **Label Visibility**:
|
|
406
|
-
|
|
483
|
+
7. **Label Visibility**:
|
|
484
|
+
- Use `'selected'` for most cases to save space
|
|
485
|
+
- Use `'all'` for better discoverability
|
|
486
|
+
- Use `'none'` with tooltips for maximum space efficiency
|
|
487
|
+
- In expanded state, labels are always shown regardless of setting
|
|
488
|
+
8. **Expanded State**: Use expanded rail for applications that need more descriptive labels or additional information
|
|
489
|
+
9. **Mobile**: Consider using bottom navigation bar on mobile instead
|
|
407
490
|
|
|
408
491
|
## Migration Guide
|
|
409
492
|
|
|
@@ -50,6 +50,7 @@ import { SchmancyNavigationRail, SchmancyNavigationRailItem } from '@schmancy'
|
|
|
50
50
|
| `alignment` | `'top' \| 'center' \| 'bottom'` | `'top'` | Vertical alignment of navigation items |
|
|
51
51
|
| `showTooltips` | `boolean` | `true` | Show tooltips when labels are hidden |
|
|
52
52
|
| `keyboardNavigation` | `boolean` | `true` | Enable keyboard navigation with arrow keys |
|
|
53
|
+
| `expanded` | `boolean` | `false` | Whether the navigation rail is expanded |
|
|
53
54
|
|
|
54
55
|
### Slots
|
|
55
56
|
|
|
@@ -73,14 +74,25 @@ import { SchmancyNavigationRail, SchmancyNavigationRailItem } from '@schmancy'
|
|
|
73
74
|
|
|
74
75
|
| Property | Default | Description |
|
|
75
76
|
|----------|---------|-------------|
|
|
76
|
-
| `--rail-width` | `80px` | Fixed width of the rail |
|
|
77
|
-
| `--rail-width-mobile` | `56px` | Width on mobile devices |
|
|
77
|
+
| `--rail-width` | `80px` (collapsed) / `240px` (expanded) | Fixed width of the rail |
|
|
78
|
+
| `--rail-width-mobile` | `56px` (collapsed) / `200px` (expanded) | Width on mobile devices |
|
|
79
|
+
|
|
80
|
+
### CSS Parts
|
|
81
|
+
|
|
82
|
+
| Part | Description |
|
|
83
|
+
|------|-------------|
|
|
84
|
+
| `rail` | The main rail container |
|
|
85
|
+
| `header` | The header section containing FAB and menu |
|
|
86
|
+
| `nav` | The navigation items container |
|
|
87
|
+
| `footer` | The footer section |
|
|
78
88
|
|
|
79
89
|
### Methods
|
|
80
90
|
|
|
81
91
|
| Method | Description |
|
|
82
92
|
|--------|-------------|
|
|
83
|
-
|
|
|
93
|
+
| `expand()` | Programmatically expand the navigation rail |
|
|
94
|
+
| `collapse()` | Programmatically collapse the navigation rail |
|
|
95
|
+
| `toggle()` | Toggle between expanded and collapsed states |
|
|
84
96
|
|
|
85
97
|
## Navigation Rail Item Component
|
|
86
98
|
|
|
@@ -116,12 +128,18 @@ import { SchmancyNavigationRail, SchmancyNavigationRailItem } from '@schmancy'
|
|
|
116
128
|
|
|
117
129
|
### CSS Custom Properties
|
|
118
130
|
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
|
124
|
-
|
|
131
|
+
Navigation rail items use the Schmancy design token system and do not expose custom properties for theming.
|
|
132
|
+
|
|
133
|
+
### CSS Parts
|
|
134
|
+
|
|
135
|
+
| Part | Description |
|
|
136
|
+
|------|-------------|
|
|
137
|
+
| `container` | The main item container |
|
|
138
|
+
| `indicator` | The active indicator behind the icon |
|
|
139
|
+
| `icon` | The icon container |
|
|
140
|
+
| `icon-text` | The icon text element |
|
|
141
|
+
| `label` | The label text |
|
|
142
|
+
| `badge` | The badge element |
|
|
125
143
|
|
|
126
144
|
## Examples
|
|
127
145
|
|
|
@@ -131,7 +149,7 @@ import { SchmancyNavigationRail, SchmancyNavigationRailItem } from '@schmancy'
|
|
|
131
149
|
<schmancy-navigation-rail
|
|
132
150
|
activeIndex="0"
|
|
133
151
|
labelVisibility="selected"
|
|
134
|
-
@
|
|
152
|
+
@navigate=${this.handleNavigation}
|
|
135
153
|
@fab-click=${this.handleFabClick}
|
|
136
154
|
@menu-click=${this.handleMenuClick}
|
|
137
155
|
>
|
|
@@ -268,7 +286,7 @@ class MyApp extends LitElement {
|
|
|
268
286
|
}
|
|
269
287
|
|
|
270
288
|
// Handle navigation
|
|
271
|
-
|
|
289
|
+
handleNavigate(event: CustomEvent<string>) {
|
|
272
290
|
const value = event.detail
|
|
273
291
|
console.log(`Navigated to: ${value}`)
|
|
274
292
|
|
|
@@ -276,6 +294,19 @@ class MyApp extends LitElement {
|
|
|
276
294
|
this.router.navigate(value)
|
|
277
295
|
}
|
|
278
296
|
|
|
297
|
+
// Expand/collapse rail
|
|
298
|
+
expandRail() {
|
|
299
|
+
this.navigationRail.expand()
|
|
300
|
+
}
|
|
301
|
+
|
|
302
|
+
collapseRail() {
|
|
303
|
+
this.navigationRail.collapse()
|
|
304
|
+
}
|
|
305
|
+
|
|
306
|
+
toggleRail() {
|
|
307
|
+
this.navigationRail.toggle()
|
|
308
|
+
}
|
|
309
|
+
|
|
279
310
|
// Change label visibility programmatically
|
|
280
311
|
toggleLabels() {
|
|
281
312
|
this.navigationRail.labelVisibility =
|
|
@@ -294,6 +325,44 @@ class MyApp extends LitElement {
|
|
|
294
325
|
}
|
|
295
326
|
```
|
|
296
327
|
|
|
328
|
+
### With Expanded State
|
|
329
|
+
|
|
330
|
+
```html
|
|
331
|
+
<schmancy-navigation-rail
|
|
332
|
+
expanded
|
|
333
|
+
activeIndex="0"
|
|
334
|
+
>
|
|
335
|
+
<schmancy-button slot="menu" variant="text" @click=${this.toggleRail}>
|
|
336
|
+
<schmancy-icon>menu</schmancy-icon>
|
|
337
|
+
</schmancy-button>
|
|
338
|
+
|
|
339
|
+
<schmancy-navigation-rail-item
|
|
340
|
+
icon="home"
|
|
341
|
+
label="Home"
|
|
342
|
+
value="/home"
|
|
343
|
+
></schmancy-navigation-rail-item>
|
|
344
|
+
|
|
345
|
+
<schmancy-navigation-rail-item
|
|
346
|
+
icon="dashboard"
|
|
347
|
+
label="Dashboard"
|
|
348
|
+
value="/dashboard"
|
|
349
|
+
></schmancy-navigation-rail-item>
|
|
350
|
+
|
|
351
|
+
<schmancy-navigation-rail-item
|
|
352
|
+
icon="analytics"
|
|
353
|
+
label="Analytics"
|
|
354
|
+
value="/analytics"
|
|
355
|
+
></schmancy-navigation-rail-item>
|
|
356
|
+
</schmancy-navigation-rail>
|
|
357
|
+
|
|
358
|
+
<script>
|
|
359
|
+
function toggleRail() {
|
|
360
|
+
const rail = document.querySelector('schmancy-navigation-rail')
|
|
361
|
+
rail.toggle()
|
|
362
|
+
}
|
|
363
|
+
</script>
|
|
364
|
+
```
|
|
365
|
+
|
|
297
366
|
### With Router Integration
|
|
298
367
|
|
|
299
368
|
```typescript
|
|
@@ -372,24 +441,33 @@ The navigation rail adapts to different screen sizes:
|
|
|
372
441
|
|
|
373
442
|
## Theming
|
|
374
443
|
|
|
375
|
-
The navigation rail uses Schmancy
|
|
444
|
+
The navigation rail uses Schmancy design tokens:
|
|
376
445
|
|
|
377
446
|
```css
|
|
378
447
|
/* Custom theming */
|
|
379
448
|
schmancy-navigation-rail {
|
|
380
|
-
/* Colors */
|
|
381
|
-
--schmancy-sys-color-surface-
|
|
382
|
-
--schmancy-sys-color-
|
|
449
|
+
/* Colors - Surface and backgrounds */
|
|
450
|
+
--schmancy-sys-color-surface-default: #ffffff;
|
|
451
|
+
--schmancy-sys-color-surface-on: #1c1b1f;
|
|
452
|
+
--schmancy-sys-color-surface-containerHighest: #e6e0e9;
|
|
453
|
+
|
|
454
|
+
/* Colors - Active state */
|
|
455
|
+
--schmancy-sys-color-secondary-container: #e8def8;
|
|
456
|
+
--schmancy-sys-color-secondary-onContainer: #1d192b;
|
|
383
457
|
|
|
384
|
-
/*
|
|
385
|
-
--
|
|
386
|
-
--rail-width-mobile: 56px;
|
|
458
|
+
/* Colors - Inactive state */
|
|
459
|
+
--schmancy-sys-color-surface-onVariant: #49454f;
|
|
387
460
|
}
|
|
388
461
|
|
|
389
462
|
/* Dark theme */
|
|
390
463
|
@media (prefers-color-scheme: dark) {
|
|
391
464
|
schmancy-navigation-rail {
|
|
392
|
-
--schmancy-sys-color-surface-
|
|
465
|
+
--schmancy-sys-color-surface-default: #1c1b1f;
|
|
466
|
+
--schmancy-sys-color-surface-on: #e6e0e9;
|
|
467
|
+
--schmancy-sys-color-surface-containerHighest: #36343b;
|
|
468
|
+
--schmancy-sys-color-secondary-container: #4a4458;
|
|
469
|
+
--schmancy-sys-color-secondary-onContainer: #e8def8;
|
|
470
|
+
--schmancy-sys-color-surface-onVariant: #cac4d0;
|
|
393
471
|
}
|
|
394
472
|
}
|
|
395
473
|
```
|
|
@@ -402,8 +480,13 @@ schmancy-navigation-rail {
|
|
|
402
480
|
4. **Hierarchy**: Place most important items at the top
|
|
403
481
|
5. **Badges**: Use sparingly for important notifications
|
|
404
482
|
6. **FAB**: Only include if there's a clear primary action
|
|
405
|
-
7. **Label Visibility**:
|
|
406
|
-
|
|
483
|
+
7. **Label Visibility**:
|
|
484
|
+
- Use `'selected'` for most cases to save space
|
|
485
|
+
- Use `'all'` for better discoverability
|
|
486
|
+
- Use `'none'` with tooltips for maximum space efficiency
|
|
487
|
+
- In expanded state, labels are always shown regardless of setting
|
|
488
|
+
8. **Expanded State**: Use expanded rail for applications that need more descriptive labels or additional information
|
|
489
|
+
9. **Mobile**: Consider using bottom navigation bar on mobile instead
|
|
407
490
|
|
|
408
491
|
## Migration Guide
|
|
409
492
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";const l=require("lit"),o=require("lit/decorators.js"),n=require("rxjs");require("./animated-text-BZUrBdvN.cjs");const I=require("./area.component-Ch2Eaa4i.cjs");require("./autocomplete-CenwFcT1.cjs"),require("lit/directives/class-map.js"),require("lit/directives/style-map.js");const N=require("./tailwind.mixin-ClfV2_Nh.cjs"),g=require("./ripple-DqQrvaTe.cjs");require("lit/directives/guard.js"),require("./boat-Dfx9-P8c.cjs"),require("./spinner-CaXU45TV.cjs"),require("./icon-button-DwnnW2oj.cjs"),require("./media-CsYVcfaX.cjs"),require("./checkbox-8djp_8NK.cjs"),require("./suggestion-chip-PI24Hc3s.cjs"),require("./input-chip-B7ANrtLF.cjs"),require("./code-preview-BFoEmN8y.cjs"),require("./payment-card-form--v94EhJF.cjs");const y=require("./types.cjs"),p=require("./provide-BxZ2kn_p.cjs"),w=require("./litElement.mixin-LplXbzd8.cjs"),m=require("./consume-edta5ng5.cjs");require("./date-range-DoCtnpW6.cjs"),require("./date-range-inline-DNr7C5X-.cjs"),require("./delay-CrdOikhP.cjs"),require("./details-CsqhGMjL.cjs"),require("./dialog-content-BzSQoM2J.cjs"),require("./dialog-service-Bdaxn2t0.cjs"),require("./divider-CNxOc8ep.cjs"),require("./dropdown-content-De0OkNoq.cjs"),require("./timezone-Bw4EXBt7.cjs"),require("./form-DzDksPgv.cjs"),require("./icon-
|
|
1
|
+
"use strict";const l=require("lit"),o=require("lit/decorators.js"),n=require("rxjs");require("./animated-text-BZUrBdvN.cjs");const I=require("./area.component-Ch2Eaa4i.cjs");require("./autocomplete-CenwFcT1.cjs"),require("lit/directives/class-map.js"),require("lit/directives/style-map.js");const N=require("./tailwind.mixin-ClfV2_Nh.cjs"),g=require("./ripple-DqQrvaTe.cjs");require("lit/directives/guard.js"),require("./boat-Dfx9-P8c.cjs"),require("./spinner-CaXU45TV.cjs"),require("./icon-button-DwnnW2oj.cjs"),require("./media-CsYVcfaX.cjs"),require("./checkbox-8djp_8NK.cjs"),require("./suggestion-chip-PI24Hc3s.cjs"),require("./input-chip-B7ANrtLF.cjs"),require("./code-preview-BFoEmN8y.cjs"),require("./payment-card-form--v94EhJF.cjs");const y=require("./types.cjs"),p=require("./provide-BxZ2kn_p.cjs"),w=require("./litElement.mixin-LplXbzd8.cjs"),m=require("./consume-edta5ng5.cjs");require("./date-range-DoCtnpW6.cjs"),require("./date-range-inline-DNr7C5X-.cjs"),require("./delay-CrdOikhP.cjs"),require("./details-CsqhGMjL.cjs"),require("./dialog-content-BzSQoM2J.cjs"),require("./dialog-service-Bdaxn2t0.cjs"),require("./divider-CNxOc8ep.cjs"),require("./dropdown-content-De0OkNoq.cjs"),require("./timezone-Bw4EXBt7.cjs"),require("./form-DzDksPgv.cjs"),require("./icon-DebIySqv.cjs"),require("./input-C2Vz-51i.cjs"),require("./flex-CHf9Gc5V.cjs"),require("./list-BH8OJ3Rv.cjs"),require("./email-recipients-DS01C3V3.cjs"),require("./map-C7lxYU4A.cjs"),require("./menu-Boqsyfmh.cjs");const j=require("lit/directives/when.js");require("./navigation-rail-D_dDK8C4.cjs"),require("./notification-service-9HXSKWcw.cjs"),require("./option-D2bxihLu.cjs"),require("./progress-CjkD8QBy.cjs"),require("./radio-button-CGmGOAil.cjs"),require("./index-CCi1otmh.cjs"),require("./select-CrB02cIO.cjs"),require("./sheet-sgVoRMi1.cjs");const W=require("./sheet.service-BxvWBGsJ.cjs");require("./slider-Dd1L6oYm.cjs"),require("./schmancy-steps-container-CydL78yk.cjs"),require("./context-object-DA9DM9QJ.cjs");const d=require("rxjs/operators");require("./surface-Ax6I7ldp.cjs"),require("./table-BlwUyf_4.cjs"),require("./tabs-compatibility-CX0cIu_Y.cjs"),require("./textarea-qLA0vP78.cjs"),require("./theme.component-CQ1trrZB.cjs"),require("./theme-button-D7fBEUGf.cjs"),require("./tooltip-Dhs4HL3A.cjs"),require("./tree-D-ezei_U.cjs"),require("./typewriter-CtPh4Pyj.cjs"),require("./typography-BrIaOYmC.cjs");const a=require("./theme.interface-BMeNadVb.cjs");var Y=Object.defineProperty,F=Object.getOwnPropertyDescriptor,v=(e,t,i,s)=>{for(var c,r=s>1?void 0:s?F(t,i):t,h=e.length-1;h>=0;h--)(c=e[h])&&(r=(s?c(t,i,r):c(r))||r);return s&&r&&Y(t,i,r),r};exports.SchmancyBadgeV2=class extends N.TailwindElement(l.css`
|
|
2
2
|
:host {
|
|
3
3
|
display: inline-flex;
|
|
4
4
|
}
|
|
@@ -300,4 +300,4 @@
|
|
|
300
300
|
`}getColorAttributes(){const e={primary:{bgColor:a.SchmancyTheme.sys.color.primary.container,color:a.SchmancyTheme.sys.color.primary.onContainer},secondary:{bgColor:a.SchmancyTheme.sys.color.secondary.container,color:a.SchmancyTheme.sys.color.secondary.onContainer},tertiary:{bgColor:a.SchmancyTheme.sys.color.tertiary.container,color:a.SchmancyTheme.sys.color.tertiary.onContainer},success:{bgColor:a.SchmancyTheme.sys.color.success.container,color:a.SchmancyTheme.sys.color.success.onContainer},error:{bgColor:a.SchmancyTheme.sys.color.error.container,color:a.SchmancyTheme.sys.color.error.onContainer},neutral:{bgColor:a.SchmancyTheme.sys.color.surface.container,color:a.SchmancyTheme.sys.color.surface.on}};return g.color(e[this.color])}renderStatusIndicator(){const e={online:a.SchmancyTheme.sys.color.success.default,offline:a.SchmancyTheme.sys.color.surface.onVariant,busy:a.SchmancyTheme.sys.color.error.default,away:a.SchmancyTheme.sys.color.tertiary.default},t={"absolute bottom-0 right-0 rounded-full border-2 border-surface-default":!0,[{xs:"w-1.5 h-1.5",sm:"w-2 h-2",md:"w-2.5 h-2.5",lg:"w-3 h-3",xl:"w-4 h-4"}[this.size]]:!0};return l.html`
|
|
301
301
|
<div class="${this.classMap(t)}" style="background-color: ${e[this.status]};"></div>
|
|
302
302
|
`}},b([o.property({type:String})],exports.SchmancyAvatar.prototype,"initials",2),b([o.property({type:String})],exports.SchmancyAvatar.prototype,"src",2),b([o.property({type:String})],exports.SchmancyAvatar.prototype,"icon",2),b([o.property({type:String})],exports.SchmancyAvatar.prototype,"size",2),b([o.property({type:String})],exports.SchmancyAvatar.prototype,"color",2),b([o.property({type:String})],exports.SchmancyAvatar.prototype,"shape",2),b([o.property({type:Boolean})],exports.SchmancyAvatar.prototype,"bordered",2),b([o.property({type:String})],exports.SchmancyAvatar.prototype,"status",2),exports.SchmancyAvatar=b([o.customElement("schmancy-avatar")],exports.SchmancyAvatar),exports.$drawer=re,exports.HereMorty=R,exports.SchmancyContentDrawerID=L,exports.SchmancyContentDrawerMaxHeight=M,exports.SchmancyContentDrawerMinWidth=z,exports.SchmancyContentDrawerSheetMode=O,exports.SchmancyContentDrawerSheetState=P,exports.SchmancyDrawerNavbarMode=B,exports.SchmancyDrawerNavbarState=A,exports.WhereAreYouRicky=H,exports.schmancyContentDrawer=G,exports.schmancyNavDrawer=X,exports.teleport=E;
|
|
303
|
-
//# sourceMappingURL=avatar-
|
|
303
|
+
//# sourceMappingURL=avatar-8TnYDr70.cjs.map
|