@oslokommune/punkt-vue 11.18.0 → 11.19.2

package/CHANGELOG.md

@@ -5,6 +5,51 @@ og skriver commits ca etter [Conventional Commits](https://conventionalcommits.o
 
 ---
 
+## [11.19.2](https://github.com/oslokommune/punkt/compare/11.19.1...11.19.2) (2024-08-20)
+
+### ⚠ BREAKING CHANGES
+Ingen
+
+### Features
+Ingen
+
+### Bug Fixes
+* stepper accessibility fixes (#1881). - remove role="separator" and use aria-hidden on step lines
+  - change vue default hideContent prop value to true
+  - add min width on horizontal content wrapper
+  - add additional button help class wrapper
+
+
+### Chores
+Ingen
+
+---
+
+
+## [11.19.0](https://github.com/oslokommune/punkt/compare/11.18.0...11.19.0) (2024-08-19)
+
+### ⚠ BREAKING CHANGES
+Ingen
+
+### Features
+* Counter i inputs, HTML i errorMessage, og endring i PktSearchInput-hendelser (#1877). * Counter i inputs, HTML i errorMessage, og WIP PktSearchInput
+  
+  * Masse tøvete arbeid for å få TypeScript til å slutte å syte
+  
+  * TypeScript gjør meg frustrert.
+  
+  * Counter PktTextInpu dokumentasjon og spesifikasjon
+
+
+### Bug Fixes
+Ingen
+
+### Chores
+Ingen
+
+---
+
+
 ## [11.17.0](https://github.com/oslokommune/punkt/compare/11.16.6...11.17.0) (2024-08-15)
 
 ### ⚠ BREAKING CHANGES

package/dist/InputWrapper-KjtXuCqE.cjs

@@ -0,0 +1 @@
+"use strict";const o=require("./Alert-VmiRg_3U.cjs"),s=require("./Button-fJVVmqZU.cjs"),e=require("vue"),d=require("./_plugin-vue_export-helper-jfW5FsfF.cjs"),p={name:"pktInputwrapper",components:{PktAlert:o.PktAlert,PktButton:s.PktButton},props:{forId:{type:String,required:!0},label:{type:String,required:!0,default:"input"},helptext:{type:String,required:!1},helptextDropdown:{type:String,required:!1},helptextDropdownButton:{type:String,required:!1},counter:{type:Boolean,default:!1},counterCurrent:{type:Number,required:!1},counterMaxLength:{type:Number,required:!1},optionalTag:{type:Boolean,required:!1,default:!1},optionalText:{type:String,default:"Valgfritt"},requiredTag:{type:Boolean,required:!1,default:!1},requiredText:{type:String,default:"Må fylles ut"},hasError:{type:Boolean,required:!1},errorMessage:{type:String,required:!1},disabled:{type:Boolean,required:!1,default:!1},inline:{type:Boolean,required:!1,default:!1},ariaDescribedby:{type:String,required:!1},useWrapper:{type:Boolean,default:!0},hasFieldset:{type:Boolean,default:!1}},data(){return{isHelpTextOpen:!1}},methods:{toggleHelpText(){this.isHelpTextOpen=!this.isHelpTextOpen,this.$emit("toggleHelpText",this.isHelpTextOpen)},tagClass(){return this.optionalTag?"pkt-tag pkt-tag--small pkt-tag--thin-text pkt-tag--blue-light":this.requiredTag?"pkt-tag pkt-tag--small pkt-tag--thin-text pkt-tag--beige":""}},computed:{tagText(){return this.optionalTag?this.optionalText:this.requiredTag?this.requiredText:""},disabledClass(){return this.disabled?"pkt-inputwrapper--disabled":""},inlineClass(){return this.inline?"pkt-inputwrapper--inline":""},errorClass(){return this.hasError?"pkt-inputwrapper--error":""},hasDropDown(){return!!this.helptextDropdown&&this.helptextDropdown!==""},dropdownButton(){return this.helptextDropdownButton||'Les mer <span class="pkt-sr-only">om inputfeltet</span>'},describedBy(){this.ariaDescribedby?this.ariaDescribedby:this.helptext&&`${this.forId}`}}},c=["id","innerHTML"],u={key:1,class:"pkt-inputwrapper__helptext-expandable"},h=["innerHTML"],k=["innerHTML"],f=["for","aria-describedby"],m=["for","aria-describedby","id"],g={key:2,class:"pkt-input__counter","aria-live":"polite","aria-atomic":"true"},y={key:3};function _(a,b,t,B,l,r){const n=e.resolveComponent("PktButton"),i=e.resolveComponent("PktAlert");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["pkt-inputwrapper",r.disabledClass,r.inlineClass,r.errorClass])},[t.useWrapper?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.hasFieldset?"fieldset":r.hasDropDown?"div":"label"),{key:0,for:t.hasFieldset?void 0:t.forId,class:e.normalizeClass(["pkt-inputwrapper__label",{"pkt-inputwrapper__fieldset":t.hasFieldset,"pkt-inputwrapper__legend":t.hasFieldset}]),"aria-describedby":r.hasDropDown?void 0:t.ariaDescribedby},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.hasFieldset?"legend":r.hasDropDown?"h2":"span"),{class:e.normalizeClass({"pkt-inputwrapper__legend":t.hasFieldset}),id:`${t.forId}-label`},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.label),1),r.tagText!==""?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(r.tagClass())},e.toDisplayString(r.tagText),3)):e.createCommentVNode("",!0)]),_:1},8,["class","id"])),t.helptext?(e.openBlock(),e.createElementBlock("div",{key:0,class:"pkt-inputwrapper__helptext",id:`${t.forId}-helptext`,innerHTML:t.helptext},null,8,c)):e.createCommentVNode("",!0),r.hasDropDown?(e.openBlock(),e.createElementBlock("div",u,[e.createVNode(n,{skin:"tertiary",size:"small",variant:"icon-right","icon-name":l.isHelpTextOpen?"chevron-thin-up":"chevron-thin-down",class:"pkt-link pkt-link--icon-right",onOnClick:r.toggleHelpText},{default:e.withCtx(()=>[e.createElementVNode("span",{innerHTML:r.dropdownButton},null,8,h)]),_:1},8,["icon-name","onOnClick"]),e.createElementVNode("div",{class:e.normalizeClass(["pkt-inputwrapper__helptext",{"pkt-inputwrapper__helptext-expandable-open":l.isHelpTextOpen,"pkt-inputwrapper__helptext-expandable-closed":!l.isHelpTextOpen}])},[e.createElementVNode("span",{innerHTML:t.helptextDropdown},null,8,k)],2),t.hasFieldset?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("label",{key:0,for:t.forId,class:"pkt-sr-only","aria-describedby":r.describedBy},e.toDisplayString(t.label),9,f))])):e.createCommentVNode("",!0),e.renderSlot(a.$slots,"default")]),_:3},8,["for","class","aria-describedby"])):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[t.hasFieldset?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("label",{key:0,for:t.forId,class:"pkt-sr-only","aria-describedby":r.describedBy,id:`${t.forId}-label`},e.toDisplayString(t.label),9,m)),e.renderSlot(a.$slots,"default")],64)),t.counter?(e.openBlock(),e.createElementBlock("div",g,[e.createTextVNode(e.toDisplayString(t.counterCurrent||0),1),t.counterMaxLength?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createTextVNode("/"+e.toDisplayString(t.counterMaxLength),1)],64)):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0),t.hasError&&t.errorMessage?(e.openBlock(),e.createElementBlock("div",y,[e.createVNode(i,{skin:"error","aria-live":"assertive",id:`${t.forId}-error`,compact:"",innerHTML:t.errorMessage},null,8,["id","innerHTML"])])):e.createCommentVNode("",!0)],2)}const x=d._export_sfc(p,[["render",_]]);exports.PktInputWrapper=x;

package/dist/{InputWrapper-aBvhZpl8.js → InputWrapper-cZ870MjV.js}

@@ -1,10 +1,10 @@
-import { P as b } from "./Alert-LNP7MGFo.js";
-import { P as x } from "./Button-5obh_jeA.js";
-import { resolveComponent as u, openBlock as r, createElementBlock as a, normalizeClass as i, createBlock as h, resolveDynamicComponent as c, withCtx as s, createTextVNode as f, toDisplayString as n, createCommentVNode as l, createVNode as k, createElementVNode as p, renderSlot as g, Fragment as m } from "vue";
+import { P as x } from "./Alert-LNP7MGFo.js";
+import { P as m } from "./Button-5obh_jeA.js";
+import { resolveComponent as c, openBlock as r, createElementBlock as a, normalizeClass as n, createBlock as h, resolveDynamicComponent as f, withCtx as d, createTextVNode as o, toDisplayString as i, createCommentVNode as l, createVNode as k, createElementVNode as p, renderSlot as g, Fragment as _ } from "vue";
 import { _ as T } from "./_plugin-vue_export-helper-hUChTQA_.js";
 const w = {
   name: "pktInputwrapper",
-  components: { PktAlert: b, PktButton: x },
+  components: { PktAlert: x, PktButton: m },
   props: {
     forId: {
       type: String,
@@ -27,6 +27,18 @@ const w = {
       type: String,
       required: !1
     },
+    counter: {
+      type: Boolean,
+      default: !1
+    },
+    counterCurrent: {
+      type: Number,
+      required: !1
+    },
+    counterMaxLength: {
+      type: Number,
+      required: !1
+    },
     optionalTag: {
       type: Boolean,
       required: !1,
@@ -115,34 +127,39 @@ const w = {
 }, D = ["id", "innerHTML"], B = {
   key: 1,
   class: "pkt-inputwrapper__helptext-expandable"
-}, q = ["innerHTML"], H = ["innerHTML"], C = ["for", "aria-describedby"], v = ["for", "aria-describedby", "id"], I = { key: 2 };
-function S(o, F, e, M, d, t) {
-  const _ = u("PktButton"), y = u("PktAlert");
+}, q = ["innerHTML"], H = ["innerHTML"], C = ["for", "aria-describedby"], v = ["for", "aria-describedby", "id"], M = {
+  key: 2,
+  class: "pkt-input__counter",
+  "aria-live": "polite",
+  "aria-atomic": "true"
+}, L = { key: 3 };
+function I(u, S, e, F, s, t) {
+  const y = c("PktButton"), b = c("PktAlert");
   return r(), a("div", {
-    class: i(["pkt-inputwrapper", t.disabledClass, t.inlineClass, t.errorClass])
+    class: n(["pkt-inputwrapper", t.disabledClass, t.inlineClass, t.errorClass])
   }, [
-    e.useWrapper ? (r(), h(c(e.hasFieldset ? "fieldset" : t.hasDropDown ? "div" : "label"), {
+    e.useWrapper ? (r(), h(f(e.hasFieldset ? "fieldset" : t.hasDropDown ? "div" : "label"), {
       key: 0,
       for: e.hasFieldset ? void 0 : e.forId,
-      class: i(["pkt-inputwrapper__label", {
+      class: n(["pkt-inputwrapper__label", {
         "pkt-inputwrapper__fieldset": e.hasFieldset,
         "pkt-inputwrapper__legend": e.hasFieldset
       }]),
       "aria-describedby": t.hasDropDown ? void 0 : e.ariaDescribedby
     }, {
-      default: s(() => [
-        (r(), h(c(e.hasFieldset ? "legend" : t.hasDropDown ? "h2" : "span"), {
-          class: i({
+      default: d(() => [
+        (r(), h(f(e.hasFieldset ? "legend" : t.hasDropDown ? "h2" : "span"), {
+          class: n({
             "pkt-inputwrapper__legend": e.hasFieldset
           }),
           id: `${e.forId}-label`
         }, {
-          default: s(() => [
-            f(n(e.label), 1),
+          default: d(() => [
+            o(i(e.label), 1),
             t.tagText !== "" ? (r(), a("span", {
               key: 0,
-              class: i(t.tagClass())
-            }, n(t.tagText), 3)) : l("", !0)
+              class: n(t.tagClass())
+            }, i(t.tagText), 3)) : l("", !0)
           ]),
           _: 1
         }, 8, ["class", "id"])),
@@ -153,23 +170,23 @@ function S(o, F, e, M, d, t) {
           innerHTML: e.helptext
         }, null, 8, D)) : l("", !0),
         t.hasDropDown ? (r(), a("div", B, [
-          k(_, {
+          k(y, {
             skin: "tertiary",
             size: "small",
             variant: "icon-right",
-            "icon-name": d.isHelpTextOpen ? "chevron-thin-up" : "chevron-thin-down",
+            "icon-name": s.isHelpTextOpen ? "chevron-thin-up" : "chevron-thin-down",
             class: "pkt-link pkt-link--icon-right",
             onOnClick: t.toggleHelpText
           }, {
-            default: s(() => [
+            default: d(() => [
               p("span", { innerHTML: t.dropdownButton }, null, 8, q)
             ]),
             _: 1
           }, 8, ["icon-name", "onOnClick"]),
           p("div", {
-            class: i(["pkt-inputwrapper__helptext", {
-              "pkt-inputwrapper__helptext-expandable-open": d.isHelpTextOpen,
-              "pkt-inputwrapper__helptext-expandable-closed": !d.isHelpTextOpen
+            class: n(["pkt-inputwrapper__helptext", {
+              "pkt-inputwrapper__helptext-expandable-open": s.isHelpTextOpen,
+              "pkt-inputwrapper__helptext-expandable-closed": !s.isHelpTextOpen
             }])
           }, [
             p("span", { innerHTML: e.helptextDropdown }, null, 8, H)
@@ -179,37 +196,39 @@ function S(o, F, e, M, d, t) {
             for: e.forId,
             class: "pkt-sr-only",
             "aria-describedby": t.describedBy
-          }, n(e.label), 9, C))
+          }, i(e.label), 9, C))
         ])) : l("", !0),
-        g(o.$slots, "default")
+        g(u.$slots, "default")
       ]),
       _: 3
-    }, 8, ["for", "class", "aria-describedby"])) : (r(), a(m, { key: 1 }, [
+    }, 8, ["for", "class", "aria-describedby"])) : (r(), a(_, { key: 1 }, [
       e.hasFieldset ? l("", !0) : (r(), a("label", {
         key: 0,
         for: e.forId,
         class: "pkt-sr-only",
         "aria-describedby": t.describedBy,
         id: `${e.forId}-label`
-      }, n(e.label), 9, v)),
-      g(o.$slots, "default")
+      }, i(e.label), 9, v)),
+      g(u.$slots, "default")
     ], 64)),
-    e.hasError && e.errorMessage ? (r(), a("div", I, [
-      k(y, {
+    e.counter ? (r(), a("div", M, [
+      o(i(e.counterCurrent || 0), 1),
+      e.counterMaxLength ? (r(), a(_, { key: 0 }, [
+        o("/" + i(e.counterMaxLength), 1)
+      ], 64)) : l("", !0)
+    ])) : l("", !0),
+    e.hasError && e.errorMessage ? (r(), a("div", L, [
+      k(b, {
         skin: "error",
         "aria-live": "assertive",
         id: `${e.forId}-error`,
-        compact: ""
-      }, {
-        default: s(() => [
-          f(n(e.errorMessage), 1)
-        ]),
-        _: 1
-      }, 8, ["id"])
+        compact: "",
+        innerHTML: e.errorMessage
+      }, null, 8, ["id", "innerHTML"])
     ])) : l("", !0)
   ], 2);
 }
-const V = /* @__PURE__ */ T(w, [["render", S]]);
+const V = /* @__PURE__ */ T(w, [["render", I]]);
 export {
   V as P
 };

package/dist/punkt-vue-index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const q=require("./punkt-vue-alert.cjs"),t=require("./punkt-vue-accordion.cjs"),a=require("./punkt-vue-backlink.cjs"),r=require("./punkt-vue-breadcrumbs.cjs"),g=require("./punkt-vue-button.cjs"),o=require("./punkt-vue-checkbox.cjs"),l=require("./punkt-vue-footer.cjs"),u=require("./punkt-vue-footersimple.cjs"),d=require("./punkt-vue-header.cjs"),x=require("./punkt-vue-icon.cjs"),m=require("./punkt-vue-inputwrapper.cjs"),n=require("./punkt-vue-messagebox.cjs"),c=require("./punkt-vue-linkcard.cjs"),i=require("./punkt-vue-loader.cjs"),k=require("./punkt-vue-progressbar.cjs"),s=require("./punkt-vue-radiobutton.cjs"),P=require("./punkt-vue-select.cjs"),e=require("./punkt-vue-table.cjs"),b=require("./punkt-vue-tabs.cjs"),B=require("./punkt-vue-tag.cjs"),f=require("./punkt-vue-textarea.cjs"),p=require("./punkt-vue-textinput.cjs"),S=require("./plugins-IAlvxbZ2.cjs"),I=require("./punkt-vue-stepper.cjs"),L=require("./Alert-VmiRg_3U.cjs"),y=require("./Button-fJVVmqZU.cjs"),F=require("./Icon-7iwiZOEn.cjs"),R=require("./InputWrapper-tRopywnC.cjs"),M=require("./Tag-1MK-d3wL.cjs");require("vue");require("./_plugin-vue_export-helper-jfW5FsfF.cjs");const T=Object.freeze(Object.defineProperty({__proto__:null,Accordion:t.default,AccordionItem:t.default,Alert:q.default,BackLink:a.default,Breadcrumbs:r.default,Button:g.default,Checkbox:o.default,Footer:l.default,FooterSimple:u.default,Header:d.default,Icon:x.default,InputWrapper:m.default,Linkcard:c.default,Loader:i.default,Messagebox:n.default,Progressbar:k.default,Radiobutton:s.default,Select:P.default,Table:e.default,TableBody:e.default,TableDataCell:e.default,TableHeader:e.default,TableHeaderCell:e.default,TableRow:e.default,Tabs:b.default,Tag:B.default,Textarea:f.default,Textinput:p.default},Symbol.toStringTag,{value:"Module"})),A={install(C,h={}){for(const H in T)S.registerPlugin(C,T[H])}};S.use(A);exports.Alert=q.default;exports.Accordion=t.default;exports.AccordionItem=t.default;exports.PktAccordion=t.PktAccordion;exports.PktAccordionItem=t.PktAccordionItem;exports.BackLink=a.default;exports.PktBackLink=a.PktBackLink;exports.Breadcrumbs=r.default;exports.PktBreadcrumbs=r.PktBreadcrumbs;exports.Button=g.default;exports.Checkbox=o.default;exports.PktCheckbox=o.PktCheckbox;exports.Footer=l.default;exports.PktFooter=l.PktFooter;exports.FooterSimple=u.default;exports.PktFooterSimple=u.PktFooterSimple;exports.Header=d.default;exports.PktHeader=d.PktHeader;exports.Icon=x.default;exports.InputWrapper=m.default;exports.Messagebox=n.default;exports.PktMessagebox=n.PktMessagebox;exports.Linkcard=c.default;exports.PktLinkcard=c.PktLinkcard;exports.Loader=i.default;exports.PktLoader=i.PktLoader;exports.PktProgressbar=k.PktProgressbar;exports.Progressbar=k.default;exports.PktRadiobutton=s.PktRadiobutton;exports.Radiobutton=s.default;exports.PktSelect=P.PktSelect;exports.Select=P.default;exports.PktTable=e.PktTable;exports.PktTableBody=e.PktTableBody;exports.PktTableDataCell=e.PktTableDataCell;exports.PktTableHeader=e.PktTableHeader;exports.PktTableHeaderCell=e.PktTableHeaderCell;exports.PktTableRow=e.PktTableRow;exports.Table=e.default;exports.TableBody=e.default;exports.TableDataCell=e.default;exports.TableHeader=e.default;exports.TableHeaderCell=e.default;exports.TableRow=e.default;exports.PktTabs=b.PktTabs;exports.Tabs=b.default;exports.Tag=B.default;exports.PktTextarea=f.PktTextarea;exports.Textarea=f.default;exports.PktTextinput=p.PktTextinput;exports.Textinput=p.default;exports.PktStep=I.PktStep;exports.PktStepper=I.PktStepper;exports.PktAlert=L.PktAlert;exports.PktButton=y.PktButton;exports.PktIcon=F.PktIcon;exports.PktInputWrapper=R.PktInputWrapper;exports.PktTag=M.Tag;exports.default=A;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const q=require("./punkt-vue-alert.cjs"),t=require("./punkt-vue-accordion.cjs"),a=require("./punkt-vue-backlink.cjs"),r=require("./punkt-vue-breadcrumbs.cjs"),g=require("./punkt-vue-button.cjs"),o=require("./punkt-vue-checkbox.cjs"),l=require("./punkt-vue-footer.cjs"),u=require("./punkt-vue-footersimple.cjs"),d=require("./punkt-vue-header.cjs"),x=require("./punkt-vue-icon.cjs"),m=require("./punkt-vue-inputwrapper.cjs"),n=require("./punkt-vue-messagebox.cjs"),c=require("./punkt-vue-linkcard.cjs"),i=require("./punkt-vue-loader.cjs"),k=require("./punkt-vue-progressbar.cjs"),s=require("./punkt-vue-radiobutton.cjs"),P=require("./punkt-vue-select.cjs"),e=require("./punkt-vue-table.cjs"),b=require("./punkt-vue-tabs.cjs"),B=require("./punkt-vue-tag.cjs"),f=require("./punkt-vue-textarea.cjs"),p=require("./punkt-vue-textinput.cjs"),S=require("./plugins-IAlvxbZ2.cjs"),I=require("./punkt-vue-stepper.cjs"),L=require("./Alert-VmiRg_3U.cjs"),y=require("./Button-fJVVmqZU.cjs"),F=require("./Icon-7iwiZOEn.cjs"),R=require("./InputWrapper-KjtXuCqE.cjs"),M=require("./Tag-1MK-d3wL.cjs");require("vue");require("./_plugin-vue_export-helper-jfW5FsfF.cjs");const T=Object.freeze(Object.defineProperty({__proto__:null,Accordion:t.default,AccordionItem:t.default,Alert:q.default,BackLink:a.default,Breadcrumbs:r.default,Button:g.default,Checkbox:o.default,Footer:l.default,FooterSimple:u.default,Header:d.default,Icon:x.default,InputWrapper:m.default,Linkcard:c.default,Loader:i.default,Messagebox:n.default,Progressbar:k.default,Radiobutton:s.default,Select:P.default,Table:e.default,TableBody:e.default,TableDataCell:e.default,TableHeader:e.default,TableHeaderCell:e.default,TableRow:e.default,Tabs:b.default,Tag:B.default,Textarea:f.default,Textinput:p.default},Symbol.toStringTag,{value:"Module"})),A={install(C,h={}){for(const H in T)S.registerPlugin(C,T[H])}};S.use(A);exports.Alert=q.default;exports.Accordion=t.default;exports.AccordionItem=t.default;exports.PktAccordion=t.PktAccordion;exports.PktAccordionItem=t.PktAccordionItem;exports.BackLink=a.default;exports.PktBackLink=a.PktBackLink;exports.Breadcrumbs=r.default;exports.PktBreadcrumbs=r.PktBreadcrumbs;exports.Button=g.default;exports.Checkbox=o.default;exports.PktCheckbox=o.PktCheckbox;exports.Footer=l.default;exports.PktFooter=l.PktFooter;exports.FooterSimple=u.default;exports.PktFooterSimple=u.PktFooterSimple;exports.Header=d.default;exports.PktHeader=d.PktHeader;exports.Icon=x.default;exports.InputWrapper=m.default;exports.Messagebox=n.default;exports.PktMessagebox=n.PktMessagebox;exports.Linkcard=c.default;exports.PktLinkcard=c.PktLinkcard;exports.Loader=i.default;exports.PktLoader=i.PktLoader;exports.PktProgressbar=k.PktProgressbar;exports.Progressbar=k.default;exports.PktRadiobutton=s.PktRadiobutton;exports.Radiobutton=s.default;exports.PktSelect=P.PktSelect;exports.Select=P.default;exports.PktTable=e.PktTable;exports.PktTableBody=e.PktTableBody;exports.PktTableDataCell=e.PktTableDataCell;exports.PktTableHeader=e.PktTableHeader;exports.PktTableHeaderCell=e.PktTableHeaderCell;exports.PktTableRow=e.PktTableRow;exports.Table=e.default;exports.TableBody=e.default;exports.TableDataCell=e.default;exports.TableHeader=e.default;exports.TableHeaderCell=e.default;exports.TableRow=e.default;exports.PktTabs=b.PktTabs;exports.Tabs=b.default;exports.Tag=B.default;exports.PktTextarea=f.PktTextarea;exports.Textarea=f.default;exports.PktTextinput=p.PktTextinput;exports.Textinput=p.default;exports.PktStep=I.PktStep;exports.PktStepper=I.PktStepper;exports.PktAlert=L.PktAlert;exports.PktButton=y.PktButton;exports.PktIcon=F.PktIcon;exports.PktInputWrapper=R.PktInputWrapper;exports.PktTag=M.Tag;exports.default=A;

package/dist/punkt-vue-index.js

@@ -42,7 +42,7 @@ import { PktStep as qo, PktStepper as Eo } from "./punkt-vue-stepper.js";
 import { P as Jo } from "./Alert-LNP7MGFo.js";
 import { P as Qo } from "./Button-5obh_jeA.js";
 import { P as Vo } from "./Icon-8MjQJfqx.js";
-import { P as Yo } from "./InputWrapper-aBvhZpl8.js";
+import { P as Yo } from "./InputWrapper-cZ870MjV.js";
 import { T as or } from "./Tag-jpZpXEPw.js";
 import "vue";
 import "./_plugin-vue_export-helper-hUChTQA_.js";

package/dist/punkt-vue-inputwrapper.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./InputWrapper-tRopywnC.cjs"),r=require("./plugins-IAlvxbZ2.cjs");require("./Alert-VmiRg_3U.cjs");require("./Icon-7iwiZOEn.cjs");require("vue");require("./_plugin-vue_export-helper-jfW5FsfF.cjs");require("./Button-fJVVmqZU.cjs");const t={install(u){r.registerComponent(u,e.PktInputWrapper)}};r.use(t);exports.PktInputWrapper=e.PktInputWrapper;exports.default=t;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./InputWrapper-KjtXuCqE.cjs"),r=require("./plugins-IAlvxbZ2.cjs");require("./Alert-VmiRg_3U.cjs");require("./Icon-7iwiZOEn.cjs");require("vue");require("./_plugin-vue_export-helper-jfW5FsfF.cjs");require("./Button-fJVVmqZU.cjs");const t={install(u){r.registerComponent(u,e.PktInputWrapper)}};r.use(t);exports.PktInputWrapper=e.PktInputWrapper;exports.default=t;

package/dist/punkt-vue-inputwrapper.js

@@ -1,4 +1,4 @@
-import { P as r } from "./InputWrapper-aBvhZpl8.js";
+import { P as r } from "./InputWrapper-cZ870MjV.js";
 import { u as o, a as p } from "./plugins-UPM181Xt.js";
 import "./Alert-LNP7MGFo.js";
 import "./Icon-8MjQJfqx.js";

package/dist/punkt-vue-select.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("./Icon-7iwiZOEn.cjs"),p=require("./Alert-VmiRg_3U.cjs"),f=require("./Button-fJVVmqZU.cjs"),g=require("./InputWrapper-tRopywnC.cjs"),t=require("vue"),b=require("./_plugin-vue_export-helper-jfW5FsfF.cjs"),i=require("./plugins-IAlvxbZ2.cjs"),q={name:"PktSelect",components:{PktIcon:s.PktIcon,PktAlert:p.PktAlert,PktButton:f.PktButton,PktInputWrapper:g.PktInputWrapper},props:{label:{type:String,required:!0,default:"input"},helptext:{type:String,required:!1},helptextDropdown:{type:String,required:!1},helptextDropdownButton:{type:String,required:!1},optionalTag:{type:Boolean,required:!1,default:!1},optionalText:{type:String,required:!1},requiredTag:{type:Boolean,required:!1,default:!1},requiredText:{type:String,required:!1},hasError:{type:Boolean,required:!1},errorMessage:{type:String,required:!1},name:{type:String,required:!1},id:{type:String,required:!0},modelValue:{type:String,required:!1},disabled:{type:Boolean,required:!1,default:!1},inline:{type:Boolean,required:!1,default:!1},fullwidth:{type:Boolean,default:!1},ariaLabelledby:{type:String,required:!1},ariaDescribedby:{type:String,required:!1},useWrapper:{type:Boolean,default:!0}},emits:["update:modelValue"],computed:{labelledBy(){this.ariaLabelledby||`${this.id}`}}},c=["aria-invalid","aria-errormessage","aria-labelledby","disabled","id","name","value"];function y(r,l,e,m,h,o){const u=t.resolveComponent("PktInputWrapper");return t.openBlock(),t.createBlock(u,{class:t.normalizeClass(["pkt-select",r.$attrs.class]),forId:e.id,label:e.label,helptext:e.helptext,helptextDropdown:e.helptextDropdown,helptextDropdownButton:e.helptextDropdownButton,optionalTag:e.optionalTag,optionalText:e.optionalText,requiredTag:e.requiredTag,requiredText:e.requiredText,hasError:e.hasError,errorMessage:e.errorMessage,disabled:e.disabled,inline:e.inline,ariaDescribedby:e.ariaDescribedby,useWrapper:e.useWrapper,onToggleHelpText:l[1]||(l[1]=a=>r.$emit("toggleHelpText"))},{default:t.withCtx(()=>[t.createElementVNode("select",t.mergeProps(r.$attrs,{onInput:l[0]||(l[0]=a=>r.$emit("update:modelValue",a.target.value)),class:{"pkt-input":!0,"pkt-input--fullwidth":e.fullwidth},"aria-invalid":e.hasError,"aria-errormessage":e.hasError?`${e.id}-error`:"","aria-labelledby":o.labelledBy,disabled:e.disabled,id:e.id,name:e.name||e.id,value:e.modelValue}),[t.renderSlot(r.$slots,"default")],16,c)]),_:3},8,["class","forId","label","helptext","helptextDropdown","helptextDropdownButton","optionalTag","optionalText","requiredTag","requiredText","hasError","errorMessage","disabled","inline","ariaDescribedby","useWrapper"])}const n=b._export_sfc(q,[["render",y]]),d={install(r){i.registerComponent(r,n)}};i.use(d);exports.PktSelect=n;exports.default=d;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("./Icon-7iwiZOEn.cjs"),p=require("./Alert-VmiRg_3U.cjs"),f=require("./Button-fJVVmqZU.cjs"),g=require("./InputWrapper-KjtXuCqE.cjs"),t=require("vue"),b=require("./_plugin-vue_export-helper-jfW5FsfF.cjs"),i=require("./plugins-IAlvxbZ2.cjs"),q={name:"PktSelect",components:{PktIcon:s.PktIcon,PktAlert:p.PktAlert,PktButton:f.PktButton,PktInputWrapper:g.PktInputWrapper},props:{label:{type:String,required:!0,default:"input"},helptext:{type:String,required:!1},helptextDropdown:{type:String,required:!1},helptextDropdownButton:{type:String,required:!1},optionalTag:{type:Boolean,required:!1,default:!1},optionalText:{type:String,required:!1},requiredTag:{type:Boolean,required:!1,default:!1},requiredText:{type:String,required:!1},hasError:{type:Boolean,required:!1},errorMessage:{type:String,required:!1},name:{type:String,required:!1},id:{type:String,required:!0},modelValue:{type:String,required:!1},disabled:{type:Boolean,required:!1,default:!1},inline:{type:Boolean,required:!1,default:!1},fullwidth:{type:Boolean,default:!1},ariaLabelledby:{type:String,required:!1},ariaDescribedby:{type:String,required:!1},useWrapper:{type:Boolean,default:!0}},emits:["update:modelValue"],computed:{labelledBy(){this.ariaLabelledby||`${this.id}`}}},c=["aria-invalid","aria-errormessage","aria-labelledby","disabled","id","name","value"];function y(r,l,e,m,h,o){const u=t.resolveComponent("PktInputWrapper");return t.openBlock(),t.createBlock(u,{class:t.normalizeClass(["pkt-select",r.$attrs.class]),forId:e.id,label:e.label,helptext:e.helptext,helptextDropdown:e.helptextDropdown,helptextDropdownButton:e.helptextDropdownButton,optionalTag:e.optionalTag,optionalText:e.optionalText,requiredTag:e.requiredTag,requiredText:e.requiredText,hasError:e.hasError,errorMessage:e.errorMessage,disabled:e.disabled,inline:e.inline,ariaDescribedby:e.ariaDescribedby,useWrapper:e.useWrapper,onToggleHelpText:l[1]||(l[1]=a=>r.$emit("toggleHelpText"))},{default:t.withCtx(()=>[t.createElementVNode("select",t.mergeProps(r.$attrs,{onInput:l[0]||(l[0]=a=>r.$emit("update:modelValue",a.target.value)),class:{"pkt-input":!0,"pkt-input--fullwidth":e.fullwidth},"aria-invalid":e.hasError,"aria-errormessage":e.hasError?`${e.id}-error`:"","aria-labelledby":o.labelledBy,disabled:e.disabled,id:e.id,name:e.name||e.id,value:e.modelValue}),[t.renderSlot(r.$slots,"default")],16,c)]),_:3},8,["class","forId","label","helptext","helptextDropdown","helptextDropdownButton","optionalTag","optionalText","requiredTag","requiredText","hasError","errorMessage","disabled","inline","ariaDescribedby","useWrapper"])}const n=b._export_sfc(q,[["render",y]]),d={install(r){i.registerComponent(r,n)}};i.use(d);exports.PktSelect=n;exports.default=d;

package/dist/punkt-vue-select.js

@@ -1,7 +1,7 @@
 import { P as d } from "./Icon-8MjQJfqx.js";
 import { P as o } from "./Alert-LNP7MGFo.js";
 import { P as n } from "./Button-5obh_jeA.js";
-import { P as s } from "./InputWrapper-aBvhZpl8.js";
+import { P as s } from "./InputWrapper-cZ870MjV.js";
 import { resolveComponent as u, openBlock as p, createBlock as f, normalizeClass as m, withCtx as g, createElementVNode as b, mergeProps as y, renderSlot as q } from "vue";
 import { _ as h } from "./_plugin-vue_export-helper-hUChTQA_.js";
 import { u as x, a as c } from "./plugins-UPM181Xt.js";

package/dist/punkt-vue-stepper.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const p=require("./plugins-IAlvxbZ2.cjs"),e=require("vue"),i=e.defineComponent({__name:"Stepper",props:{className:{},hideNonActiveStepsContent:{type:Boolean,default:!1},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,r)=>(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"},null,-1),_=e.createElementVNode("span",{class:"pkt-step__line pkt-step__line--2"},null,-1),m=["innerHTML"],h=e.createElementVNode("span",{class:"pkt-step__line pkt-step__line--3",role:"separator"},null,-1),f={class:"pkt-step__wrapper"},v={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()}]),r=e.computed(()=>{switch(t.status){case"current":return S;case"completed":return w;default:return k}});return(c,C)=>(e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass(o.value),"data-testid":"pkt-step"},[u,_,e.createElementVNode("span",{class:"pkt-step__indicator",innerHTML:r.value},null,8,m),h,e.createElementVNode("div",f,[e.createElementVNode("div",v,e.toDisplayString(c.title),1),e.createElementVNode("div",g,[e.renderSlot(c.$slots,"default")])])],2))}}),d={install(s){p.registerComponent(s,i),p.registerComponent(s,a)}};p.use(d);exports.PktStep=a;exports.PktStepper=i;exports.default=d;
+"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;

package/dist/punkt-vue-stepper.js

@@ -1,10 +1,10 @@
-import { u as f, a } from "./plugins-UPM181Xt.js";
-import { defineComponent as c, ref as m, computed as p, provide as v, openBlock as _, createElementBlock as d, normalizeClass as u, renderSlot as h, inject as k, createElementVNode as e, toDisplayString as g } from "vue";
+import { u as f, a as r } from "./plugins-UPM181Xt.js";
+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";
 const S = /* @__PURE__ */ c({
   __name: "Stepper",
   props: {
     className: {},
-    hideNonActiveStepsContent: { type: Boolean, default: !1 },
+    hideNonActiveStepsContent: { type: Boolean, default: !0 },
     orientation: { default: "vertical" }
   },
   setup(s) {
@@ -13,7 +13,7 @@ const S = /* @__PURE__ */ c({
       "pkt-stepper",
       t.orientation === "horizontal" ? "pkt-stepper--horizontal" : "pkt-stepper--vertical"
     ].filter(Boolean).join(" "));
-    return v("hideNonActiveStepsContent", t.hideNonActiveStepsContent), (o, i) => (_(), d("ol", {
+    return v("hideNonActiveStepsContent", t.hideNonActiveStepsContent), (o, i) => (d(), _("ol", {
       class: u(l.value),
       ref_key: "stepperRef",
       ref: n
@@ -21,9 +21,15 @@ const S = /* @__PURE__ */ c({
       h(o.$slots, "default")
     ], 2));
   }
-}), w = /* @__PURE__ */ e("span", { class: "pkt-step__line pkt-step__line--1" }, null, -1), C = /* @__PURE__ */ e("span", { class: "pkt-step__line pkt-step__line--2" }, null, -1), y = ["innerHTML"], N = /* @__PURE__ */ e("span", {
+}), w = /* @__PURE__ */ e("span", {
+  class: "pkt-step__line pkt-step__line--1",
+  "aria-hidden": ""
+}, null, -1), C = /* @__PURE__ */ e("span", {
+  class: "pkt-step__line pkt-step__line--2",
+  "aria-hidden": ""
+}, null, -1), y = ["innerHTML"], N = /* @__PURE__ */ e("span", {
   class: "pkt-step__line pkt-step__line--3",
-  role: "separator"
+  "aria-hidden": ""
 }, 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({
   __name: "Step",
   props: {
@@ -47,7 +53,7 @@ const S = /* @__PURE__ */ c({
           return z;
       }
     });
-    return (r, V) => (_(), d("li", {
+    return (a, V) => (d(), _("li", {
       class: u(o.value),
       "data-testid": "pkt-step"
     }, [
@@ -59,16 +65,16 @@ const S = /* @__PURE__ */ c({
       }, null, 8, y),
       N,
       e("div", A, [
-        e("div", x, g(r.title), 1),
+        e("div", x, g(a.title), 1),
         e("div", L, [
-          h(r.$slots, "default")
+          h(a.$slots, "default")
         ])
       ])
     ], 2));
   }
 }), H = {
   install(s) {
-    a(s, S), a(s, G);
+    r(s, S), r(s, G);
   }
 };
 f(H);

package/dist/punkt-vue-textarea.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const p=require("./Icon-7iwiZOEn.cjs"),g=require("./Alert-VmiRg_3U.cjs"),f=require("./Button-fJVVmqZU.cjs"),y=require("./InputWrapper-tRopywnC.cjs"),t=require("vue"),m=require("./_plugin-vue_export-helper-jfW5FsfF.cjs"),i=require("./plugins-IAlvxbZ2.cjs"),q={name:"PktTextarea",components:{PktIcon:p.PktIcon,PktAlert:g.PktAlert,PktButton:f.PktButton,PktInputWrapper:y.PktInputWrapper},props:{label:{type:String,required:!0,default:"input"},helptext:{type:String,required:!1},helptextDropdown:{type:String,required:!1},helptextDropdownButton:{type:String,required:!1},optionalTag:{type:Boolean,required:!1,default:!1},optionalText:{type:String,required:!1},requiredTag:{type:Boolean,required:!1,default:!1},requiredText:{type:String,required:!1},hasError:{type:Boolean,required:!1},errorMessage:{type:String,required:!1},name:{type:String,required:!1},id:{type:String,required:!0},placeholder:{type:String,required:!1},modelValue:{type:String,required:!1},disabled:{type:Boolean,required:!1,default:!1},inline:{type:Boolean,required:!1,default:!1},fullwidth:{type:Boolean,default:!1},ariaLabelledby:{type:String,required:!1},ariaDescribedby:{type:String,required:!1},counter:{type:Boolean,default:!1},counterMaxLength:{type:Number,required:!1},rows:{type:Number,required:!1},useWrapper:{type:Boolean,default:!0}},emits:["update:modelValue"],computed:{labelledBy(){this.ariaLabelledby||`${this.id}`}}},b=["aria-invalid","aria-errormessage","aria-labelledby","disabled","id","name","placeholder","rows","value"],h={key:0,class:"pkt-input__counter","aria-live":"polite","aria-atomic":"true"};function x(r,a,e,k,T,d){const s=t.resolveComponent("PktInputWrapper");return t.openBlock(),t.createBlock(s,{class:t.normalizeClass(["pkt-textarea",r.$attrs.class]),forId:e.id,label:e.label,helptext:e.helptext,helptextDropdown:e.helptextDropdown,helptextDropdownButton:e.helptextDropdownButton,optionalTag:e.optionalTag,optionalText:e.optionalText,requiredTag:e.requiredTag,requiredText:e.requiredText,hasError:e.hasError,errorMessage:e.errorMessage,disabled:e.disabled,inline:e.inline,ariaDescribedby:e.ariaDescribedby,useWrapper:e.useWrapper,onToggleHelpText:a[1]||(a[1]=l=>r.$emit("toggleHelpText"))},{default:t.withCtx(()=>{var l,n;return[t.createElementVNode("textarea",t.mergeProps(r.$attrs,{onInput:a[0]||(a[0]=c=>r.$emit("update:modelValue",c.target.value)),class:{"pkt-input":!0,"pkt-input--fullwidth":e.fullwidth,"pkt-input--counter-error":e.counterMaxLength&&((l=e.modelValue)==null?void 0:l.length)>e.counterMaxLength},"aria-invalid":e.hasError,"aria-errormessage":e.hasError?`${e.id}-error`:"","aria-labelledby":d.labelledBy,disabled:e.disabled,id:e.id,name:e.name||e.id,placeholder:e.placeholder,rows:e.rows,value:e.modelValue}),null,16,b),e.counter?(t.openBlock(),t.createElementBlock("div",h,[t.createTextVNode(t.toDisplayString(((n=e.modelValue)==null?void 0:n.length)||0),1),e.counterMaxLength?(t.openBlock(),t.createElementBlock(t.Fragment,{key:0},[t.createTextVNode("/"+t.toDisplayString(e.counterMaxLength),1)],64)):t.createCommentVNode("",!0)])):t.createCommentVNode("",!0)]}),_:1},8,["class","forId","label","helptext","helptextDropdown","helptextDropdownButton","optionalTag","optionalText","requiredTag","requiredText","hasError","errorMessage","disabled","inline","ariaDescribedby","useWrapper"])}const o=m._export_sfc(q,[["render",x]]),u={install(r){i.registerComponent(r,o)}};i.use(u);exports.PktTextarea=o;exports.default=u;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const p=require("./Icon-7iwiZOEn.cjs"),c=require("./Alert-VmiRg_3U.cjs"),f=require("./Button-fJVVmqZU.cjs"),q=require("./InputWrapper-KjtXuCqE.cjs"),t=require("vue"),b=require("./_plugin-vue_export-helper-jfW5FsfF.cjs"),i=require("./plugins-IAlvxbZ2.cjs"),h={name:"PktTextarea",components:{PktIcon:p.PktIcon,PktAlert:c.PktAlert,PktButton:f.PktButton,PktInputWrapper:q.PktInputWrapper},props:{label:{type:String,required:!0,default:"input"},helptext:{type:String,required:!1},helptextDropdown:{type:String,required:!1},helptextDropdownButton:{type:String,required:!1},optionalTag:{type:Boolean,required:!1,default:!1},optionalText:{type:String,required:!1},requiredTag:{type:Boolean,required:!1,default:!1},requiredText:{type:String,required:!1},hasError:{type:Boolean,required:!1},errorMessage:{type:String,required:!1},name:{type:String,required:!1},id:{type:String,required:!0},placeholder:{type:String,required:!1},modelValue:{type:String,required:!1},disabled:{type:Boolean,required:!1,default:!1},inline:{type:Boolean,required:!1,default:!1},fullwidth:{type:Boolean,default:!1},ariaLabelledby:{type:String,required:!1},ariaDescribedby:{type:String,required:!1},counter:{type:Boolean,default:!1},counterMaxLength:{type:Number,required:!1},rows:{type:Number,required:!1},useWrapper:{type:Boolean,default:!0}},emits:["update:modelValue"],computed:{labelledBy(){this.ariaLabelledby||`${this.id}`}}},y=["aria-invalid","aria-errormessage","aria-labelledby","disabled","id","name","placeholder","rows","value"];function x(r,a,e,m,T,d){var n;const s=t.resolveComponent("PktInputWrapper");return t.openBlock(),t.createBlock(s,{class:t.normalizeClass(["pkt-textarea",r.$attrs.class]),forId:e.id,label:e.label,helptext:e.helptext,helptextDropdown:e.helptextDropdown,helptextDropdownButton:e.helptextDropdownButton,counter:e.counter,counterCurrent:(n=e.modelValue)==null?void 0:n.length,counterMaxLength:e.counterMaxLength,optionalTag:e.optionalTag,optionalText:e.optionalText,requiredTag:e.requiredTag,requiredText:e.requiredText,hasError:e.hasError,errorMessage:e.errorMessage,disabled:e.disabled,inline:e.inline,ariaDescribedby:e.ariaDescribedby,useWrapper:e.useWrapper,onToggleHelpText:a[1]||(a[1]=l=>r.$emit("toggleHelpText"))},{default:t.withCtx(()=>{var l;return[t.createElementVNode("textarea",t.mergeProps(r.$attrs,{onInput:a[0]||(a[0]=g=>r.$emit("update:modelValue",g.target.value)),class:{"pkt-input":!0,"pkt-input--fullwidth":e.fullwidth,"pkt-input--counter-error":e.counterMaxLength&&((l=e.modelValue)==null?void 0:l.length)>e.counterMaxLength},"aria-invalid":e.hasError,"aria-errormessage":e.hasError?`${e.id}-error`:"","aria-labelledby":d.labelledBy,disabled:e.disabled,id:e.id,name:e.name||e.id,placeholder:e.placeholder,rows:e.rows,value:e.modelValue}),null,16,y)]}),_:1},8,["class","forId","label","helptext","helptextDropdown","helptextDropdownButton","counter","counterCurrent","counterMaxLength","optionalTag","optionalText","requiredTag","requiredText","hasError","errorMessage","disabled","inline","ariaDescribedby","useWrapper"])}const u=b._export_sfc(h,[["render",x]]),o={install(r){i.registerComponent(r,u)}};i.use(o);exports.PktTextarea=u;exports.default=o;

package/dist/punkt-vue-textarea.js

@@ -1,13 +1,13 @@
-import { P as g } from "./Icon-8MjQJfqx.js";
-import { P as p } from "./Alert-LNP7MGFo.js";
-import { P as c } from "./Button-5obh_jeA.js";
-import { P as y } from "./InputWrapper-aBvhZpl8.js";
-import { resolveComponent as h, openBlock as l, createBlock as x, normalizeClass as b, withCtx as q, createElementVNode as T, mergeProps as k, createElementBlock as n, createTextVNode as o, toDisplayString as d, Fragment as B, createCommentVNode as u } from "vue";
-import { _ as w } from "./_plugin-vue_export-helper-hUChTQA_.js";
-import { u as P, a as S } from "./plugins-UPM181Xt.js";
-const D = {
+import { P as d } from "./Icon-8MjQJfqx.js";
+import { P as u } from "./Alert-LNP7MGFo.js";
+import { P as s } from "./Button-5obh_jeA.js";
+import { P as f } from "./InputWrapper-cZ870MjV.js";
+import { resolveComponent as g, openBlock as p, createBlock as m, normalizeClass as h, withCtx as c, createElementVNode as x, mergeProps as y } from "vue";
+import { _ as b } from "./_plugin-vue_export-helper-hUChTQA_.js";
+import { u as q, a as T } from "./plugins-UPM181Xt.js";
+const B = {
   name: "PktTextarea",
-  components: { PktIcon: g, PktAlert: p, PktButton: c, PktInputWrapper: y },
+  components: { PktIcon: d, PktAlert: u, PktButton: s, PktInputWrapper: f },
   props: {
     label: {
       type: String,
@@ -113,21 +113,20 @@ const D = {
       this.ariaLabelledby || `${this.id}`;
     }
   }
-}, _ = ["aria-invalid", "aria-errormessage", "aria-labelledby", "disabled", "id", "name", "placeholder", "rows", "value"], v = {
-  key: 0,
-  class: "pkt-input__counter",
-  "aria-live": "polite",
-  "aria-atomic": "true"
-};
-function M(t, r, e, I, L, s) {
-  const f = h("PktInputWrapper");
-  return l(), x(f, {
-    class: b(["pkt-textarea", t.$attrs.class]),
+}, w = ["aria-invalid", "aria-errormessage", "aria-labelledby", "disabled", "id", "name", "placeholder", "rows", "value"];
+function k(t, r, e, D, M, i) {
+  var l;
+  const n = g("PktInputWrapper");
+  return p(), m(n, {
+    class: h(["pkt-textarea", t.$attrs.class]),
     forId: e.id,
     label: e.label,
     helptext: e.helptext,
     helptextDropdown: e.helptextDropdown,
     helptextDropdownButton: e.helptextDropdownButton,
+    counter: e.counter,
+    counterCurrent: (l = e.modelValue) == null ? void 0 : l.length,
+    counterMaxLength: e.counterMaxLength,
     optionalTag: e.optionalTag,
     optionalText: e.optionalText,
     requiredTag: e.requiredTag,
@@ -140,11 +139,11 @@ function M(t, r, e, I, L, s) {
     useWrapper: e.useWrapper,
     onToggleHelpText: r[1] || (r[1] = (a) => t.$emit("toggleHelpText"))
   }, {
-    default: q(() => {
-      var a, i;
+    default: c(() => {
+      var a;
       return [
-        T("textarea", k(t.$attrs, {
-          onInput: r[0] || (r[0] = (m) => t.$emit("update:modelValue", m.target.value)),
+        x("textarea", y(t.$attrs, {
+          onInput: r[0] || (r[0] = (o) => t.$emit("update:modelValue", o.target.value)),
           class: {
             "pkt-input": !0,
             "pkt-input--fullwidth": e.fullwidth,
@@ -152,32 +151,26 @@ function M(t, r, e, I, L, s) {
           },
           "aria-invalid": e.hasError,
           "aria-errormessage": e.hasError ? `${e.id}-error` : "",
-          "aria-labelledby": s.labelledBy,
+          "aria-labelledby": i.labelledBy,
           disabled: e.disabled,
           id: e.id,
           name: e.name || e.id,
           placeholder: e.placeholder,
           rows: e.rows,
           value: e.modelValue
-        }), null, 16, _),
-        e.counter ? (l(), n("div", v, [
-          o(d(((i = e.modelValue) == null ? void 0 : i.length) || 0), 1),
-          e.counterMaxLength ? (l(), n(B, { key: 0 }, [
-            o("/" + d(e.counterMaxLength), 1)
-          ], 64)) : u("", !0)
-        ])) : u("", !0)
+        }), null, 16, w)
       ];
     }),
     _: 1
-  }, 8, ["class", "forId", "label", "helptext", "helptextDropdown", "helptextDropdownButton", "optionalTag", "optionalText", "requiredTag", "requiredText", "hasError", "errorMessage", "disabled", "inline", "ariaDescribedby", "useWrapper"]);
+  }, 8, ["class", "forId", "label", "helptext", "helptextDropdown", "helptextDropdownButton", "counter", "counterCurrent", "counterMaxLength", "optionalTag", "optionalText", "requiredTag", "requiredText", "hasError", "errorMessage", "disabled", "inline", "ariaDescribedby", "useWrapper"]);
 }
-const V = /* @__PURE__ */ w(D, [["render", M]]), E = {
+const P = /* @__PURE__ */ b(B, [["render", k]]), S = {
   install(t) {
-    S(t, V);
+    T(t, P);
   }
 };
-P(E);
+q(S);
 export {
-  V as PktTextarea,
-  E as default
+  P as PktTextarea,
+  S as default
 };

package/dist/punkt-vue-textinput.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("./Icon-7iwiZOEn.cjs"),p=require("./Alert-VmiRg_3U.cjs"),f=require("./InputWrapper-tRopywnC.cjs"),t=require("vue"),g=require("./_plugin-vue_export-helper-jfW5FsfF.cjs"),o=require("./plugins-IAlvxbZ2.cjs");require("./Button-fJVVmqZU.cjs");const m={name:"PktTextinput",components:{PktIcon:c.PktIcon,PktAlert:p.PktAlert,PktInputWrapper:f.PktInputWrapper},inheritAttrs:!1,props:{label:{type:String,required:!0,default:"input"},helptext:{type:String,required:!1},helptextDropdown:{type:String,required:!1},helptextDropdownButton:{type:String,required:!1},optionalTag:{type:Boolean,required:!1,default:!1},optionalText:{type:String,required:!1},requiredTag:{type:Boolean,required:!1,default:!1},requiredText:{type:String,required:!1},hasError:{type:Boolean,required:!1},errorMessage:{type:String,required:!1},name:{type:String,required:!1},id:{type:String,required:!0},placeholder:{type:String,required:!1},type:{type:String,required:!1,default:"text"},autocomplete:{type:String,required:!1,default:"off"},modelValue:{type:String,required:!1},suffix:{type:String,required:!1},prefix:{type:String,required:!1},iconNameRight:{type:String,required:!1},disabled:{type:Boolean,required:!1,default:!1},inline:{type:Boolean,required:!1,default:!1},fullwidth:{type:Boolean,default:!1},ariaLabelledby:{type:String,required:!1},ariaDescribedby:{type:String,required:!1},useWrapper:{type:Boolean,default:!0},omitSearchIcon:{type:Boolean,default:!1}},emits:["update:modelValue"],computed:{labelledBy(){this.ariaLabelledby||`${this.id}`},shouldShowSearchIcon(){return this.type==="search"&&!this.iconNameRight&&!this.omitSearchIcon}}},y={class:"pkt-input__container"},h={key:0,class:"pkt-input-prefix"},k=["type","name","id","placeholder","autocomplete","value","disabled","aria-invalid","aria-errormessage","aria-labelledby"],q={key:1,class:"pkt-input-suffix"};function x(r,a,e,b,S,i){const l=t.resolveComponent("PktIcon"),s=t.resolveComponent("PktInputWrapper");return t.openBlock(),t.createBlock(s,{class:t.normalizeClass(["pkt-textinput",r.$attrs.class]),forId:e.id,label:e.label,helptext:e.helptext,helptextDropdown:e.helptextDropdown,helptextDropdownButton:e.helptextDropdownButton,optionalTag:e.optionalTag,optionalText:e.optionalText,requiredTag:e.requiredTag,requiredText:e.requiredText,hasError:e.hasError,errorMessage:e.errorMessage,disabled:e.disabled,inline:e.inline,ariaDescribedby:e.ariaDescribedby,useWrapper:e.useWrapper,onToggleHelpText:a[1]||(a[1]=n=>r.$emit("toggleHelpText"))},{default:t.withCtx(()=>[t.createElementVNode("div",y,[e.prefix?(t.openBlock(),t.createElementBlock("div",h,t.toDisplayString(e.prefix),1)):t.createCommentVNode("",!0),t.createElementVNode("input",t.mergeProps(r.$attrs,{onInput:a[0]||(a[0]=n=>r.$emit("update:modelValue",n.target.value)),class:{"pkt-input":!0,"pkt-input--fullwidth":e.fullwidth},type:e.type,name:e.name||e.id,id:e.id,placeholder:e.placeholder,autocomplete:e.autocomplete,value:e.modelValue,disabled:e.disabled,"aria-invalid":e.hasError,"aria-errormessage":e.hasError?`${e.id}-error`:"","aria-labelledby":i.labelledBy,ref:"input"}),null,16,k),e.suffix?(t.openBlock(),t.createElementBlock("p",q,[t.createTextVNode(t.toDisplayString(e.suffix)+" ",1),e.iconNameRight?(t.openBlock(),t.createBlock(l,{key:0,class:"pkt-input-suffix-icon",name:e.iconNameRight},null,8,["name"])):i.shouldShowSearchIcon?(t.openBlock(),t.createBlock(l,{key:1,class:"pkt-input-suffix-icon",name:"magnifying-glass-big"})):t.createCommentVNode("",!0)])):e.iconNameRight?(t.openBlock(),t.createBlock(l,{key:2,class:"pkt-input-icon",name:e.iconNameRight},null,8,["name"])):i.shouldShowSearchIcon?(t.openBlock(),t.createBlock(l,{key:3,class:"pkt-input-icon",name:"magnifying-glass-big"})):t.createCommentVNode("",!0)])]),_:1},8,["class","forId","label","helptext","helptextDropdown","helptextDropdownButton","optionalTag","optionalText","requiredTag","requiredText","hasError","errorMessage","disabled","inline","ariaDescribedby","useWrapper"])}const u=g._export_sfc(m,[["render",x]]),d={install(r){o.registerComponent(r,u)}};o.use(d);exports.PktTextinput=u;exports.default=d;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("./Icon-7iwiZOEn.cjs"),p=require("./Alert-VmiRg_3U.cjs"),f=require("./InputWrapper-KjtXuCqE.cjs"),t=require("vue"),g=require("./_plugin-vue_export-helper-jfW5FsfF.cjs"),o=require("./plugins-IAlvxbZ2.cjs");require("./Button-fJVVmqZU.cjs");const h={name:"PktTextinput",components:{PktIcon:s.PktIcon,PktAlert:p.PktAlert,PktInputWrapper:f.PktInputWrapper},inheritAttrs:!1,props:{label:{type:String,required:!0,default:"input"},helptext:{type:String,required:!1},helptextDropdown:{type:String,required:!1},helptextDropdownButton:{type:String,required:!1},counter:{type:Boolean,default:!1},counterMaxLength:{type:Number,required:!1},optionalTag:{type:Boolean,required:!1,default:!1},optionalText:{type:String,required:!1},requiredTag:{type:Boolean,required:!1,default:!1},requiredText:{type:String,required:!1},hasError:{type:Boolean,required:!1},errorMessage:{type:String,required:!1},name:{type:String,required:!1},id:{type:String,required:!0},placeholder:{type:String,required:!1},type:{type:String,required:!1,default:"text"},autocomplete:{type:String,required:!1,default:"off"},modelValue:{type:String,required:!1},suffix:{type:String,required:!1},prefix:{type:String,required:!1},iconNameRight:{type:String,required:!1},disabled:{type:Boolean,required:!1,default:!1},inline:{type:Boolean,required:!1,default:!1},fullwidth:{type:Boolean,default:!1},ariaLabelledby:{type:String,required:!1},ariaDescribedby:{type:String,required:!1},useWrapper:{type:Boolean,default:!0},omitSearchIcon:{type:Boolean,default:!1}},emits:["update:modelValue"],computed:{labelledBy(){this.ariaLabelledby||`${this.id}`},shouldShowSearchIcon(){return this.type==="search"&&!this.iconNameRight&&!this.omitSearchIcon},counterCurrent(){var r;return(r=this.modelValue)==null?void 0:r.length}}},m={class:"pkt-input__container"},y={key:0,class:"pkt-input-prefix"},x=["type","name","id","placeholder","autocomplete","value","disabled","aria-invalid","aria-errormessage","aria-labelledby"],k={key:1,class:"pkt-input-suffix"};function q(r,l,e,b,S,a){const n=t.resolveComponent("PktIcon"),c=t.resolveComponent("PktInputWrapper");return t.openBlock(),t.createBlock(c,{class:t.normalizeClass(["pkt-textinput",r.$attrs.class]),forId:e.id,label:e.label,helptext:e.helptext,helptextDropdown:e.helptextDropdown,helptextDropdownButton:e.helptextDropdownButton,counter:e.counter,counterCurrent:a.counterCurrent,counterMaxLength:e.counterMaxLength,optionalTag:e.optionalTag,optionalText:e.optionalText,requiredTag:e.requiredTag,requiredText:e.requiredText,hasError:e.hasError,errorMessage:e.errorMessage,disabled:e.disabled,inline:e.inline,ariaDescribedby:e.ariaDescribedby,useWrapper:e.useWrapper,onToggleHelpText:l[1]||(l[1]=i=>r.$emit("toggleHelpText"))},{default:t.withCtx(()=>[t.createElementVNode("div",m,[e.prefix?(t.openBlock(),t.createElementBlock("div",y,t.toDisplayString(e.prefix),1)):t.createCommentVNode("",!0),t.createElementVNode("input",t.mergeProps(r.$attrs,{onInput:l[0]||(l[0]=i=>r.$emit("update:modelValue",i.target.value)),class:{"pkt-input":!0,"pkt-input--fullwidth":e.fullwidth,"pkt-input--counter-error":e.counterMaxLength&&a.counterCurrent>e.counterMaxLength},type:e.type,name:e.name||e.id,id:e.id,placeholder:e.placeholder,autocomplete:e.autocomplete,value:e.modelValue,disabled:e.disabled,"aria-invalid":e.hasError,"aria-errormessage":e.hasError?`${e.id}-error`:"","aria-labelledby":a.labelledBy,ref:"input"}),null,16,x),e.suffix?(t.openBlock(),t.createElementBlock("p",k,[t.createTextVNode(t.toDisplayString(e.suffix)+" ",1),e.iconNameRight?(t.openBlock(),t.createBlock(n,{key:0,class:"pkt-input-suffix-icon",name:e.iconNameRight},null,8,["name"])):a.shouldShowSearchIcon?(t.openBlock(),t.createBlock(n,{key:1,class:"pkt-input-suffix-icon",name:"magnifying-glass-big"})):t.createCommentVNode("",!0)])):e.iconNameRight?(t.openBlock(),t.createBlock(n,{key:2,class:"pkt-input-icon",name:e.iconNameRight},null,8,["name"])):a.shouldShowSearchIcon?(t.openBlock(),t.createBlock(n,{key:3,class:"pkt-input-icon",name:"magnifying-glass-big"})):t.createCommentVNode("",!0)])]),_:1},8,["class","forId","label","helptext","helptextDropdown","helptextDropdownButton","counter","counterCurrent","counterMaxLength","optionalTag","optionalText","requiredTag","requiredText","hasError","errorMessage","disabled","inline","ariaDescribedby","useWrapper"])}const u=g._export_sfc(h,[["render",q]]),d={install(r){o.registerComponent(r,u)}};o.use(d);exports.PktTextinput=u;exports.default=d;

package/dist/punkt-vue-textinput.js

@@ -1,13 +1,13 @@
-import { P as m } from "./Icon-8MjQJfqx.js";
-import { P as g } from "./Alert-LNP7MGFo.js";
-import { P as h } from "./InputWrapper-aBvhZpl8.js";
-import { resolveComponent as u, openBlock as t, createBlock as r, normalizeClass as y, withCtx as x, createElementVNode as s, createElementBlock as f, toDisplayString as p, createCommentVNode as o, mergeProps as b, createTextVNode as q } from "vue";
+import { P as g } from "./Icon-8MjQJfqx.js";
+import { P as m } from "./Alert-LNP7MGFo.js";
+import { P as h } from "./InputWrapper-cZ870MjV.js";
+import { resolveComponent as d, openBlock as r, createBlock as i, normalizeClass as y, withCtx as x, createElementVNode as s, createElementBlock as c, toDisplayString as f, createCommentVNode as o, mergeProps as b, createTextVNode as q } from "vue";
 import { _ as k } from "./_plugin-vue_export-helper-hUChTQA_.js";
 import { u as S, a as T } from "./plugins-UPM181Xt.js";
 import "./Button-5obh_jeA.js";
 const B = {
   name: "PktTextinput",
-  components: { PktIcon: m, PktAlert: g, PktInputWrapper: h },
+  components: { PktIcon: g, PktAlert: m, PktInputWrapper: h },
   inheritAttrs: !1,
   props: {
     label: {
@@ -27,6 +27,14 @@ const B = {
       type: String,
       required: !1
     },
+    counter: {
+      type: Boolean,
+      default: !1
+    },
+    counterMaxLength: {
+      type: Number,
+      required: !1
+    },
     optionalTag: {
       type: Boolean,
       required: !1,
@@ -129,6 +137,10 @@ const B = {
     },
     shouldShowSearchIcon() {
       return this.type === "search" && !this.iconNameRight && !this.omitSearchIcon;
+    },
+    counterCurrent() {
+      var t;
+      return (t = this.modelValue) == null ? void 0 : t.length;
     }
   }
 }, _ = { class: "pkt-input__container" }, w = {
@@ -138,15 +150,18 @@ const B = {
   key: 1,
   class: "pkt-input-suffix"
 };
-function D(a, i, e, E, V, n) {
-  const l = u("PktIcon"), c = u("PktInputWrapper");
-  return t(), r(c, {
-    class: y(["pkt-textinput", a.$attrs.class]),
+function D(t, l, e, N, v, a) {
+  const n = d("PktIcon"), p = d("PktInputWrapper");
+  return r(), i(p, {
+    class: y(["pkt-textinput", t.$attrs.class]),
     forId: e.id,
     label: e.label,
     helptext: e.helptext,
     helptextDropdown: e.helptextDropdown,
     helptextDropdownButton: e.helptextDropdownButton,
+    counter: e.counter,
+    counterCurrent: a.counterCurrent,
+    counterMaxLength: e.counterMaxLength,
     optionalTag: e.optionalTag,
     optionalText: e.optionalText,
     requiredTag: e.requiredTag,
@@ -157,16 +172,17 @@ function D(a, i, e, E, V, n) {
     inline: e.inline,
     ariaDescribedby: e.ariaDescribedby,
     useWrapper: e.useWrapper,
-    onToggleHelpText: i[1] || (i[1] = (d) => a.$emit("toggleHelpText"))
+    onToggleHelpText: l[1] || (l[1] = (u) => t.$emit("toggleHelpText"))
   }, {
     default: x(() => [
       s("div", _, [
-        e.prefix ? (t(), f("div", w, p(e.prefix), 1)) : o("", !0),
-        s("input", b(a.$attrs, {
-          onInput: i[0] || (i[0] = (d) => a.$emit("update:modelValue", d.target.value)),
+        e.prefix ? (r(), c("div", w, f(e.prefix), 1)) : o("", !0),
+        s("input", b(t.$attrs, {
+          onInput: l[0] || (l[0] = (u) => t.$emit("update:modelValue", u.target.value)),
           class: {
             "pkt-input": !0,
-            "pkt-input--fullwidth": e.fullwidth
+            "pkt-input--fullwidth": e.fullwidth,
+            "pkt-input--counter-error": e.counterMaxLength && a.counterCurrent > e.counterMaxLength
           },
           type: e.type,
           name: e.name || e.id,
@@ -177,25 +193,25 @@ function D(a, i, e, E, V, n) {
           disabled: e.disabled,
           "aria-invalid": e.hasError,
           "aria-errormessage": e.hasError ? `${e.id}-error` : "",
-          "aria-labelledby": n.labelledBy,
+          "aria-labelledby": a.labelledBy,
           ref: "input"
         }), null, 16, I),
-        e.suffix ? (t(), f("p", P, [
-          q(p(e.suffix) + " ", 1),
-          e.iconNameRight ? (t(), r(l, {
+        e.suffix ? (r(), c("p", P, [
+          q(f(e.suffix) + " ", 1),
+          e.iconNameRight ? (r(), i(n, {
             key: 0,
             class: "pkt-input-suffix-icon",
             name: e.iconNameRight
-          }, null, 8, ["name"])) : n.shouldShowSearchIcon ? (t(), r(l, {
+          }, null, 8, ["name"])) : a.shouldShowSearchIcon ? (r(), i(n, {
             key: 1,
             class: "pkt-input-suffix-icon",
             name: "magnifying-glass-big"
           })) : o("", !0)
-        ])) : e.iconNameRight ? (t(), r(l, {
+        ])) : e.iconNameRight ? (r(), i(n, {
           key: 2,
           class: "pkt-input-icon",
           name: e.iconNameRight
-        }, null, 8, ["name"])) : n.shouldShowSearchIcon ? (t(), r(l, {
+        }, null, 8, ["name"])) : a.shouldShowSearchIcon ? (r(), i(n, {
           key: 3,
           class: "pkt-input-icon",
           name: "magnifying-glass-big"
@@ -203,15 +219,15 @@ function D(a, i, e, E, V, n) {
       ])
     ]),
     _: 1
-  }, 8, ["class", "forId", "label", "helptext", "helptextDropdown", "helptextDropdownButton", "optionalTag", "optionalText", "requiredTag", "requiredText", "hasError", "errorMessage", "disabled", "inline", "ariaDescribedby", "useWrapper"]);
+  }, 8, ["class", "forId", "label", "helptext", "helptextDropdown", "helptextDropdownButton", "counter", "counterCurrent", "counterMaxLength", "optionalTag", "optionalText", "requiredTag", "requiredText", "hasError", "errorMessage", "disabled", "inline", "ariaDescribedby", "useWrapper"]);
 }
-const v = /* @__PURE__ */ k(B, [["render", D]]), N = {
-  install(a) {
-    T(a, v);
+const C = /* @__PURE__ */ k(B, [["render", D]]), M = {
+  install(t) {
+    T(t, C);
   }
 };
-S(N);
+S(M);
 export {
-  v as PktTextinput,
-  N as default
+  C as PktTextinput,
+  M as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oslokommune/punkt-vue",
-  "version": "11.18.0",
+  "version": "11.19.2",
   "description": "Vue komponentbibliotek til Punkt, et designsystem laget av Oslo Origo",
   "homepage": "https://punkt.oslo.kommune.no",
   "author": "Team Designsystem, Oslo Origo",
@@ -27,7 +27,7 @@
   },
   "devDependencies": {
     "@oslokommune/punkt-assets": "^11.17.0",
-    "@oslokommune/punkt-css": "^11.18.0",
+    "@oslokommune/punkt-css": "^11.19.2",
     "@vitejs/plugin-vue": "^4.5.2",
     "edit-json-file": "^1.7.0",
     "sass": "^1.69.5",
@@ -65,5 +65,5 @@
     "url": "https://github.com/oslokommune/punkt/issues"
   },
   "license": "MIT",
-  "gitHead": "f2382da4fe9b032b7d2d1671b6f76f282960e9a2"
+  "gitHead": "0ca7c50fc32c471a63615349ecee431fd30f7a72"
 }

package/src/components/inputwrapper/InputWrapper.vue

@@ -61,8 +61,11 @@
       >
       <slot />
     </template>
+    <div v-if="counter" class="pkt-input__counter" aria-live="polite" aria-atomic="true">
+      {{ counterCurrent || 0 }}<template v-if="counterMaxLength">/{{ counterMaxLength }}</template>
+    </div>
     <div v-if="hasError && errorMessage">
-      <PktAlert skin="error" aria-live="assertive" :id="`${forId}-error`" compact>{{ errorMessage }}</PktAlert>
+      <PktAlert skin="error" aria-live="assertive" :id="`${forId}-error`" compact v-html="errorMessage"></PktAlert>
     </div>
   </div>
 </template>
@@ -96,6 +99,18 @@ export default {
       type: String,
       required: false,
     },
+    counter: {
+      type: Boolean,
+      default: false,
+    },
+    counterCurrent: {
+      type: Number,
+      required: false,
+    },
+    counterMaxLength: {
+      type: Number,
+      required: false,
+    },
     optionalTag: {
       type: Boolean,
       required: false,

package/src/components/stepper/Step.vue

@@ -1,9 +1,9 @@
 <template>
   <li :class="stepClasses" data-testid="pkt-step">
-    <span class="pkt-step__line pkt-step__line--1"></span>
-    <span class="pkt-step__line pkt-step__line--2"></span>
+    <span class="pkt-step__line pkt-step__line--1" aria-hidden></span>
+    <span class="pkt-step__line pkt-step__line--2" aria-hidden></span>
     <span class="pkt-step__indicator" v-html="statusSVG"> </span>
-    <span class="pkt-step__line pkt-step__line--3" role="separator"></span>
+    <span class="pkt-step__line pkt-step__line--3" aria-hidden></span>
     <div class="pkt-step__wrapper">
       <div class="pkt-step__title">{{ title }}</div>
       <div class="pkt-step__content">

package/src/components/stepper/Stepper.vue

@@ -14,7 +14,7 @@ interface IStepperProps {
 }
 
 const props = withDefaults(defineProps<IStepperProps>(), {
-  hideNonActiveStepsContent: false,
+  hideNonActiveStepsContent: true,
   orientation: 'vertical',
 })
 

package/src/components/textarea/Textarea.vue

@@ -7,6 +7,9 @@
     :helptext="helptext"
     :helptextDropdown="helptextDropdown"
     :helptextDropdownButton="helptextDropdownButton"
+    :counter="counter"
+    :counterCurrent="modelValue?.length"
+    :counterMaxLength="counterMaxLength"
     :optionalTag="optionalTag"
     :optionalText="optionalText"
     :requiredTag="requiredTag"
@@ -37,9 +40,6 @@
       :rows="rows"
       :value="modelValue"
     />
-    <div v-if="counter" class="pkt-input__counter" aria-live="polite" aria-atomic="true">
-      {{ modelValue?.length || 0 }}<template v-if="counterMaxLength">/{{ counterMaxLength }}</template>
-    </div>
   </PktInputWrapper>
 </template>
 

package/src/components/textinput/Textinput.vue

@@ -7,6 +7,9 @@
     :helptext="helptext"
     :helptextDropdown="helptextDropdown"
     :helptextDropdownButton="helptextDropdownButton"
+    :counter="counter"
+    :counterCurrent="counterCurrent"
+    :counterMaxLength="counterMaxLength"
     :optionalTag="optionalTag"
     :optionalText="optionalText"
     :requiredTag="requiredTag"
@@ -27,6 +30,7 @@
         :class="{
           'pkt-input': true,
           'pkt-input--fullwidth': fullwidth,
+          'pkt-input--counter-error': counterMaxLength && counterCurrent > counterMaxLength,
         }"
         :type="type"
         :name="name || id"
@@ -78,6 +82,14 @@ export default {
       type: String,
       required: false,
     },
+    counter: {
+      type: Boolean,
+      default: false,
+    },
+    counterMaxLength: {
+      type: Number,
+      required: false,
+    },
     optionalTag: {
       type: Boolean,
       required: false,
@@ -181,6 +193,9 @@ export default {
     shouldShowSearchIcon() {
       return this.type === 'search' && !this.iconNameRight && !this.omitSearchIcon
     },
+    counterCurrent() {
+      return this.modelValue?.length
+    },
   },
 }
 </script>

package/dist/InputWrapper-tRopywnC.cjs

@@ -1 +0,0 @@
-"use strict";const s=require("./Alert-VmiRg_3U.cjs"),o=require("./Button-fJVVmqZU.cjs"),e=require("vue"),d=require("./_plugin-vue_export-helper-jfW5FsfF.cjs"),p={name:"pktInputwrapper",components:{PktAlert:s.PktAlert,PktButton:o.PktButton},props:{forId:{type:String,required:!0},label:{type:String,required:!0,default:"input"},helptext:{type:String,required:!1},helptextDropdown:{type:String,required:!1},helptextDropdownButton:{type:String,required:!1},optionalTag:{type:Boolean,required:!1,default:!1},optionalText:{type:String,default:"Valgfritt"},requiredTag:{type:Boolean,required:!1,default:!1},requiredText:{type:String,default:"Må fylles ut"},hasError:{type:Boolean,required:!1},errorMessage:{type:String,required:!1},disabled:{type:Boolean,required:!1,default:!1},inline:{type:Boolean,required:!1,default:!1},ariaDescribedby:{type:String,required:!1},useWrapper:{type:Boolean,default:!0},hasFieldset:{type:Boolean,default:!1}},data(){return{isHelpTextOpen:!1}},methods:{toggleHelpText(){this.isHelpTextOpen=!this.isHelpTextOpen,this.$emit("toggleHelpText",this.isHelpTextOpen)},tagClass(){return this.optionalTag?"pkt-tag pkt-tag--small pkt-tag--thin-text pkt-tag--blue-light":this.requiredTag?"pkt-tag pkt-tag--small pkt-tag--thin-text pkt-tag--beige":""}},computed:{tagText(){return this.optionalTag?this.optionalText:this.requiredTag?this.requiredText:""},disabledClass(){return this.disabled?"pkt-inputwrapper--disabled":""},inlineClass(){return this.inline?"pkt-inputwrapper--inline":""},errorClass(){return this.hasError?"pkt-inputwrapper--error":""},hasDropDown(){return!!this.helptextDropdown&&this.helptextDropdown!==""},dropdownButton(){return this.helptextDropdownButton||'Les mer <span class="pkt-sr-only">om inputfeltet</span>'},describedBy(){this.ariaDescribedby?this.ariaDescribedby:this.helptext&&`${this.forId}`}}},c=["id","innerHTML"],u={key:1,class:"pkt-inputwrapper__helptext-expandable"},h=["innerHTML"],k=["innerHTML"],f=["for","aria-describedby"],g=["for","aria-describedby","id"],m={key:2};function y(a,x,t,b,l,r){const n=e.resolveComponent("PktButton"),i=e.resolveComponent("PktAlert");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["pkt-inputwrapper",r.disabledClass,r.inlineClass,r.errorClass])},[t.useWrapper?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.hasFieldset?"fieldset":r.hasDropDown?"div":"label"),{key:0,for:t.hasFieldset?void 0:t.forId,class:e.normalizeClass(["pkt-inputwrapper__label",{"pkt-inputwrapper__fieldset":t.hasFieldset,"pkt-inputwrapper__legend":t.hasFieldset}]),"aria-describedby":r.hasDropDown?void 0:t.ariaDescribedby},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.hasFieldset?"legend":r.hasDropDown?"h2":"span"),{class:e.normalizeClass({"pkt-inputwrapper__legend":t.hasFieldset}),id:`${t.forId}-label`},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.label),1),r.tagText!==""?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(r.tagClass())},e.toDisplayString(r.tagText),3)):e.createCommentVNode("",!0)]),_:1},8,["class","id"])),t.helptext?(e.openBlock(),e.createElementBlock("div",{key:0,class:"pkt-inputwrapper__helptext",id:`${t.forId}-helptext`,innerHTML:t.helptext},null,8,c)):e.createCommentVNode("",!0),r.hasDropDown?(e.openBlock(),e.createElementBlock("div",u,[e.createVNode(n,{skin:"tertiary",size:"small",variant:"icon-right","icon-name":l.isHelpTextOpen?"chevron-thin-up":"chevron-thin-down",class:"pkt-link pkt-link--icon-right",onOnClick:r.toggleHelpText},{default:e.withCtx(()=>[e.createElementVNode("span",{innerHTML:r.dropdownButton},null,8,h)]),_:1},8,["icon-name","onOnClick"]),e.createElementVNode("div",{class:e.normalizeClass(["pkt-inputwrapper__helptext",{"pkt-inputwrapper__helptext-expandable-open":l.isHelpTextOpen,"pkt-inputwrapper__helptext-expandable-closed":!l.isHelpTextOpen}])},[e.createElementVNode("span",{innerHTML:t.helptextDropdown},null,8,k)],2),t.hasFieldset?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("label",{key:0,for:t.forId,class:"pkt-sr-only","aria-describedby":r.describedBy},e.toDisplayString(t.label),9,f))])):e.createCommentVNode("",!0),e.renderSlot(a.$slots,"default")]),_:3},8,["for","class","aria-describedby"])):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[t.hasFieldset?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("label",{key:0,for:t.forId,class:"pkt-sr-only","aria-describedby":r.describedBy,id:`${t.forId}-label`},e.toDisplayString(t.label),9,g)),e.renderSlot(a.$slots,"default")],64)),t.hasError&&t.errorMessage?(e.openBlock(),e.createElementBlock("div",m,[e.createVNode(i,{skin:"error","aria-live":"assertive",id:`${t.forId}-error`,compact:""},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.errorMessage),1)]),_:1},8,["id"])])):e.createCommentVNode("",!0)],2)}const _=d._export_sfc(p,[["render",y]]);exports.PktInputWrapper=_;