@oslokommune/punkt-elements 12.29.7 → 12.29.8

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.
@@ -4,7 +4,7 @@ import { P as m, x as r, E as k, n as a, a as u } from "./element-D_ZgQsSr.js";
4
4
  import { P as y } from "./pkt-slot-controller-Clbye6cM.js";
5
5
  import { e as f, n as b } from "./ref-BSGI8ogR.js";
6
6
  import "./icon-BBFK-d-X.js";
7
- import "./tag-DVk69673.js";
7
+ import "./tag-BFqxindw.js";
8
8
  const $ = "pkt-card", v = !0, _ = {
9
9
  heading: {
10
10
  type: "string",
@@ -1,4 +1,4 @@
1
- "use strict";const g=require("./class-map-Dzci3Pfe.cjs"),d=require("./if-defined-CWHk9Kqm.cjs"),t=require("./element-r-PeQ419.cjs"),k=require("./pkt-slot-controller-Oc32unDk.cjs"),l=require("./ref-BUWgvhgU.cjs");require("./icon-DcJIqTIY.cjs");require("./tag-BMyii4Da.cjs");const u="pkt-card",h=!0,m={heading:{type:"string",name:"Heading",description:"Tittel på kortet"},subheading:{type:"string",name:"Subheading",description:"Undertittel på kortet"},skin:{type:["outlined","gray","blue","beige","green"],name:"Skin",description:"Farge på kortet",default:"outlined"},direction:{type:["landscape","portrait"],name:"Direction",description:"Retningen innholdet skal ligge i forhold til kortet",default:"portrait"},tags:{type:"array",description:"Liste av tags på kortet. Tar inn en array med objekter med følgende stringproperties: skin, iconName, ariaLabel, text",name:"Tags",items:{type:"object",properties:{skin:{type:["blue","green","red","yellow"],description:"Farge på tag"},iconName:{type:"icon",description:"Id på ikonet du ønsker å bruke til tag"},ariaLabel:{type:"string",description:"Tekst for aria-label"},text:{type:"string",description:"Tekst på tag",required:!0}}}},image:{type:"object",name:"Bilde",description:"Bilde på kortet. Tar inn et objekt av typen {src: string, alt: string}. src er stien til bildet, og alt er tekst for aria-label.",properties:{src:{type:"string",description:"Bilde på kortet",required:!0},alt:{type:"string",description:"Tekst for aria-label",required:!0}}}},y={default:{description:"Innholdet i kortet"}},c={name:u,"css-class":"pkt-card",isElement:h,props:m,slots:y};var f=Object.defineProperty,b=Object.getOwnPropertyDescriptor,i=(a,s,e,n)=>{for(var r=n>1?void 0:n?b(s,e):s,o=a.length-1,p;o>=0;o--)(p=a[o])&&(r=(n?p(s,e,r):p(r))||r);return n&&r&&f(s,e,r),r};exports.PktCard=class extends t.PktElement{constructor(){super(),this.defaultSlot=l.e(),this.skin=c.props.skin.default,this.direction=c.props.direction.default,this.image={src:"",alt:""},this.heading="",this.subheading="",this.tags=[],this.slotController=new k.PktSlotController(this,this.defaultSlot)}connectedCallback(){super.connectedCallback()}render(){const s={"pkt-card":!0,[`pkt-card--${this.skin}`]:this.skin,[`pkt-card--${this.direction}`]:this.direction};return t.x`
1
+ "use strict";const g=require("./class-map-Dzci3Pfe.cjs"),d=require("./if-defined-CWHk9Kqm.cjs"),t=require("./element-r-PeQ419.cjs"),k=require("./pkt-slot-controller-Oc32unDk.cjs"),l=require("./ref-BUWgvhgU.cjs");require("./icon-DcJIqTIY.cjs");require("./tag-B3KEILId.cjs");const u="pkt-card",h=!0,m={heading:{type:"string",name:"Heading",description:"Tittel på kortet"},subheading:{type:"string",name:"Subheading",description:"Undertittel på kortet"},skin:{type:["outlined","gray","blue","beige","green"],name:"Skin",description:"Farge på kortet",default:"outlined"},direction:{type:["landscape","portrait"],name:"Direction",description:"Retningen innholdet skal ligge i forhold til kortet",default:"portrait"},tags:{type:"array",description:"Liste av tags på kortet. Tar inn en array med objekter med følgende stringproperties: skin, iconName, ariaLabel, text",name:"Tags",items:{type:"object",properties:{skin:{type:["blue","green","red","yellow"],description:"Farge på tag"},iconName:{type:"icon",description:"Id på ikonet du ønsker å bruke til tag"},ariaLabel:{type:"string",description:"Tekst for aria-label"},text:{type:"string",description:"Tekst på tag",required:!0}}}},image:{type:"object",name:"Bilde",description:"Bilde på kortet. Tar inn et objekt av typen {src: string, alt: string}. src er stien til bildet, og alt er tekst for aria-label.",properties:{src:{type:"string",description:"Bilde på kortet",required:!0},alt:{type:"string",description:"Tekst for aria-label",required:!0}}}},y={default:{description:"Innholdet i kortet"}},c={name:u,"css-class":"pkt-card",isElement:h,props:m,slots:y};var f=Object.defineProperty,b=Object.getOwnPropertyDescriptor,i=(a,s,e,n)=>{for(var r=n>1?void 0:n?b(s,e):s,o=a.length-1,p;o>=0;o--)(p=a[o])&&(r=(n?p(s,e,r):p(r))||r);return n&&r&&f(s,e,r),r};exports.PktCard=class extends t.PktElement{constructor(){super(),this.defaultSlot=l.e(),this.skin=c.props.skin.default,this.direction=c.props.direction.default,this.image={src:"",alt:""},this.heading="",this.subheading="",this.tags=[],this.slotController=new k.PktSlotController(this,this.defaultSlot)}connectedCallback(){super.connectedCallback()}render(){const s={"pkt-card":!0,[`pkt-card--${this.skin}`]:this.skin,[`pkt-card--${this.direction}`]:this.direction};return t.x`
2
2
  <div class=${g.e(s)}>
3
3
  ${this.image.src&&t.x`
4
4
  <div class="pkt-card__image">
@@ -7,7 +7,7 @@ import { P as U } from "./input-element-B6BTwL1q.js";
7
7
  import { p as K, v as $, r as R, M as I, m as W, e as w, n as y } from "./ref-BSGI8ogR.js";
8
8
  import "./icon-BBFK-d-X.js";
9
9
  import "./input-wrapper-D-pEAZaj.js";
10
- import "./tag-DVk69673.js";
10
+ import "./tag-BFqxindw.js";
11
11
  import { P as z } from "./pkt-slot-controller-Clbye6cM.js";
12
12
  /**
13
13
  * @license
@@ -1,4 +1,4 @@
1
- "use strict";const $=require("./class-map-Dzci3Pfe.cjs"),k=require("./if-defined-CWHk9Kqm.cjs"),a=require("./element-r-PeQ419.cjs"),T=require("./state-B77EXPZ9.cjs"),g=require("./calendar-DUkAC9Hx.cjs"),S=require("./input-element-KOSm5htR.cjs"),r=require("./ref-BUWgvhgU.cjs");require("./icon-DcJIqTIY.cjs");require("./input-wrapper-Dqj4uers.cjs");require("./tag-BMyii4Da.cjs");const P=require("./pkt-slot-controller-Oc32unDk.cjs");/**
1
+ "use strict";const $=require("./class-map-Dzci3Pfe.cjs"),k=require("./if-defined-CWHk9Kqm.cjs"),a=require("./element-r-PeQ419.cjs"),T=require("./state-B77EXPZ9.cjs"),g=require("./calendar-DUkAC9Hx.cjs"),S=require("./input-element-KOSm5htR.cjs"),r=require("./ref-BUWgvhgU.cjs");require("./icon-DcJIqTIY.cjs");require("./input-wrapper-Dqj4uers.cjs");require("./tag-B3KEILId.cjs");const P=require("./pkt-slot-controller-Oc32unDk.cjs");/**
2
2
  * @license
3
3
  * Copyright 2017 Google LLC
4
4
  * SPDX-License-Identifier: BSD-3-Clause
package/dist/index.d.ts CHANGED
@@ -703,7 +703,7 @@ export declare class PktTag extends PktElement {
703
703
  closeTag: boolean;
704
704
  size: TPktSize;
705
705
  skin: TTagSkin;
706
- textStyle: string;
706
+ textStyle: string | null;
707
707
  iconName: string | undefined;
708
708
  type: TTagType;
709
709
  ariaLabel: string;
package/dist/pkt-card.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./card-Bxe-jQD_.cjs"),t=e.PktCard;Object.defineProperty(exports,"PktCard",{enumerable:!0,get:()=>e.PktCard});exports.default=t;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./card-D6VEEvX3.cjs"),t=e.PktCard;Object.defineProperty(exports,"PktCard",{enumerable:!0,get:()=>e.PktCard});exports.default=t;
package/dist/pkt-card.js CHANGED
@@ -1,4 +1,4 @@
1
- import { P as a } from "./card-Db2Ex1cH.js";
1
+ import { P as a } from "./card-CGMZxbH_.js";
2
2
  const r = a;
3
3
  export {
4
4
  a as PktCard,
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./datepicker-D6ifQ2so.cjs"),t=e.PktDatepicker;Object.defineProperty(exports,"PktDatepicker",{enumerable:!0,get:()=>e.PktDatepicker});exports.default=t;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./datepicker-NbLoqIKZ.cjs"),t=e.PktDatepicker;Object.defineProperty(exports,"PktDatepicker",{enumerable:!0,get:()=>e.PktDatepicker});exports.default=t;
@@ -1,4 +1,4 @@
1
- import { P as t } from "./datepicker-gZ_eVIyS.js";
1
+ import { P as t } from "./datepicker-LKIwV9DD.js";
2
2
  const a = t;
3
3
  export {
4
4
  t as PktDatepicker,
@@ -1,4 +1,4 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("./alert-CP5oN7df.cjs"),P=require("./button-DPb5WL9h.cjs"),c=require("./calendar-DUkAC9Hx.cjs"),k=require("./card-Bxe-jQD_.cjs"),b=require("./checkbox-CDMUepTW.cjs"),t=require("./element-r-PeQ419.cjs"),m=require("./pkt-slot-controller-Oc32unDk.cjs"),s=require("./ref-BUWgvhgU.cjs"),g=require("./class-map-Dzci3Pfe.cjs"),h=require("./datepicker-D6ifQ2so.cjs"),f=require("./helptext-C0mrdhRi.cjs"),y=require("./icon-DcJIqTIY.cjs"),O=require("./input-wrapper-Dqj4uers.cjs"),j=require("./link-C_bwx1Ml.cjs"),x=require("./linkcard-C6mZOE0R.cjs"),q=require("./loader-DQV1hMM3.cjs"),C=require("./messagebox-BSyLVNas.cjs"),v=require("./modal-CblCiNUi.cjs"),S=require("./progressbar-C_q48_qh.cjs"),p=require("./radiobutton-3e105CXX.cjs"),$=require("./tag-BMyii4Da.cjs"),_=require("./textarea-BKCVcJ6E.cjs"),L=require("./textinput-BRupcl9v.cjs"),T=require("./select-DJu4Wr1y.cjs");var B=Object.defineProperty,M=Object.getOwnPropertyDescriptor,o=(a,e,r,i)=>{for(var n=i>1?void 0:i?M(e,r):e,l=a.length-1,u;l>=0;l--)(u=a[l])&&(n=(i?u(e,r,n):u(n))||n);return i&&n&&B(e,r,n),n};exports.PktComponent=class extends t.PktElement{constructor(){super(),this.string="",this.strings=[],this.darkmode=!1,this._list=[],this.defaultSlot=s.e(),this.namedSlot=s.e(),this.slotController=new m.PktSlotController(this,this.defaultSlot,this.namedSlot)}connectedCallback(){this.strings.length&&this.strings.forEach(e=>{this._list.push(e.toUpperCase())}),super.connectedCallback()}render(){const e={"pkt-component":!0,"pkt-component--has-list":this.strings.length>0,"pkt-darkmode":this.darkmode};return t.x`
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("./alert-CP5oN7df.cjs"),P=require("./button-DPb5WL9h.cjs"),c=require("./calendar-DUkAC9Hx.cjs"),k=require("./card-D6VEEvX3.cjs"),b=require("./checkbox-CDMUepTW.cjs"),t=require("./element-r-PeQ419.cjs"),m=require("./pkt-slot-controller-Oc32unDk.cjs"),s=require("./ref-BUWgvhgU.cjs"),g=require("./class-map-Dzci3Pfe.cjs"),h=require("./datepicker-NbLoqIKZ.cjs"),f=require("./helptext-C0mrdhRi.cjs"),y=require("./icon-DcJIqTIY.cjs"),O=require("./input-wrapper-Dqj4uers.cjs"),j=require("./link-C_bwx1Ml.cjs"),x=require("./linkcard-C6mZOE0R.cjs"),q=require("./loader-DQV1hMM3.cjs"),C=require("./messagebox-BSyLVNas.cjs"),v=require("./modal-CblCiNUi.cjs"),S=require("./progressbar-C_q48_qh.cjs"),p=require("./radiobutton-3e105CXX.cjs"),$=require("./tag-B3KEILId.cjs"),_=require("./textarea-BKCVcJ6E.cjs"),L=require("./textinput-BRupcl9v.cjs"),T=require("./select-DJu4Wr1y.cjs");var B=Object.defineProperty,M=Object.getOwnPropertyDescriptor,o=(a,e,r,i)=>{for(var n=i>1?void 0:i?M(e,r):e,l=a.length-1,u;l>=0;l--)(u=a[l])&&(n=(i?u(e,r,n):u(n))||n);return i&&n&&B(e,r,n),n};exports.PktComponent=class extends t.PktElement{constructor(){super(),this.string="",this.strings=[],this.darkmode=!1,this._list=[],this.defaultSlot=s.e(),this.namedSlot=s.e(),this.slotController=new m.PktSlotController(this,this.defaultSlot,this.namedSlot)}connectedCallback(){this.strings.length&&this.strings.forEach(e=>{this._list.push(e.toUpperCase())}),super.connectedCallback()}render(){const e={"pkt-component":!0,"pkt-component--has-list":this.strings.length>0,"pkt-darkmode":this.darkmode};return t.x`
2
2
  <div class="${g.e(e)}">
3
3
  <h1 class="pkt-txt-28">${this.string}</h1>
4
4
 
package/dist/pkt-index.js CHANGED
@@ -2,13 +2,13 @@ import { P as w } from "./alert-CugVni4g.js";
2
2
  import { P as O } from "./button-BnmFhao8.js";
3
3
  import { c as d } from "./calendar-DevhqUoj.js";
4
4
  import { P as T } from "./calendar-DevhqUoj.js";
5
- import { P as A } from "./card-Db2Ex1cH.js";
5
+ import { P as A } from "./card-CGMZxbH_.js";
6
6
  import { P as D } from "./checkbox-Dw2CX5zY.js";
7
7
  import { P as f, x as P, t as k, n, a as c } from "./element-D_ZgQsSr.js";
8
8
  import { P as x } from "./pkt-slot-controller-Clbye6cM.js";
9
9
  import { e as m, n as h } from "./ref-BSGI8ogR.js";
10
10
  import { e as u } from "./class-map-BYCG9U47.js";
11
- import { P as G } from "./datepicker-gZ_eVIyS.js";
11
+ import { P as G } from "./datepicker-LKIwV9DD.js";
12
12
  import { P as M } from "./helptext-RPq_TKzJ.js";
13
13
  import { P as N } from "./icon-BBFK-d-X.js";
14
14
  import { P as W } from "./input-wrapper-D-pEAZaj.js";
@@ -19,7 +19,7 @@ import { P as Y } from "./messagebox-Di7LUz4C.js";
19
19
  import { P as tt } from "./modal-DZUQb_yG.js";
20
20
  import { P as rt } from "./progressbar-CuZj4FWi.js";
21
21
  import { P as st, P as at } from "./radiobutton-CcZ2-z8q.js";
22
- import { P as it } from "./tag-DVk69673.js";
22
+ import { P as it } from "./tag-BFqxindw.js";
23
23
  import { P as lt } from "./textarea-uzzCtHtj.js";
24
24
  import { P as mt } from "./textinput-DRkv93vp.js";
25
25
  import { P as dt } from "./select-CnizDIYN.js";
package/dist/pkt-tag.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./tag-BMyii4Da.cjs"),t=e.PktTag;Object.defineProperty(exports,"PktTag",{enumerable:!0,get:()=>e.PktTag});exports.default=t;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./tag-B3KEILId.cjs"),t=e.PktTag;Object.defineProperty(exports,"PktTag",{enumerable:!0,get:()=>e.PktTag});exports.default=t;
package/dist/pkt-tag.js CHANGED
@@ -1,4 +1,4 @@
1
- import { P as a } from "./tag-DVk69673.js";
1
+ import { P as a } from "./tag-BFqxindw.js";
2
2
  const o = a;
3
3
  export {
4
4
  a as PktTag,
@@ -1,6 +1,6 @@
1
- "use strict";const u=require("./class-map-Dzci3Pfe.cjs"),t=require("./element-r-PeQ419.cjs"),h=require("./state-B77EXPZ9.cjs"),g=require("./pkt-slot-controller-Oc32unDk.cjs"),c=require("./ref-BUWgvhgU.cjs");require("./icon-DcJIqTIY.cjs");const k="pkt-tag",d=!0,f={closeTag:{type:"boolean",required:!1,default:!1},size:{required:!1,default:"medium",type:["small","medium","large"]},iconName:{type:"icon",required:!1},skin:{required:!1,default:"blue",type:["blue","blue-light","blue-dark","green","red","beige","yellow","gray"]},textStyle:{required:!1,default:"normal-text",type:["thin-text","normal-text"]},type:{required:!1,default:"button",type:["button","submit","reset"]},ariaLabel:{type:"string",required:!1,default:"Lukk"}},y={default:{description:"Teksten til tag"}},a={name:k,"css-class":"pkt-tag",isElement:d,props:f,slots:y};var b=Object.defineProperty,m=Object.getOwnPropertyDescriptor,s=(o,e,l,r)=>{for(var i=r>1?void 0:r?m(e,l):e,n=o.length-1,p;n>=0;n--)(p=o[n])&&(i=(r?p(e,l,i):p(i))||i);return r&&i&&b(e,l,i),i};exports.PktTag=class extends t.PktElement{constructor(){super(),this.defaultSlot=c.e(),this.closeTag=a.props.closeTag.default,this.size=a.props.size.default,this.skin=a.props.skin.default,this.textStyle=a.props.textStyle.default,this.iconName=void 0,this.type=a.props.type.default,this.ariaLabel=a.props.ariaLabel.default,this._isClosed=!1,this.close=e=>{this._isClosed=!0,this.dispatchEvent(new CustomEvent("close",{detail:{origin:e},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("on-close",{detail:{origin:e},bubbles:!0,composed:!0}))},this.slotController=new g.PktSlotController(this,this.defaultSlot),this._isClosed=!1}render(){const e={"pkt-tag":!0,[`pkt-tag--${this.size}`]:!!this.size,[`pkt-tag--${this.skin}`]:!!this.skin,[`pkt-tag--${this.textStyle}`]:!!this.textStyle},l={"pkt-tag":!0,"pkt-btn":!0,"pkt-btn--tertiary":!0,[`pkt-tag--${this.size}`]:!!this.size,[`pkt-tag--${this.skin}`]:!!this.skin,[`pkt-tag--${this.textStyle}`]:!!this.textStyle,"pkt-btn--icons-right-and-left":this.closeTag&&!!this.iconName,"pkt-hide":this._isClosed};return this.closeTag?t.x`
1
+ "use strict";const u=require("./class-map-Dzci3Pfe.cjs"),t=require("./element-r-PeQ419.cjs"),h=require("./state-B77EXPZ9.cjs"),g=require("./pkt-slot-controller-Oc32unDk.cjs"),c=require("./ref-BUWgvhgU.cjs");require("./icon-DcJIqTIY.cjs");const k="pkt-tag",d=!0,f={closeTag:{type:"boolean",required:!1,default:!1},size:{required:!1,default:"medium",type:["small","medium","large"]},iconName:{type:"icon",required:!1},skin:{required:!1,default:"blue",type:["blue","blue-light","blue-dark","green","red","beige","yellow","gray"]},textStyle:{required:!1,default:"normal-text",type:["thin-text","normal-text"]},type:{required:!1,default:"button",type:["button","submit","reset"]},ariaLabel:{type:"string",required:!1,default:"Lukk"}},y={default:{description:"Teksten til tag"}},l={name:k,"css-class":"pkt-tag",isElement:d,props:f,slots:y};var b=Object.defineProperty,m=Object.getOwnPropertyDescriptor,s=(o,e,a,r)=>{for(var i=r>1?void 0:r?m(e,a):e,n=o.length-1,p;n>=0;n--)(p=o[n])&&(i=(r?p(e,a,i):p(i))||i);return r&&i&&b(e,a,i),i};exports.PktTag=class extends t.PktElement{constructor(){super(),this.defaultSlot=c.e(),this.closeTag=l.props.closeTag.default,this.size=l.props.size.default,this.skin=l.props.skin.default,this.textStyle=null,this.iconName=void 0,this.type=l.props.type.default,this.ariaLabel=l.props.ariaLabel.default,this._isClosed=!1,this.close=e=>{this._isClosed=!0,this.dispatchEvent(new CustomEvent("close",{detail:{origin:e},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("on-close",{detail:{origin:e},bubbles:!0,composed:!0}))},this.slotController=new g.PktSlotController(this,this.defaultSlot),this._isClosed=!1}render(){const e={"pkt-tag":!0,[`pkt-tag--${this.size}`]:!!this.size,[`pkt-tag--${this.skin}`]:!!this.skin,[`pkt-tag--${this.textStyle}`]:!!this.textStyle},a={"pkt-tag":!0,"pkt-btn":!0,"pkt-btn--tertiary":!0,[`pkt-tag--${this.textStyle}`]:!!this.textStyle,[`pkt-tag--${this.size}`]:!!this.size,[`pkt-tag--${this.skin}`]:!!this.skin,"pkt-btn--icons-right-and-left":this.closeTag&&!!this.iconName,"pkt-hide":this._isClosed};return this.closeTag?t.x`
2
2
  <button
3
- class=${u.e(l)}
3
+ class=${u.e(a)}
4
4
  type=${this.type}
5
5
  aria-label=${this.ariaLabel}
6
6
  @click=${this.close}
@@ -11,7 +11,7 @@
11
11
  </button>
12
12
  `:t.x`
13
13
  <span class=${u.e(e)}>
14
- ${this.iconName&&t.x` <pkt-icon class="pkt-tag__icon" name=${this.iconName}></pkt-icon> `}
14
+ ${this.iconName&&t.x`<pkt-icon class="pkt-tag__icon" name=${this.iconName}></pkt-icon>`}
15
15
  <span ${c.n(this.defaultSlot)}></span>
16
16
  </span>
17
17
  `}};s([t.n({type:Boolean,reflect:!0})],exports.PktTag.prototype,"closeTag",2);s([t.n({type:String,reflect:!0})],exports.PktTag.prototype,"size",2);s([t.n({type:String,reflect:!0})],exports.PktTag.prototype,"skin",2);s([t.n({type:String,reflect:!0})],exports.PktTag.prototype,"textStyle",2);s([t.n({type:String,reflect:!0})],exports.PktTag.prototype,"iconName",2);s([t.n({type:String})],exports.PktTag.prototype,"type",2);s([t.n({type:String})],exports.PktTag.prototype,"ariaLabel",2);s([h.r()],exports.PktTag.prototype,"_isClosed",2);exports.PktTag=s([t.t("pkt-tag")],exports.PktTag);
@@ -4,7 +4,7 @@ import { r as y } from "./state-DuS4ffEQ.js";
4
4
  import { P as g } from "./pkt-slot-controller-Clbye6cM.js";
5
5
  import { e as k, n as f } from "./ref-BSGI8ogR.js";
6
6
  import "./icon-BBFK-d-X.js";
7
- const b = "pkt-tag", S = !0, $ = {
7
+ const b = "pkt-tag", $ = !0, S = {
8
8
  closeTag: {
9
9
  type: "boolean",
10
10
  required: !1,
@@ -66,8 +66,8 @@ const b = "pkt-tag", S = !0, $ = {
66
66
  }, l = {
67
67
  name: b,
68
68
  "css-class": "pkt-tag",
69
- isElement: S,
70
- props: $,
69
+ isElement: $,
70
+ props: S,
71
71
  slots: _
72
72
  };
73
73
  var x = Object.defineProperty, C = Object.getOwnPropertyDescriptor, e = (s, o, n, r) => {
@@ -77,7 +77,7 @@ var x = Object.defineProperty, C = Object.getOwnPropertyDescriptor, e = (s, o, n
77
77
  };
78
78
  let t = class extends d {
79
79
  constructor() {
80
- super(), this.defaultSlot = k(), this.closeTag = l.props.closeTag.default, this.size = l.props.size.default, this.skin = l.props.skin.default, this.textStyle = l.props.textStyle.default, this.iconName = void 0, this.type = l.props.type.default, this.ariaLabel = l.props.ariaLabel.default, this._isClosed = !1, this.close = (s) => {
80
+ super(), this.defaultSlot = k(), this.closeTag = l.props.closeTag.default, this.size = l.props.size.default, this.skin = l.props.skin.default, this.textStyle = null, this.iconName = void 0, this.type = l.props.type.default, this.ariaLabel = l.props.ariaLabel.default, this._isClosed = !1, this.close = (s) => {
81
81
  this._isClosed = !0, this.dispatchEvent(
82
82
  new CustomEvent("close", { detail: { origin: s }, bubbles: !0, composed: !0 })
83
83
  ), this.dispatchEvent(
@@ -95,9 +95,9 @@ let t = class extends d {
95
95
  "pkt-tag": !0,
96
96
  "pkt-btn": !0,
97
97
  "pkt-btn--tertiary": !0,
98
+ [`pkt-tag--${this.textStyle}`]: !!this.textStyle,
98
99
  [`pkt-tag--${this.size}`]: !!this.size,
99
100
  [`pkt-tag--${this.skin}`]: !!this.skin,
100
- [`pkt-tag--${this.textStyle}`]: !!this.textStyle,
101
101
  "pkt-btn--icons-right-and-left": this.closeTag && !!this.iconName,
102
102
  "pkt-hide": this._isClosed
103
103
  };
@@ -114,7 +114,7 @@ let t = class extends d {
114
114
  </button>
115
115
  ` : p`
116
116
  <span class=${h(s)}>
117
- ${this.iconName && p` <pkt-icon class="pkt-tag__icon" name=${this.iconName}></pkt-icon> `}
117
+ ${this.iconName && p`<pkt-icon class="pkt-tag__icon" name=${this.iconName}></pkt-icon>`}
118
118
  <span ${f(this.defaultSlot)}></span>
119
119
  </span>
120
120
  `;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@oslokommune/punkt-elements",
3
- "version": "12.29.7",
3
+ "version": "12.29.8",
4
4
  "description": "Komponentbiblioteket til Punkt, et designsystem laget av Oslo Origo",
5
5
  "homepage": "https://punkt.oslo.kommune.no",
6
6
  "author": "Team Designsystem, Oslo Origo",
@@ -30,7 +30,7 @@
30
30
  },
31
31
  "devDependencies": {
32
32
  "@oslokommune/punkt-assets": "^12.27.1",
33
- "@oslokommune/punkt-css": "^12.29.6",
33
+ "@oslokommune/punkt-css": "^12.29.8",
34
34
  "sass": "^1.78.0",
35
35
  "typescript": "^5.6.2",
36
36
  "vite": "^5.4.4",
@@ -57,5 +57,5 @@
57
57
  "url": "https://github.com/oslokommune/punkt/issues"
58
58
  },
59
59
  "license": "MIT",
60
- "gitHead": "37c6ab9bde9ad2ae8008eb935e5e74068c356343"
60
+ "gitHead": "d6ef6c1fbcc6b2e6b30847642656af35e75287de"
61
61
  }
@@ -49,7 +49,7 @@ export class PktTag extends PktElement {
49
49
  @property({ type: Boolean, reflect: true }) closeTag: boolean = specs.props.closeTag.default
50
50
  @property({ type: String, reflect: true }) size: TPktSize = specs.props.size.default as TPktSize
51
51
  @property({ type: String, reflect: true }) skin: TTagSkin = specs.props.skin.default as TTagSkin
52
- @property({ type: String, reflect: true }) textStyle: string = specs.props.textStyle.default
52
+ @property({ type: String, reflect: true }) textStyle: string | null = null
53
53
  @property({ type: String, reflect: true }) iconName: string | undefined = undefined
54
54
  @property({ type: String }) type: TTagType = specs.props.type.default as TTagType
55
55
  @property({ type: String }) ariaLabel: string = specs.props.ariaLabel.default
@@ -85,9 +85,9 @@ export class PktTag extends PktElement {
85
85
  'pkt-tag': true,
86
86
  'pkt-btn': true,
87
87
  'pkt-btn--tertiary': true,
88
+ [`pkt-tag--${this.textStyle}`]: !!this.textStyle,
88
89
  [`pkt-tag--${this.size}`]: !!this.size,
89
90
  [`pkt-tag--${this.skin}`]: !!this.skin,
90
- [`pkt-tag--${this.textStyle}`]: !!this.textStyle,
91
91
  'pkt-btn--icons-right-and-left': this.closeTag && !!this.iconName,
92
92
  'pkt-hide': this._isClosed,
93
93
  }
@@ -110,7 +110,7 @@ export class PktTag extends PktElement {
110
110
  return html`
111
111
  <span class=${classMap(classes)}>
112
112
  ${this.iconName &&
113
- html` <pkt-icon class="pkt-tag__icon" name=${this.iconName}></pkt-icon> `}
113
+ html`<pkt-icon class="pkt-tag__icon" name=${this.iconName}></pkt-icon>`}
114
114
  <span ${ref(this.defaultSlot)}></span>
115
115
  </span>
116
116
  `