{"version":3,"names":["pnlShipmentSearchCss","PnlShipmentSearch","async","this","setLanguage","translationService","language","localeLanguage","locale","substring","toLowerCase","availableLanguages","includes","DEFAULT_LANGUAGE","configuration","GetConfiguration","baseUrl","TranslationService","languageFileLocation","translations$","subscribe","translations","render","h","class","showHeader","title","isStacked","defaultCountryCode","trackAndTraceUrl"],"sources":["./src/components/pnl-shipment-search/pnl-shipment-search.scss?tag=pnl-shipment-search&encapsulation=shadow","./src/components/pnl-shipment-search/pnl-shipment-search.tsx"],"sourcesContent":["@import '../../assets/styles/variables';\n@import '../../assets/styles/typography';\n@import '../../../node_modules/@design-system/css/src/components/button/button.css';\n\n:host(*) {\n    all: initial;\n    font-family: $font-family-bodytext;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n    font-feature-settings: 'ss03' on, 'ss01' on;\n    font-size: 16px;\n    box-sizing: border-box !important;\n}\n\n.pnl-shipment-search {\n    display: flex;\n    flex-direction: column;\n    max-width: 57.125em;\n\n    @media (max-width: $bp-nav) {\n        max-width: 21.375em;\n    }\n\n    h1 {\n        margin-bottom: 1rem;\n        color: $color-heading-default;\n        font-family: $font-family-title;\n        font-synthesis: none;\n        font-weight: 700;\n        font-size: 2rem;\n        line-height: 1.111;\n        text-align: left;\n        display: block;\n    }\n}\n","import { Component, h, Prop, State, Watch } from '@stencil/core';\nimport { DEFAULT_LANGUAGE, ITranslationService, TranslationService } from '../../helpers/translation';\nimport { ShipmentSearchConfiguration } from './models/configuration.model';\nimport { GetConfiguration } from './track-and-trace-service';\n\n@Component({\n  tag: 'pnl-shipment-search',\n  styleUrl: 'pnl-shipment-search.scss',\n  shadow: true,\n})\nexport class PnlShipmentSearch {\n  private translationService: ITranslationService;\n\n  @State() language: string;\n  @State() availableLanguages: string[] = ['nl', 'en', 'fr']\n  @State() configuration: ShipmentSearchConfiguration;\n  @State() translations: any = {};\n\n  /**\n   * The locale (required) to show the shipment search widget in (en_GB, nl_NL, nl_BE and fr_BE). Default is nl_NL.\n  */\n  @Prop() locale: string = 'nl_NL';\n\n  /**\n   * BaseUrl(required) for the used backend service of the shipment search widget.\n   * With this uri you can connect the widget with the different enviroments\n   * Current FAT (Test) enviroment https://jouw.fat.postnl.nl/track-and-trace.\n   * Current PAT (Acceptance) enviroment https://jouw.pat.postnl.nl/track-and-trace.\n   * Current Production enviroment https://jouw.postnl.nl/track-and-trace.\n   */\n  @Prop() baseUrl: string;\n\n  /**\n   * Set to true if the header should be shown. Default is false.\n  */\n  @Prop() showHeader: boolean = false;\n\n  /** Make it possible to stack the form fields */\n  @Prop() isStacked: boolean = false;\n\n  @Watch('locale')\n  async reloadTranslations() {\n    this.setLanguage();\n    this.translationService.setLanguage(this.language);\n  }\n\n  private setLanguage() {\n    var localeLanguage = this.locale.substring(0, 2).toLowerCase();\n    this.language = this.availableLanguages.includes(localeLanguage) ? localeLanguage : DEFAULT_LANGUAGE;\n  }\n\n  async componentWillLoad() {\n    this.configuration = await GetConfiguration(this.baseUrl);\n    //Set language\n    this.setLanguage();\n\n    //Initialize translation service\n    this.translationService = TranslationService('shipment', this.language, this.configuration.languageFileLocation);\n\n    //Get translations\n    this.translationService.translations$.subscribe((translations) => {\n      this.translations = translations;\n    });\n  }\n\n  render() {\n    return (\n      <div class=\"pnl-shipment-search\">\n        {!!this.translations && this.showHeader && <h1>{this.translations.title}</h1>}\n        <div>\n          <pnl-shipment-input\n            isStacked={this.isStacked}\n            language={this.language}\n            baseUrl={this.baseUrl}\n            defaultCountryCode={this.configuration.defaultCountryCode}\n            trackAndTraceUrl={this.configuration.trackAndTraceUrl}\n          ></pnl-shipment-input>\n        </div>\n      </div>\n    );\n  }\n}\n"],"mappings":"kJAAA,MAAMA,EAAuB,stN,MCUhBC,EAAiB,M,yEAIY,CAAC,KAAM,KAAM,M,+CAExB,G,YAKJ,Q,uCAcK,M,eAGD,K,CAG7BC,2BACEC,KAAKC,cACLD,KAAKE,mBAAmBD,YAAYD,KAAKG,S,CAGnCF,cACN,IAAIG,EAAiBJ,KAAKK,OAAOC,UAAU,EAAG,GAAGC,cACjDP,KAAKG,SAAWH,KAAKQ,mBAAmBC,SAASL,GAAkBA,EAAiBM,C,CAGtFX,0BACEC,KAAKW,oBAAsBC,EAAiBZ,KAAKa,SAEjDb,KAAKC,cAGLD,KAAKE,mBAAqBY,EAAmB,WAAYd,KAAKG,SAAUH,KAAKW,cAAcI,sBAG3Ff,KAAKE,mBAAmBc,cAAcC,WAAWC,IAC/ClB,KAAKkB,aAAeA,CAAY,G,CAIpCC,SACE,OACEC,EAAA,OAAKC,MAAM,yBACNrB,KAAKkB,cAAgBlB,KAAKsB,YAAcF,EAAA,UAAKpB,KAAKkB,aAAaK,OAClEH,EAAA,WACEA,EAAA,sBACEI,UAAWxB,KAAKwB,UAChBrB,SAAUH,KAAKG,SACfU,QAASb,KAAKa,QACdY,mBAAoBzB,KAAKW,cAAcc,mBACvCC,iBAAkB1B,KAAKW,cAAce,oB"}