https://kaartjes-fabriek.nl/create/343.b93dfb348f449570.js

1"use strict";(self.webpackChunkangular_cli=self.webpackChunkangular_cli||[]).push([[343],{4343(m,c,t){t.r(c),t.d(c,{sp_button:()=>u,sp_icon:()=>h});var r=t(1098),f=t(8353);const u=(()=>{let e=class{constructor(o){(0,r.r)(this,o),this.text=void 0,this.icon=void 0,this.iconPosition=void 0,this.selectArrowIcon=void 0,this.color=void 0,this.inverted=void 0,this.size=void 0,this.fullWidth=!1,this.roundedCorners="medium",this.showBadge=!1,this.badgeContent=void 0,this.badgeRoundedCorners=void 0,this.disabled=!1,this.grouped=!1,this.boldText=!1}getButtonClass(){let o="button";return this.size&&(o=o+" "+this.size),this.color&&(o=o+" "+this.color),this.disabled&&(o+=" disabled"),this.grouped&&(o+=" grouped"),this.boldText&&(o+=" bold"),this.inverted&&(o+=" inverted"),!this.text&&!this.showBadge&&!this.selectArrowIcon&&!this.grouped&&this.icon&&(o+=" square"),o}render(){let o,a,l,b,i,s;this.icon&&(!this.iconPosition||this.selectArrowIcon||"left"===this.iconPosition)&&(i=this.text?"icon-left":"",o=(0,r.h)("sp-icon",{class:i,icon:this.icon,color:"inherit"})),(this.icon&&this.iconPosition&&"right"===this.iconPosition||this.selectArrowIcon)&&(s=this.text?" arrow":"",a=(0,r.h)("sp-icon",{class:s,icon:this.selectArrowIcon?this.selectArrowIcon:this.icon,color:"inherit"})),this.showBadge&&(b=(0,r.h)("span",{class:this.badgeRoundedCorners?"badge "+this.badgeRoundedCorners:"badge"},this.badgeContent)),this.text&&(l=(0,r.h)("span",{class:"text"},this.text));const v=this.getButtonClass();return(0,r.h)("button",{class:v},o,l,a,b)}};return e.style=":host{-webkit-box-sizing:border-box;box-sizing:border-box;vertical-align:middle;display:inline-block;border-radius:var(--border-radius-medium, 4px)}.button,button.light-grey{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;font-family:inherit;border-radius:inherit;-webkit-box-shadow:none;box-shadow:none;border:1px solid var(--color-grey-5, #ebebeb);background-color:var(--color-grey-5, #ebebeb);color:var(--color-black, #1a1a1a);height:var(--bi-height-normal, 3rem);padding:0 var(--padding-medium, 1.5rem);font-size:var(--font-size-normal, 1rem);line-height:var(--bi-height-normal, 3rem);-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;cursor:pointer}.button:active,.button:focus,button.light-grey:active,button.light-grey:focus{outline:0}.button:hover,button.light-grey:hover{border-color:var(--color-grey-4, #dbdbdb);background-color:var(--color-grey-4, #dbdbdb)}.button.square,button.light-grey.square{width:var(--bi-height-normal, 3rem);padding:0}.button.grouped,button.light-grey.grouped{padding:var(--padding-small, 0.5rem)}.button.disabled,button.light-grey.disabled{pointer-events:none;opacity:0.7}.button .text,button.light-grey .text{white-space:nowrap;vertical-align:baseline}.button.bold .text,button.light-grey.bold .text{font-weight:bold}.button sp-icon,button.light-grey sp-icon{font-size:calc(var(--font-size-normal, 1rem) * 1.2)}.button .icon-left,button.light-grey .icon-left{margin-right:0.3rem}.button .icon-right,button.light-grey .icon-right{margin-left:0.3rem}.button .badge,button.light-grey .badge{margin-left:0.3rem;text-align:center;-ms-flex-item-align:start;align-self:flex-start;margin-top:0.1rem;padding:0 0.05rem;font-weight:bold;border-radius:var(--border-radius-round, 50%);height:calc(var(--bi-height-normal, 3rem) * 0.5);min-width:calc((var(--bi-height-normal, 3rem) * 0.5) - 0.1rem);font-size:calc(var(--font-size-normal, 1rem) * 0.75);line-height:calc(var(--bi-height-normal, 3rem) * 0.5);background-color:var(--color-black, #1a1a1a);color:var(--color-white, #fff)}.button .badge.none,button.light-grey .badge.none{border-radius:0}.button .badge.small,button.light-grey .badge.small{border-radius:var(--border-radius-small, 2px)}.button .badge.medium,button.light-grey .badge.medium{border-radius:var(--border-radius-medium, 4px)}.button.inverted,button.light-grey.inverted{border-color:var(--color-grey-5, #ebebeb);background-color:var(--color-white, #fff);color:var(--color-black, #1a1a1a)}.button.inverted .badge,button.light-grey.inverted .badge{background-color:var(--color-grey-5, #ebebeb);color:var(--color-black, #1a1a1a)}.button.inverted:hover,button.light-grey.inverted:hover{background-color:var(--color-grey-5, #ebebeb);color:var(--color-black, #1a1a1a)}.button.inverted:hover .badge,button.light-grey.inverted:hover .badge{background-color:var(--color-white, #fff)}:host([full-width]),:host([fullWidth]),:host([full-width=true]),:host([fullWidth=true]){display:block}:host([full-width]) .button,:host([fullWidth]) .button,:host([full-width=true]) .button,:host([fullWidth=true]) .button{width:100%}:host([full-width]):host([select-arrow-icon]) .button,:host([full-width]):host([select-arrow-icon]) button.light-grey,:host([fullWidth]):host([select-arrow-icon]) .button,:host([fullWidth]):host([select-arrow-icon]) button.light-grey,:host([full-width=true]):host([select-arrow-icon]) .button,:host([full-width=true]):host([select-arrow-icon]) button.light-grey,:host([fullWidth=true]):host([select-arrow-icon]) .button,:host([fullWidth=true]):host([select-arrow-icon]) button.light-grey{-ms-flex-pack:justify;justify-content:space-between}:host([rounded-corners=none]){border-radius:0}:host([rounded-corners=small]){border-radius:var(--border-radius-small, 2px)}:host([rounded-corners=medium]){border-radius:var(--border-radius-medium, 4px)}:host([rounded-corners=round]){border-radius:var(--border-radius-round, 50%)}.button.primary{border-color:var(--color-base-primary, #3082b0);background-color:var(--color-base-primary, #3082b0);color:var(--color-base-primary-text, #ffffff)}.button.primary:hover{border-color:var(--color-base-primary-dark, #2b759e);background-color:var(--color-base-primary-dark, #2b759e)}.button.primary .badge{background-color:var(--color-base-primary-text, #ffffff);color:var(--color-base-primary, #3082b0)}.button.primary.inverted{background-color:var(--color-white, #fff);color:var(--color-base-primary, #3082b0)}.button.primary.inverted .badge{background-color:var(--color-base-primary, #3082b0);color:var(--color-base-primary-text, #ffffff)}.button.primary.inverted:hover{background-color:var(--color-base-primary, #3082b0);color:var(--color-base-primary-text, #ffffff)}.button.primary.inverted:hover .badge{background-color:var(--color-white, #fff);color:var(--color-base-primary, #3082b0)}.button.secondary{border-color:var(--color-base-secondary, #444c5f);background-color:var(--color-base-secondary, #444c5f);color:var(--color-base-secondary-text, #ffffff)}.button.secondary:hover{border-color:var(--color-base-secondary-dark, #3d4456);background-color:var(--color-base-secondary-dark, #3d4456)}.button.secondary .badge{background-color:var(--color-base-secondary-text, #ffffff);color:var(--color-base-secondary, #444c5f)}.button.secondary.inverted{background-color:var(--color-white, #fff);color:var(--color-base-secondary, #444c5f)}.button.secondary.inverted .badge{background-color:var(--color-base-secondary, #444c5f);color:var(--color-white, #fff)}.button.secondary.inverted:hover{background-color:var(--color-base-secondary, #444c5f);color:var(--color-base-secondary-text, #ffffff)}.button.secondary.inverted:hover .badge{background-color:var(--color-white, #fff);color:var(--color-base-secondary, #444c5f)}.button.success{border-color:var(--color-base-success, #71b030);background-color:var(--color-base-success, #71b030);color:var(--color-base-success-text, #ffffff)}.button.success:hover{border-color:var(--color-base-success-dark, #669e2b);background-color:var(--color-base-success-dark, #669e2b)}.button.success .badge{background-color:var(--color-base-success-text, #ffffff);color:var(--color-base-success, #71b030)}.button.success.inverted{background-color:var(--color-white, #fff);color:var(--color-base-success, #71b030)}.button.success.inverted .badge{background-color:var(--color-base-success, #71b030);color:var(--color-base-success-text, #ffffff)}.button.success.inverted:hover{background-color:var(--color-base-success, #71b030);color:var(--color-base-success-text, #ffffff)}.button.success.inverted:hover .badge{background-color:var(--color-white, #fff);color:var(--color-base-success, #71b030)}.button.warning{border-color:var(--color-base-warning, #ffcc00);background-color:var(--color-base-warning, #ffcc00);color:var(--color-base-warning-text, #1a1a1a)}.button.warning:hover{border-color:var(--color-base-warning-dark, #e6b800);background-color:var(--color-base-warning-dark, #e6b800)}.button.warning .badge{background-color:var(--color-white, #fff);color:var(--color-base-warning, #ffcc00)}.button.warning.inverted{background-color:var(--color-white, #fff);color:var(--color-base-warning, #ffcc00)}.button.warning.inverted .badge{background-color:var(--color-base-warning, #ffcc00);color:var(--color-white, #fff)}.button.warning.inverted:hover{background-color:var(--color-base-warning, #ffcc00);color:var(--color-base-warning-text, #1a1a1a)}.button.warning.inverted:hover .badge{background-color:var(--color-white, #fff);color:var(--color-base-warning-text, #1a1a1a)}.button.error{border-color:var(--color-base-error, #ff0000);background-color:var(--color-base-error, #ff0000);color:var(--color-base-error-text, #ffffff)}.button.error:hover{border-color:var(--color-base-error-dark, #e60000);background-color:var(--color-base-error-dark, #e60000)}.button.error .badge{background-color:var(--color-base-error-text, #ffffff);color:var(--color-base-error, #ff0000)}.button.error.inverted{background-color:var(--color-white, #fff);color:var(--color-base-error, #ff0000)}.button.error.inverted .badge{background-color:var(--color-base-error, #ff0000);color:var(--color-white, #fff)}.button.error.inverted:hover{background-color:var(--color-base-error, #ff0000);color:var(--color-base-error-text, #ffffff)}.button.error.inverted:hover .badge{background-color:var(--color-white, #fff);color:var(--color-base-error, #ff0000)}.button.info{border-color:var(--color-base-info, #1298b3);background-color:var(--color-base-info, #1298b3);color:var(--color-base-info-text, #ffffff)}.button.info:hover{border-color:var(--color-base-info-dark, #1089a1);background-color:var(--color-base-info-dark, #1089a1)}.button.info .badge{background-color:var(--color-base-info-text, #ffffff);color:var(--color-base-info, #1298b3)}.button.info.inverted{background-color:var(--color-white, #fff);color:var(--color-base-info, #1298b3)}.button.info.inverted .badge{background-color:var(--color-base-info, #1298b3);color:var(--color-white, #fff)}.button.info.inverted:hover{background-color:var(--color-base-info, #1298b3);color:var(--color-base-info-text, #ffffff)}.button.info.inverted:hover .badge{background-color:var(--color-white, #fff);color:var(--color-base-info, #1298b3)}.button.white{border-color:var(--color-white, #fff);background-color:var(--color-white, #fff);color:var(--color-black, #1a1a1a)}.button.white:hover{border-color:var(--color-grey-6, #f5f5f5);background-color:var(--color-grey-6, #f5f5f5)}.button.white .badge{background-color:var(--color-black, #1a1a1a);color:var(--color-white, #fff)}.button.white.inverted{border-color:var(--color-white, #fff);background-color:var(--color-black, #1a1a1a);color:var(--color-white, #fff)}.button.white.inverted .badge{background-color:var(--color-white, #fff);color:var(--color-black, #1a1a1a)}.button.white.inverted:hover{border-color:var(--color-black, #1a1a1a);background-color:var(--color-white, #fff);color:var(--color-black, #1a1a1a)}.button.white.inverted:hover .badge{background-color:var(--color-black, #1a1a1a);color:var(--color-white, #fff)}.button.grey-dark{border-color:var(--color-grey-1, #525252);background-color:var(--color-grey-1, #525252);color:var(--color-white, #fff)}.button.grey-dark:hover{border-color:var(--color-black, #1a1a1a);background-color:var(--color-black, #1a1a1a)}.button.grey-dark .badge{background-color:var(--color-white, #fff);color:var(--color-grey-1, #525252)}.button.grey-dark.inverted{border-color:var(--color-grey-1, #525252);background-color:var(--color-white, #fff);color:var(--color-grey-1, #525252)}.button.grey-dark.inverted .badge{background-color:var(--color-grey-1, #525252);color:var(--color-white, #fff)}.button.grey-dark.inverted:hover{background-color:var(--color-grey-1, #525252);color:var(--color-white, #fff)}.button.grey-dark.inverted:hover .badge{background-color:var(--color-white, #fff);color:var(--color-grey-1, #525252)}.button.transparent{border-color:transparent;background-color:transparent;color:var(--color-black, #1a1a1a)}.button.transparent:hover{border-color:transparent;background-color:transparent;color:var(--color-grey-2, #8a8a8a)}.button.transparent .badge{background-color:var(--color-black, #1a1a1a);color:var(--color-white, #fff)}.button.transparent.disabled{border-color:var(--color-grey-3, #b8b8b8);background-color:var(--color-grey-3, #b8b8b8)}.button.small{height:var(--bi-height-small, 2rem);padding:0 var(--padding-small, 1rem);font-size:var(--font-size-small, 0.85rem)}.button.small sp-icon{font-size:calc(var(--font-size-small, 0.85rem) * 1.2)}.button.small .icon-left{margin-right:0.3rem}.button.small .icon-right{margin-left:0.3rem}.button.small.square{width:var(--bi-height-small, 2rem);padding:0}.button.large{height:var(--bi-height-large, 3.5rem);padding:0 var(--padding-large, 2rem);font-size:var(--font-size-medium, 1.25rem);line-height:var(--bi-height-large, 3.5rem)}.button.large sp-icon{font-size:calc(var(--font-size-medium, 1.25rem) * 1.2)}.button.large .icon-left{margin-right:0.3rem}.button.large .icon-right{margin-left:0.3rem}.button.large.square{width:var(--bi-height-large, 3.5rem);padding:0}",e})(),h=(()=>{let e=class{constructor(o){(0,r.r)(this,o),this.icon=f.I.add,this.fontsize=void 0,this.color=void 0,this.themeColor=void 0}render(){return(0,r.h)("span",{class:this.themeColor?this.icon+" color-"+this.themeColor:this.icon,style:{"font-size":this.fontsize,color:this.color}})}};return e.style='@charset "UTF-8";:host{font-family:"IconFont" !important;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;font-size:1rem;line-height:1}.zoom-in:before{content:"\u{18200}"}.search:before{content:"\u{18201}"}.trash-can-outline:before{content:"\u{18202}"}.settings:before{content:"\u{18203}"}.print-off:before{content:"\u{18205}"}.hamburger:before{content:"\u{18206}"}.person:before{content:"\u{18207}"}.shopping-basket:before{content:"\u{18208}"}.shopping-cart:before{content:"\u{18209}"}.visibility:before{content:"\u{18210}"}.visibility-off:before{content:"\u{18211}"}.check:before{content:"\u{18212}"}.app-command:before{content:"\u{18213}"}.undo:before{content:"\u{18214}"}.redo:before{content:"\u{18215}"}.save:before{content:"\u{18216}"}.folder-open:before{content:"\u{18217}"}.cut:before{content:"\u{18218}"}.copy:before{content:"\u{18219}"}.paste:before{content:"\u{18220}"}.edit:before{content:"\u{18221}"}.add-circled:before{content:"\u{18222}"}.remove-circled:before{content:"\u{18223}"}.help:before{content:"\u{18224}"}.help-outline:before{content:"\u{18225}"}.info:before{content:"\u{18226}"}.info-outline:before{content:"\u{18227}"}.error:before{content:"\u{18228}"}.error-outline:before{content:"\u{18229}"}.arrow-back:before{content:"\u{18230}"}.arrow-forward:before{content:"\u{18231}"}.expand-less:before{content:"\u{18232}"}.expand-more:before{content:"\u{18233}"}.navigate-before:before{content:"\u{18234}"}.navigate-next:before{content:"\u{18235}"}.arrow-drop-up:before{content:"\u{18236}"}.arrow-drop-left:before{content:"\u{18237}"}.arrow-drop-right:before{content:"\u{18238}"}.arrow-drop-down:before{content:"\u{18239}"}.add:before{content:"\u{18240}"}.remove:before{content:"\u{18241}"}.close:before{content:"\u{18242}"}.cancel:before{content:"\u{18243}"}.upload:before{content:"\u{18244}"}.camera:before{content:"\u{18245}"}.panorama:before{content:"\u{18246}"}.replay:before{content:"\u{18247}"}.locked:before{content:"\u{18248}"}.lock-open:before{content:"\u{18249}"}.check-circled:before{content:"\u{18250}

1"}.folder:before{content:"\u{18251}"}.print:before{content:"\u{18252}"}.sync:before{content:"\u{18253}"}.color-primary{color:var(--color-base-primary, #3082b0)}.color-secondary{color:var(--color-base-secondary, #444c5f)}.color-success{color:var(--color-base-success, #71b030)}.color-warning{color:var(--color-base-warning, #ffcc00)}.color-error{color:var(--color-base-error, #ff0000)}.color-info{color:var(--color-base-info, #1298b3)}.color-black{color:var(--color-black, #1a1a1a)}.color-white{color:var(--color-white, #fff)}.color-grey-1{color:var(--color-grey-1, #525252)}.color-grey-2{color:var(--color-grey-2, #8a8a8a)}.color-grey-3{color:var(--color-grey-3, #b8b8b8)}.color-grey-4{color:var(--color-grey-4, #dbdbdb)}.color-grey-5{color:var(--color-grey-5, #ebebeb)}.color-grey-6{color:var(--color-grey-6, #f5f5f5)}',e})()}}]);