@jsekulowicz/ds-components 0.5.0 → 0.5.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.
- package/custom-elements.json +615 -586
- package/dist/atoms/icon/icons/user-circle.d.ts +2 -0
- package/dist/atoms/icon/icons/user-circle.d.ts.map +1 -0
- package/dist/atoms/icon/icons/user-circle.js +4 -0
- package/dist/atoms/icon/icons/user-circle.js.map +1 -0
- package/dist/organisms/navbar/navbar.d.ts +1 -1
- package/dist/organisms/navbar/navbar.d.ts.map +1 -1
- package/dist/organisms/navbar/navbar.js +19 -5
- package/dist/organisms/navbar/navbar.js.map +1 -1
- package/dist/organisms/sidenav/sidenav.styles.d.ts.map +1 -1
- package/dist/organisms/sidenav/sidenav.styles.js +5 -1
- package/dist/organisms/sidenav/sidenav.styles.js.map +1 -1
- package/dist/templates/page-shell/page-shell.d.ts +1 -0
- package/dist/templates/page-shell/page-shell.d.ts.map +1 -1
- package/dist/templates/page-shell/page-shell.js +6 -3
- package/dist/templates/page-shell/page-shell.js.map +1 -1
- package/dist/templates/page-shell/page-shell.styles.d.ts.map +1 -1
- package/dist/templates/page-shell/page-shell.styles.js +31 -1
- package/dist/templates/page-shell/page-shell.styles.js.map +1 -1
- package/package.json +5 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"user-circle.d.ts","sourceRoot":"","sources":["../../../../src/atoms/icon/icons/user-circle.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
// Heroicons v2 — user-circle (24/outline) — MIT License
|
|
2
|
+
import { registerIcon } from '../icon.js';
|
|
3
|
+
registerIcon('user-circle', '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" d="M17.982 18.725A7.488 7.488 0 0 0 12 15.75a7.488 7.488 0 0 0-5.982 2.975m11.963 0a9 9 0 1 0-11.963 0m11.963 0A8.966 8.966 0 0 1 12 21a8.966 8.966 0 0 1-5.982-2.275M15 9.75a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" /></svg>');
|
|
4
|
+
//# sourceMappingURL=user-circle.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"user-circle.js","sourceRoot":"","sources":["../../../../src/atoms/icon/icons/user-circle.ts"],"names":[],"mappings":"AAAA,wDAAwD;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE1C,YAAY,CACV,aAAa,EACb,4XAA4X,CAC7X,CAAC"}
|
|
@@ -2,7 +2,6 @@ import { type TemplateResult } from 'lit';
|
|
|
2
2
|
import { DsElement } from '@jsekulowicz/ds-core';
|
|
3
3
|
import '../../atoms/icon/define.js';
|
|
4
4
|
import '../../atoms/icon/icons/bars-3.js';
|
|
5
|
-
import '../../atoms/icon/icons/x-mark.js';
|
|
6
5
|
/**
|
|
7
6
|
* @tag ds-navbar
|
|
8
7
|
* @summary Top-bar navigation shell. Collapses to a hamburger menu below the configured breakpoint.
|
|
@@ -22,6 +21,7 @@ export declare class DsNavbar extends DsElement {
|
|
|
22
21
|
label: string;
|
|
23
22
|
menuLabel: string;
|
|
24
23
|
private _open;
|
|
24
|
+
private _hasLinks;
|
|
25
25
|
connectedCallback(): void;
|
|
26
26
|
disconnectedCallback(): void;
|
|
27
27
|
render(): TemplateResult;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"navbar.d.ts","sourceRoot":"","sources":["../../../src/organisms/navbar/navbar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAEhD,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAEjD,OAAO,4BAA4B,CAAC;AACpC,OAAO,kCAAkC,CAAC;
|
|
1
|
+
{"version":3,"file":"navbar.d.ts","sourceRoot":"","sources":["../../../src/organisms/navbar/navbar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAEhD,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAEjD,OAAO,4BAA4B,CAAC;AACpC,OAAO,kCAAkC,CAAC;AAE1C;;;;;;;;;;;;GAYG;AACH,qBAAa,QAAS,SAAQ,SAAS;;IACrC,OAAgB,MAAM,4BAAuC;IAEjD,KAAK,SAAa;IACS,SAAS,SAAU;IAEjD,OAAO,CAAC,KAAK,CAAS;IACtB,OAAO,CAAC,SAAS,CAAS;IAE1B,iBAAiB,IAAI,IAAI;IAKzB,oBAAoB,IAAI,IAAI;IA2B5B,MAAM,IAAI,cAAc;CAuBlC"}
|
|
@@ -10,7 +10,6 @@ import { DsElement } from '@jsekulowicz/ds-core';
|
|
|
10
10
|
import { navbarStyles } from './navbar.styles.js';
|
|
11
11
|
import '../../atoms/icon/define.js';
|
|
12
12
|
import '../../atoms/icon/icons/bars-3.js';
|
|
13
|
-
import '../../atoms/icon/icons/x-mark.js';
|
|
14
13
|
/**
|
|
15
14
|
* @tag ds-navbar
|
|
16
15
|
* @summary Top-bar navigation shell. Collapses to a hamburger menu below the configured breakpoint.
|
|
@@ -30,6 +29,14 @@ export class DsNavbar extends DsElement {
|
|
|
30
29
|
this.label = 'Primary';
|
|
31
30
|
this.menuLabel = 'Menu';
|
|
32
31
|
this._open = false;
|
|
32
|
+
this._hasLinks = false;
|
|
33
|
+
this.#syncLinksPresence = () => {
|
|
34
|
+
const slot = this.shadowRoot?.querySelector('.menu slot:not([name])');
|
|
35
|
+
this._hasLinks = Boolean(slot?.assignedNodes({ flatten: true }).some(isContentNode));
|
|
36
|
+
};
|
|
37
|
+
this.#onLinksSlotChange = () => {
|
|
38
|
+
this.#syncLinksPresence();
|
|
39
|
+
};
|
|
33
40
|
this.#onDocumentKeydown = (event) => {
|
|
34
41
|
if (event.key === 'Escape' && this._open) {
|
|
35
42
|
this._open = false;
|
|
@@ -51,14 +58,15 @@ export class DsNavbar extends DsElement {
|
|
|
51
58
|
super.disconnectedCallback();
|
|
52
59
|
document.removeEventListener('keydown', this.#onDocumentKeydown);
|
|
53
60
|
}
|
|
61
|
+
#syncLinksPresence;
|
|
62
|
+
#onLinksSlotChange;
|
|
54
63
|
#onDocumentKeydown;
|
|
55
64
|
#onToggle;
|
|
56
65
|
render() {
|
|
57
66
|
const menuId = `${this.uid}-menu`;
|
|
58
|
-
const iconName = this._open ? 'x-mark' : 'bars-3';
|
|
59
67
|
return html `<nav part="bar" aria-label=${this.label}>
|
|
60
68
|
<div class="brand" part="brand"><slot name="brand"></slot></div>
|
|
61
|
-
<div class="links" part="links">
|
|
69
|
+
<div class="links" part="links" ?hidden=${!this._hasLinks}>
|
|
62
70
|
<button
|
|
63
71
|
class="toggle"
|
|
64
72
|
part="toggle"
|
|
@@ -68,10 +76,10 @@ export class DsNavbar extends DsElement {
|
|
|
68
76
|
aria-controls=${menuId}
|
|
69
77
|
@click=${this.#onToggle}
|
|
70
78
|
>
|
|
71
|
-
<ds-icon name
|
|
79
|
+
<ds-icon name="bars-3" size="xl"></ds-icon>
|
|
72
80
|
</button>
|
|
73
81
|
<div class="menu" part="menu" id=${menuId} role="list">
|
|
74
|
-
<slot></slot>
|
|
82
|
+
<slot @slotchange=${this.#onLinksSlotChange}></slot>
|
|
75
83
|
</div>
|
|
76
84
|
</div>
|
|
77
85
|
<div class="actions" part="actions"><slot name="actions"></slot></div>
|
|
@@ -87,4 +95,10 @@ __decorate([
|
|
|
87
95
|
__decorate([
|
|
88
96
|
state()
|
|
89
97
|
], DsNavbar.prototype, "_open", void 0);
|
|
98
|
+
__decorate([
|
|
99
|
+
state()
|
|
100
|
+
], DsNavbar.prototype, "_hasLinks", void 0);
|
|
101
|
+
function isContentNode(node) {
|
|
102
|
+
return node.nodeType !== Node.TEXT_NODE || Boolean(node.textContent?.trim());
|
|
103
|
+
}
|
|
90
104
|
//# sourceMappingURL=navbar.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"navbar.js","sourceRoot":"","sources":["../../../src/organisms/navbar/navbar.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAuB,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,4BAA4B,CAAC;AACpC,OAAO,kCAAkC,CAAC;
|
|
1
|
+
{"version":3,"file":"navbar.js","sourceRoot":"","sources":["../../../src/organisms/navbar/navbar.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sidenav.styles.d.ts","sourceRoot":"","sources":["../../../src/organisms/sidenav/sidenav.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,aAAa,
|
|
1
|
+
{"version":3,"file":"sidenav.styles.d.ts","sourceRoot":"","sources":["../../../src/organisms/sidenav/sidenav.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,aAAa,yBAgEzB,CAAC"}
|
|
@@ -17,6 +17,7 @@ export const sidenavStyles = css `
|
|
|
17
17
|
|
|
18
18
|
nav {
|
|
19
19
|
width: var(--ds-sidenav-collapsed-width);
|
|
20
|
+
padding: var(--ds-space-4) var(--ds-space-1);
|
|
20
21
|
scrollbar-width: none;
|
|
21
22
|
}
|
|
22
23
|
}
|
|
@@ -24,7 +25,7 @@ export const sidenavStyles = css `
|
|
|
24
25
|
display: flex;
|
|
25
26
|
flex-direction: column;
|
|
26
27
|
height: 100%;
|
|
27
|
-
padding: var(--ds-space-
|
|
28
|
+
padding: var(--ds-space-4);
|
|
28
29
|
background: var(--ds-color-bg);
|
|
29
30
|
overflow-x: clip;
|
|
30
31
|
overflow-y: auto;
|
|
@@ -56,6 +57,9 @@ export const sidenavStyles = css `
|
|
|
56
57
|
flex-direction: column;
|
|
57
58
|
gap: var(--ds-space-1);
|
|
58
59
|
}
|
|
60
|
+
:host-context(ds-page-shell[mobile-layout]) nav {
|
|
61
|
+
padding-block: var(--ds-space-2);
|
|
62
|
+
}
|
|
59
63
|
:host-context(ds-page-shell:not([mobile-layout])) nav {
|
|
60
64
|
border-right: 1px solid var(--ds-color-border);
|
|
61
65
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sidenav.styles.js","sourceRoot":"","sources":["../../../src/organisms/sidenav/sidenav.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"sidenav.styles.js","sourceRoot":"","sources":["../../../src/organisms/sidenav/sidenav.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgE/B,CAAC"}
|
|
@@ -8,6 +8,7 @@ import '../../atoms/icon/icons/x-mark.js';
|
|
|
8
8
|
* @tag ds-page-shell
|
|
9
9
|
* @summary Application frame: header + aside + main + optional footer with responsive collapse.
|
|
10
10
|
* @slot brand - Top-left brand/logo.
|
|
11
|
+
* @slot drawer-brand - Brand/logo shown at the start of the mobile navigation drawer.
|
|
11
12
|
* @slot header-actions - Top-right actions.
|
|
12
13
|
* @slot aside - Primary side navigation (inline-start). When empty, the column and hamburger toggle are not rendered.
|
|
13
14
|
* @slot aside-end - Secondary side region (inline-end), e.g. table of contents, contextual help. Hidden on mobile.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"page-shell.d.ts","sourceRoot":"","sources":["../../../src/templates/page-shell/page-shell.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAEhD,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAEjD,OAAO,8BAA8B,CAAC;AACtC,OAAO,4BAA4B,CAAC;AACpC,OAAO,kCAAkC,CAAC;AAC1C,OAAO,kCAAkC,CAAC;AAE1C
|
|
1
|
+
{"version":3,"file":"page-shell.d.ts","sourceRoot":"","sources":["../../../src/templates/page-shell/page-shell.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAEhD,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAEjD,OAAO,8BAA8B,CAAC;AACtC,OAAO,4BAA4B,CAAC;AACpC,OAAO,kCAAkC,CAAC;AAC1C,OAAO,kCAAkC,CAAC;AAE1C;;;;;;;;;;;;;GAaG;AACH,qBAAa,WAAY,SAAQ,SAAS;;IACxC,OAAgB,MAAM,4BAA0C;IAEpD,KAAK,SAAM;IACgB,SAAS,SAAqB;IAC/B,QAAQ,SAA0B;IAC/D,OAAO,CAAC,cAAc,CAAS;IAC/B,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,YAAY,CAAS;IAC7B,OAAO,CAAC,UAAU,CAAS;IAI3B,iBAAiB,IAAI,IAAI;IAuBzB,oBAAoB,IAAI,IAAI;IAS5B,YAAY,IAAI,IAAI;IAkFpB,MAAM,IAAI,cAAc;CAyElC"}
|
|
@@ -16,6 +16,7 @@ import '../../atoms/icon/icons/x-mark.js';
|
|
|
16
16
|
* @tag ds-page-shell
|
|
17
17
|
* @summary Application frame: header + aside + main + optional footer with responsive collapse.
|
|
18
18
|
* @slot brand - Top-left brand/logo.
|
|
19
|
+
* @slot drawer-brand - Brand/logo shown at the start of the mobile navigation drawer.
|
|
19
20
|
* @slot header-actions - Top-right actions.
|
|
20
21
|
* @slot aside - Primary side navigation (inline-start). When empty, the column and hamburger toggle are not rendered.
|
|
21
22
|
* @slot aside-end - Secondary side region (inline-end), e.g. table of contents, contextual help. Hidden on mobile.
|
|
@@ -150,7 +151,6 @@ export class DsPageShell extends DsElement {
|
|
|
150
151
|
#onAsideEndSlotChange;
|
|
151
152
|
#onFooterSlotChange;
|
|
152
153
|
render() {
|
|
153
|
-
const menuIcon = this._mobileNavOpen ? 'x-mark' : 'bars-3';
|
|
154
154
|
const ariaExpanded = this._mobileNavOpen ? 'true' : 'false';
|
|
155
155
|
const hasFooter = this._hasFooter || hasNamedSlotContent(this, 'footer');
|
|
156
156
|
return html `<header part="header">
|
|
@@ -166,13 +166,13 @@ export class DsPageShell extends DsElement {
|
|
|
166
166
|
aria-controls="mobile-aside"
|
|
167
167
|
@click=${this.#toggleMobileNav}
|
|
168
168
|
>
|
|
169
|
-
<ds-icon slot="leading" name
|
|
169
|
+
<ds-icon slot="leading" name="bars-3" size="xl"></ds-icon>
|
|
170
170
|
</ds-button>`
|
|
171
171
|
: null}
|
|
172
172
|
<div class="brand">
|
|
173
173
|
<slot name="brand">${this.brand}</slot>
|
|
174
174
|
</div>
|
|
175
|
-
<div><slot name="header-actions"></slot></div>
|
|
175
|
+
<div class="header-actions"><slot name="header-actions"></slot></div>
|
|
176
176
|
</div>
|
|
177
177
|
</header>
|
|
178
178
|
<button
|
|
@@ -190,6 +190,9 @@ export class DsPageShell extends DsElement {
|
|
|
190
190
|
@click=${this.#onAsideClick}
|
|
191
191
|
>
|
|
192
192
|
<div class="drawer-header">
|
|
193
|
+
<div class="drawer-brand">
|
|
194
|
+
<slot name="drawer-brand">${this.brand}</slot>
|
|
195
|
+
</div>
|
|
193
196
|
<ds-button
|
|
194
197
|
class="drawer-close"
|
|
195
198
|
variant="ghost"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"page-shell.js","sourceRoot":"","sources":["../../../src/templates/page-shell/page-shell.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAuB,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,8BAA8B,CAAC;AACtC,OAAO,4BAA4B,CAAC;AACpC,OAAO,kCAAkC,CAAC;AAC1C,OAAO,kCAAkC,CAAC;AAE1C
|
|
1
|
+
{"version":3,"file":"page-shell.js","sourceRoot":"","sources":["../../../src/templates/page-shell/page-shell.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"page-shell.styles.d.ts","sourceRoot":"","sources":["../../../src/templates/page-shell/page-shell.styles.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,eAAe,
|
|
1
|
+
{"version":3,"file":"page-shell.styles.d.ts","sourceRoot":"","sources":["../../../src/templates/page-shell/page-shell.styles.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,eAAe,yBAkO3B,CAAC"}
|
|
@@ -116,6 +116,11 @@ export const pageShellStyles = css `
|
|
|
116
116
|
letter-spacing: var(--ds-letter-spacing-display);
|
|
117
117
|
}
|
|
118
118
|
|
|
119
|
+
.header-actions {
|
|
120
|
+
display: inline-flex;
|
|
121
|
+
align-items: center;
|
|
122
|
+
}
|
|
123
|
+
|
|
119
124
|
.menu-toggle {
|
|
120
125
|
display: inline-flex;
|
|
121
126
|
}
|
|
@@ -125,6 +130,9 @@ export const pageShellStyles = css `
|
|
|
125
130
|
.drawer-header {
|
|
126
131
|
display: none;
|
|
127
132
|
}
|
|
133
|
+
.drawer-brand {
|
|
134
|
+
display: none;
|
|
135
|
+
}
|
|
128
136
|
.drawer-close {
|
|
129
137
|
display: none;
|
|
130
138
|
}
|
|
@@ -149,6 +157,13 @@ export const pageShellStyles = css `
|
|
|
149
157
|
}
|
|
150
158
|
:host([mobile-layout]) .brand {
|
|
151
159
|
flex: 1;
|
|
160
|
+
order: 0;
|
|
161
|
+
}
|
|
162
|
+
:host([mobile-layout]) .menu-toggle {
|
|
163
|
+
order: 1;
|
|
164
|
+
}
|
|
165
|
+
:host([mobile-layout]) .header-actions {
|
|
166
|
+
order: 2;
|
|
152
167
|
}
|
|
153
168
|
:host([mobile-layout]) aside[part="aside"] {
|
|
154
169
|
position: absolute;
|
|
@@ -173,10 +188,25 @@ export const pageShellStyles = css `
|
|
|
173
188
|
:host([mobile-layout]) .drawer-header {
|
|
174
189
|
display: flex;
|
|
175
190
|
align-items: center;
|
|
176
|
-
|
|
191
|
+
justify-content: space-between;
|
|
192
|
+
gap: var(--ds-space-3);
|
|
193
|
+
padding: var(--ds-space-2) var(--ds-space-4);
|
|
194
|
+
}
|
|
195
|
+
:host([mobile-layout]) .drawer-brand {
|
|
196
|
+
display: inline-flex;
|
|
197
|
+
align-items: center;
|
|
198
|
+
flex: 1;
|
|
199
|
+
min-width: 0;
|
|
200
|
+
font-family: var(--ds-font-display);
|
|
201
|
+
font-size: var(--ds-font-size-lg);
|
|
202
|
+
letter-spacing: var(--ds-letter-spacing-display);
|
|
203
|
+
}
|
|
204
|
+
:host([mobile-layout]) slot[name='drawer-brand']::slotted(*) {
|
|
205
|
+
max-width: 100%;
|
|
177
206
|
}
|
|
178
207
|
:host([mobile-layout]) .drawer-close {
|
|
179
208
|
display: inline-flex;
|
|
209
|
+
flex: 0 0 auto;
|
|
180
210
|
margin: 0;
|
|
181
211
|
}
|
|
182
212
|
:host([mobile-layout]) aside[part="aside"] ::slotted(ds-sidenav) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"page-shell.styles.js","sourceRoot":"","sources":["../../../src/templates/page-shell/page-shell.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAEpD,MAAM,sBAAsB,GAAG,SAAS,CAAC,QAAQ,UAAU,CAAC,EAAE,YAAY,CAAC,CAAC;AAE5E,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uBAmGX,sBAAsB
|
|
1
|
+
{"version":3,"file":"page-shell.styles.js","sourceRoot":"","sources":["../../../src/templates/page-shell/page-shell.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAEpD,MAAM,sBAAsB,GAAG,SAAS,CAAC,QAAQ,UAAU,CAAC,EAAE,YAAY,CAAC,CAAC;AAE5E,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uBAmGX,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+H5C,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jsekulowicz/ds-components",
|
|
3
|
-
"version": "0.5.
|
|
3
|
+
"version": "0.5.2",
|
|
4
4
|
"description": "Lit web components for the Design System Library (atoms, molecules, organisms, templates, pages).",
|
|
5
5
|
"license": "UNLICENSED",
|
|
6
6
|
"repository": {
|
|
@@ -132,6 +132,10 @@
|
|
|
132
132
|
"types": "./dist/atoms/icon/icons/user.d.ts",
|
|
133
133
|
"import": "./dist/atoms/icon/icons/user.js"
|
|
134
134
|
},
|
|
135
|
+
"./icon/user-circle": {
|
|
136
|
+
"types": "./dist/atoms/icon/icons/user-circle.d.ts",
|
|
137
|
+
"import": "./dist/atoms/icon/icons/user-circle.js"
|
|
138
|
+
},
|
|
135
139
|
"./icon/users": {
|
|
136
140
|
"types": "./dist/atoms/icon/icons/users.d.ts",
|
|
137
141
|
"import": "./dist/atoms/icon/icons/users.js"
|