@oslokommune/punkt-elements 12.34.0 → 12.34.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/dist/accordion.d.ts +3 -3
- package/dist/alert-B3HuK30R.cjs +32 -0
- package/dist/{alert-DjT5NY6b.js → alert-BOvwM-m4.js} +41 -32
- package/dist/alert.d.ts +3 -3
- package/dist/backlink.d.ts +3 -3
- package/dist/button.d.ts +3 -3
- package/dist/calendar.d.ts +3 -3
- package/dist/card.d.ts +3 -3
- package/dist/checkbox.d.ts +3 -3
- package/dist/combobox.d.ts +3 -3
- package/dist/datepicker.d.ts +3 -3
- package/dist/helptext.d.ts +3 -3
- package/dist/icon.d.ts +3 -3
- package/dist/index.d.ts +3 -3
- package/dist/input-wrapper.d.ts +3 -3
- package/dist/link.d.ts +3 -3
- package/dist/linkcard.d.ts +3 -3
- package/dist/listbox.d.ts +3 -3
- package/dist/loader.d.ts +3 -3
- package/dist/messagebox.d.ts +3 -3
- package/dist/modal.d.ts +3 -3
- package/dist/pkt-alert.cjs +1 -1
- package/dist/pkt-alert.js +1 -1
- package/dist/pkt-index.cjs +1 -1
- package/dist/pkt-index.js +1 -1
- package/dist/progressbar.d.ts +3 -3
- package/dist/radiobutton.d.ts +3 -3
- package/dist/select.d.ts +3 -3
- package/dist/tag.d.ts +3 -3
- package/dist/textarea.d.ts +3 -3
- package/dist/textinput.d.ts +3 -3
- package/package.json +3 -3
- package/src/components/alert/alert.ts +38 -27
- package/dist/alert-CrBZnND3.cjs +0 -27
package/dist/accordion.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"use strict";const c=require("./class-map-BjTUtIEl.cjs"),e=require("./element-BYpg5e6C.cjs"),u=require("./state-y7tCw3bg.cjs"),h=require("./pkt-slot-controller-plQxXRvV.cjs"),d=require("./ref-BbKbXwub.cjs"),k=require("./classutils-BwNK82ZQ.cjs");require("./icon-Cc4gVHxd.cjs");const v={skin:{default:"info"},ariaLive:{default:"polite"},compact:{default:!1},closeAlert:{default:!1}},a={props:v};var f=Object.defineProperty,_=Object.getOwnPropertyDescriptor,i=(o,t,s,l)=>{for(var r=l>1?void 0:l?_(t,s):t,p=o.length-1,n;p>=0;p--)(n=o[p])&&(r=(l?n(t,s,r):n(r))||r);return l&&r&&f(t,s,r),r};exports.PktAlert=class extends e.PktElement{constructor(){super(),this.defaultSlot=d.e(),this.compact=a.props.compact.default,this.title="",this.skin=a.props.skin.default,this.ariaLive=a.props.ariaLive.default,this["aria-live"]=null,this.closeAlert=a.props.closeAlert.default,this.date=null,this._isClosed=!1,this.close=t=>{this._isClosed=!0,this.dispatchEvent(new CustomEvent("close",{detail:{origin:t},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("on-close",{detail:{origin:t},bubbles:!0,composed:!0}))},this.slotController=new h.PktSlotController(this,this.defaultSlot),this._isClosed=!1}connectedCallback(){super.connectedCallback(),this["aria-live"]=this.getAttribute("aria-live")||this.ariaLive}attributeChangedCallback(t,s,l){t==="ariaLive"&&(this["aria-live"]=l),super.attributeChangedCallback(t,s,l)}updated(t){super.updated(t),t.has("ariaLive")&&(this["aria-live"]=this.ariaLive),t.has("_isClosed")&&k.updateClassAttribute(this,"pkt-hide",this._isClosed)}render(){const t={"pkt-alert":!0,"pkt-alert--compact":this.compact,[`pkt-alert--${this.skin}`]:this.skin,"pkt-hide":this._isClosed},s={"pkt-alert__grid":!0,"pkt-alert__noTitle":!this.title,"pkt-alert__noDate":!this.date};return e.x`
|
|
2
|
+
<div class=${c.e(t)}>
|
|
3
|
+
<div class=${c.e(s)}>
|
|
4
|
+
<pkt-icon
|
|
5
|
+
class="pkt-alert__icon"
|
|
6
|
+
aria-hidden="true"
|
|
7
|
+
name=${this.skin==="info"?"alert-information":`alert-${this.skin}`}
|
|
8
|
+
></pkt-icon>
|
|
9
|
+
|
|
10
|
+
${this.closeAlert?e.x`
|
|
11
|
+
<div class="pkt-alert__close">
|
|
12
|
+
<pkt-button
|
|
13
|
+
tabindex="0"
|
|
14
|
+
aria-label="close"
|
|
15
|
+
size=${this.compact?"small":"medium"}
|
|
16
|
+
type="button"
|
|
17
|
+
skin="tertiary"
|
|
18
|
+
iconName="close"
|
|
19
|
+
variant="icon-only"
|
|
20
|
+
@click=${this.close}
|
|
21
|
+
>
|
|
22
|
+
</pkt-button>
|
|
23
|
+
</div>
|
|
24
|
+
`:e.E}
|
|
25
|
+
${this.title?e.x`<div class="pkt-alert__title">${this.title}</div>`:e.E}
|
|
26
|
+
|
|
27
|
+
<div class="pkt-alert__text" ${d.n(this.defaultSlot)}></div>
|
|
28
|
+
|
|
29
|
+
${this.date?e.x`<div class="pkt-alert__date">Sist oppdatert: ${this.date}</div>`:e.E}
|
|
30
|
+
</div>
|
|
31
|
+
</div>
|
|
32
|
+
`}};i([e.n({type:Boolean,reflect:!1})],exports.PktAlert.prototype,"compact",2);i([e.n({type:String,reflect:!0})],exports.PktAlert.prototype,"title",2);i([e.n({type:String,reflect:!0})],exports.PktAlert.prototype,"skin",2);i([e.n({type:String})],exports.PktAlert.prototype,"ariaLive",2);i([e.n({type:String,reflect:!0})],exports.PktAlert.prototype,"aria-live",2);i([e.n({type:Boolean,reflect:!0})],exports.PktAlert.prototype,"closeAlert",2);i([e.n({type:String,reflect:!0})],exports.PktAlert.prototype,"date",2);i([u.r()],exports.PktAlert.prototype,"_isClosed",2);exports.PktAlert=i([e.t("pkt-alert")],exports.PktAlert);
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { e as
|
|
2
|
-
import { P as f, E as
|
|
1
|
+
import { e as u } from "./class-map-D4QK1bDP.js";
|
|
2
|
+
import { P as f, E as h, x as p, n as l, a as v } from "./element-J964Wi0N.js";
|
|
3
3
|
import { r as k } from "./state-fdb9lRrL.js";
|
|
4
4
|
import { P as m } from "./pkt-slot-controller-DFrc5O93.js";
|
|
5
|
-
import { e as
|
|
5
|
+
import { e as _, n as b } from "./ref-3rhflVgg.js";
|
|
6
6
|
import { u as C } from "./classutils-RQs1k6D9.js";
|
|
7
7
|
import "./icon-kSv2VoAB.js";
|
|
8
8
|
const y = {
|
|
@@ -18,17 +18,17 @@ const y = {
|
|
|
18
18
|
closeAlert: {
|
|
19
19
|
default: !1
|
|
20
20
|
}
|
|
21
|
-
},
|
|
21
|
+
}, c = {
|
|
22
22
|
props: y
|
|
23
23
|
};
|
|
24
|
-
var $ = Object.defineProperty,
|
|
25
|
-
for (var
|
|
26
|
-
(d = t[
|
|
27
|
-
return o &&
|
|
24
|
+
var $ = Object.defineProperty, g = Object.getOwnPropertyDescriptor, i = (t, s, r, o) => {
|
|
25
|
+
for (var a = o > 1 ? void 0 : o ? g(s, r) : s, n = t.length - 1, d; n >= 0; n--)
|
|
26
|
+
(d = t[n]) && (a = (o ? d(s, r, a) : d(a)) || a);
|
|
27
|
+
return o && a && $(s, r, a), a;
|
|
28
28
|
};
|
|
29
29
|
let e = class extends f {
|
|
30
30
|
constructor() {
|
|
31
|
-
super(), this.defaultSlot =
|
|
31
|
+
super(), this.defaultSlot = _(), this.compact = c.props.compact.default, this.title = "", this.skin = c.props.skin.default, this.ariaLive = c.props.ariaLive.default, this["aria-live"] = null, this.closeAlert = c.props.closeAlert.default, this.date = null, this._isClosed = !1, this.close = (t) => {
|
|
32
32
|
this._isClosed = !0, this.dispatchEvent(
|
|
33
33
|
new CustomEvent("close", { detail: { origin: t }, bubbles: !0, composed: !0 })
|
|
34
34
|
), this.dispatchEvent(
|
|
@@ -40,8 +40,8 @@ let e = class extends f {
|
|
|
40
40
|
connectedCallback() {
|
|
41
41
|
super.connectedCallback(), this["aria-live"] = this.getAttribute("aria-live") || this.ariaLive;
|
|
42
42
|
}
|
|
43
|
-
attributeChangedCallback(t,
|
|
44
|
-
t === "ariaLive" && (this["aria-live"] = r), super.attributeChangedCallback(t,
|
|
43
|
+
attributeChangedCallback(t, s, r) {
|
|
44
|
+
t === "ariaLive" && (this["aria-live"] = r), super.attributeChangedCallback(t, s, r);
|
|
45
45
|
}
|
|
46
46
|
updated(t) {
|
|
47
47
|
super.updated(t), t.has("ariaLive") && (this["aria-live"] = this.ariaLive), t.has("_isClosed") && C(this, "pkt-hide", this._isClosed);
|
|
@@ -53,32 +53,41 @@ let e = class extends f {
|
|
|
53
53
|
"pkt-alert--compact": this.compact,
|
|
54
54
|
[`pkt-alert--${this.skin}`]: this.skin,
|
|
55
55
|
"pkt-hide": this._isClosed
|
|
56
|
+
}, s = {
|
|
57
|
+
"pkt-alert__grid": !0,
|
|
58
|
+
"pkt-alert__noTitle": !this.title,
|
|
59
|
+
"pkt-alert__noDate": !this.date
|
|
56
60
|
};
|
|
57
61
|
return p`
|
|
58
|
-
<div class=${
|
|
59
|
-
<
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
62
|
+
<div class=${u(t)}>
|
|
63
|
+
<div class=${u(s)}>
|
|
64
|
+
<pkt-icon
|
|
65
|
+
class="pkt-alert__icon"
|
|
66
|
+
aria-hidden="true"
|
|
67
|
+
name=${this.skin === "info" ? "alert-information" : `alert-${this.skin}`}
|
|
68
|
+
></pkt-icon>
|
|
63
69
|
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
70
|
+
${this.closeAlert ? p`
|
|
71
|
+
<div class="pkt-alert__close">
|
|
72
|
+
<pkt-button
|
|
73
|
+
tabindex="0"
|
|
74
|
+
aria-label="close"
|
|
75
|
+
size=${this.compact ? "small" : "medium"}
|
|
76
|
+
type="button"
|
|
77
|
+
skin="tertiary"
|
|
78
|
+
iconName="close"
|
|
79
|
+
variant="icon-only"
|
|
80
|
+
@click=${this.close}
|
|
81
|
+
>
|
|
82
|
+
</pkt-button>
|
|
83
|
+
</div>
|
|
84
|
+
` : h}
|
|
85
|
+
${this.title ? p`<div class="pkt-alert__title">${this.title}</div>` : h}
|
|
78
86
|
|
|
79
|
-
|
|
87
|
+
<div class="pkt-alert__text" ${b(this.defaultSlot)}></div>
|
|
80
88
|
|
|
81
|
-
|
|
89
|
+
${this.date ? p`<div class="pkt-alert__date">Sist oppdatert: ${this.date}</div>` : h}
|
|
90
|
+
</div>
|
|
82
91
|
</div>
|
|
83
92
|
`;
|
|
84
93
|
}
|
package/dist/alert.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/backlink.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/button.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/calendar.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/card.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/checkbox.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/combobox.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/datepicker.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/helptext.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/icon.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/index.d.ts
CHANGED
|
@@ -1125,21 +1125,21 @@ export { }
|
|
|
1125
1125
|
|
|
1126
1126
|
declare global {
|
|
1127
1127
|
interface HTMLElementTagNameMap {
|
|
1128
|
-
'pkt-
|
|
1128
|
+
'pkt-icon': PktIcon;
|
|
1129
1129
|
}
|
|
1130
1130
|
}
|
|
1131
1131
|
|
|
1132
1132
|
|
|
1133
1133
|
declare global {
|
|
1134
1134
|
interface HTMLElementTagNameMap {
|
|
1135
|
-
'pkt-
|
|
1135
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
1136
1136
|
}
|
|
1137
1137
|
}
|
|
1138
1138
|
|
|
1139
1139
|
|
|
1140
1140
|
declare global {
|
|
1141
1141
|
interface HTMLElementTagNameMap {
|
|
1142
|
-
'pkt-
|
|
1142
|
+
'pkt-listbox': PktListbox;
|
|
1143
1143
|
}
|
|
1144
1144
|
}
|
|
1145
1145
|
|
package/dist/input-wrapper.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/link.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/linkcard.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/listbox.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/loader.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/messagebox.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/modal.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/pkt-alert.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./alert-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./alert-B3HuK30R.cjs"),t=e.PktAlert;Object.defineProperty(exports,"PktAlert",{enumerable:!0,get:()=>e.PktAlert});exports.default=t;
|
package/dist/pkt-alert.js
CHANGED
package/dist/pkt-index.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("./alert-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("./alert-B3HuK30R.cjs"),l=require("./accordionitem-DDnUkCJP.cjs"),P=require("./backlink-1p-ADrG8.cjs"),b=require("./button-5tOMyPEx.cjs"),p=require("./calendar-BU7DqDLG.cjs"),m=require("./card-a_Cs18EQ.cjs"),g=require("./combobox-DqHwVglB.cjs"),h=require("./checkbox-bsBqWqcn.cjs"),t=require("./element-BYpg5e6C.cjs"),f=require("./pkt-slot-controller-plQxXRvV.cjs"),s=require("./ref-BbKbXwub.cjs"),y=require("./class-map-BjTUtIEl.cjs"),x=require("./datepicker-DW6AdQ9X.cjs"),O=require("./helptext-OW48aGy8.cjs"),j=require("./icon-Cc4gVHxd.cjs"),q=require("./input-wrapper-DmVnotQ2.cjs"),C=require("./link-3uccc2MM.cjs"),v=require("./linkcard-P1I3dzQb.cjs"),S=require("./loader-CM7wLajY.cjs"),$=require("./messagebox-CD8fS0Ym.cjs"),L=require("./modal-DOCsiHGv.cjs"),_=require("./progressbar-BmI-K95y.cjs"),k=require("./radiobutton-CJYNTtFF.cjs"),A=require("./tag-Dg2-c_OZ.cjs"),B=require("./textarea-go_AyeP-.cjs"),T=require("./textinput-FvLq5W70.cjs"),I=require("./select-Swc0c6lZ.cjs");var M=Object.defineProperty,R=Object.getOwnPropertyDescriptor,o=(a,e,r,i)=>{for(var n=i>1?void 0:i?R(e,r):e,u=a.length-1,c;u>=0;u--)(c=a[u])&&(n=(i?c(e,r,n):c(n))||n);return i&&n&&M(e,r,n),n};exports.PktComponent=class extends t.PktElement{constructor(){super(),this.string="",this.strings=[],this.darkmode=!1,this._list=[],this.defaultSlot=s.e(),this.namedSlot=s.e(),this.slotController=new f.PktSlotController(this,this.defaultSlot,this.namedSlot)}connectedCallback(){this.strings.length&&this.strings.forEach(e=>{this._list.push(e.toUpperCase())}),super.connectedCallback()}render(){const e={"pkt-component":!0,"pkt-component--has-list":this.strings.length>0,"pkt-darkmode":this.darkmode};return t.x`
|
|
2
2
|
<div class="${y.e(e)}">
|
|
3
3
|
<h1 class="pkt-txt-28">${this.string}</h1>
|
|
4
4
|
|
package/dist/pkt-index.js
CHANGED
package/dist/progressbar.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/radiobutton.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/select.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/tag.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/textarea.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/dist/textinput.d.ts
CHANGED
|
@@ -3,21 +3,21 @@ export { }
|
|
|
3
3
|
|
|
4
4
|
declare global {
|
|
5
5
|
interface HTMLElementTagNameMap {
|
|
6
|
-
'pkt-
|
|
6
|
+
'pkt-icon': PktIcon;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
13
|
-
'pkt-
|
|
13
|
+
'pkt-combobox': PktCombobox & HTMLSelectElement;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'pkt-
|
|
20
|
+
'pkt-listbox': PktListbox;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@oslokommune/punkt-elements",
|
|
3
|
-
"version": "12.34.
|
|
3
|
+
"version": "12.34.2",
|
|
4
4
|
"description": "Komponentbiblioteket til Punkt, et designsystem laget av Oslo Origo",
|
|
5
5
|
"homepage": "https://punkt.oslo.kommune.no",
|
|
6
6
|
"author": "Team Designsystem, Oslo Origo",
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
},
|
|
31
31
|
"devDependencies": {
|
|
32
32
|
"@oslokommune/punkt-assets": "^12.30.1",
|
|
33
|
-
"@oslokommune/punkt-css": "^12.34.
|
|
33
|
+
"@oslokommune/punkt-css": "^12.34.2",
|
|
34
34
|
"sass": "^1.78.0",
|
|
35
35
|
"typescript": "^5.6.2",
|
|
36
36
|
"vite": "^5.4.18",
|
|
@@ -57,5 +57,5 @@
|
|
|
57
57
|
"url": "https://github.com/oslokommune/punkt/issues"
|
|
58
58
|
},
|
|
59
59
|
"license": "MIT",
|
|
60
|
-
"gitHead": "
|
|
60
|
+
"gitHead": "780c78ea4619450ddd43ba97183c2eb239a53524"
|
|
61
61
|
}
|
|
@@ -78,35 +78,46 @@ export class PktAlert extends PktElement implements IPktAlert {
|
|
|
78
78
|
'pkt-hide': this._isClosed,
|
|
79
79
|
}
|
|
80
80
|
|
|
81
|
+
const gridClasses = {
|
|
82
|
+
'pkt-alert__grid': true,
|
|
83
|
+
'pkt-alert__noTitle': !this.title,
|
|
84
|
+
'pkt-alert__noDate': !this.date,
|
|
85
|
+
}
|
|
86
|
+
|
|
81
87
|
return html`
|
|
82
88
|
<div class=${classMap(classes)}>
|
|
83
|
-
<
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
89
|
+
<div class=${classMap(gridClasses)}>
|
|
90
|
+
<pkt-icon
|
|
91
|
+
class="pkt-alert__icon"
|
|
92
|
+
aria-hidden="true"
|
|
93
|
+
name=${this.skin === 'info' ? 'alert-information' : `alert-${this.skin}`}
|
|
94
|
+
></pkt-icon>
|
|
95
|
+
|
|
96
|
+
${this.closeAlert
|
|
97
|
+
? html`
|
|
98
|
+
<div class="pkt-alert__close">
|
|
99
|
+
<pkt-button
|
|
100
|
+
tabindex="0"
|
|
101
|
+
aria-label="close"
|
|
102
|
+
size=${this.compact ? 'small' : 'medium'}
|
|
103
|
+
type="button"
|
|
104
|
+
skin="tertiary"
|
|
105
|
+
iconName="close"
|
|
106
|
+
variant="icon-only"
|
|
107
|
+
@click=${this.close}
|
|
108
|
+
>
|
|
109
|
+
</pkt-button>
|
|
110
|
+
</div>
|
|
111
|
+
`
|
|
112
|
+
: nothing}
|
|
113
|
+
${this.title ? html`<div class="pkt-alert__title">${this.title}</div>` : nothing}
|
|
114
|
+
|
|
115
|
+
<div class="pkt-alert__text" ${ref(this.defaultSlot)}></div>
|
|
116
|
+
|
|
117
|
+
${this.date
|
|
118
|
+
? html`<div class="pkt-alert__date">Sist oppdatert: ${this.date}</div>`
|
|
119
|
+
: nothing}
|
|
120
|
+
</div>
|
|
110
121
|
</div>
|
|
111
122
|
`
|
|
112
123
|
}
|
package/dist/alert-CrBZnND3.cjs
DELETED
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
"use strict";const u=require("./class-map-BjTUtIEl.cjs"),e=require("./element-BYpg5e6C.cjs"),d=require("./state-y7tCw3bg.cjs"),h=require("./pkt-slot-controller-plQxXRvV.cjs"),c=require("./ref-BbKbXwub.cjs"),k=require("./classutils-BwNK82ZQ.cjs");require("./icon-Cc4gVHxd.cjs");const f={skin:{default:"info"},ariaLive:{default:"polite"},compact:{default:!1},closeAlert:{default:!1}},a={props:f};var v=Object.defineProperty,b=Object.getOwnPropertyDescriptor,s=(o,t,r,i)=>{for(var l=i>1?void 0:i?b(t,r):t,p=o.length-1,n;p>=0;p--)(n=o[p])&&(l=(i?n(t,r,l):n(l))||l);return i&&l&&v(t,r,l),l};exports.PktAlert=class extends e.PktElement{constructor(){super(),this.defaultSlot=c.e(),this.compact=a.props.compact.default,this.title="",this.skin=a.props.skin.default,this.ariaLive=a.props.ariaLive.default,this["aria-live"]=null,this.closeAlert=a.props.closeAlert.default,this.date=null,this._isClosed=!1,this.close=t=>{this._isClosed=!0,this.dispatchEvent(new CustomEvent("close",{detail:{origin:t},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("on-close",{detail:{origin:t},bubbles:!0,composed:!0}))},this.slotController=new h.PktSlotController(this,this.defaultSlot),this._isClosed=!1}connectedCallback(){super.connectedCallback(),this["aria-live"]=this.getAttribute("aria-live")||this.ariaLive}attributeChangedCallback(t,r,i){t==="ariaLive"&&(this["aria-live"]=i),super.attributeChangedCallback(t,r,i)}updated(t){super.updated(t),t.has("ariaLive")&&(this["aria-live"]=this.ariaLive),t.has("_isClosed")&&k.updateClassAttribute(this,"pkt-hide",this._isClosed)}render(){const t={"pkt-alert":!0,"pkt-alert--compact":this.compact,[`pkt-alert--${this.skin}`]:this.skin,"pkt-hide":this._isClosed};return e.x`
|
|
2
|
-
<div class=${u.e(t)}>
|
|
3
|
-
<pkt-icon
|
|
4
|
-
class="pkt-alert__icon"
|
|
5
|
-
name=${this.skin==="info"?"alert-information":`alert-${this.skin}`}
|
|
6
|
-
></pkt-icon>
|
|
7
|
-
|
|
8
|
-
${this.closeAlert?e.x`
|
|
9
|
-
<div class="pkt-alert__close">
|
|
10
|
-
<button
|
|
11
|
-
type="button"
|
|
12
|
-
class="pkt-btn pkt-btn--tertiary pkt-btn--small pkt-btn--icon-only"
|
|
13
|
-
tabindex="0"
|
|
14
|
-
aria-label="close"
|
|
15
|
-
@click=${this.close}
|
|
16
|
-
>
|
|
17
|
-
<pkt-icon name="close" class="pkt-btn__icon" aria-hidden="true"></pkt-icon>
|
|
18
|
-
</button>
|
|
19
|
-
</div>
|
|
20
|
-
`:e.E}
|
|
21
|
-
${this.title?e.x`<div class="pkt-alert__title">${this.title}</div>`:e.E}
|
|
22
|
-
|
|
23
|
-
<div class="pkt-alert__text" ${c.n(this.defaultSlot)}></div>
|
|
24
|
-
|
|
25
|
-
${this.date?e.x`<div class="pkt-alert__date">Sist oppdatert: ${this.date}</div>`:e.E}
|
|
26
|
-
</div>
|
|
27
|
-
`}};s([e.n({type:Boolean,reflect:!1})],exports.PktAlert.prototype,"compact",2);s([e.n({type:String,reflect:!0})],exports.PktAlert.prototype,"title",2);s([e.n({type:String,reflect:!0})],exports.PktAlert.prototype,"skin",2);s([e.n({type:String})],exports.PktAlert.prototype,"ariaLive",2);s([e.n({type:String,reflect:!0})],exports.PktAlert.prototype,"aria-live",2);s([e.n({type:Boolean,reflect:!0})],exports.PktAlert.prototype,"closeAlert",2);s([e.n({type:String,reflect:!0})],exports.PktAlert.prototype,"date",2);s([d.r()],exports.PktAlert.prototype,"_isClosed",2);exports.PktAlert=s([e.t("pkt-alert")],exports.PktAlert);
|