{"version":3,"names":["gotAccordionCss","GotAccordion","render","h","Host","gotAccordionItemCss","GotAccordionItem","toggle","this","open","onClick","label","name","gotBadgeCss","GotBadge","class","color","size","gotBannerCss","GotBanner","handleClick","e","bannerButtonClicked","emit","part","variant","buttonLabel","gotBreadcrumbItemCss","GotBreadcrumbItem","active","href","isLastChild","gotBreadcrumbsCss","GotBreadcrumbs","componentDidLoad","lastChild","hostElement","lastElementChild","gotButtonCss","GothesButton","buttonClicked","type","square","iconPosition","buyButton","disabled","icon","gotCardCityCss","GotCardCity","src","alt","heading","pin","gotCardPersonCss","GotCardPerson","width","height","location","jobTitle","phone","phoneSecondary","email","gotCardProductCss","GotCardProduct","itemsEl","scrollHeight","infoContentEl","offsetHeight","isOverflowing","toggleExpanded","expanded","productLink","articleNumber","loggedIn","statusOne","statusOneColor","statusTwo","statusTwoColor","ref","el","brand","brandId","price","listingPrice","hidePrice","amountType","bundleAmount","currency","bundleButtonLabel","bundleText","gotCardProductActionsCss","GotCardProductActions","handleFavoritesClick","event","addToFavorites","handleShoppingListClick","addToShoppingList","handleBundleClick","addBundleToCart","value","min","step","gotCardProductInfoItemCss","GotCardProductInfoItem","gotCarouselCss","GotCarousel","handleIndexChange","index","activeIndex","numberOfChildren","updateSlides","elements","Array","from","forEach","element","setAttribute","classList","add","remove","getAttribute","activeSlideColor","autoUpdateActiveSlide","setInterval","intervalTimer","slotted","host","children","length","componentDidUpdate","map","_","gotCarouselItemCss","GotCarouselItem","getBackgroundStyle","backgroundStyle","backgroundImage","backgroundSrc","backgroundSize","backgroundRepeat","backgroundPosition","horizontalAlign","SlideColor","logoSrc","style","tabIndex","gotCheckboxCss","GotCheckbox","handleChange","checked","target","changed","invalid","onChange","gotDropdownCss","GotDropdown","getIcon","icons","key","svg","arrowLeftIcon","arrowRightIcon","cartIcon","checkCircleIcon","checkIcon","chevronDownIcon","chevronLeftIcon","chevronRightIcon","chevronUpIcon","doubleArrowLeftIcon","doubleArrowRightIcon","emailIcon","externalLinkIcon","fullSizeIcon","mailIcon","minusIcon","pdfIcon","peopleIcon","pinIcon","plusIcon","ribbonIcon","searchIcon","starIcon","truckIcon","userIcon","heartIcon","listIcon","find","_a","gotIconCss","GotIcon","innerHTML","gotInfoStatusCss","GotInfoStatus","gotInputNumberCss","GotInputNumber","updateValue","amount","parseInt","toString","handleBlur","Math","ceil","max","onInput","onBlur","gotInputTextCss","GotInputText","placeholder","gotRadioCss","GotRadio","gotRangeSliderCss","GotRangeSlider","setRailColor","sectionOne","lowerSlider","sectionTwo","_b","upperSlider","railColor","onLowerSliderChange","lowerValue","upperValue","onUpperSliderChange","unit","background","lowerName","id","upperName","gotShopButtonCss","GothesShopButton","badge","gotTabCss","GotTab","tab","gotTableCss","GotTable","gotTableBodyCss","GotTableBody","gotTableCellCss","GotTableCell","colspan","colSpan","gotTableHeadCss","GotTableHead","gotTableHeaderCss","GotTableHeader","gotTableRowCss","GotTableRow","gotTabsCss","GotTabs"],"sources":["./src/components/got-accordion/got-accordion.scss?tag=got-accordion&encapsulation=shadow","./src/components/got-accordion/got-accordion.tsx","./src/components/got-accordion/got-accordion-item/got-accordion-item.scss?tag=got-accordion-item&encapsulation=shadow","./src/components/got-accordion/got-accordion-item/got-accordion-item.tsx","./src/components/got-badge/got-badge.scss?tag=got-badge&encapsulation=shadow","./src/components/got-badge/got-badge.tsx","./src/components/got-banner/got-banner.scss?tag=got-banner&encapsulation=shadow","./src/components/got-banner/got-banner.tsx","./src/components/got-breadcrumbs/got-breadcrumb-item/got-breadcrumb-item.scss?tag=got-breadcrumb-item&encapsulation=shadow","./src/components/got-breadcrumbs/got-breadcrumb-item/got-breadcrumb-item.tsx","./src/components/got-breadcrumbs/got-breadcrumbs.scss?tag=got-breadcrumbs&encapsulation=shadow","./src/components/got-breadcrumbs/got-breadcrumbs.tsx","./src/components/got-button/got-button.scss?tag=got-button&encapsulation=scoped","./src/components/got-button/got-button.tsx","./src/components/got-card-city/got-card-city.scss?tag=got-card-city&encapsulation=shadow","./src/components/got-card-city/got-card-city.tsx","./src/components/got-card-person/got-card-person.scss?tag=got-card-person&encapsulation=shadow","./src/components/got-card-person/got-card-person.tsx","./src/components/got-card-product/got-card-product.scss?tag=got-card-product&encapsulation=scoped","./src/components/got-card-product/got-card-product.tsx","./src/components/got-card-product/got-card-product-actions/got-card-product-actions.scss?tag=got-card-product-actions&encapsulation=scoped","./src/components/got-card-product/got-card-product-actions/got-card-product-actions.tsx","./src/components/got-card-product/got-card-product-info-item/got-card-product-info-item.scss?tag=got-card-product-info-item&encapsulation=shadow","./src/components/got-card-product/got-card-product-info-item/got-card-product-info-item.tsx","./src/components/got-carousel/got-carousel.scss?tag=got-carousel&encapsulation=shadow","./src/components/got-carousel/got-carousel.tsx","./src/components/got-carousel/got-carousel-item/got-carousel-item.scss?tag=got-carousel-item&encapsulation=shadow","./src/components/got-carousel/got-carousel-item/got-carousel-item.tsx","./src/components/got-checkbox/got-checkbox.scss?tag=got-checkbox&encapsulation=scoped","./src/components/got-checkbox/got-checkbox.tsx","./src/components/got-dropdown/got-dropdown.scss?tag=got-dropdown&encapsulation=scoped","./src/components/got-dropdown/got-dropdown.tsx","./src/components/got-icon/getIcon.ts","./src/components/got-icon/got-icon.scss?tag=got-icon&encapsulation=shadow","./src/components/got-icon/got-icon.tsx","./src/components/got-info-status/got-info-status.scss?tag=got-info-status&encapsulation=shadow","./src/components/got-info-status/got-info-status.tsx","./src/components/got-input-number/got-input-number.scss?tag=got-input-number&encapsulation=scoped","./src/components/got-input-number/got-input-number.tsx","./src/components/got-input-text/got-input-text.scss?tag=got-input-text&encapsulation=scoped","./src/components/got-input-text/got-input-text.tsx","./src/components/got-radio/got-radio.scss?tag=got-radio&encapsulation=scoped","./src/components/got-radio/got-radio.tsx","./src/components/got-range-slider/got-range-slider.scss?tag=got-range-slider&encapsulation=scoped","./src/components/got-range-slider/got-range-slider.tsx","./src/components/got-shop-button/got-shop-button.scss?tag=got-shop-button&encapsulation=scoped","./src/components/got-shop-button/got-shop-button.tsx","./src/components/got-tabs/got-tab/got-tab.scss?tag=got-tab&encapsulation=shadow","./src/components/got-tabs/got-tab/got-tab.tsx","./src/components/got-table/got-table.scss?tag=got-table&encapsulation=shadow","./src/components/got-table/got-table.tsx","./src/components/got-table/got-table-body/got-table-body.scss?tag=got-table-body&encapsulation=shadow","./src/components/got-table/got-table-body/got-table-body.tsx","./src/components/got-table/got-table-cell/got-table-cell.scss?tag=got-table-cell&encapsulation=shadow","./src/components/got-table/got-table-cell/got-table-cell.tsx","./src/components/got-table/got-table-head/got-table-head.scss?tag=got-table-head&encapsulation=shadow","./src/components/got-table/got-table-head/got-table-head.tsx","./src/components/got-table/got-table-header/got-table-header.scss?tag=got-table-header&encapsulation=shadow","./src/components/got-table/got-table-header/got-table-header.tsx","./src/components/got-table/got-table-row/got-table-row.scss?tag=got-table-row&encapsulation=shadow","./src/components/got-table/got-table-row/got-table-row.tsx","./src/components/got-tabs/got-tabs.scss?tag=got-tabs&encapsulation=shadow","./src/components/got-tabs/got-tabs.tsx"],"sourcesContent":[":host {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-20);\n}\n","import { Component, Host, h } from '@stencil/core';\n\n/**\n * The wrapper to use with got-accordion-item\n */\n\n@Component({\n tag: 'got-accordion',\n styleUrl: 'got-accordion.scss',\n shadow: true,\n})\nexport class GotAccordion {\n render() {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n","@import 'src/styles/font.scss';\n\ndetails {\n @include font-body-large;\n border: 0.2rem solid var(--color-warning);\n background-color: var(--color-background);\n}\n\nsummary {\n @include font-headline-medium;\n display: block;\n cursor: pointer;\n padding: 0 var(--spacing-16);\n height: 6.4rem;\n display: flex;\n align-items: center;\n justify-content: space-between;\n background-color: var(--color-warning);\n border-radius: var(--radius-4);\n color: var(--color-on-background);\n transition: margin 150ms ease-out;\n\n ::part(stroke) {\n stroke: var(--color-primary);\n }\n}\n\nsummary::-webkit-details-marker {\n display: none;\n}\n\ndetails[open] summary {\n margin-bottom: 1.6rem;\n}\n\ndetails summary ::part(icon) {\n transition: 0.25s transform ease;\n}\n\ndetails[open] summary ::part(icon) {\n transform: rotate(-180deg);\n}\n\ndiv {\n padding: 0 var(--spacing-16) var(--spacing-16);\n}\n\n::slotted(a) {\n color: var(--color-primary);\n}\n\n::slotted(a:visited) {\n color: var(--color-primary);\n}\n","import { Component, Prop, State, h } from '@stencil/core';\n\n@Component({\n tag: 'got-accordion-item',\n styleUrl: 'got-accordion-item.scss',\n shadow: true,\n})\nexport class GotAccordionItem {\n /** The label to display */\n @Prop() label: string;\n @State() open: boolean = false;\n\n toggle() {\n this.open = !this.open;\n }\n\n render() {\n return (\n <details>\n <summary onClick={() => this.toggle()}>\n {this.label}\n <got-icon name=\"chevron-down\"></got-icon>\n </summary>\n <div>\n <slot></slot>\n </div>\n </details>\n );\n }\n}\n",".badge {\n font-family: var(--font-family-700);\n font-size: var(--font-size-14);\n border-radius: var(--radius-4);\n display: flex;\n justify-content: center;\n align-items: center;\n height: 3.2rem;\n width: fit-content;\n padding: 0 var(--spacing-8);\n white-space: nowrap;\n}\n\n.blue {\n background-color: var(--color-information);\n color: var(--color-primary);\n}\n\n.green {\n background-color: var(--color-success);\n color: var(--color-on-success);\n}\n\n.yellow {\n background-color: var(--color-warning);\n color: var(--color-on-warning);\n}\n\n.red {\n background-color: var(--color-error);\n color: var(--color-on-error);\n}\n\n.grey {\n background-color: var(--color-surface);\n color: var(--color-on-background);\n}\n\n.small {\n height: 2.4rem;\n font-size: var(--font-size-12);\n}\n","import { Component, Prop, h } from '@stencil/core';\n\nexport type BadgeColor = 'blue' | 'green' | 'yellow' | 'red' | 'grey';\nexport type BadgeSize = 'large' | 'small';\n\n@Component({\n tag: 'got-badge',\n styleUrl: 'got-badge.scss',\n shadow: true,\n})\nexport class GotBadge {\n /** The color to display */\n @Prop() color: BadgeColor = 'blue';\n /** The size to display */\n @Prop() size: BadgeSize = 'large';\n\n render() {\n return (\n <div class={`badge ${this.color} ${this.size}`}>\n <slot></slot>\n </div>\n );\n }\n}\n","@import 'src/styles/font.scss';\n\n:host {\n position: fixed;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: var(--layer-skybar);\n}\n\n.banner {\n @include font-body-medium;\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 1.6rem;\n padding: var(--spacing-16) var(--spacing-32);\n background-color: var(--color-primary-variant-2);\n color: var(--color-on-background);\n}\n\n::slotted(a) {\n color: var(--color-primary);\n}\n\n::slotted(a:visited) {\n color: var(--color-primary);\n}\n","import { Component, Event, EventEmitter, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'got-banner',\n styleUrl: 'got-banner.scss',\n shadow: true,\n})\nexport class GotBanner {\n /** The label to display on the button */\n @Prop() buttonLabel: string;\n /** The name of the click event */\n @Event() bannerButtonClicked: EventEmitter<MouseEvent>;\n\n handleClick(e: MouseEvent) {\n this.bannerButtonClicked.emit(e);\n }\n\n render() {\n return (\n <div class=\"banner\">\n <div>\n <slot></slot>\n </div>\n <got-button\n part=\"button\"\n variant=\"ghost\"\n size=\"small\"\n onClick={e => {\n this.handleClick(e);\n }}\n >\n {this.buttonLabel}\n </got-button>\n </div>\n );\n }\n}\n",".breadcrumb {\n display: flex;\n gap: var(--spacing-16);\n padding: var(--spacing-20) 0;\n}\n\na {\n color: var(--color-primary);\n text-decoration: none;\n}\n\nspan {\n color: var(--color-on-background);\n}\n\n::part(stroke) {\n stroke: var(--color-surface-plus-1);\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'got-breadcrumb-item',\n styleUrl: 'got-breadcrumb-item.scss',\n shadow: true,\n})\nexport class GotBreadcrumbItem {\n /** The flag used for the last breadcrumb */\n @Prop() active = false;\n /** The url to link to */\n @Prop() href: string;\n /** The flag used for the last breadcrumb, ignore this prop as this is handled automatically by internal logic */\n @Prop() isLastChild: boolean;\n\n render() {\n return (\n <li class=\"breadcrumb\">\n {this.active ? (\n <span>\n <slot></slot>\n </span>\n ) : (\n <a href={this.href}>\n <slot></slot>\n </a>\n )}\n {!this.isLastChild ? <got-icon name=\"chevron-right\" size=\"small\"></got-icon> : null}\n </li>\n );\n }\n}\n","@import 'src/styles/font.scss';\n\n.breadcrumbs {\n @include font-body-medium;\n border-top: 1px solid var(--color-surface-plus-1);\n border-bottom: 1px solid var(--color-surface-plus-1);\n display: flex;\n list-style-type: none;\n padding: 0;\n gap: 0 var(--spacing-16);\n flex-wrap: wrap;\n}\n\n::slotted(a) {\n color: var(--color-primary);\n text-decoration: none;\n}\n\n:last-of-type::slotted(got-icon) {\n display: none;\n}\n\n::slotted(svg) {\n background-color: purple;\n}\n","import { Component, Element, h } from '@stencil/core';\n\n/**\n * The wrapper to use with got-breadcrumb-item\n */\n\n@Component({\n tag: 'got-breadcrumbs',\n styleUrl: 'got-breadcrumbs.scss',\n shadow: true,\n})\nexport class GotBreadcrumbs {\n @Element() hostElement: HTMLElement;\n\n componentDidLoad() {\n const lastChild = this.hostElement.lastElementChild;\n if (!lastChild) return;\n lastChild['isLastChild'] = true;\n }\n\n render() {\n return (\n <ol class=\"breadcrumbs\">\n <slot></slot>\n </ol>\n );\n }\n}\n","@import 'src/styles/button.scss';\n\n.button {\n @include button;\n\n &.primary[disabled],\n &.secondary[disabled],\n &.ghost[disabled],\n &.tertiary[disabled],\n &.green[disabled] {\n border: none;\n box-shadow: none;\n background: var(--color-surface-plus-2-05);\n color: var(--color-on-primary);\n cursor: not-allowed;\n\n ::part(stroke) {\n stroke: var(--color-on-primary);\n }\n\n ::part(fill) {\n fill: var(--color-on-primary);\n }\n\n &.green[disabled] {\n background: var(--color-on-success-05);\n }\n }\n}\n","import { Component, Event, EventEmitter, Prop, h } from '@stencil/core';\nimport { IconName } from '../got-icon/got-icon';\n\nexport type ButtonVariant = 'primary' | 'secondary' | 'ghost' | 'tertiary' | 'green';\nexport type ButtonSize = 'tiny' | 'small' | 'medium';\nexport type IconPosition = 'leading' | 'trailing' | 'icon-only';\n\n@Component({\n\ttag: 'got-button',\n\tstyleUrl: 'got-button.scss',\n\tscoped: true,\n})\nexport class GothesButton {\n\t/** The variant to display */\n\t@Prop() variant: ButtonVariant = 'primary';\n\t/** The size to display */\n\t@Prop() size: ButtonSize = 'medium';\n\t/** The flag to display square type button */\n\t@Prop() square = false;\n\t/** The flag to display button in a disabled state */\n\t@Prop() disabled = false;\n\t/** The icon to display */\n\t@Prop() icon: IconName;\n\t/** The trailing icon to display */\n\t@Prop() iconPosition: IconPosition = 'trailing';\n\t/** The type attribute from regular button element */\n\t@Prop() type: HTMLButtonElement['type'];\n\t/** Used for got-product-card component and should be ignored */\n\t@Prop() buyButton: boolean;\n\t/** The name of the click event */\n\t@Event() buttonClicked: EventEmitter<MouseEvent>;\n\n\thandleClick(e: MouseEvent) {\n\t\tthis.buttonClicked.emit(e);\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<button\n\t\t\t\ttype={this.type}\n\t\t\t\tclass={`button ${this.variant} ${this.size} ${this.square ? 'square' : null} ${\n\t\t\t\t\tthis.iconPosition\n\t\t\t\t} ${this.buyButton ? 'buy' : null}`}\n\t\t\t\tdisabled={this.disabled}\n\t\t\t\tonClick={e => {\n\t\t\t\t\tthis.handleClick(e);\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{this.icon && this.iconPosition === 'leading' ? (\n\t\t\t\t\t<got-icon name={this.icon}></got-icon>\n\t\t\t\t) : null}\n\t\t\t\t{this.icon && this.iconPosition === 'icon-only' ? (\n\t\t\t\t\t<got-icon name={this.icon}></got-icon>\n\t\t\t\t) : (\n\t\t\t\t\t<slot></slot>\n\t\t\t\t)}\n\t\t\t\t{this.icon && this.iconPosition === 'trailing' ? (\n\t\t\t\t\t<got-icon name={this.icon}></got-icon>\n\t\t\t\t) : null}\n\t\t\t</button>\n\t\t);\n\t}\n}\n","@import 'src/styles/font.scss';\n\n:host {\n height: inherit;\n width: 100%;\n}\n\n.card-city {\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n gap: var(--spacing-16);\n border-radius: var(--radius-8);\n background-color: var(--color-background);\n border: 0.1rem solid var(--color-surface);\n color: var(--color-on-background);\n}\n\n.image {\n width: 100%;\n overflow: hidden;\n border-radius: var(--radius-8) var(--radius-8) 0 0;\n\n img {\n width: 100%;\n }\n}\n\n.content {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: var(--spacing-16);\n padding: 0 var(--spacing-16) var(--spacing-16);\n}\n\n.heading {\n @include font-display-small;\n margin: 0;\n display: flex;\n gap: var(--spacing-8);\n\n ::part(stroke) {\n stroke: var(--color-on-background);\n }\n}\n\n::slotted(p) {\n @include font-body-large;\n margin: 0 !important;\n text-align: center;\n}\n\n::slotted(a) {\n font-family: var(--font-family-600);\n font-size: var(--font-size-16);\n text-decoration: none;\n display: flex;\n align-items: center;\n gap: var(--spacing-8);\n color: var(--color-primary);\n}\n\n::slotted(a:hover) {\n color: var(--color-primary);\n text-decoration: underline;\n}\n\n::part(stroke) {\n stroke: var(--color-primary);\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'got-card-city',\n styleUrl: 'got-card-city.scss',\n shadow: true,\n})\nexport class GotCardCity {\n /** The path to the image */\n @Prop() src: string;\n /** The heading of the card */\n @Prop() heading: string;\n /** The flag to display a pin icon */\n @Prop() pin: boolean = false;\n\n render() {\n return (\n <div class=\"card-city\">\n <div class=\"image\">\n <img src={this.src} alt={this.heading} />\n </div>\n <div class=\"content\">\n <h3 class=\"heading\">\n {this.pin ? <got-icon name=\"pin\"></got-icon> : null}\n {this.heading}\n </h3>\n <slot></slot>\n </div>\n </div>\n );\n }\n}\n","@import 'src/styles/font.scss';\n\n.card-person {\n display: flex;\n gap: var(--spacing-20);\n background-color: var(--color-tertiary);\n border-radius: var(--radius-4);\n padding: var(--spacing-24);\n overflow-wrap: anywhere;\n\n img {\n object-fit: cover;\n }\n}\n\n.content {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n gap: var(--spacing-4);\n\n span {\n @include font-label-uppercase;\n color: var(--color-primary);\n }\n\n h4 {\n @include font-headline-large;\n color: var(--color-on-background);\n margin: 0;\n }\n\n p {\n @include font-body-medium;\n color: var(--color-on-background);\n margin: 0;\n }\n\n p:first-of-type {\n margin-bottom: var(--spacing-12);\n }\n\n a {\n color: var(--color-on-background);\n text-decoration: none;\n }\n\n a:hover {\n color: var(--color-primary);\n }\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'got-card-person',\n styleUrl: 'got-card-person.scss',\n shadow: true,\n})\nexport class GotCardPerson {\n /** The path to the image to display */\n @Prop() src: string;\n /** The location of the person */\n @Prop() location: string;\n /** The person's name */\n @Prop() name: string;\n /** The person's job title */\n @Prop() jobTitle: string;\n /** The person's phone number */\n @Prop() phone: string;\n /** The person's secondary phone number */\n @Prop() phoneSecondary: string;\n /** The person's email */\n @Prop() email: string;\n\n render() {\n return (\n <div class=\"card-person\">\n {this.src ? <img src={this.src} alt={this.name} width=\"95\" height=\"142\" /> : null}\n <div class=\"content\">\n <span>{this.location}</span>\n <h4>{this.name}</h4>\n <p>{this.jobTitle}</p>\n <p>\n <strong>Telefon:</strong> <a href={`tel:${this.phone}`}>{this.phone}</a> <a href={`tel:${this.phoneSecondary}`}>{this.phoneSecondary}</a>\n </p>\n <p>\n <strong>E-post:</strong> <a href={`mailto:${this.email}`}>{this.email}</a>\n </p>\n </div>\n </div>\n );\n }\n}\n","@import 'src/styles/font.scss';\n@import 'src/styles/breakpoints.scss';\n\n.product-card {\n box-sizing: border-box;\n background-color: var(--color-background);\n border: 0.2rem solid var(--color-tertiary);\n display: flex;\n flex-direction: column;\n border-radius: var(--radius-4);\n}\n\n.info {\n display: flex;\n flex-direction: column;\n position: relative;\n width: 100%;\n}\n\n.info-header {\n display: flex;\n flex-direction: column-reverse;\n padding: var(--spacing-16) var(--spacing-16) var(--spacing-8);\n background-color: var(--color-tertiary);\n gap: var(--spacing-12);\n\n h4 {\n font-family: var(--font-family-700);\n font-size: var(--font-size-18);\n color: var(--color-on-background);\n margin: 0;\n margin-bottom: var(--spacing-4);\n text-transform: uppercase;\n }\n\n p {\n @include font-label-normal;\n color: var(--color-on-background);\n margin: 0;\n }\n\n a,\n a:visited {\n color: var(--color-on-background);\n text-decoration: none;\n }\n\n a:hover {\n color: var(--color-primary);\n }\n\n div:last-of-type {\n display: flex;\n margin-left: auto;\n gap: var(--spacing-4);\n }\n}\n\n.info-content {\n display: flex;\n align-items: flex-start;\n gap: var(--spacing-16);\n padding: var(--spacing-16);\n\n img {\n max-height: 16rem;\n max-width: 9rem;\n }\n}\n\n.info-items {\n width: 100%;\n grid-area: info-items;\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));\n grid-template-rows: auto;\n max-height: 16rem;\n overflow: hidden;\n transition: max-height 0.4s ease-in-out;\n gap: var(--spacing-16);\n padding-bottom: var(--spacing-32);\n\n &.expanded {\n max-height: 500px;\n }\n}\n\n.show-more {\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n display: flex;\n justify-content: center;\n height: 4rem;\n background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, var(--color-background) 50%, var(--color-background) 100%);\n}\n\n@media (min-width: $bp-md) {\n .product-card {\n flex-direction: row;\n height: 26.4rem;\n overflow: hidden;\n\n &.expanded {\n height: unset;\n }\n }\n\n .info-header {\n flex-direction: row;\n }\n\n .info-content {\n img {\n max-width: 10rem;\n }\n }\n}\n","import { Component, Element, Prop, State, h } from '@stencil/core';\nimport { BadgeColor } from '../got-badge/got-badge';\n\n@Component({\n\ttag: 'got-card-product',\n\tstyleUrl: 'got-card-product.scss',\n\tscoped: true,\n})\nexport class GotCardProduct {\n\t/** The name of the product */\n\t@Prop() name: string;\n\t/** The brand of the product */\n\t@Prop() brand: string;\n\t/** The brand id */\n\t@Prop() brandId: string;\n\t/** The article number of the product */\n\t@Prop() articleNumber: string;\n\t/** The image source */\n\t@Prop() src: string;\n\t/** The flag for displaying logged in content */\n\t@Prop() loggedIn = false;\n\t/** Status label right */\n\t@Prop() statusOne: string;\n\t/** Color of the right label */\n\t@Prop() statusOneColor: BadgeColor;\n\t/** Status label left */\n\t@Prop() statusTwo: string;\n\t/** Color of the right label */\n\t@Prop() statusTwoColor: BadgeColor;\n\t/** The price of the product */\n\t@Prop() price: string;\n\t/** The listing price of the product */\n\t@Prop() listingPrice: string;\n\t/** Flag for hiding prices */\n\t@Prop() hidePrice: boolean;\n\t/** The currency of the price */\n\t@Prop() currency: string;\n\t/** The label for the button to buy in bundle */\n\t@Prop() bundleButtonLabel: string;\n\t/** The amount bundle size, if sold in bundles of e.g. 10 */\n\t@Prop() bundleAmount: string;\n\t/** The bundle information text, e.g. \"Förpackning: 200 ST (delas ej)\" */\n\t@Prop() bundleText: string;\n\t/** The amount type, e.g. ST, FRP, STS */\n\t@Prop() amountType: string;\n\t/** href to the product page */\n\t@Prop() productLink: string;\n\n\t@Element() el: HTMLElement;\n\t@State() expanded = false;\n\t@State() isOverflowing = false;\n\n\tprivate infoContentEl: HTMLDivElement;\n\tprivate itemsEl: HTMLDivElement;\n\n\tcomponentDidLoad() {\n\t\tif (this.itemsEl.scrollHeight > this.infoContentEl.offsetHeight) {\n\t\t\tthis.isOverflowing = true;\n\t\t}\n\t}\n\n\ttoggleExpanded() {\n\t\tthis.expanded = !this.expanded;\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<div class={`product-card ${this.expanded ? 'expanded' : ''}`}>\n\t\t\t\t<div class=\"info\">\n\t\t\t\t\t<div class=\"info-header\">\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<h4>\n\t\t\t\t\t\t\t\t<a href={this.productLink}>{this.name}</a>\n\t\t\t\t\t\t\t</h4>\n\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\tArtikel: <a href={this.productLink}>{this.articleNumber}</a>\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t{this.loggedIn && this.statusOne ? (\n\t\t\t\t\t\t\t\t<got-badge size=\"small\" color={this.statusOneColor}>\n\t\t\t\t\t\t\t\t\t{this.statusOne}\n\t\t\t\t\t\t\t\t</got-badge>\n\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t{this.loggedIn && this.statusTwo ? (\n\t\t\t\t\t\t\t\t<got-badge size=\"small\" color={this.statusTwoColor}>\n\t\t\t\t\t\t\t\t\t{this.statusTwo}\n\t\t\t\t\t\t\t\t</got-badge>\n\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass={`info-content ${this.isOverflowing ? 'overflowing' : ''}`}\n\t\t\t\t\t\tref={el => (this.infoContentEl = el as HTMLDivElement)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<img src={this.src} alt={this.name} />\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass={`info-items ${this.expanded ? 'expanded' : ''}`}\n\t\t\t\t\t\t\tref={el => (this.itemsEl = el as HTMLDivElement)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t\t{this.isOverflowing ? (\n\t\t\t\t\t\t<div class=\"show-more\">\n\t\t\t\t\t\t\t<got-button\n\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\ticon={this.expanded ? 'chevron-up' : 'chevron-down'}\n\t\t\t\t\t\t\t\ticon-position=\"trailing\"\n\t\t\t\t\t\t\t\tonClick={() => this.toggleExpanded()}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{this.expanded ? 'Visa mindre' : 'Visa mer'}\n\t\t\t\t\t\t\t</got-button>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) : null}\n\t\t\t\t</div>\n\t\t\t\t<got-card-product-actions\n\t\t\t\t\tloggedIn={this.loggedIn}\n\t\t\t\t\tbrand={this.brand}\n\t\t\t\t\tbrandId={this.brandId}\n\t\t\t\t\tprice={this.price}\n\t\t\t\t\tlistingPrice={this.listingPrice}\n\t\t\t\t\thidePrice={this.hidePrice}\n\t\t\t\t\tamountType={this.amountType}\n\t\t\t\t\tbundleAmount={this.bundleAmount}\n\t\t\t\t\tarticleNumber={this.articleNumber}\n\t\t\t\t\tcurrency={this.currency}\n\t\t\t\t\tbundleButtonLabel={this.bundleButtonLabel}\n\t\t\t\t\tbundleText={this.bundleText}\n\t\t\t\t>\n\t\t\t\t\t{this.loggedIn ? null : <slot name=\"login-text\"></slot>}\n\t\t\t\t</got-card-product-actions>\n\t\t\t</div>\n\t\t);\n\t}\n}\n","@import 'src/styles/font.scss';\n@import 'src/styles/breakpoints.scss';\n\n.actions {\n\t@include font-body-small;\n\tbox-sizing: border-box;\n\tbackground-color: var(--color-success);\n\tpadding: var(--spacing-16);\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: var(--spacing-16);\n\tmin-height: 17.6rem;\n\n\tp {\n\t\tmargin: 0;\n\t}\n\n\t::slotted(p) {\n\t\tmargin: 0;\n\n\t\ta,\n\t\ta:visited {\n\t\t\tcolor: var(--color-primary);\n\t\t}\n\n\t\ta:hover {\n\t\t\ttext-decoration: none;\n\t\t}\n\t}\n}\n\n.logged-in {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: var(--spacing-8);\n\tcolor: var(--color-surface-plus-2);\n\n\tp:first-of-type {\n\t\ttext-transform: uppercase;\n\t\tcolor: var(--color-on-background);\n\t}\n\n\tspan {\n\t\t@include font-display-small;\n\t}\n\n\tp:last-of-type > span {\n\t\tline-height: unset;\n\t\tfont-size: unset;\n\t\tfont-family: var(--font-family-400);\n\t\ttext-transform: uppercase;\n\t}\n\n\tform {\n\t\tdisplay: flex;\n\t\tgap: var(--spacing-8);\n\t\ttext-transform: uppercase;\n\t\tmax-width: 27.5rem;\n\t\talign-items: center;\n\n\t\tspan:not(.bundle-button) {\n\t\t\t@include font-headline-medium;\n\t\t\tfont-size: var(--font-size-16);\n\t\t\tcolor: var(--color-black);\n\t\t}\n\t}\n\n\t.bundle-button,\n\t.bundle-text {\n\t\tline-height: unset;\n\t\tfont-size: unset;\n\t\tfont-family: var(--font-family-400);\n\t}\n}\n\n.brand {\n\tdisplay: flex;\n\n\t> div {\n\t\twidth: 50%;\n\t}\n}\n\n.icon-buttons {\n\tdisplay: flex;\n\tgap: var(--spacing-4);\n}\n\n@media (min-width: $bp-md) {\n\t.actions {\n\t\twidth: 29rem;\n\t\theight: 100%;\n\t}\n}\n","import { Component, Event, EventEmitter, Prop, h } from '@stencil/core';\n\n@Component({\n\ttag: 'got-card-product-actions',\n\tstyleUrl: 'got-card-product-actions.scss',\n\tscoped: true,\n})\nexport class GotCardProductActions {\n\t/** The flag for displaying logged in content */\n\t@Prop() loggedIn = false;\n\t/** The brand of the product */\n\t@Prop() brand: string;\n\t/** The brand id */\n\t@Prop() brandId: string;\n\t/** The article number of the product */\n\t@Prop() articleNumber: string;\n\t/** The price of the product */\n\t@Prop() price: string;\n\t/** The listing price of the product */\n\t@Prop() listingPrice: string;\n\t/** Flag for hiding prices */\n\t@Prop() hidePrice: boolean;\n\t/** The currency of the price */\n\t@Prop() currency: string;\n\t/** The amount type, e.g. ST, FRP, STS */\n\t@Prop() amountType: string;\n\t/** The amount bundle size, if sold in bundles of e.g. 10 */\n\t@Prop() bundleAmount: string;\n\t/** The label for the button to buy in bundle */\n\t@Prop() bundleButtonLabel: string;\n\t/** The bundle information text, e.g. \"Förpackning: 200 ST (delas ej)\" */\n\t@Prop() bundleText: string;\n\t/** The event emitted when favorites button has been clicked */\n\t@Event() addToFavorites: EventEmitter<any>;\n\t/** The event emitted when shopping list button has been clicked */\n\t@Event() addToShoppingList: EventEmitter<any>;\n\t/** The event emitted when favorites button has been clicked */\n\t@Event() addBundleToCart: EventEmitter<any>;\n\n\thandleFavoritesClick(event) {\n\t\tthis.addToFavorites.emit(event);\n\t}\n\n\thandleShoppingListClick(event) {\n\t\tthis.addToShoppingList.emit(event);\n\t}\n\n\thandleBundleClick(event) {\n\t\tthis.addBundleToCart.emit(event);\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<div class=\"actions\">\n\t\t\t\t{this.loggedIn ? (\n\t\t\t\t\t<div class=\"logged-in\">\n\t\t\t\t\t\t{this.hidePrice ? null : (\n\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\t\t<span>{this.price}</span> {this.currency} per {this.amountType}\n\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\t\tListpris: <strong>{this.listingPrice}</strong>{' '}\n\t\t\t\t\t\t\t\t\t<span class=\"currency\">{this.currency}</span>\n\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<form data-aid={this.articleNumber}>\n\t\t\t\t\t\t\t<got-input-number\n\t\t\t\t\t\t\t\tname=\"amount\"\n\t\t\t\t\t\t\t\tvalue={this.bundleAmount ? this.bundleAmount : '1'}\n\t\t\t\t\t\t\t\tmin={this.bundleAmount ? this.bundleAmount : '1'}\n\t\t\t\t\t\t\t\tstep={this.bundleAmount}\n\t\t\t\t\t\t\t></got-input-number>\n\t\t\t\t\t\t\t<span>{this.amountType}</span>\n\t\t\t\t\t\t\t<got-button\n\t\t\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t\t\tvariant=\"green\"\n\t\t\t\t\t\t\t\ticon=\"cart\"\n\t\t\t\t\t\t\t\ticon-position=\"leading\"\n\t\t\t\t\t\t\t\tsquare\n\t\t\t\t\t\t\t\tbuy-button\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\tKöp\n\t\t\t\t\t\t\t</got-button>\n\t\t\t\t\t\t</form>\n\t\t\t\t\t\t{this.bundleButtonLabel ? (\n\t\t\t\t\t\t\t<got-button\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\tvariant=\"green\"\n\t\t\t\t\t\t\t\ticon=\"cart\"\n\t\t\t\t\t\t\t\ticon-position=\"leading\"\n\t\t\t\t\t\t\t\tsquare\n\t\t\t\t\t\t\t\tonClick={event => this.handleBundleClick(event)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<span class=\"bundle-button\">{this.bundleButtonLabel}</span>\n\t\t\t\t\t\t\t</got-button>\n\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t{this.bundleText ? <span class=\"bundle-text\">{this.bundleText}</span> : null}\n\t\t\t\t\t\t<div class=\"icon-buttons\">\n\t\t\t\t\t\t\t<got-button\n\t\t\t\t\t\t\t\tdata-aid={this.articleNumber}\n\t\t\t\t\t\t\t\tvariant=\"green\"\n\t\t\t\t\t\t\t\tsquare\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\ticon-position=\"icon-only\"\n\t\t\t\t\t\t\t\ticon=\"heart\"\n\t\t\t\t\t\t\t\tonClick={event => this.handleFavoritesClick(event)}\n\t\t\t\t\t\t\t></got-button>\n\t\t\t\t\t\t\t<got-button\n\t\t\t\t\t\t\t\tdata-aid={this.articleNumber}\n\t\t\t\t\t\t\t\tvariant=\"green\"\n\t\t\t\t\t\t\t\tsquare\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\ticon-position=\"icon-only\"\n\t\t\t\t\t\t\t\ticon=\"list\"\n\t\t\t\t\t\t\t\tonClick={event => this.handleShoppingListClick(event)}\n\t\t\t\t\t\t\t></got-button>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t) : (\n\t\t\t\t\t<slot></slot>\n\t\t\t\t)}\n\t\t\t\t<div class=\"brand\">\n\t\t\t\t\t{this.brand ? (\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<got-card-product-info-item\n\t\t\t\t\t\t\t\tlabel=\"varumärke\"\n\t\t\t\t\t\t\t\tvalue={this.brand}\n\t\t\t\t\t\t\t></got-card-product-info-item>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) : null}\n\t\t\t\t\t{this.brandId ? (\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<got-card-product-info-item\n\t\t\t\t\t\t\t\tlabel=\"varumärkes-id\"\n\t\t\t\t\t\t\t\tvalue={this.brandId}\n\t\t\t\t\t\t\t></got-card-product-info-item>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) : null}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t}\n}\n","@import 'src/styles/font.scss';\n\n* {\n box-sizing: border-box;\n}\n\n.item-container {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-4);\n\n p {\n @include font-body-medium-600;\n margin: 0;\n color: var(--color-black);\n }\n\n .title {\n @include font-body-small;\n text-transform: uppercase;\n color: var(--color-surface-plus-2);\n }\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'got-card-product-info-item',\n styleUrl: 'got-card-product-info-item.scss',\n shadow: true,\n})\nexport class GotCardProductInfoItem {\n /** The label of the item */\n @Prop() label: string;\n /** The value of the item */\n @Prop() value: string;\n\n render() {\n return (\n <div class=\"item-container\">\n <p class=\"title\">{this.label}</p>\n <p>{this.value}</p>\n </div>\n );\n }\n}\n",".carousel {\n position: relative;\n margin-bottom: var(--spacing-32);\n}\n\n.controls {\n position: absolute;\n width: 100%;\n z-index: var(--layer-floor-1);\n display: flex;\n justify-content: space-between;\n top: 50%;\n transform: translateY(-50%);\n\n button {\n background: none;\n outline: none;\n border: none;\n cursor: pointer;\n opacity: 0.4;\n }\n\n button:hover {\n opacity: 1;\n }\n\n button:focus-visible {\n outline: 1px solid var(--color-on-primary);\n }\n\n .white {\n ::part(stroke) {\n stroke: var(--color-on-background);\n }\n }\n\n .white:focus-visible {\n outline: 1px solid var(--color-on-background);\n }\n}\n\n.pagination {\n position: absolute;\n left: 50%;\n transform: translateX(-50%);\n display: flex;\n gap: var(--spacing-8);\n margin-top: var(--spacing-20);\n\n button {\n cursor: pointer;\n border: 1px solid var(--color-surface-plus-2);\n outline: none;\n background: var(--color-background);\n border-radius: var(--radius-round);\n width: 1rem;\n height: 1rem;\n padding: 0;\n }\n\n button:focus-visible {\n outline: 1px solid var(--color-primary);\n }\n\n .carousel-active {\n background: var(--color-surface-plus-2);\n }\n}\n\n::slotted(.carousel-hidden) {\n visibility: hidden !important;\n opacity: 0;\n position: fixed;\n}\n\n::slotted(.carousel-active) {\n visibility: visible;\n opacity: 1;\n transition: opacity 0.7s;\n}\n","import { Component, Element, Prop, State, h } from '@stencil/core';\n\nimport { SlideColor } from './got-carousel-item/got-carousel-item';\n\n/**\n * The wrapper to use with got-carousel-item\n */\n\n@Component({\n tag: 'got-carousel',\n styleUrl: 'got-carousel.scss',\n shadow: true,\n})\nexport class GotCarousel {\n @Element() host: HTMLElement;\n @State() numberOfChildren: number;\n @State() activeIndex: number = 0;\n @State() activeSlideColor: SlideColor;\n /** The time in ms each slide is visible, no autoplay if no timer is set */\n @Prop() intervalTimer: number;\n\n handleIndexChange(index: number) {\n if (index === -1) return (this.activeIndex = this.numberOfChildren - 1);\n if (index === this.numberOfChildren) return (this.activeIndex = 0);\n return (this.activeIndex = index);\n }\n\n updateSlides(elements: Element[]) {\n Array.from(elements).forEach((element: HTMLElement, index) => {\n element.setAttribute('aria-label', `Item ${index + 1}`);\n\n if (index !== this.activeIndex) {\n element.classList.add('carousel-hidden');\n element.classList.remove('carousel-active');\n } else {\n element.classList.remove('carousel-hidden');\n element.classList.add('carousel-active');\n\n if (element.getAttribute('slide-color') === 'white') {\n this.activeSlideColor = 'white';\n } else {\n this.activeSlideColor = 'blue';\n }\n }\n });\n }\n\n autoUpdateActiveSlide() {\n setInterval(() => {\n this.handleIndexChange(this.activeIndex + 1);\n }, this.intervalTimer);\n }\n\n componentDidLoad() {\n let slotted = this.host.children;\n\n this.updateSlides(Array.from(slotted));\n\n if (this.numberOfChildren !== slotted.length) this.numberOfChildren = slotted.length;\n\n if (typeof this.intervalTimer !== 'undefined') {\n this.autoUpdateActiveSlide();\n }\n }\n\n componentDidUpdate() {\n let slotted = this.host.children;\n\n this.updateSlides(Array.from(slotted));\n }\n\n render() {\n return (\n <section class=\"carousel\" aria-label=\"Featured content\">\n <div class=\"controls\">\n <button class={`previous-button ${this.activeSlideColor}`} onClick={() => this.handleIndexChange(this.activeIndex - 1)} aria-label=\"Previous item\">\n <got-icon name=\"chevron-left\" size=\"large\"></got-icon>\n </button>\n <button class={`next-button ${this.activeSlideColor}`} onClick={() => this.handleIndexChange(this.activeIndex + 1)} aria-label=\"Next item\">\n <got-icon name=\"chevron-right\" size=\"large\"></got-icon>\n </button>\n </div>\n <slot></slot>\n <div class=\"pagination\">\n {[...Array(this.numberOfChildren)].map((_, index) => (\n <button\n class={this.activeIndex === index ? 'carousel-active' : null}\n aria-current={this.activeIndex === index ? 'true' : 'false'}\n aria-label={`Item ${index + 1} button`}\n onClick={() => this.handleIndexChange(index)}\n ></button>\n ))}\n </div>\n </section>\n );\n }\n}\n","@import 'src/styles/font.scss';\n@import 'src/styles/breakpoints.scss';\n\n.carousel-item {\n background-color: var(--color-secondary);\n aspect-ratio: 129 / 50;\n border-radius: var(--radius-8);\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n padding: var(--spacing-48) var(--spacing-64);\n color: var(--color-on-primary);\n text-decoration: none;\n container-name: carouselItem;\n container-type: inline-size;\n\n &.left {\n align-items: flex-start;\n }\n\n &.with-logo {\n justify-content: space-between;\n gap: 1.6rem;\n }\n\n &.white {\n background-color: var(--color-background);\n color: var(--color-on-background);\n }\n}\n\n.content {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-24);\n\n &.left {\n align-items: flex-start;\n }\n}\n\nh2 {\n @include font-headline-large;\n margin: 0;\n}\n\np {\n @include font-body-large;\n margin: 0;\n}\n\n@container carouselItem (min-width: 70rem) {\n h2 {\n font-size: 4.8rem;\n }\n\n p {\n font-size: 3.2rem;\n }\n}\n\n@container carouselItem (max-width: 70rem) {\n .logo {\n width: 30%;\n height: auto;\n }\n}\n","import { Component, Prop, h } from '@stencil/core';\n\nexport type VerticalPosition = 'center' | 'bottom';\nexport type HorizontalPosition = 'left' | 'center';\nexport type LogoPosition = 'left' | 'center' | 'right';\nexport type SlideColor = 'blue' | 'white';\n\n@Component({\n tag: 'got-carousel-item',\n styleUrl: 'got-carousel-item.scss',\n shadow: true,\n})\nexport class GotCarouselItem {\n /** The horizontal position of the content */\n @Prop() horizontalAlign: HorizontalPosition = 'center';\n /** The url to a background image */\n @Prop() backgroundSrc: string;\n /** The url to a logo */\n @Prop() logoSrc: string;\n /** The heading text of the slide */\n @Prop() heading: string;\n /** The button label */\n @Prop() buttonLabel: string;\n /** The url the slide should link to */\n @Prop() href: string;\n /** The color of the background */\n @Prop() SlideColor: SlideColor = 'blue';\n\n getBackgroundStyle() {\n const backgroundStyle = {\n backgroundImage: `linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(${this.backgroundSrc})`,\n backgroundSize: 'cover',\n backgroundRepeat: 'no-repeat',\n backgroundPosition: 'center',\n };\n\n return backgroundStyle;\n }\n\n render() {\n return (\n <a\n href={this.href}\n class={`carousel-item ${this.horizontalAlign} ${this.SlideColor} ${this.logoSrc ? 'with-logo' : null}`}\n style={this.backgroundSrc ? this.getBackgroundStyle() : null}\n >\n {this.logoSrc ? <img src={this.logoSrc} class=\"logo\" /> : null}\n <div class={`content ${this.horizontalAlign}`}>\n {this.heading ? <h2>{this.heading}</h2> : null}\n <p>\n <slot></slot>\n </p>\n {this.buttonLabel ? (\n <got-button type=\"button\" tabIndex={-1}>\n {this.buttonLabel}\n </got-button>\n ) : null}\n </div>\n </a>\n );\n }\n}\n","@import 'src/styles/font.scss';\n\n.label {\n\t@include font-body-medium-500;\n\tcolor: var(--color-on-background);\n\tdisplay: flex;\n\talign-items: center;\n\tpadding: 0;\n\tmargin: 0;\n\tgap: var(--spacing-4);\n\tposition: relative;\n\tcursor: pointer;\n\n\t&:before {\n\t\tcontent: '';\n\t\tbox-shadow: none;\n\t\tdisplay: none;\n\t}\n\n\t&.disabled {\n\t\tcursor: not-allowed;\n\t\topacity: 0.5;\n\t}\n\n\t.checkbox-input {\n\t\t/* Add if not using autoprefixer */\n\t\t-webkit-appearance: none;\n\t\tappearance: none;\n\t\t/* For iOS < 15 to remove gradient background */\n\t\tbackground-color: #fff;\n\t\t/* Not removed via appearance */\n\t\tmargin: 0;\n\t\tmargin-right: var(--spacing-4);\n\t\twidth: 1.8rem;\n\t\theight: 1.8rem;\n\t\tborder: 1px solid var(--color-surface);\n\t\tborder-radius: var(--radius-4) !important;\n\t\tcursor: pointer;\n\t\tdisplay: block;\n\t}\n\n\t.checkbox-input:focus {\n\t\toutline: none;\n\t\tborder: 1px solid var(--color-surface-plus-1);\n\t\tbox-shadow: none;\n\t}\n\n\t.checkbox-input.invalid,\n\t.checkbox-input:invalid {\n\t\tborder: 1px solid var(--color-on-error);\n\t}\n\n\t.icon {\n\t\tdisplay: none;\n\t\tcursor: pointer;\n\t}\n\n\t&.checked .icon {\n\t\tdisplay: block;\n\t\tposition: absolute;\n\t\tleft: -0.3rem;\n\n\t\t::part(stroke) {\n\t\t\tstroke: var(--color-primary);\n\t\t}\n\t}\n}\n","import { Component, Event, EventEmitter, Prop, h } from '@stencil/core';\n\n@Component({\n\ttag: 'got-checkbox',\n\tstyleUrl: 'got-checkbox.scss',\n\tscoped: true,\n})\nexport class GotCheckbox {\n\t/** The input name */\n\t@Prop() name: string;\n\t/** The input value */\n\t@Prop({ mutable: true }) checked: boolean = false;\n\t/** The invalid flag for displaying invalid state incase of custom validation */\n\t@Prop({ mutable: true }) invalid = false;\n\t/** Disabled */\n\t@Prop({ mutable: true }) disabled = false;\n\t/** The name of the event triggered when the checkbox value changes */\n\t@Event() changed: EventEmitter<any>;\n\n\thandleChange(event) {\n\t\tthis.checked = event.target.checked;\n\t\tthis.changed.emit(event);\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<label class={`label${this.checked ? ' checked' : ''}${this.disabled ? ' disabled' : ''}`}>\n\t\t\t\t<input\n\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\tname={this.name}\n\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\tchecked={this.checked}\n\t\t\t\t\tclass={`checkbox-input ${this.invalid ? 'invalid' : null}`}\n\t\t\t\t\tonChange={event => {\n\t\t\t\t\t\tthis.handleChange(event);\n\t\t\t\t\t}}\n\t\t\t\t/>\n\n\t\t\t\t<span class=\"icon\">\n\t\t\t\t\t<got-icon name=\"check\"></got-icon>\n\t\t\t\t</span>\n\n\t\t\t\t<slot></slot>\n\t\t\t</label>\n\t\t);\n\t}\n}\n",":host {\n\tposition: relative;\n}\n\n:host:after {\n\tposition: absolute !important;\n\tright: 1.6rem;\n\ttop: 50%;\n\ttransform: translateY(-50%);\n\tcontent: '';\n\twidth: 0;\n\theight: 0;\n\tborder-style: solid;\n\tborder-width: 0.4rem 0.35rem 0 0.35rem;\n\tborder-color: var(--color-on-background) transparent transparent transparent;\n\ttransition: transform cubic-bezier(0.075, 0.82, 0.165, 1) 0.3s;\n}\n\n.got-dropdown {\n\twidth: 100%;\n\tfont-family: var(--font-family-500);\n\tappearance: none;\n\tborder: 0.1rem solid var(--color-surface) !important;\n\tborder-radius: var(--radius-4) !important;\n\ttext-transform: capitalize;\n\tpadding: 1.3rem 3.3rem var(--spacing-16) var(--spacing-8) !important;\n\tdisplay: flex;\n\ttext-overflow: ellipsis;\n\toverflow: hidden !important;\n\tbackground: var(--color-background) !important;\n\tbox-shadow: none !important;\n\tcolor: var(--color-on-background) !important;\n\theight: unset !important;\n}\n\n.got-dropdown:focus {\n\toutline: none;\n\tborder: 0.1rem solid var(--color-surface-plus-1);\n\tbox-shadow: none !important;\n}\n\n.got-dropdown.small {\n\tpadding: 0.6rem 3.3rem 0.7rem var(--spacing-8) !important;\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\n\nexport type dropdownSize = 'small' | 'medium';\n\n@Component({\n\ttag: 'got-dropdown',\n\tstyleUrl: 'got-dropdown.scss',\n\tscoped: true,\n})\nexport class GotDropdown {\n\t/** The name of the select */\n\t@Prop() name: string;\n\t/** The name of the initial option */\n\t@Prop() label: string;\n\t/** The name of the initial option */\n\t@Prop() size: dropdownSize = 'medium';\n\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<select name={this.name} class={`got-dropdown ${this.size}`}>\n\t\t\t\t\t<option value=\"\">{this.label}</option>\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</select>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n","import arrowLeftIcon from '../../assets/icons/arrow-left.svg';\nimport arrowRightIcon from '../../assets/icons/arrow-right.svg';\nimport cartIcon from '../../assets/icons/cart.svg';\nimport checkCircleIcon from '../../assets/icons/check-circle.svg';\nimport checkIcon from '../../assets/icons/check.svg';\nimport chevronDownIcon from '../../assets/icons/chevron-down.svg';\nimport chevronLeftIcon from '../../assets/icons/chevron-left.svg';\nimport chevronRightIcon from '../../assets/icons/chevron-right.svg';\nimport chevronUpIcon from '../../assets/icons/chevron-up.svg';\nimport doubleArrowLeftIcon from '../../assets/icons/double-arrow-left.svg';\nimport doubleArrowRightIcon from '../../assets/icons/double-arrow-right.svg';\nimport emailIcon from '../../assets/icons/email.svg';\nimport externalLinkIcon from '../../assets/icons/external-link.svg';\nimport fullSizeIcon from '../../assets/icons/full-size.svg';\nimport mailIcon from '../../assets/icons/mail.svg';\nimport minusIcon from '../../assets/icons/minus.svg';\nimport pdfIcon from '../../assets/icons/pdf.svg';\nimport peopleIcon from '../../assets/icons/people.svg';\nimport pinIcon from '../../assets/icons/pin.svg';\nimport plusIcon from '../../assets/icons/plus.svg';\nimport ribbonIcon from '../../assets/icons/ribbon.svg';\nimport searchIcon from '../../assets/icons/search.svg';\nimport starIcon from '../../assets/icons/star.svg';\nimport truckIcon from '../../assets/icons/truck.svg';\nimport userIcon from '../../assets/icons/user.svg';\nimport heartIcon from '../../assets/icons/heart.svg';\nimport listIcon from '../../assets/icons/list.svg';\n\nexport const getIcon = (name: string) => {\n const icons = [\n { key: 'arrow-left', svg: arrowLeftIcon },\n { key: 'arrow-right', svg: arrowRightIcon },\n { key: 'cart', svg: cartIcon },\n { key: 'check-circle', svg: checkCircleIcon },\n { key: 'check', svg: checkIcon },\n { key: 'chevron-down', svg: chevronDownIcon },\n { key: 'chevron-left', svg: chevronLeftIcon },\n { key: 'chevron-right', svg: chevronRightIcon },\n { key: 'chevron-up', svg: chevronUpIcon },\n { key: 'double-arrow-left', svg: doubleArrowLeftIcon },\n { key: 'double-arrow-left', svg: doubleArrowRightIcon },\n { key: 'email', svg: emailIcon },\n { key: 'external-link', svg: externalLinkIcon },\n { key: 'full-size', svg: fullSizeIcon },\n { key: 'mail', svg: mailIcon },\n { key: 'minus', svg: minusIcon },\n { key: 'pdf', svg: pdfIcon },\n { key: 'people', svg: peopleIcon },\n { key: 'pin', svg: pinIcon },\n { key: 'plus', svg: plusIcon },\n { key: 'ribbon', svg: ribbonIcon },\n { key: 'search', svg: searchIcon },\n { key: 'star', svg: starIcon },\n { key: 'truck', svg: truckIcon },\n { key: 'user', svg: userIcon },\n { key: 'heart', svg: heartIcon },\n { key: 'list', svg: listIcon },\n ];\n\n const icon = icons.find(icon => icon.key === name);\n return icon?.svg ?? '';\n};\n",".svg-container {\n display: flex;\n}\n\n.small {\n svg {\n width: 1.6rem;\n height: 1.6rem;\n }\n}\n\n.medium {\n svg {\n width: 2.4rem;\n height: 2.4rem;\n }\n}\n\n.large {\n svg {\n width: 4.8rem;\n height: 4.8rem;\n }\n}\n","import { Component, Prop, h } from '@stencil/core';\nimport { getIcon } from './getIcon';\n\nexport type IconSize = 'small' | 'medium' | 'large';\nexport type IconName =\n | 'arrow-left'\n | 'arrow-right'\n | 'cart'\n | 'check-circle'\n | 'check'\n | 'chevron-down'\n | 'chevron-left'\n | 'chevron-right'\n | 'chevron-up'\n | 'double-arrow-left'\n | 'double-arrow-right'\n | 'email'\n | 'external-link'\n | 'full-size'\n | 'mail'\n | 'minus'\n | 'pdf'\n | 'people'\n | 'pin'\n | 'plus'\n | 'ribbon'\n | 'search'\n | 'star'\n | 'truck'\n | 'user'\n | 'heart'\n | 'list';\n\n@Component({\n tag: 'got-icon',\n styleUrl: 'got-icon.scss',\n shadow: true,\n})\nexport class GotIcon {\n /** The size to display */\n @Prop() size: IconSize = 'medium';\n /** The name of the icon to display */\n @Prop() name: IconName;\n\n render() {\n return <div class={`svg-container ${this.size}`} innerHTML={getIcon(this.name)} />;\n }\n}\n",".info-status {\n font-family: var(--font-family-700);\n border-radius: var(--radius-round);\n color: var(--color-on-primary);\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.large {\n font-size: var(--font-size-14);\n width: 3.2rem;\n height: 3.2rem;\n}\n\n.small {\n font-size: var(--font-size-12);\n width: 2.4rem;\n height: 2.4rem;\n}\n\n.blue {\n background-color: var(--color-primary);\n}\n\n.green {\n background-color: var(--color-on-success);\n}\n\n.yellow {\n background-color: var(--color-on-warning);\n}\n\n.red {\n background-color: var(--color-on-error);\n}\n\n.grey {\n background-color: var(--color-surface);\n color: var(--color-on-background);\n}\n","import { Component, Prop, h } from '@stencil/core';\n\nexport type InfoStatusColor = 'blue' | 'green' | 'yellow' | 'red' | 'grey';\nexport type InfoStatusSize = 'large' | 'small';\n\n@Component({\n tag: 'got-info-status',\n styleUrl: 'got-info-status.scss',\n shadow: true,\n})\nexport class GotInfoStatus {\n /** The color to display */\n @Prop() color: InfoStatusColor = 'blue';\n /** The size to display */\n @Prop() size: InfoStatusSize = 'small';\n\n render() {\n return (\n <div class={`info-status ${this.color} ${this.size}`}>\n <slot></slot>\n </div>\n );\n }\n}\n","@import 'src/styles/font.scss';\n\nlabel {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: var(--spacing-8);\n\ttext-transform: capitalize;\n\tfont-family: var(--font-family-500);\n\tfont-size: var(--font-size-16);\n\tposition: relative;\n}\n\ndiv {\n\tdisplay: flex;\n}\n\ninput {\n\tfont-family: var(--font-family-600);\n\tfont-size: var(--font-size-16);\n\tpadding: 1.3rem var(--spacing-16);\n\tbox-shadow: var(--decline-1);\n\tborder: 0.1rem solid var(--color-surface);\n\tborder-radius: var(--radius-4);\n\tcolor: var(--color-on-background);\n\twidth: 100%;\n\ttext-align: center;\n}\n\ninput:focus {\n\toutline: none;\n\tborder: 0.1rem solid var(--color-surface-plus-1);\n}\n\ninput[type='number'] {\n\tappearance: textfield;\n}\n\ninput[type='number']::-webkit-inner-spin-button,\ninput[type='number']::-webkit-outer-spin-button {\n\t-webkit-appearance: none;\n}\n\ninput.invalid,\ninput:invalid {\n\tborder: 0.1rem solid var(--color-on-error);\n}\n\nbutton {\n\tbackground: none;\n\tborder: 0.1rem solid transparent;\n\toutline: none;\n\tpadding: 1.1rem;\n\tcursor: pointer;\n}\n\nbutton:first-of-type {\n\tposition: absolute;\n\tleft: 0;\n\tbottom: 0;\n}\n\nbutton:last-of-type {\n\tposition: absolute;\n\tright: 0;\n\tbottom: 0;\n}\n\nbutton:focus-visible {\n\tborder: 0.1rem solid var(--color-surface-plus-1);\n\tborder-radius: var(--radius-4);\n}\n\nbutton:disabled {\n\tcursor: not-allowed;\n\topacity: 0.5;\n}\n\n::part(fill) {\n\tfill: var(--color-primary);\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n\ttag: 'got-input-number',\n\tstyleUrl: 'got-input-number.scss',\n\tscoped: true,\n})\nexport class GotInputNumber {\n\t/** The input name */\n\t@Prop() name: string;\n\t/** The input value */\n\t@Prop({ mutable: true }) value!: string;\n\t/** The input label */\n\t@Prop() label: string;\n\t/** The min value */\n\t@Prop() min: string;\n\t/** The max value */\n\t@Prop() max: string;\n\t/** The step value */\n\t@Prop() step: string;\n\t/** The invalid flag for displaying invalid state incase of custom validation */\n\t@Prop({ mutable: true }) invalid = false;\n\n\tupdateValue(type: 'decrement' | 'increment') {\n\t\tconst amount = this.step ? parseInt(this.step) : 1;\n\n\t\tif (type === 'decrement') {\n\t\t\tthis.value = (parseInt(this.value) - amount).toString();\n\t\t} else {\n\t\t\tthis.value = (parseInt(this.value) + amount).toString();\n\t\t}\n\t}\n\n\thandleBlur() {\n\t\t// Check if there is a step and if it's divisible by the step\n\t\t// Correct the entered value if it does not match the step value\n\t\tif (this.step && parseInt(this.value) % parseInt(this.step) !== 0) {\n\t\t\tthis.value = (\n\t\t\t\tMath.ceil(parseInt(this.value) / parseInt(this.step)) * parseInt(this.step)\n\t\t\t).toString();\n\t\t}\n\n\t\t// Correct value if to max if entered value is greater than max\n\t\tif (parseInt(this.value) > parseInt(this.max)) {\n\t\t\tthis.value = this.max;\n\t\t}\n\n\t\t// Correct value if to min if entered value is less than min\n\t\tif (parseInt(this.value) < parseInt(this.min)) {\n\t\t\tthis.value = this.min;\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<label>\n\t\t\t\t{this.label}\n\t\t\t\t<div>\n\t\t\t\t\t<button\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tonClick={() => this.updateValue('decrement')}\n\t\t\t\t\t\tdisabled={this.value === this.min}\n\t\t\t\t\t>\n\t\t\t\t\t\t<got-icon name=\"minus\"></got-icon>\n\t\t\t\t\t</button>\n\t\t\t\t\t<input\n\t\t\t\t\t\tname={this.name}\n\t\t\t\t\t\ttype=\"number\"\n\t\t\t\t\t\tmin={this.min}\n\t\t\t\t\t\tmax={this.max}\n\t\t\t\t\t\tstep={this.step}\n\t\t\t\t\t\tvalue={this.value}\n\t\t\t\t\t\tclass={`${this.invalid ? 'invalid' : null}`}\n\t\t\t\t\t\tonInput={(event: any) => (this.value = event.target.value)}\n\t\t\t\t\t\tonBlur={() => this.handleBlur()}\n\t\t\t\t\t/>\n\t\t\t\t\t<button\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tonClick={() => this.updateValue('increment')}\n\t\t\t\t\t\tdisabled={this.value === this.max}\n\t\t\t\t\t>\n\t\t\t\t\t\t<got-icon name=\"plus\"></got-icon>\n\t\t\t\t\t</button>\n\t\t\t\t</div>\n\t\t\t</label>\n\t\t);\n\t}\n}\n","@import 'src/styles/font.scss';\n\nlabel {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-8);\n text-transform: capitalize;\n font-family: var(--font-family-500);\n font-size: var(--font-size-16);\n}\n\ndiv {\n display: flex;\n}\n\ninput {\n @include font-body-large;\n padding: 1.3rem var(--spacing-16) var(--spacing-16);\n box-shadow: var(--decline-1);\n border: 0.1rem solid var(--color-surface);\n border-radius: var(--radius-4);\n color: var(--color-on-background);\n width: 100%;\n}\n\ninput::placeholder {\n color: var(--color-surface-plus-1);\n text-transform: capitalize;\n}\n\ninput:focus {\n outline: none;\n border: 0.1rem solid var(--color-surface-plus-1);\n}\n\ninput.invalid,\ninput:invalid {\n border: 0.1rem solid var(--color-on-error);\n}\n\n.with-button {\n border-radius: var(--radius-4) 0 0 var(--radius-4);\n}\n\n.small {\n padding: 0.6rem var(--spacing-16) 0.7rem;\n}\n\nbutton {\n font-family: var(--font-family-500);\n font-size: var(--font-size-14);\n text-transform: capitalize;\n background-color: var(--color-primary);\n color: var(--color-on-primary);\n outline: none;\n border: 0.1rem solid var(--color-primary);\n border-radius: 0 var(--radius-4) var(--radius-4) 0;\n padding: 0 var(--spacing-16);\n display: flex;\n gap: var(--spacing-8);\n align-items: center;\n cursor: pointer;\n}\n\nbutton:focus-visible {\n border: 0.1rem solid var(--color-on-background);\n}\n","import { Component, Event, EventEmitter, Prop, h } from '@stencil/core';\nimport { IconName } from '../got-icon/got-icon';\n\nexport type inputType = 'text' | 'password' | 'email';\nexport type inputSize = 'small' | 'medium';\n\n@Component({\n tag: 'got-input-text',\n styleUrl: 'got-input-text.scss',\n scoped: true,\n})\nexport class GotInputText {\n /** The input name */\n @Prop() name: string;\n /** The input value */\n @Prop({ mutable: true }) value: string = '';\n /** The size of the input */\n @Prop() size: inputSize = 'medium';\n /** The text of the placeholder */\n @Prop() placeholder: string;\n /** The name of the button icon (for the button variant with icon) */\n @Prop() icon: IconName;\n /** The label of the button (for the button variant with label) */\n @Prop() buttonLabel: string;\n /** The name of the label */\n @Prop() label: string;\n /** The invalid flag for displaying invalid state incase of custom validation */\n @Prop({ mutable: true }) invalid = false;\n /** The name of the click event */\n @Event() buttonClicked: EventEmitter<MouseEvent>;\n\n handleClick(e: MouseEvent) {\n this.buttonClicked.emit(e);\n }\n\n render() {\n return (\n <label>\n {this.label}\n <div>\n <input\n name={this.name}\n type=\"text\"\n placeholder={this.placeholder}\n value={this.value}\n class={`${this.icon || this.buttonLabel ? 'with-button' : null} ${this.size} ${this.invalid ? 'invalid' : null}`}\n />\n {this.buttonLabel || this.icon ? (\n <button\n class=\"text-button\"\n type=\"submit\"\n onClick={e => {\n this.handleClick(e);\n }}\n >\n {this.buttonLabel}\n {this.icon ? <got-icon name={this.icon} size={this.size}></got-icon> : null}\n </button>\n ) : null}\n </div>\n </label>\n );\n }\n}\n","@import 'src/styles/font.scss';\n\n.label {\n\t@include font-body-medium;\n\tcolor: var(--color-on-background);\n\tfont-weight: 500;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: var(--spacing-8);\n\tposition: relative;\n\tcursor: pointer;\n\n\t&.disabled {\n\t\tcursor: not-allowed;\n\t\topacity: 0.5;\n\t}\n\n\tinput {\n\t\tposition: relative;\n\t\t/* Add if not using autoprefixer */\n\t\t-webkit-appearance: none;\n\t\tappearance: none;\n\t\t/* For iOS < 15 to remove gradient background */\n\t\tbackground-color: #fff;\n\t\t/* Not removed via appearance */\n\t\tmargin: 0;\n\t\twidth: 1.8rem;\n\t\theight: 1.8rem;\n\t\tborder: 1px solid var(--color-surface);\n\t\tborder-radius: var(--radius-round) !important;\n\t\tcursor: pointer;\n\t}\n\n\tinput:focus {\n\t\toutline: none;\n\t\tborder: 1px solid var(--color-surface-plus-1);\n\t}\n\n\tinput.invalid,\n\tinput:invalid {\n\t\tborder: 1px solid var(--color-on-error);\n\t}\n\n\t.icon {\n\t\tdisplay: none;\n\t\tcursor: pointer;\n\t}\n\n\tinput:checked::after {\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\ttop: 50%;\n\t\tleft: 50%;\n\t\ttransform: translate(-50%, -50%);\n\t\twidth: 1.2rem;\n\t\theight: 1.2rem;\n\t\tborder-radius: var(--radius-round);\n\t\tbackground-color: var(--color-primary);\n\t}\n}\n","import { Component, Event, EventEmitter, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'got-radio',\n styleUrl: 'got-radio.scss',\n scoped: true,\n})\nexport class GotRadio {\n /** The input name */\n @Prop() name: string;\n /** The input value */\n @Prop() value: string;\n /** The checked flag */\n @Prop({ mutable: true }) checked: boolean = false;\n /** The invalid flag for displaying invalid state incase of custom validation */\n @Prop() invalid = false;\n /** Disabled */\n @Prop() disabled = false;\n /** The name of the event triggered when the radio value changes */\n @Event() changed: EventEmitter<any>;\n\n handleChange(event) {\n this.checked = event.target.checked;\n this.changed.emit(event);\n }\n\n render() {\n return (\n <label class={`label ${this.disabled ? ' disabled' : ''}`}>\n <input\n disabled={this.disabled}\n name={this.name}\n value={this.value}\n type=\"radio\"\n checked={this.checked}\n class={this.invalid ? 'invalid' : null}\n onChange={event => {\n this.handleChange(event);\n }}\n />\n <slot></slot>\n </label>\n );\n }\n}\n",".slider {\n position: relative;\n display: flex;\n flex-direction: column;\n justify-content: space-evenly;\n width: 100%;\n}\n\n.slider-values {\n font-family: var(--font-family-400);\n font-size: var(--font-size-10);\n color: var(--color-primary);\n display: flex;\n justify-content: space-between;\n}\n\n.slider-container {\n display: flex;\n align-items: center;\n height: 1.875rem;\n width: 100%;\n}\n\n.slider-rail {\n background: var(--color-silver-grey);\n position: absolute;\n width: 100%;\n height: 0.2rem;\n}\n\ninput[type='range'] {\n position: absolute;\n width: 100%;\n appearance: none;\n border-radius: 0.25rem;\n background: transparent;\n pointer-events: none;\n\n &::-webkit-slider-thumb {\n height: 2rem;\n width: 2rem;\n border-radius: 100%;\n background-color: var(--color-background);\n border: 0.2rem solid var(--color-primary);\n position: relative;\n cursor: pointer;\n appearance: none;\n pointer-events: all;\n }\n\n &::-moz-range-thumb {\n height: 2rem;\n width: 2rem;\n border-radius: 100%;\n border: none;\n background-color: var(--color-background);\n border: 0.2rem solid var(--color-primary);\n position: relative;\n cursor: pointer;\n appearance: none;\n pointer-events: all;\n }\n}\n","import { Component, Event, EventEmitter, Prop, State, h } from '@stencil/core';\n\n@Component({\n tag: 'got-range-slider',\n styleUrl: 'got-range-slider.scss',\n scoped: true,\n})\nexport class GotRangeSlider {\n /** The input name for the lower value */\n @Prop() lowerName: string;\n /** The input name for the upper value */\n @Prop() upperName: string;\n /** The input minimum value */\n @Prop() min: string;\n /** The input maximum value */\n @Prop() max: string;\n /** The lower value */\n @Prop({ mutable: true }) lowerValue: number;\n /** The upper value */\n @Prop({ mutable: true }) upperValue: number;\n /** The value unit */\n @Prop() unit: string;\n /** The name of the event triggered when any value changes */\n @Event() changed: EventEmitter<any>;\n\n @State() railColor: string = '#f5f5f5';\n private lowerSlider: HTMLInputElement;\n private upperSlider: HTMLInputElement;\n\n componentDidLoad() {\n this.setRailColor();\n }\n\n setRailColor() {\n let sectionOne = ((parseInt(this.lowerSlider?.value) - parseInt(this.min)) * 100) / (parseInt(this.max) - parseInt(this.min));\n let sectionTwo = ((parseInt(this.upperSlider?.value) - parseInt(this.min)) * 100) / (parseInt(this.max) - parseInt(this.min));\n\n this.railColor = `linear-gradient(to right, #8D9093 ${sectionOne}% , #005FBE ${sectionOne}% , #005FBE ${sectionTwo}%, #8D9093 ${sectionTwo}%)`;\n }\n\n onLowerSliderChange(event) {\n const lowerValue = parseInt(this.lowerSlider?.value);\n const upperValue = parseInt(this.upperSlider?.value);\n\n this.lowerSlider.value = Math.min(lowerValue, upperValue).toString();\n this.lowerValue = Math.min(lowerValue, upperValue);\n this.setRailColor();\n this.changed.emit(event);\n }\n\n onUpperSliderChange(event) {\n const lowerValue = parseInt(this.lowerSlider?.value);\n const upperValue = parseInt(this.upperSlider?.value);\n\n this.upperSlider.value = Math.max(lowerValue, upperValue).toString();\n this.upperValue = Math.max(lowerValue, upperValue);\n this.setRailColor();\n this.changed.emit(event);\n }\n\n render() {\n return (\n <div class=\"slider\">\n <div class=\"slider-values\">\n <span>\n {this.lowerValue} {this.unit}\n </span>\n <span>\n {this.upperValue} {this.unit}\n </span>\n </div>\n <div class=\"slider-container\">\n <div class=\"slider-rail\" style={{ background: this.railColor }}></div>\n <input\n name={this.lowerName}\n type=\"range\"\n aria-label=\"Change minimum range value\"\n step=\"1\"\n onInput={event => {\n this.onLowerSliderChange(event);\n }}\n min={this.min}\n max={this.max}\n value={this.lowerValue}\n id=\"lower\"\n ref={el => (this.lowerSlider = el as HTMLInputElement)}\n />\n <input\n name={this.upperName}\n type=\"range\"\n aria-label=\"Change maximum range value\"\n step=\"1\"\n onInput={event => {\n this.onUpperSliderChange(event);\n }}\n min={this.min}\n max={this.max}\n value={this.upperValue}\n id=\"upper\"\n ref={el => (this.upperSlider = el as HTMLInputElement)}\n />\n </div>\n </div>\n );\n }\n}\n","@import 'src/styles/font.scss';\n@import 'src/styles/breakpoints.scss';\n\n.button {\n @include font-body-medium;\n display: flex;\n align-items: center;\n gap: var(--spacing-8);\n border: none;\n color: var(--color-on-background);\n background-color: var(--color-tertiary);\n cursor: pointer;\n padding: var(--spacing-10) var(--spacing-16);\n\n &:hover {\n background-color: var(--color-tertiary-button-hover);\n }\n\n &.primary .icon {\n ::part(stroke) {\n stroke: var(--color-primary);\n }\n\n ::part(fill) {\n fill: var(--color-primary);\n }\n }\n\n &.success .icon {\n ::part(stroke) {\n stroke: var(--color-on-success);\n }\n\n ::part(fill) {\n fill: var(--color-on-success);\n }\n }\n\n .chevron {\n ::part(stroke) {\n stroke: var(--color-on-background);\n }\n }\n\n .label,\n strong {\n display: none;\n }\n\n @media (min-width: $bp-md) {\n .label,\n strong {\n display: inline;\n }\n }\n}\n","import { Component, Event, EventEmitter, Prop, h } from '@stencil/core';\nimport { IconName } from '../got-icon/got-icon';\n\nexport type ShopButtonVariant = 'primary' | 'success';\n\n@Component({\n tag: 'got-shop-button',\n styleUrl: 'got-shop-button.scss',\n scoped: true,\n})\nexport class GothesShopButton {\n /** The icon to display */\n @Prop() icon: IconName;\n /** Bold label applied after the button text (hidden on smaller screens. E.g. 125,19 SEK) */\n @Prop() label: string;\n /** Badge displaying a number */\n @Prop() badge: number = -1;\n /** Controls colors of the icon and badge */\n @Prop() variant: ShopButtonVariant = 'primary';\n /** The name of the click event */\n @Event() buttonClicked: EventEmitter<MouseEvent>;\n\n handleClick(e: MouseEvent) {\n this.buttonClicked.emit(e);\n }\n\n render() {\n return (\n <button\n class={`button ${this.variant}`}\n type=\"button\"\n onClick={e => {\n this.handleClick(e);\n }}\n >\n {this.icon ? (\n <span class=\"icon\">\n <got-icon name={this.icon}></got-icon>\n </span>\n ) : null}\n\n <span class=\"label\">\n <slot></slot>\n </span>\n\n <strong>{this.label}</strong>\n\n {this.badge > -1 ? (\n <got-info-status color={this.variant === 'primary' ? 'blue' : 'green'} size=\"small\">\n {this.badge}\n </got-info-status>\n ) : null}\n\n <span class=\"chevron\">\n <got-icon name=\"chevron-down\"></got-icon>\n </span>\n </button>\n );\n }\n}\n",".tab {\n display: flex;\n align-items: center;\n padding: 0 var(--spacing-16);\n height: 4.8rem;\n background-color: var(--color-background);\n font-family: var(--font-family-500);\n font-size: var(--font-size-14);\n color: var(--color-on-background-05);\n text-decoration: none;\n border: 1px solid var(--color-background);\n}\n\n.tab:hover {\n border: 1px solid var(--color-surface);\n background-color: var(--color-surface);\n}\n\n.tab.active {\n border: 1px solid var(--color-surface-plus-1);\n border-bottom: 0;\n color: var(--color-on-background);\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'got-tab',\n styleUrl: 'got-tab.scss',\n shadow: true,\n})\nexport class GotTab {\n /** The url to link to */\n @Prop() href: string;\n /** The flag to display the tab as active */\n @Prop() active = false;\n\n render() {\n return (\n <a class={{ active: this.active, tab: true }} href={this.href}>\n <slot></slot>\n </a>\n );\n }\n}\n","@import 'src/styles/font';\n\n:host {\n overflow: auto;\n display: flex;\n flex-direction: column;\n}\n\ntable {\n width: 100%;\n border-collapse: collapse;\n border: 0.2rem solid var(--color-surface);\n table-layout: auto;\n white-space: nowrap;\n}\n","import { Component, Host, h } from '@stencil/core';\n\n/**\n * A wrapper to use with got-table-head and got-table-body\n */\n\n@Component({\n tag: 'got-table',\n styleUrl: 'got-table.scss',\n shadow: true,\n})\nexport class GotTable {\n render() {\n return (\n <Host class=\"table\">\n <table>\n <slot></slot>\n </table>\n </Host>\n );\n }\n}\n",":host {\n display: contents;\n}\n","import { Component, h } from '@stencil/core';\n\n/**\n * A wrapper to use with got-table-row\n */\n\n@Component({\n tag: 'got-table-body',\n styleUrl: 'got-table-body.scss',\n shadow: true,\n})\nexport class GotTableBody {\n render() {\n return (\n <tbody>\n <slot></slot>\n </tbody>\n );\n }\n}\n","@import 'src/styles/font';\n\n:host {\n display: contents;\n}\n\ntd {\n @include font-body-medium;\n border: 0.2rem solid var(--color-surface);\n padding: var(--spacing-20) var(--spacing-12);\n vertical-align: middle;\n\n &.extended {\n background-color: var(--color-primary-variant-2);\n @include font-label-normal;\n }\n}\n\n::slotted(a),\n::slotted(a:visited) {\n color: var(--color-primary);\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'got-table-cell',\n styleUrl: 'got-table-cell.scss',\n shadow: true,\n})\nexport class GotTableCell {\n /** The number for how many columns the cell extends */\n @Prop() colspan?: HTMLTableCellElement['colSpan'];\n\n render() {\n return (\n <td class={this.colspan ? 'extended' : null} colSpan={this.colspan}>\n <slot></slot>\n </td>\n );\n }\n}\n",":host {\n display: contents;\n}\n","import { Component, h } from '@stencil/core';\n\n/**\n * A wrapper to use with got-table-row\n */\n\n@Component({\n tag: 'got-table-head',\n styleUrl: 'got-table-head.scss',\n shadow: true,\n})\nexport class GotTableHead {\n render() {\n return (\n <thead>\n <slot></slot>\n </thead>\n );\n }\n}\n","@import 'src/styles/font';\n\n:host {\n display: contents;\n}\n\nth {\n @include font-label-uppercase;\n text-align: left;\n background-color: var(--color-primary-variant-2);\n border: 0.2rem solid var(--color-surface);\n padding: var(--spacing-20) var(--spacing-12);\n vertical-align: middle;\n}\n","import { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'got-table-header',\n styleUrl: 'got-table-header.scss',\n shadow: true,\n})\nexport class GotTableHeader {\n render() {\n return (\n <th>\n <slot></slot>\n </th>\n );\n }\n}\n",":host {\n display: contents;\n}\n","import { Component, h } from '@stencil/core';\n\n/**\n * A wrapper to use with got-table-header and got-table-cell\n */\n\n@Component({\n tag: 'got-table-row',\n styleUrl: 'got-table-row.scss',\n shadow: true,\n})\nexport class GotTableRow {\n render() {\n return (\n <tr>\n <slot></slot>\n </tr>\n );\n }\n}\n","@import 'src/styles/breakpoints.scss';\n\n.wrapper {\n display: none;\n}\n\n@media (min-width: $bp-md) {\n .wrapper {\n display: flex;\n gap: var(--spacing-2);\n background-color: var(--color-background);\n }\n}\n","import { Component, h } from '@stencil/core';\n\n/**\n * The wrapper to use with got-tab\n */\n\n@Component({\n tag: 'got-tabs',\n styleUrl: 'got-tabs.scss',\n shadow: true,\n})\nexport class GotTabs {\n render() {\n return (\n <div class=\"wrapper\">\n <slot></slot>\n </div>\n );\n }\n}\n"],"mappings":"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"}