@oslokommune/punkt-vue 11.19.0 → 11.19.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/CHANGELOG.md
CHANGED
|
@@ -5,6 +5,27 @@ og skriver commits ca etter [Conventional Commits](https://conventionalcommits.o
|
|
|
5
5
|
|
|
6
6
|
---
|
|
7
7
|
|
|
8
|
+
## [11.19.2](https://github.com/oslokommune/punkt/compare/11.19.1...11.19.2) (2024-08-20)
|
|
9
|
+
|
|
10
|
+
### ⚠ BREAKING CHANGES
|
|
11
|
+
Ingen
|
|
12
|
+
|
|
13
|
+
### Features
|
|
14
|
+
Ingen
|
|
15
|
+
|
|
16
|
+
### Bug Fixes
|
|
17
|
+
* stepper accessibility fixes (#1881). - remove role="separator" and use aria-hidden on step lines
|
|
18
|
+
- change vue default hideContent prop value to true
|
|
19
|
+
- add min width on horizontal content wrapper
|
|
20
|
+
- add additional button help class wrapper
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
### Chores
|
|
24
|
+
Ingen
|
|
25
|
+
|
|
26
|
+
---
|
|
27
|
+
|
|
28
|
+
|
|
8
29
|
## [11.19.0](https://github.com/oslokommune/punkt/compare/11.18.0...11.19.0) (2024-08-19)
|
|
9
30
|
|
|
10
31
|
### ⚠ BREAKING CHANGES
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("./plugins-IAlvxbZ2.cjs"),e=require("vue"),c=e.defineComponent({__name:"Stepper",props:{className:{},hideNonActiveStepsContent:{type:Boolean,default:!0},orientation:{default:"vertical"}},setup(s){const t=s,n=e.ref(null),l=e.computed(()=>[t.className,"pkt-stepper",t.orientation==="horizontal"?"pkt-stepper--horizontal":"pkt-stepper--vertical"].filter(Boolean).join(" "));return e.provide("hideNonActiveStepsContent",t.hideNonActiveStepsContent),(o,p)=>(e.openBlock(),e.createElementBlock("ol",{class:e.normalizeClass(l.value),ref_key:"stepperRef",ref:n},[e.renderSlot(o.$slots,"default")],2))}}),u=e.createElementVNode("span",{class:"pkt-step__line pkt-step__line--1","aria-hidden":""},null,-1),_=e.createElementVNode("span",{class:"pkt-step__line pkt-step__line--2","aria-hidden":""},null,-1),h=["innerHTML"],m=e.createElementVNode("span",{class:"pkt-step__line pkt-step__line--3","aria-hidden":""},null,-1),v={class:"pkt-step__wrapper"},f={class:"pkt-step__title"},g={class:"pkt-step__content"},k='<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><circle cx="12" cy="12" r="7" style="fill: var(--pkt-color-grays-grey-200, #CCC);" /></svg>',S='<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><circle opacity=".15" cx="12" cy="12" r="12" fill="#2A2859" /><circle cx="12" cy="12" r="6" fill="#2A2859" /></svg>',w='<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><path fill="#2A2859" d="M3 3h18v18H3z" /><path d="m10.34 16-1.11-1.14L7 12.58l1.11-1.15 2.23 2.28L15.88 8 17 9.15l-5.55 5.71L10.34 16Z" fill="#F1FDFF" /></svg>',a=e.defineComponent({__name:"Step",props:{title:{},className:{},status:{default:"incomplete"}},setup(s){const t=s,n=e.inject("hideNonActiveStepsContent"),l=()=>!!(n&&t.status!=="current"),o=e.computed(()=>["pkt-step",t.className,`pkt-step--${t.status}`,{"pkt-step--hidden":l()}]),p=e.computed(()=>{switch(t.status){case"current":return S;case"completed":return w;default:return k}});return(i,C)=>(e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass(o.value),"data-testid":"pkt-step"},[u,_,e.createElementVNode("span",{class:"pkt-step__indicator",innerHTML:p.value},null,8,h),m,e.createElementVNode("div",v,[e.createElementVNode("div",f,e.toDisplayString(i.title),1),e.createElementVNode("div",g,[e.renderSlot(i.$slots,"default")])])],2))}}),d={install(s){r.registerComponent(s,c),r.registerComponent(s,a)}};r.use(d);exports.PktStep=a;exports.PktStepper=c;exports.default=d;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { u as f, a } from "./plugins-UPM181Xt.js";
|
|
2
|
-
import { defineComponent as c, ref as m, computed as p, provide as v, openBlock as
|
|
1
|
+
import { u as f, a as r } from "./plugins-UPM181Xt.js";
|
|
2
|
+
import { defineComponent as c, ref as m, computed as p, provide as v, openBlock as d, createElementBlock as _, normalizeClass as u, renderSlot as h, inject as k, createElementVNode as e, toDisplayString as g } from "vue";
|
|
3
3
|
const S = /* @__PURE__ */ c({
|
|
4
4
|
__name: "Stepper",
|
|
5
5
|
props: {
|
|
6
6
|
className: {},
|
|
7
|
-
hideNonActiveStepsContent: { type: Boolean, default: !
|
|
7
|
+
hideNonActiveStepsContent: { type: Boolean, default: !0 },
|
|
8
8
|
orientation: { default: "vertical" }
|
|
9
9
|
},
|
|
10
10
|
setup(s) {
|
|
@@ -13,7 +13,7 @@ const S = /* @__PURE__ */ c({
|
|
|
13
13
|
"pkt-stepper",
|
|
14
14
|
t.orientation === "horizontal" ? "pkt-stepper--horizontal" : "pkt-stepper--vertical"
|
|
15
15
|
].filter(Boolean).join(" "));
|
|
16
|
-
return v("hideNonActiveStepsContent", t.hideNonActiveStepsContent), (o, i) => (
|
|
16
|
+
return v("hideNonActiveStepsContent", t.hideNonActiveStepsContent), (o, i) => (d(), _("ol", {
|
|
17
17
|
class: u(l.value),
|
|
18
18
|
ref_key: "stepperRef",
|
|
19
19
|
ref: n
|
|
@@ -21,9 +21,15 @@ const S = /* @__PURE__ */ c({
|
|
|
21
21
|
h(o.$slots, "default")
|
|
22
22
|
], 2));
|
|
23
23
|
}
|
|
24
|
-
}), w = /* @__PURE__ */ e("span", {
|
|
24
|
+
}), w = /* @__PURE__ */ e("span", {
|
|
25
|
+
class: "pkt-step__line pkt-step__line--1",
|
|
26
|
+
"aria-hidden": ""
|
|
27
|
+
}, null, -1), C = /* @__PURE__ */ e("span", {
|
|
28
|
+
class: "pkt-step__line pkt-step__line--2",
|
|
29
|
+
"aria-hidden": ""
|
|
30
|
+
}, null, -1), y = ["innerHTML"], N = /* @__PURE__ */ e("span", {
|
|
25
31
|
class: "pkt-step__line pkt-step__line--3",
|
|
26
|
-
|
|
32
|
+
"aria-hidden": ""
|
|
27
33
|
}, null, -1), A = { class: "pkt-step__wrapper" }, x = { class: "pkt-step__title" }, L = { class: "pkt-step__content" }, z = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><circle cx="12" cy="12" r="7" style="fill: var(--pkt-color-grays-grey-200, #CCC);" /></svg>', B = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><circle opacity=".15" cx="12" cy="12" r="12" fill="#2A2859" /><circle cx="12" cy="12" r="6" fill="#2A2859" /></svg>', F = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><path fill="#2A2859" d="M3 3h18v18H3z" /><path d="m10.34 16-1.11-1.14L7 12.58l1.11-1.15 2.23 2.28L15.88 8 17 9.15l-5.55 5.71L10.34 16Z" fill="#F1FDFF" /></svg>', G = /* @__PURE__ */ c({
|
|
28
34
|
__name: "Step",
|
|
29
35
|
props: {
|
|
@@ -47,7 +53,7 @@ const S = /* @__PURE__ */ c({
|
|
|
47
53
|
return z;
|
|
48
54
|
}
|
|
49
55
|
});
|
|
50
|
-
return (
|
|
56
|
+
return (a, V) => (d(), _("li", {
|
|
51
57
|
class: u(o.value),
|
|
52
58
|
"data-testid": "pkt-step"
|
|
53
59
|
}, [
|
|
@@ -59,16 +65,16 @@ const S = /* @__PURE__ */ c({
|
|
|
59
65
|
}, null, 8, y),
|
|
60
66
|
N,
|
|
61
67
|
e("div", A, [
|
|
62
|
-
e("div", x, g(
|
|
68
|
+
e("div", x, g(a.title), 1),
|
|
63
69
|
e("div", L, [
|
|
64
|
-
h(
|
|
70
|
+
h(a.$slots, "default")
|
|
65
71
|
])
|
|
66
72
|
])
|
|
67
73
|
], 2));
|
|
68
74
|
}
|
|
69
75
|
}), H = {
|
|
70
76
|
install(s) {
|
|
71
|
-
|
|
77
|
+
r(s, S), r(s, G);
|
|
72
78
|
}
|
|
73
79
|
};
|
|
74
80
|
f(H);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@oslokommune/punkt-vue",
|
|
3
|
-
"version": "11.19.
|
|
3
|
+
"version": "11.19.2",
|
|
4
4
|
"description": "Vue komponentbibliotek til Punkt, et designsystem laget av Oslo Origo",
|
|
5
5
|
"homepage": "https://punkt.oslo.kommune.no",
|
|
6
6
|
"author": "Team Designsystem, Oslo Origo",
|
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
29
|
"@oslokommune/punkt-assets": "^11.17.0",
|
|
30
|
-
"@oslokommune/punkt-css": "^11.
|
|
30
|
+
"@oslokommune/punkt-css": "^11.19.2",
|
|
31
31
|
"@vitejs/plugin-vue": "^4.5.2",
|
|
32
32
|
"edit-json-file": "^1.7.0",
|
|
33
33
|
"sass": "^1.69.5",
|
|
@@ -65,5 +65,5 @@
|
|
|
65
65
|
"url": "https://github.com/oslokommune/punkt/issues"
|
|
66
66
|
},
|
|
67
67
|
"license": "MIT",
|
|
68
|
-
"gitHead": "
|
|
68
|
+
"gitHead": "0ca7c50fc32c471a63615349ecee431fd30f7a72"
|
|
69
69
|
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<li :class="stepClasses" data-testid="pkt-step">
|
|
3
|
-
<span class="pkt-step__line pkt-step__line--1"></span>
|
|
4
|
-
<span class="pkt-step__line pkt-step__line--2"></span>
|
|
3
|
+
<span class="pkt-step__line pkt-step__line--1" aria-hidden></span>
|
|
4
|
+
<span class="pkt-step__line pkt-step__line--2" aria-hidden></span>
|
|
5
5
|
<span class="pkt-step__indicator" v-html="statusSVG"> </span>
|
|
6
|
-
<span class="pkt-step__line pkt-step__line--3"
|
|
6
|
+
<span class="pkt-step__line pkt-step__line--3" aria-hidden></span>
|
|
7
7
|
<div class="pkt-step__wrapper">
|
|
8
8
|
<div class="pkt-step__title">{{ title }}</div>
|
|
9
9
|
<div class="pkt-step__content">
|