@oslokommune/punkt-elements 12.2.0 → 12.3.1

package/dist/index-DkGcZra2.cjs

@@ -0,0 +1,90 @@
+"use strict";const r=require("./index-BJ_4AGO3.cjs"),w=require("./converters-DhM11VlY.cjs"),$=require("./directive-19_ixLKS.cjs"),x=require("./state-D2tUtTi6.cjs"),P=require("./class-map-CA8wadiN.cjs");require("./index-DSplpVWQ.cjs");function k(i){const e=Object.prototype.toString.call(i);return i instanceof Date||typeof i=="object"&&e==="[object Date]"?new i.constructor(+i):typeof i=="number"||e==="[object Number]"||typeof i=="string"||e==="[object String]"?new Date(i):new Date(NaN)}function D(i,e){return i instanceof Date?new i.constructor(e):new Date(e)}const M=6048e5,_=864e5;let A={};function v(){return A}function m(i,e){var h,c,d,p;const t=v(),s=(e==null?void 0:e.weekStartsOn)??((c=(h=e==null?void 0:e.locale)==null?void 0:h.options)==null?void 0:c.weekStartsOn)??t.weekStartsOn??((p=(d=t.locale)==null?void 0:d.options)==null?void 0:p.weekStartsOn)??0,n=k(i),a=n.getDay(),l=(a<s?7:0)+a-s;return n.setDate(n.getDate()-l),n.setHours(0,0,0,0),n}function b(i,e){const t=k(i.start),s=k(i.end);let n=+t>+s;const a=n?+t:+s,l=n?s:t;l.setHours(0,0,0,0);let h=1;const c=[];for(;+l<=a;)c.push(k(l)),l.setDate(l.getDate()+h),l.setHours(0,0,0,0);return n?c.reverse():c}function O(i,e){var p,u,f,y;const t=k(i),s=t.getFullYear(),n=v(),a=(e==null?void 0:e.firstWeekContainsDate)??((u=(p=e==null?void 0:e.locale)==null?void 0:p.options)==null?void 0:u.firstWeekContainsDate)??n.firstWeekContainsDate??((y=(f=n.locale)==null?void 0:f.options)==null?void 0:y.firstWeekContainsDate)??1,l=D(i,0);l.setFullYear(s+1,0,a),l.setHours(0,0,0,0);const h=m(l,e),c=D(i,0);c.setFullYear(s,0,a),c.setHours(0,0,0,0);const d=m(c,e);return t.getTime()>=h.getTime()?s+1:t.getTime()>=d.getTime()?s:s-1}function I(i,e){var h,c,d,p;const t=v(),s=(e==null?void 0:e.firstWeekContainsDate)??((c=(h=e==null?void 0:e.locale)==null?void 0:h.options)==null?void 0:c.firstWeekContainsDate)??t.firstWeekContainsDate??((p=(d=t.locale)==null?void 0:d.options)==null?void 0:p.firstWeekContainsDate)??1,n=O(i,e),a=D(i,0);return a.setFullYear(n,0,s),a.setHours(0,0,0,0),m(a,e)}function S(i,e){const t=k(i),s=+m(t,e)-+I(t,e);return Math.round(s/M)+1}function T(i){let t=k(i).getDay();return t===0&&(t=7),t}const E="pkt-calendar",R={id:{type:"string",name:"ID",description:"Unique identifier for the calendar"},currentmonth:{type:"date",converter:"stringToDate",description:"The current month to display"},selected:{type:"array",converter:"csvToArray",reflect:!0,items:{type:"date"},description:"Array of selected dates"},excludeweekdays:{type:"array",converter:"csvToArray",items:{type:"string"},description:"Array of weekdays (1-7) to exclude"},excludedates:{type:"array",converter:"stringsToDate",items:{type:"date"},description:"Array of specific dates to exclude"},earliest:{type:"date",converter:"stringToDate",default:null,description:"Earliest selectable date"},latest:{type:"date",converter:"stringToDate",default:null,description:"Latest selectable date"},weeknumbers:{type:"boolean",reflect:!0,default:!1,description:"Show week numbers in calendar"},withcontrols:{type:"boolean",reflect:!0,default:!1,description:"Show month and year navigation controls"},multiple:{type:"boolean",reflect:!0,default:!1,description:"Allow multiple date selection"},maxMultiple:{type:"number",default:4,description:"Maximum number of dates that can be selected"},range:{type:"boolean",reflect:!0,default:!1,description:"Allow date range selection"}},W={"date-selected":{description:"Returns ISO formatted date string"}},g={name:E,"css-class":"pkt-calendar",props:R,events:W};var H=Object.defineProperty,N=Object.getOwnPropertyDescriptor,o=(i,e,t,s)=>{for(var n=s>1?void 0:s?N(e,t):e,a=i.length-1,l;a>=0;a--)(l=i[a])&&(n=(s?l(e,t,n):l(n))||n);return s&&n&&H(e,t,n),n};exports.PktCalendar=class extends r.PktElement{constructor(){super(),this.multiple=g.props.multiple.default,this.maxMultiple=g.props.maxMultiple.default,this.range=g.props.range.default,this.weeknumbers=g.props.weeknumbers.default,this.withcontrols=g.props.withcontrols.default,this.focused=!1,this.selected=[],this.earliest=g.props.earliest.default,this.latest=g.props.latest.default,this.excludedates=[],this.excludeweekdays=[],this.currentmonth=new Date,this.dayStrings=this.strings.dates.daysShort,this.monthStrings=this.strings.dates.months,this.weekString=this.strings.dates.week,this.prevMonthString=this.strings.dates.prevMonth,this.nextMonthString=this.strings.dates.nextMonth,this._selected=[],this.year=0,this.month=0,this.week=0,this.rangeHovered=null,this.inRange={},this.focusedDate=null,this.selectableDates=[]}connectedCallback(){const e=this.currentmonth;this.year=e.getFullYear(),this.month=e.getMonth(),this.week=S(new Date(this.year,this.month,1,12)),this.selected&&this.selected.length&&this.selected.forEach(t=>{this._selected.push(new Date(t))}),super.connectedCallback()}disconnectedCallback(){this.removeEventListener("keydown",this.handleKeydown),super.disconnectedCallback()}updated(e){if(e.has("selected")&&this.selected.length===2){const t=b({start:new Date(this.selected[0]),end:new Date(this.selected[1])});if(this.inRange={},Array.isArray(t)&&t.length){const s={};for(let n=0;n<t.length;n++)s[this.formatISODate(t[n])]=this.isInRange(t[n]);this.inRange=s}}super.updated(e)}firstUpdated(e){this.addEventListener("keydown",this.handleKeydown)}handleKeydown(e){switch(e.key){case"ArrowLeft":this.handleArrowKey(e,-1);break;case"ArrowRight":this.handleArrowKey(e,1);break;case"ArrowUp":this.handleArrowKey(e,-7);break;case"ArrowDown":this.handleArrowKey(e,7);break}}handleArrowKey(e,t){if(e.preventDefault(),!this.focusedDate)return;const s=new Date(this.focusedDate);let n=new Date(s.setDate(s.getDate()+t));if(n){let a=this.querySelector(`div[data-date="${this.formatISODate(n)}"]`);if(a instanceof HTMLDivElement){if(a.dataset.disabled){let l=new Date(s.setDate(s.getDate()+t)),h=this.querySelector(`div[data-date="${this.formatISODate(l)}"]`);for(;h&&h instanceof HTMLDivElement&&h.dataset.disabled;)l=new Date(l.setDate(l.getDate()+t)),h=this.querySelector(`div[data-date="${this.formatISODate(l)}"]`);a=h}a instanceof HTMLDivElement&&!a.dataset.disabled&&a.focus()}}}render(){return r.ke`
+      <div
+        class="pkt-calendar ${this.weeknumbers?"pkt-cal-weeknumbers":r.D}"
+        @focusout=${this.closeEvent}
+        @keydown=${e=>{e.key==="Escape"&&(e.preventDefault(),this.close())}}
+      >
+        <nav class="pkt-cal-month-nav">
+          <div
+            @click=${this.isPrevMonthAllowed()&&this.prevMonth}
+            @keydown=${e=>{(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),this.isNextMonthAllowed()&&this.prevMonth())}}
+            class="pkt-btn pkt-btn--tertiary pkt-btn--small pkt-btn--icon-only"
+            .data-disabled=${this.isPrevMonthAllowed()?r.D:"disabled"}
+            ?aria-disabled=${!this.isPrevMonthAllowed()}
+            tabindex="0"
+          >
+            <pkt-icon class="pkt-btn__icon" name="chevron-thin-left"></pkt-icon>
+            <span class="pkt-btn__text">${this.prevMonthString}</span>
+          </div>
+          ${this.renderMonthNav()}
+          <div
+            @click=${this.isNextMonthAllowed()&&this.nextMonth}
+            @keydown=${e=>{(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),this.isNextMonthAllowed()&&this.nextMonth())}}
+            class="pkt-btn pkt-btn--tertiary pkt-btn--small pkt-btn--icon-only"
+            .data-disabled=${this.isNextMonthAllowed()?r.D:"disabled"}
+            ?aria-disabled=${!this.isNextMonthAllowed()}
+            tabindex="0"
+          >
+            <pkt-icon class="pkt-btn__icon" name="chevron-thin-right"></pkt-icon>
+            <span class="pkt-btn__text">${this.nextMonthString}</span>
+          </div>
+        </nav>
+        <table
+          class="pkt-cal-days pkt-txt-12-medium"
+          role="grid"
+          ?aria-multiselectable=${this.range||this.multiple}
+        >
+          ${this.renderDayNames()} ${this.renderCalendarBody()}
+        </table>
+      </div>
+    `}renderDayNames(){const e=[];this.weeknumbers&&e.push(r.ke`<td><div>${this.weekString}<div></td>`);for(let t=0;t<this.dayStrings.length;t++)e.push(r.ke`<td><div>${this.dayStrings[t]}</div></td>`);return r.ke`<tr class="pkt-cal-week-row" role="presentation">
+      ${e}
+    </tr>`}renderMonthNav(){let e=[];return this.withcontrols?e.push(r.ke`<div class="pkt-cal-month-picker">
+          <select
+            class="pkt-input pkt-input-compact"
+            @change=${t=>{this.changeMonth(this.year,t.target.value)}}
+          >
+            ${this.monthStrings.map((t,s)=>r.ke`<option value=${s} ?selected=${this.month===s}>${t}</option>`)}
+          </select>
+          <input
+            class="pkt-input pkt-cal-input-year pkt-input-compact"
+            type="number"
+            size="4"
+            placeholder="0000"
+            @change=${t=>{this.changeMonth(t.target.value,this.month)}}
+            value="${this.year}"
+          />
+        </div> `):e.push(r.ke`<div class="pkt-txt-16-medium" aria-live="polite">
+          ${this.monthStrings[this.month]} ${this.year}
+        </div>`),e}renderDayView(e,t,s){const n=new Date(this.year,this.month,e,12),a=this.formatISODate(n),l=a===this.formatISODate(t),h=this.selected.includes(a),c=this.isExcluded(s,n)||!h&&this.multiple&&this.maxMultiple>0&&this.selected.length>=this.maxMultiple,d=this.focusedDate?this.focusedDate===a?"0":"-1":e===1?"0":"-1";this.selectableDates.push({currentDateISO:a,isDisabled:c});const p={"pkt-cal-today":l,"pkt-cal-selected":h,"pkt-cal-in-range":this.inRange[a],"pkt-cal-excluded":this.isExcluded(s,n),"pkt-cal-in-range-first":this.range&&(this.selected.length===2||this.rangeHovered!==null)&&a===this.selected[0],"pkt-cal-in-range-last":this.range&&this.selected.length===2&&a===this.selected[1],"pkt-cal-range-hover":this.rangeHovered!==null&&a===this.formatISODate(this.rangeHovered)};return r.ke`<td class=${P.Rt(p)}>
+      <div
+        ?aria-selected=${h}
+        role="gridcell"
+        class="pkt-btn pkt-btn--tertiary pkt-btn--small pkt-btn--label-only"
+        @mouseover=${()=>this.range&&!this.isExcluded(s,n)&&this.handleRangeHover(n)}
+        @focus=${()=>{this.range&&!this.isExcluded(s,n)&&this.handleRangeHover(n),this.focusedDate=a}}
+        tabindex=${d}
+        data-disabled=${c?"disabled":r.D}
+        data-date=${a}
+        @keydown=${u=>{(u.key==="Enter"||u.key===" ")&&(u.preventDefault(),this.handleDateSelect(n))}}
+        @click=${u=>{c||(u.preventDefault(),this.handleDateSelect(n))}}
+      >
+        <span class="pkt-btn__text pkt-txt-14-light">${e}</span>
+      </div>
+    </td>`}renderCalendarBody(){const e=new Date,t=new Date(this.year,this.month,1,12),s=new Date(this.year,this.month+1,0,12),n=(t.getDay()+6)%7,a=s.getDate(),l=Math.ceil((a+n)/7),c=new Date(this.year,this.month,0,12).getDate();let d=1;this.week=S(new Date(this.year,this.month,1,12));const p=[];for(let u=0;u<l;u++){const f=[];this.weeknumbers&&f.push(r.ke`<td class="pkt-cal-week">${this.week}</td>`),this.week++;for(let y=1;y<8;y++)if(u===0&&y<n+1){const C=c-(n-y-1);f.push(r.ke`<td class="pkt-cal-other">
+              <div
+                class="pkt-btn pkt-btn--tertiary pkt-btn--small pkt-btn--label-only"
+                data-disabled="disabled"
+              >
+                <span class="pkt-btn__text pkt-txt-14-light">${C}</span>
+              </div>
+            </td>`)}else d>a?(f.push(r.ke`<td class="pkt-cal-other">
+              <div
+                class="pkt-btn pkt-btn--tertiary pkt-btn--small pkt-btn--label-only"
+                data-disabled="disabled"
+              >
+                <span class="pkt-btn__text pkt-txt-14-light">${d-a}</span>
+              </div>
+            </td>`),d++):(f.push(this.renderDayView(d,e,y)),d++);p.push(r.ke`<tr class="pkt-cal-week-row" role="row">
+          ${f}
+        </tr>`)}return p}isExcluded(e,t){return this.excludeweekdays.includes(e.toString())||this.earliest&&t<new Date(this.earliest)||this.latest&&t>new Date(this.latest)?!0:this.excludedates.some(s=>typeof s=="string"?s===this.formatISODate(t):s.toDateString()===t.toDateString())}formatISODate(e){return e.toISOString().split("T")[0]}isPrevMonthAllowed(){const e=new Date(this.year,this.month,0,12);return!(this.earliest&&new Date(this.earliest)>e)}prevMonth(){const e=this.month===0?11:this.month-1,t=this.month===0?this.year-1:this.year;this.changeMonth(t,e)}isNextMonthAllowed(){const e=new Date(this.year,this.month===11?0:this.month+1,1,12);return!(this.latest&&new Date(this.latest)<e)}nextMonth(){const e=this.month===11?0:this.month+1,t=this.month===11?this.year+1:this.year;this.changeMonth(t,e)}changeMonth(e,t){this.year=e,this.month=t,this.selectableDates=[],this.requestUpdate("currentmonth")}isInRange(e){if(this.range&&this.selected.length===2){if(e>new Date(this.selected[0])&&e<new Date(this.selected[1]))return!0}else if(this.range&&this.selected.length===1&&this.rangeHovered&&e>new Date(this.selected[0])&&e<this.rangeHovered)return!0;return!1}isRangeAllowed(e){let t=!0;if(this._selected.length===1){const s=b({start:this._selected[0],end:e});if(Array.isArray(s)&&s.length)for(let n=0;n<s.length;n++)this.excludedates.forEach(a=>{a>this._selected[0]&&a<e&&(t=!1)}),this.excludeweekdays.includes(T(s[n]).toString())&&(t=!1)}return t}emptySelected(){this.selected=[],this._selected=[],this.inRange={}}addToSelected(e){this.selected.includes(this.formatISODate(e))||(this.selected=[...this.selected,this.formatISODate(e)],this._selected=[...this._selected,e])}removeFromSelected(e){if(this.selected.length===1)this.emptySelected();else{const t=this.selected.indexOf(this.formatISODate(e)),s=[...this.selected],n=[...this._selected];s.splice(t,1),n.splice(t,1),this.selected=s,this._selected=n}}toggleSelected(e){const t=this.formatISODate(e);this.selected.includes(t)?this.removeFromSelected(e):this.maxMultiple&&this.selected.length>=this.maxMultiple||this.addToSelected(e)}handleRangeSelect(e){const t=this.formatISODate(e);return this.selected.includes(t)?this.selected.indexOf(t)===0?this.emptySelected():this.removeFromSelected(e):this.selected.length>1?(this.emptySelected(),this.addToSelected(e)):(this.selected.length===1&&!this.isRangeAllowed(e)&&this.emptySelected(),this.selected.length===1&&this._selected[0]>e&&this.emptySelected(),this.addToSelected(e)),Promise.resolve()}handleRangeHover(e){if(this.range&&this._selected.length===1&&this.isRangeAllowed(e)&&this._selected[0]<e){this.rangeHovered=e,this.inRange={};const t=b({start:this._selected[0],end:e});if(Array.isArray(t)&&t.length)for(let s=0;s<t.length;s++)this.inRange[this.formatISODate(t[s])]=this.isInRange(t[s])}else this.rangeHovered=null}handleDateSelect(e){if(e)return this.range?this.handleRangeSelect(e):this.multiple?this.toggleSelected(e):(this.selected.includes(this.formatISODate(e))?this.emptySelected():(this.emptySelected(),this.addToSelected(e)),this.close()),this.dispatchEvent(new CustomEvent("date-selected",{detail:this.selected,bubbles:!0,composed:!0})),Promise.resolve()}closeEvent(e){this.contains(e.relatedTarget)||this.close()}close(){this.dispatchEvent(new CustomEvent("close",{detail:!0,bubbles:!0,composed:!0}))}};o([r.n({type:Boolean,reflect:!0})],exports.PktCalendar.prototype,"multiple",2);o([r.n({type:Number})],exports.PktCalendar.prototype,"maxMultiple",2);o([r.n({type:Boolean,reflect:!0})],exports.PktCalendar.prototype,"range",2);o([r.n({type:Boolean,reflect:!0})],exports.PktCalendar.prototype,"weeknumbers",2);o([r.n({type:Boolean,reflect:!0})],exports.PktCalendar.prototype,"withcontrols",2);o([r.n({type:Boolean,reflect:!0})],exports.PktCalendar.prototype,"focused",2);o([r.n({converter:w.converters.csvToArray})],exports.PktCalendar.prototype,"selected",2);o([r.n({type:String,reflect:!0})],exports.PktCalendar.prototype,"earliest",2);o([r.n({type:String,reflect:!0})],exports.PktCalendar.prototype,"latest",2);o([r.n({converter:w.converters.stringsToDate})],exports.PktCalendar.prototype,"excludedates",2);o([r.n({converter:w.converters.csvToArray})],exports.PktCalendar.prototype,"excludeweekdays",2);o([r.n({converter:w.converters.stringToDate})],exports.PktCalendar.prototype,"currentmonth",2);o([r.n({type:Array})],exports.PktCalendar.prototype,"dayStrings",2);o([r.n({type:Array})],exports.PktCalendar.prototype,"monthStrings",2);o([r.n({type:String})],exports.PktCalendar.prototype,"weekString",2);o([r.n({type:String})],exports.PktCalendar.prototype,"prevMonthString",2);o([r.n({type:String})],exports.PktCalendar.prototype,"nextMonthString",2);o([r.n({type:Array})],exports.PktCalendar.prototype,"_selected",2);o([r.n({type:Number})],exports.PktCalendar.prototype,"year",2);o([r.n({type:Number})],exports.PktCalendar.prototype,"month",2);o([r.n({type:Number})],exports.PktCalendar.prototype,"week",2);o([r.n({type:Date})],exports.PktCalendar.prototype,"rangeHovered",2);o([x.r()],exports.PktCalendar.prototype,"inRange",2);o([x.r()],exports.PktCalendar.prototype,"focusedDate",2);o([x.r()],exports.PktCalendar.prototype,"selectableDates",2);exports.PktCalendar=o([$.t("pkt-calendar")],exports.PktCalendar);exports.constructFrom=D;exports.getDefaultOptions=v;exports.getWeek=S;exports.getWeekYear=O;exports.millisecondsInDay=_;exports.millisecondsInWeek=M;exports.startOfWeek=m;exports.toDate=k;

package/dist/index.d.ts

@@ -1,3 +1,393 @@
-export { PktCalendar } from './components';
-export { PktIcon } from './components';
-export { PktComponent } from './components';
+import { LitElement } from 'lit';
+import { nothing } from 'lit';
+import { PropertyValues } from 'lit';
+import { ReactiveController } from 'lit';
+import { ReactiveControllerHost } from 'lit';
+import { Ref } from 'lit/directives/ref.js';
+import { StaticValue } from 'lit/static-html.js';
+import { TemplateResult } from 'lit';
+
+declare type ICardSkin = 'outlined' | 'gray' | 'beige' | 'green' | 'blue';
+
+declare type IDirection = 'portrait' | 'landscape';
+
+declare interface IPktTag {
+    closeTag?: boolean;
+    size?: TagSize;
+    skin?: 'blue' | 'green' | 'red' | 'yellow';
+    textStyle?: string;
+    iconName?: string;
+    type?: string;
+    ariaLabel?: string;
+}
+
+export declare class PktCalendar extends PktElement {
+    /**
+     * Element attributes
+     */
+    multiple: boolean;
+    maxMultiple: number;
+    range: boolean;
+    weeknumbers: boolean;
+    withcontrols: boolean;
+    focused: boolean;
+    selected: string[];
+    earliest: string | null;
+    latest: string | null;
+    excludedates: Date[];
+    excludeweekdays: string[];
+    currentmonth: Date;
+    /**
+     * If we are initializing props, slots and events from specs, we should do it in the constructor
+     */
+    constructor();
+    /**
+     * Strings
+     */
+    dayStrings: string[];
+    monthStrings: string[];
+    weekString: string;
+    prevMonthString: string;
+    nextMonthString: string;
+    /**
+     * Private properties
+     */
+    private _selected;
+    private year;
+    private month;
+    private week;
+    private rangeHovered;
+    private inRange;
+    private focusedDate;
+    private selectableDates;
+    /**
+     * Runs on mount, used to set up various values and whatever you need to run
+     */
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    updated(changedProperties: PropertyValues): void;
+    protected firstUpdated(_changedProperties: PropertyValues): void;
+    handleKeydown(e: KeyboardEvent): void;
+    handleArrowKey(e: KeyboardEvent, direction: number): void;
+    /**
+     * Component functionality and render
+     */
+    render(): TemplateResult<1>;
+    private renderDayNames;
+    private renderMonthNav;
+    private renderDayView;
+    private renderCalendarBody;
+    private isExcluded;
+    private formatISODate;
+    isPrevMonthAllowed(): boolean;
+    private prevMonth;
+    isNextMonthAllowed(): boolean;
+    private nextMonth;
+    private changeMonth;
+    private isInRange;
+    private isRangeAllowed;
+    private emptySelected;
+    addToSelected(selectedDate: Date): void;
+    removeFromSelected(selectedDate: Date): void;
+    toggleSelected(selectedDate: Date): void;
+    private handleRangeSelect;
+    private handleRangeHover;
+    handleDateSelect(selectedDate: Date | null): Promise<void> | undefined;
+    closeEvent(e: FocusEvent): void;
+    close(): void;
+}
+
+export declare class PktCard extends PktElement {
+    defaultSlot: Ref<HTMLElement>;
+    constructor();
+    skin: ICardSkin;
+    direction: IDirection;
+    image: {
+        src: string;
+        alt: string;
+    };
+    heading: string;
+    subheading: string;
+    tags: (Omit<IPktTag, 'closeTag'> & {
+        text: string;
+    })[];
+    connectedCallback(): void;
+    render(): TemplateResult<1>;
+}
+
+export declare class PktComponent extends PktElement {
+    /**
+     * Element attributes => props
+     * Example:
+     * <pkt-component string="hei" strings="hei,og,hallo" darkmode>
+     *  Hei!
+     * </pkt-component>
+     */
+    string: string;
+    strings: string[];
+    darkmode: boolean;
+    /**
+     * Private properties, for internal use only
+     */
+    private _list;
+    /**
+     * Runs on mount, used to set up various values and whatever you need to run
+     */
+    connectedCallback(): void;
+    /**
+     * Set up slot support for Light DOM
+     */
+    slotController: PktSlotController;
+    defaultSlot: Ref<HTMLElement>;
+    namedSlot: Ref<HTMLElement>;
+    constructor();
+    /**
+     * Render functions
+     */
+    render(): TemplateResult<1>;
+    private renderList;
+    /**
+     * Add other functionality under here
+     */
+    private doStuff;
+    /**
+     * Handlers for returning data from the component
+     */
+    private handleGreeting;
+}
+
+export declare class PktDatepicker extends PktInputElement {
+    /**
+     * Element attributes and properties
+     */
+    value: string | string[];
+    _value: string[];
+    label: string;
+    helptext: string;
+    helptextDropdown: string;
+    helptextDropdownButton: string;
+    dateformat: string;
+    multiple: boolean;
+    maxlength: number | null;
+    range: boolean;
+    weeknumbers: boolean;
+    withcontrols: boolean;
+    fullwidth: boolean;
+    excludedates: string[];
+    excludeweekdays: string[];
+    currentmonth: string;
+    calendarOpen: boolean;
+    /**
+     * Housekeeping / lifecycle methods
+     */
+    connectedCallback(): Promise<void>;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: string, _old: string | null, value: string | null): void;
+    updated(changedProperties: PropertyValues): void;
+    /**
+     * Element references
+     */
+    inputRef: Ref<HTMLInputElement>;
+    inputRefTo: Ref<HTMLInputElement>;
+    btnRef: Ref<HTMLButtonElement>;
+    calRef: Ref<PktCalendar>;
+    popupRef: Ref<HTMLDivElement>;
+    /**
+     * CSS classes
+     */
+    inputClasses: {
+        'pkt-input': boolean;
+        'pkt-datepicker__input': boolean;
+        'pkt-input--fullwidth': boolean;
+    };
+    buttonClasses: {
+        'pkt-input-icon': boolean;
+        'pkt-btn': boolean;
+        'pkt-btn--icon-only': boolean;
+        'pkt-btn--tertiary': boolean;
+    };
+    /**
+     * Date value manipulation
+     */
+    private formatISODate;
+    fromISOToDate: (date: string | null) => Date | null;
+    fromISOtoLocal: (date: string) => string;
+    massageDates: (dates: (string | undefined)[]) => string[];
+    renderInput(): TemplateResult<1>;
+    renderRangeInput(): TemplateResult<1>;
+    renderMultipleInput(): TemplateResult<1>;
+    renderTags(): TemplateResult<1>;
+    renderCalendar(): TemplateResult<1>;
+    render(): TemplateResult<1>;
+    /**
+     * Handlers
+     */
+    handleCalendarPosition(): void;
+    addToSelected: (e: Event | KeyboardEvent) => void;
+    private handleFocusOut;
+    showCalendar(): Promise<void>;
+    hideCalendar(): void;
+    toggleCalendar(e: Event): void;
+}
+
+/**
+ * Base class for all Punkt elements
+ * @extends LitElement
+ */
+declare class PktElement extends LitElement {
+    [key: string]: any;
+    strings: any;
+    /**
+     * Runs on mount, used to set up various values and whatever you need to run
+     */
+    connectedCallback(): void;
+    /**
+     * Make sure the component renders in light DOM instead of shadow DOM
+     */
+    createRenderRoot(): this;
+    /**
+     * Add support for Hot Module Reloading in dev mode
+     */
+    hotReplacedCallback(): void;
+    /**
+     * Add extra stuff here whenever we decide what should be added here…
+     */
+    constructor();
+}
+
+export declare class PktIcon extends PktElement {
+    constructor();
+    protected willUpdate(_changedProperties: PropertyValues): void;
+    path: string | undefined;
+    name: string;
+    private icon;
+    private _updatedProps;
+    attributeChangedCallback(name: string, _old: string | null, value: string | null): Promise<void>;
+    render(): TemplateResult<1>;
+}
+
+/**
+ * Base class for all Punkt input elements
+ * @extends PktElement
+ */
+declare class PktInputElement extends PktElement {
+    static get formAssociated(): boolean;
+    id: string;
+    name: string;
+    required: boolean;
+    disabled: boolean;
+    placeholder: string;
+    min: string | number | null;
+    max: string | number | null;
+    minlength: number;
+    maxlength: number | null;
+    pattern: string;
+    optionalTag: boolean;
+    optionalText: string;
+    requiredTag: boolean;
+    requiredText: string;
+    hasError: boolean;
+    errorMessage: string;
+    constructor();
+    protected manageValidity(input: HTMLInputElement): void;
+    protected onInput(value: string | string[]): void;
+    protected firstUpdated(_changedProperties: PropertyValues): void;
+}
+
+export declare class PktInputWrapper extends PktElement {
+    defaultSlot: Ref<HTMLElement>;
+    constructor();
+    /**
+     * Element attributes
+     */
+    forId: string;
+    label: string;
+    helptext: string;
+    helptextDropdown: string;
+    helptextDropdownButton: string;
+    counter: boolean;
+    counterCurrent: number;
+    counterMaxLength: number;
+    optionalTag: boolean;
+    optionalText: string;
+    requiredTag: boolean;
+    requiredText: string;
+    hasError: boolean;
+    errorMessage: string;
+    disabled: boolean;
+    inline: boolean;
+    ariaDescribedby: string | undefined;
+    hasFieldset: boolean;
+    useWrapper: boolean;
+    private isHelpTextOpen;
+    wrapperType: StaticValue;
+    render(): TemplateResult<1>;
+}
+
+export declare class PktLink extends PktElement {
+    defaultSlot: Ref<HTMLElement>;
+    constructor();
+    /**
+     * Element attributes
+     */
+    href: string;
+    iconName: string | undefined;
+    iconPosition: string | undefined;
+    external: boolean;
+    render(): TemplateResult<1>;
+    private handleClick;
+}
+
+export declare class PktMessagebox extends PktElement {
+    defaultSlot: Ref<HTMLElement>;
+    constructor();
+    closable: boolean;
+    compact: boolean;
+    title: string;
+    skin: string;
+    isDisplayed: boolean;
+    onClose?: () => void;
+    handleClose(): void;
+    render(): TemplateResult<1> | typeof nothing;
+}
+
+declare class PktSlotController implements ReactiveController {
+    host: LitElement & ReactiveControllerHost;
+    nodes: Element[];
+    slots: Ref<HTMLElement>[];
+    constructor(host: LitElement & ReactiveControllerHost, ...slots: Ref<HTMLElement>[]);
+    hostConnected(): void;
+    hostUpdated(): void;
+    private nodeFromElement;
+}
+
+export declare class PktTag extends PktElement {
+    slotController: PktSlotController;
+    defaultSlot: Ref<HTMLElement>;
+    constructor();
+    /**
+     * Element attributes
+     */
+    closeTag: boolean;
+    size: TagSize;
+    skin: TagSkin;
+    textStyle: string;
+    iconName: string | undefined;
+    type: string;
+    ariaLabel: string;
+    /**
+     * Element state
+     */
+    _isClosed: boolean;
+    /**
+     * Element functions
+     */
+    private close;
+    render(): TemplateResult<1> | typeof nothing;
+}
+
+declare type TagSize = 'small' | 'medium' | 'large';
+
+declare type TagSkin = 'blue' | 'green' | 'red' | 'yellow';
+
+export { }

package/dist/input-wrapper.d.ts

@@ -0,0 +1 @@
+export { }

package/dist/link.d.ts

@@ -0,0 +1 @@
+export { }

package/dist/messagebox.d.ts

@@ -0,0 +1 @@
+export { }

package/dist/pkt-alert.cjs

@@ -0,0 +1,27 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./index-BJ_4AGO3.cjs"),p=require("./ref-Bk590hog.cjs"),c=require("./class-map-CA8wadiN.cjs"),k=require("./directive-19_ixLKS.cjs");require("./index-DSplpVWQ.cjs");var h=Object.defineProperty,u=Object.getOwnPropertyDescriptor,e=(s,r,o,i)=>{for(var l=i>1?void 0:i?u(r,o):r,a=s.length-1,n;a>=0;a--)(n=s[a])&&(l=(i?n(r,o,l):n(l))||l);return i&&l&&h(r,o,l),l};exports.PktAlert=class extends t.PktElement{constructor(){super(),this.defaultSlot=p.ii(),this.closable=!1,this.compact=!1,this.title="",this.skin="info",this.isDisplayed=!0,this.ariaLive="polite",this.closeAlert=!1,this.date="",this.slotController=new p.PktSlotController(this,this.defaultSlot)}handleClose(){this.isDisplayed=!1,this.onClose&&this.onClose()}render(){const r={"pkt-alert":!0,"pkt-alert--compact":this.compact,[`pkt-alert--${this.skin}`]:this.skin,"pkt-alert--closable":this.closable};return this.isDisplayed?t.ke`
+      <div class=${c.Rt(r)} aria-live=${this.ariaLive}>
+        <pkt-icon
+          class="pkt-alert__icon"
+          name=${this.skin==="info"?"alert-information":`alert-${this.skin}`}
+        ></pkt-icon>
+
+        ${this.closable?t.ke`
+              <div class="pkt-alert__close">
+                <button
+                  type="button"
+                  class="pkt-btn pkt-btn--tertiary pkt-btn--small pkt-btn--icon-only"
+                  tabindex="0"
+                  aria-label="close"
+                  @click=${this.handleClose}
+                >
+                  <pkt-icon name="close" class="pkt-btn__icon" aria-hidden="true"></pkt-icon>
+                </button>
+              </div>
+            `:t.D}
+        ${this.title?t.ke`<div class="pkt-alert__title">${this.title}</div>`:t.D}
+
+        <div class="pkt-alert__text" ${p.Kt(this.defaultSlot)}></div>
+
+        ${this.date?t.ke`<div class="pkt-alert__date">Sist oppdatert: ${this.date}</div>`:t.D}
+      </div>
+    `:t.D}};e([t.n({type:Boolean,reflect:!0})],exports.PktAlert.prototype,"closable",2);e([t.n({type:Boolean,reflect:!0})],exports.PktAlert.prototype,"compact",2);e([t.n({type:String,reflect:!0})],exports.PktAlert.prototype,"title",2);e([t.n({type:String,reflect:!0})],exports.PktAlert.prototype,"skin",2);e([t.n({type:Boolean,reflect:!0})],exports.PktAlert.prototype,"isDisplayed",2);e([t.n({type:Function,reflect:!0})],exports.PktAlert.prototype,"onClose",2);e([t.n({type:String,reflect:!0})],exports.PktAlert.prototype,"ariaLive",2);e([t.n({type:Boolean,reflect:!0})],exports.PktAlert.prototype,"closeAlert",2);e([t.n({type:String,reflect:!0})],exports.PktAlert.prototype,"date",2);exports.PktAlert=e([k.t("pkt-alert")],exports.PktAlert);

package/dist/pkt-alert.js

@@ -0,0 +1,86 @@
+import { P as f, D as a, k as p, n as i } from "./index-BHzxfdBK.js";
+import { i as d, P as k, K as u } from "./ref-Co_S0Cgj.js";
+import { R as y } from "./class-map-DiT0qP3E.js";
+import { t as v } from "./directive-DA0-wdk7.js";
+import "./index-BlHnvy7v.js";
+var m = Object.defineProperty, _ = Object.getOwnPropertyDescriptor, e = (l, r, n, o) => {
+  for (var s = o > 1 ? void 0 : o ? _(r, n) : r, c = l.length - 1, h; c >= 0; c--)
+    (h = l[c]) && (s = (o ? h(r, n, s) : h(s)) || s);
+  return o && s && m(r, n, s), s;
+};
+let t = class extends f {
+  constructor() {
+    super(), this.defaultSlot = d(), this.closable = !1, this.compact = !1, this.title = "", this.skin = "info", this.isDisplayed = !0, this.ariaLive = "polite", this.closeAlert = !1, this.date = "", this.slotController = new k(this, this.defaultSlot);
+  }
+  handleClose() {
+    this.isDisplayed = !1, this.onClose && this.onClose();
+  }
+  render() {
+    const l = {
+      "pkt-alert": !0,
+      "pkt-alert--compact": this.compact,
+      [`pkt-alert--${this.skin}`]: this.skin,
+      "pkt-alert--closable": this.closable
+    };
+    return this.isDisplayed ? p`
+      <div class=${y(l)} aria-live=${this.ariaLive}>
+        <pkt-icon
+          class="pkt-alert__icon"
+          name=${this.skin === "info" ? "alert-information" : `alert-${this.skin}`}
+        ></pkt-icon>
+
+        ${this.closable ? p`
+              <div class="pkt-alert__close">
+                <button
+                  type="button"
+                  class="pkt-btn pkt-btn--tertiary pkt-btn--small pkt-btn--icon-only"
+                  tabindex="0"
+                  aria-label="close"
+                  @click=${this.handleClose}
+                >
+                  <pkt-icon name="close" class="pkt-btn__icon" aria-hidden="true"></pkt-icon>
+                </button>
+              </div>
+            ` : a}
+        ${this.title ? p`<div class="pkt-alert__title">${this.title}</div>` : a}
+
+        <div class="pkt-alert__text" ${u(this.defaultSlot)}></div>
+
+        ${this.date ? p`<div class="pkt-alert__date">Sist oppdatert: ${this.date}</div>` : a}
+      </div>
+    ` : a;
+  }
+};
+e([
+  i({ type: Boolean, reflect: !0 })
+], t.prototype, "closable", 2);
+e([
+  i({ type: Boolean, reflect: !0 })
+], t.prototype, "compact", 2);
+e([
+  i({ type: String, reflect: !0 })
+], t.prototype, "title", 2);
+e([
+  i({ type: String, reflect: !0 })
+], t.prototype, "skin", 2);
+e([
+  i({ type: Boolean, reflect: !0 })
+], t.prototype, "isDisplayed", 2);
+e([
+  i({ type: Function, reflect: !0 })
+], t.prototype, "onClose", 2);
+e([
+  i({ type: String, reflect: !0 })
+], t.prototype, "ariaLive", 2);
+e([
+  i({ type: Boolean, reflect: !0 })
+], t.prototype, "closeAlert", 2);
+e([
+  i({ type: String, reflect: !0 })
+], t.prototype, "date", 2);
+t = e([
+  v("pkt-alert")
+], t);
+export {
+  t as PktAlert
+};

package/dist/pkt-calendar.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("./index-BJ_4AGO3.cjs");require("./converters-DhM11VlY.cjs");require("./directive-19_ixLKS.cjs");require("./state-D2tUtTi6.cjs");require("./class-map-CA8wadiN.cjs");const e=require("./index-DkGcZra2.cjs");require("./index-DSplpVWQ.cjs");Object.defineProperty(exports,"PktCalendar",{enumerable:!0,get:()=>e.PktCalendar});

package/dist/pkt-calendar.js

@@ -0,0 +1,10 @@
+import "./index-BHzxfdBK.js";
+import "./converters-DNCwIFwr.js";
+import "./directive-DA0-wdk7.js";
+import "./state-BRgFbJX9.js";
+import "./class-map-DiT0qP3E.js";
+import { P } from "./index-CPvZ03uX.js";
+import "./index-BlHnvy7v.js";
+export {
+  P as PktCalendar
+};