nve-designsystem 0.1.55 → 0.1.56

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/components/nve-checkbox-group/nve-checkbox-group.component.d.ts +1 -1
  2. package/components/nve-checkbox-group/nve-checkbox-group.component.js +74 -61
  3. package/package.json +1 -1
package/components/nve-checkbox-group/nve-checkbox-group.component.d.ts CHANGED
@@ -3,7 +3,7 @@ import { LitElement } from 'lit';
3
3
  * Representerer en tilpasset sjekboksgruppekomponent.
4
4
  * Denne komponenten burde brukes kun med <nve-checkbox> komponent.
5
5
  * Man kan ta i bruk selectedValues som inneholder value-attributet fra alle aktive sjekkbokser inn i sjekkboksgruppen. Den
6
- * oppdaterer seg automatisk når mån klikker på sjekkbokser.
6
+ * oppdaterer seg automatisk når mån klikker på sjekkbokser. Man kan lagre både primitiver og objekter i selectedValues.
7
7
  * Valideres både med constraint validation (kun required støttes per i dag), og custom validering. Custom validering prioriteres når man submitter formen.
8
8
  * <nve-checkbox> komponenter som er wrappet i <nve-checkbox-group>
9
9
  * @slot default - innholder alle nve-checkbox komponenter for global style styring og validering
package/components/nve-checkbox-group/nve-checkbox-group.component.js CHANGED
@@ -1,10 +1,10 @@
1
- import { s as u, x as n } from "../../chunks/lit-element.js";
2
- import { n as l, t as p } from "../../chunks/property.js";
3
- import { r as c } from "../../chunks/state.js";
4
- import { e as b } from "../../chunks/query.js";
1
+ import { s as p, x as c } from "../../chunks/lit-element.js";
2
+ import { n as a, t as b } from "../../chunks/property.js";
3
+ import { r as d } from "../../chunks/state.js";
4
+ import { e as f } from "../../chunks/query.js";
5
5
  import "../nve-label/nve-label.component.js";
6
- import v from "./nve-checkbox-group.styles.js";
7
- import { t as m } from "../../chunks/updateInvalidProperty.js";
6
+ import m from "./nve-checkbox-group.styles.js";
7
+ import { t as v } from "../../chunks/updateInvalidProperty.js";
8
8
  import "../nve-label/nve-label.styles.js";
9
9
  import "../nve-icon/nve-icon.component.js";
10
10
  import "../nve-icon/nve-icon.styles.js";
@@ -15,12 +15,25 @@ import "../../chunks/class-map.js";
15
15
  import "../../chunks/chunk.KRRLOROJ.js";
16
16
  import "../../chunks/chunk.MAS2SHYD.js";
17
17
  import "../../chunks/chunk.Q6ASPMKT.js";
18
- var f = Object.defineProperty, g = Object.getOwnPropertyDescriptor, i = (e, t, s, o) => {
19
- for (var a = o > 1 ? void 0 : o ? g(t, s) : t, h = e.length - 1, d; h >= 0; h--)
20
- (d = e[h]) && (a = (o ? d(t, s, a) : d(a)) || a);
21
- return o && a && f(t, s, a), a;
18
+ function u(e, t) {
19
+ if (e === t)
20
+ return !0;
21
+ if (typeof e != "object" || e === null || typeof t != "object" || t === null)
22
+ return !1;
23
+ let r = Object.keys(e), i = Object.keys(t);
24
+ if (r.length !== i.length)
25
+ return !1;
26
+ for (let l of r)
27
+ if (!i.includes(l) || !u(e[l], t[l]))
28
+ return !1;
29
+ return !0;
30
+ }
31
+ var g = Object.defineProperty, y = Object.getOwnPropertyDescriptor, o = (e, t, r, i) => {
32
+ for (var l = i > 1 ? void 0 : i ? y(t, r) : t, n = e.length - 1, h; n >= 0; n--)
33
+ (h = e[n]) && (l = (i ? h(t, r, l) : h(l)) || l);
34
+ return i && l && g(t, r, l), l;
22
35
  };
23
- let r = class extends u {
36
+ let s = class extends p {
24
37
  constructor() {
25
38
  super(), this.disabled = !1, this.required = !1, this.orientation = "vertical", this.requiredLabel = "*Obligatorisk", this.showErrorMessage = !1, this.isCustomValidationError = !1, this.updateSelectedValues = (e) => {
26
39
  if (!this.selectedValues)
@@ -29,8 +42,8 @@ let r = class extends u {
29
42
  if (t.checked)
30
43
  this.selectedValues.push(t.value);
31
44
  else {
32
- const s = this.selectedValues.findIndex((o) => o === t.value);
33
- s !== -1 && this.selectedValues.splice(s, 1);
45
+ const r = this.selectedValues.findIndex((i) => u(i, t.value));
46
+ r !== -1 && this.selectedValues.splice(r, 1);
34
47
  }
35
48
  this.requestUpdate();
36
49
  };
@@ -47,15 +60,15 @@ let r = class extends u {
47
60
  var t;
48
61
  if (this.requiredLabel && this.style.setProperty("--sl-checkbox-required-content", `"${this.requiredLabel}"`), !((t = this.selectedValues) != null && t.length))
49
62
  return;
50
- Array.from(this.querySelectorAll("nve-checkbox")).forEach((s) => {
51
- var o;
52
- (o = this.selectedValues) != null && o.includes(s.value) ? s.checked = !0 : s.checked = !1;
63
+ Array.from(this.querySelectorAll("nve-checkbox")).forEach((r) => {
64
+ var i;
65
+ (i = this.selectedValues) != null && i.includes(r.value) ? r.checked = !0 : r.checked = !1;
53
66
  });
54
67
  }
55
68
  updated(e) {
56
69
  if (super.updated(e), e.has("disabled")) {
57
70
  const t = Array.from(this.querySelectorAll("nve-checkbox"));
58
- m(t, this.disabled, "disabled");
71
+ v(t, this.disabled, "disabled");
59
72
  }
60
73
  }
61
74
  /** En 'fake' metode som gjør custom validering enklere på checkbox-group komponent */
@@ -86,8 +99,8 @@ let r = class extends u {
86
99
  }), this.showErrorMessage = !1;
87
100
  }
88
101
  makeInvalid() {
89
- Array.from(this.querySelectorAll("nve-checkbox")).forEach((s) => {
90
- s.toggleAttribute("data-user-invalid", !0), s.setCustomValidity(this.errorMessage || "Error");
102
+ Array.from(this.querySelectorAll("nve-checkbox")).forEach((r) => {
103
+ r.toggleAttribute("data-user-invalid", !0), r.setCustomValidity(this.errorMessage || "Error");
91
104
  }), this.showErrorMessage = !0;
92
105
  const t = new Event("sl-invalid", {
93
106
  bubbles: !0,
@@ -96,10 +109,10 @@ let r = class extends u {
96
109
  this.dispatchEvent(t);
97
110
  }
98
111
  checkIfRequiredValid() {
99
- return Array.from(this.querySelectorAll("nve-checkbox")).some((s) => s.checked);
112
+ return Array.from(this.querySelectorAll("nve-checkbox")).some((r) => r.checked);
100
113
  }
101
114
  render() {
102
- return n`
115
+ return c`
103
116
  <fieldset
104
117
  class="checkbox-group"
105
118
  aria-required=${this.required}
@@ -107,54 +120,54 @@ let r = class extends u {
107
120
  aria-describedby="error-message"
108
121
  aria-errormessage="error-message"
109
122
  >
110
- ${this.label ? n`<div class="checkbox-group__label">
123
+ ${this.label ? c`<div class="checkbox-group__label">
111
124
  <nve-label id="label" value=${this.label} size="small" tooltip=${this.tooltip}></nve-label>
112
125
  </div>` : null}
113
126
  <slot class="checkbox-group__checkboxes"></slot>
114
- ${this.showErrorMessage ? n`<span role="alert" id="error-message" class="checkbox-group__error-message"
127
+ ${this.showErrorMessage ? c`<span role="alert" id="error-message" class="checkbox-group__error-message"
115
128
  >${this.errorMessage || null}</span
116
129
  >` : null}
117
130
  </fieldset>
118
131
  `;
119
132
  }
120
133
  };
121
- r.styles = [v];
122
- i([
123
- l({ type: Boolean, reflect: !0 })
124
- ], r.prototype, "disabled", 2);
125
- i([
126
- l({ type: Boolean, reflect: !0 })
127
- ], r.prototype, "required", 2);
128
- i([
129
- l()
130
- ], r.prototype, "label", 2);
131
- i([
132
- l()
133
- ], r.prototype, "tooltip", 2);
134
- i([
135
- l()
136
- ], r.prototype, "orientation", 2);
137
- i([
138
- l()
139
- ], r.prototype, "errorMessage", 2);
140
- i([
141
- l()
142
- ], r.prototype, "requiredLabel", 2);
143
- i([
144
- l({ type: Array })
145
- ], r.prototype, "selectedValues", 2);
146
- i([
147
- b("slot")
148
- ], r.prototype, "slot", 2);
149
- i([
150
- c()
151
- ], r.prototype, "showErrorMessage", 2);
152
- i([
153
- c()
154
- ], r.prototype, "isCustomValidationError", 2);
155
- r = i([
156
- p("nve-checkbox-group")
157
- ], r);
134
+ s.styles = [m];
135
+ o([
136
+ a({ type: Boolean, reflect: !0 })
137
+ ], s.prototype, "disabled", 2);
138
+ o([
139
+ a({ type: Boolean, reflect: !0 })
140
+ ], s.prototype, "required", 2);
141
+ o([
142
+ a()
143
+ ], s.prototype, "label", 2);
144
+ o([
145
+ a()
146
+ ], s.prototype, "tooltip", 2);
147
+ o([
148
+ a()
149
+ ], s.prototype, "orientation", 2);
150
+ o([
151
+ a()
152
+ ], s.prototype, "errorMessage", 2);
153
+ o([
154
+ a()
155
+ ], s.prototype, "requiredLabel", 2);
156
+ o([
157
+ a({ type: Array })
158
+ ], s.prototype, "selectedValues", 2);
159
+ o([
160
+ f("slot")
161
+ ], s.prototype, "slot", 2);
162
+ o([
163
+ d()
164
+ ], s.prototype, "showErrorMessage", 2);
165
+ o([
166
+ d()
167
+ ], s.prototype, "isCustomValidationError", 2);
168
+ s = o([
169
+ b("nve-checkbox-group")
170
+ ], s);
158
171
  export {
159
- r as default
172
+ s as default
160
173
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "nve-designsystem",
3
- "version": "0.1.55",
3
+ "version": "0.1.56",
4
4
  "exports": {
5
5
  ".": {
6
6
  "import": "./nve-designsystem.js",