https://www.bmn.nl/45.273506a479d04b1c7de0.js

1/*!
2 * @version 3ea9a483c
3 * 
4 */
5(window.webpackJsonp=window.webpackJsonp||[]).push([[45],{rBiN:function(n,e,t){"use strict"
6t.r(e)
7var i=t("q1tI"),o=t.n(i)
8var r=function(){return(r=Object.assign||function __assign(n){for(var e,t=1,i=arguments.length;t<i;t++)for(var o in e=arguments[t])Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o])
9return n}).apply(this,arguments)}
10function __rest(n,e){var t={}
11for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&e.indexOf(i)<0&&(t[i]=n[i])
12if(null!=n&&"function"==typeof Object.getOwnPropertySymbols){var o=0
13for(i=Object.getOwnPropertySymbols(n);o<i.length;o++)e.indexOf(i[o])<0&&Object.prototype.propertyIsEnumerable.call(n,i[o])&&(t[i[o]]=n[i[o]])}return t}function __awaiter(n,e,t,i){return new(t||(t=Promise))(function(o,r){function fulfilled(n){try{step(i.next(n))}catch(n){r(n)}}function rejected(n){try{step(i.throw(n))}catch(n){r(n)}}function step(n){n.done?o(n.value):function adopt(n){return n instanceof t?n:new t(function(e){e(n)})}(n.value).then(fulfilled,rejected)}step((i=i.apply(n,e||[])).next())})}function __generator(n,e){var t,i,o,r={label:0,sent:function(){if(1&o[0])throw o[1]
14return o[1]},trys:[],ops:[]},a=Object.create(("function"==typeof Iterator?Iterator:Object).prototype)
15return a.next=verb(0),a.throw=verb(1),a.return=verb(2),"function"==typeof Symbol&&(a[Symbol.iterator]=function(){return this}),a
16function verb(s){return function(c){return function step(s){if(t)throw new TypeError("Generator is already executing.")
17for(;a&&(a=0,s[0]&&(r=0)),r;)try{if(t=1,i&&(o=2&s[0]?i.return:s[0]?i.throw||((o=i.return)&&o.call(i),0):i.next)&&!(o=o.call(i,s[1])).done)return o
18switch(i=0,o&&(s=[2&s[0],o.value]),s[0]){case 0:case 1:o=s
19break
20case 4:return r.label++,{value:s[1],done:!1}
21case 5:r.label++,i=s[1],s=[0]
22continue
23case 7:s=r.ops.pop(),r.trys.pop()
24continue
25default:if(!(o=(o=r.trys).length>0&&o[o.length-1])&&(6===s[0]||2===s[0])){r=0
26continue}if(3===s[0]&&(!o||s[1]>o[0]&&s[1]<o[3])){r.label=s[1]
27break}if(6===s[0]&&r.label<o[1]){r.label=o[1],o=s
28break}if(o&&r.label<o[2]){r.label=o[2],r.ops.push(s)
29break}o[2]&&r.ops.pop(),r.trys.pop()
30continue}s=e.call(n,r)}catch(n){s=[6,n],i=0}finally{t=o=0}if(5&s[0])throw s[1]
31return{value:s[0]?s[1]:void 0,done:!0}}([s,c])}}}Object.create
32function __spreadArray(n,e,t){if(t||2===arguments.length)for(var i,o=0,r=e.length;o<r;o++)!i&&o in e||(i||(i=Array.prototype.slice.call(e,0,o)),i[o]=e[o])
33return n.concat(i||Array.prototype.slice.call(e))}Object.create
34"function"==typeof SuppressedError&&SuppressedError
35var a=function(n,e){for(var t=[],i=2;i<arguments.length;i++)t[i-2]=arguments[i]
36return __awaiter(void 0,__spreadArray([n,e],t,!0),void 0,function(n,e,t){var i,o
37return void 0===t&&(t="error"),__generator(this,function(r){switch(r.label){case 0:return[4,new Promise(function(r,a){i=r,o=a,n.addEventListener(e,i),n.addEventListener(t,o)}).finally(function(){n.removeEventListener(e,i),n.removeEventListener(t,o)})]
38case 1:return[2,r.sent()]}})})},s=function(n){return __awaiter(void 0,void 0,void 0,function(){return __generator(this,function(e){switch(e.label){case 0:return[4,new Promise(function(e){return setTimeout(e,n)})]
39case 1:return e.sent(),[2]}})})},c=[]
40function set(n){setTimeout(function(){c.forEach(function(e){e(n)})})}function useStreamState(){var n=Object(i.useState)(),e=n[0],t=n[1]
41return Object(i.useEffect)(function(){var n=c.push(t)
42return function(){c.splice(n,1)}},[]),[e,set]}var l={width:{min:640,ideal:1280},height:{min:480,ideal:720},facingMode:{ideal:"environment"},advanced:[{width:1920,height:1280},{aspectRatio:1.333}]}
43var A={delay:1e3,formats:["qr_code"]}
44var f=t("nKUr"),u=function(n){var e=n.options,t=n.onCapture,o=n.trackConstraints,c=__rest(n,["options","onCapture","trackConstraints"]),u=Object(i.useRef)(null),h=function useCamera(n,e){var t=this,o=Object(i.useState)(!1),r=o[0],c=o[1],A=useStreamState()[1]
45Object(i.useEffect)(function(){if(!window.isSecureContext)throw new Error("[react-barcode-scanner]: \n        Browser ask for secure origin (such as https) when use getUserMedia,\n        reference: https://sites.google.com/a/chromium.org/dev/Home/chromium-security/deprecating-powerful-features-on-insecure-origins\n      ")},[])
46var f=Object(i.useMemo)(function(){return{audio:!1,video:Object.assign({},l,e)}},[e])
47return Object(i.useEffect)(function(){var e,i=!1,o=function(){null==e||e.getTracks().forEac

47h(function(n){n.stop()})}
48return __awaiter(t,void 0,void 0,function(){var t
49return __generator(this,function(i){switch(i.label){case 0:return null==(t=n.current)?[2]:[4,navigator.mediaDevices.getUserMedia(f)]
50case 1:return e=i.sent(),void 0!==t.mozSrcObject?t.mozSrcObject=e:t.srcObject=e,[4,a(t,"loadeddata")]
51case 2:return i.sent(),[4,s(500)]
52case 3:return i.sent(),c(!0),A(e),[2]}})}).then(function(){i&&o()}),function(){i=!0,o()}},[n,f,A]),[r]}(u,o)[0],d=function useScanning(n,e){var t=this,o=Object(i.useState)(),r=o[0],a=o[1],s=Object(i.useState)(!1),c=s[0],l=s[1],f=Object(i.useMemo)(function(){return Object.assign({},A,e)},[e]),u=Object(i.useCallback)(function(){return __awaiter(t,void 0,void 0,function(){var e,t
53return __generator(this,function(i){switch(i.label){case 0:return e=n.current,[4,new BarcodeDetector({formats:f.formats}).detect(e)]
54case 1:return void 0!==(t=i.sent()[0])&&a(t),[2]}})})},[n,f.formats])
55return Object(i.useEffect)(function(){if(null!=n.current&&c){var e,i=!1,o=function(){return __awaiter(t,void 0,void 0,function(){return __generator(this,function(n){switch(n.label){case 0:return[4,u()]
56case 1:return n.sent(),i||(e=window.setTimeout(o,f.delay)),[2]}})})}
57return e=window.setTimeout(o,f.delay),function(){clearTimeout(e),i=!0}}},[c,n,f.delay,u]),[r,Object(i.useCallback)(function(){l(!0)},[]),Object(i.useCallback)(function(){l(!1)},[])]}(u,e),_=d[0],m=d[1],g=d[2]
58return Object(i.useEffect)(function(){h?m():g()},[g,h,m]),Object(i.useEffect)(function(){void 0!==_&&(null==t||t(_))},[_,t]),Object(f.jsx)("video",r({ref:u,style:{width:"100%",height:"100%",objectFit:"cover"},autoPlay:!0,muted:!0,playsInline:!0},c))},h=t("LboF"),d=t.n(h),_=t("yLH9"),m={insert:"head",singleton:!1},g=(d()(_.a,m),_.a.locals||{}),p=t("T1X5"),b=t("17x9")
59const w=n=>{let{onClose:e,onDetect:t}=n
60const i=Object(p.a)(g)
61return o.a.createElement("div",{onClick:()=>e(),className:i.overlay},o.a.createElement("div",{className:i.container},o.a.createElement("button",{onClick:()=>e(),className:i.close,"aria-label":"Close barcode scanner"}),o.a.createElement(u,{className:i.scanner,onCapture:n=>t(n.rawValue),options:{delay:2500,formats:["ean_13","ean_8","qr_code"]}})))}
62w.propTypes={onClose:b.func.isRequired,onDetect:b.func.isRequired}
63e.default=w},yLH9:function(n,e,t){"use strict"
64var i=t("denP"),o=t.n(i),r=t("JPst"),a=t.n(r)()(o.a)
65a.push([n.i,"@media only screen and (max-width:  767px  ) {\n}@media only screen and (max-width:  767px  ) {\n}@media only screen and (max-width:  767px  ) {\n}@media only screen and (max-width:  767px  ) {\n}.scanner__W7vIh {\n  width: 100%;\n}\n.container__QoFUa {\n  background-color: white;\n  padding: 10px;\n  border: 1px solid grey;\n  border-radius: 4px;\n  position: fixed;\n  z-index: 9999;\n  line-height: 0;\n}\n@media only screen and (max-width:  1023px  ) {\n  .container__QoFUa {\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n  }\n  .close__bDmhJ {\n    display: flex;\n    align-items: center;

65\n    align-self: center;\n  }\n  .close__bDmhJ:after {\n    content: '\\e924';\n    font-family: 'icomoon';\n    font-size: 26px;\n    color: #fff;\n    margin: 0;\n    font-weight: 400;\n  }\n  .close__bDmhJ:after {\n    content: '\\e924';\n    font-family: 'icomoon';\n    font-size: 26px;\n    color: #fff;\n    margin: 0;\n    font-weight: 400;\n  }\n}\n@media only screen and (min-width: 1024px) {\n  .container__QoFUa {\n    max-width: 80em;\n    left: 50%;\n    top: 50%;\n    transform: translate(-50%, -50%);\n    min-width: 65em;\n  }\n  .close__bDmhJ {\n    display: flex;\n    align-items: center;\n    align-self: center;\n  }\n  .close__bDmhJ:after {\n    content: '\\e924';\n    font-family: 'icomoon';\n    font-size: 14px;\n    color: #fff;\n    margin: 0;\n    font-weight: 400;\n  }\n  .close__bDmhJ:after {\n    content: '\\e924';\n    font-family: 'icomoon';\n    font-size: 14px;\n    color: #fff;\n    margin: 0;\n    font-weight: 400;\n  }\n}\n.close__bDmhJ {\n  position: absolute;\n  top: 10px;\n  right: 10px;\n  margin: 0;\n  padding: 20px;\n  background-color: rgba(255, 255, 255, 0.5);\n}\n.close__bDmhJ:hover::after {\n  filter: invert(70%);\n}\n.overlay__F2Hmp {\n  position: fixed;\n  height: 100%;\n  width: 100%;\n  top: 0;\n  left: 0;\n  background-color: rgba(0, 0, 0, 0.5);\n  z-index: 9998;\n}\n","",{version:3,sources:["webpack://./src/web/typography.less","webpack://./src/pwastudio/@magento/venia-ui/lib/components/SearchBar/scanner.less","webpack://./src/web/icons.less"],names:[],mappings:"AA8EE;AC7EF,CDuFE;ACtFF,CD4EE;AC3EF,CDqFE;ACpFF,CAFA;EACI,WAAA;AAGJ;AAAA;EACI,uBAAA;EACA,aAAA;EACA,sBAAA;EACA,kBAAA;EACA,eAAA;EACA,aAAA;EACA,cAAA;AAEJ;AAAA;EACI;IACI,MAAA;IACA,OAAA;IACA,WAAA;IACA,YAAA;EAEN;EAAE;IC2EF,aAAA;IACA,mBAAA;IACA,kBAAA;EDxEA;EC0EA;IACE,gBAAA;IACA,sBAAA;IACA,eAAA;IACA,WAAA;IACA,SAAA;IACA,gBAAA;EDxEF;ECkEA;IACE,gBAAA;IACA,sBAAA;IACA,eAAA;IACA,WAAA;IACA,SAAA;IACA,gBAAA;EDhEF;AACF;AAlBA;EACI;IACI,eAAA;IACA,SAAA;IACA,QAAA;IACA,gCAAA;IACA,eAAA;EAoBN;EAlBE;IC+DF,aAAA;IACA,mBAAA;IACA,kBAAA;ED1CA;EC4CA;IACE,gBAAA;IACA,sBAAA;IACA,eAAA;IACA,WAAA;IACA,SAAA;IACA,gBAAA;ED1CF;ECoCA;IACE,gBAAA;IACA,sBAAA;IACA,eAAA;IACA,WAAA;IACA,SAAA;IACA,gBAAA;EDlCF;AACF;AApCA;EACI,kBAAA;EACA,SAAA;EACA,WAAA;EACA,SAAA;EACA,aAAA;EACA,0CAAA;AAsCJ;AApCI;EACE,mBAAA;AAsCN;AAlCA;EACI,eAAA;EACA,YAAA;EACA,WAAA;EACA,MAAA;EACA,OAAA;EACA,oCAAA;EACA,aAAA;AAoCJ",sourcesContent:["@import './theme.less';\n\n@font-family__sans-serif: Sans-Serif;\n\n@font-family-name__base: FrutigerRoman;\n@font-family-name__light: FrutigerLight;\n@font-family-name__bold: FrutigerBlack;\n\n@font-family__base: @font-family-name__base, @font-family__sans-serif;\n@font-family__light: @font-family-name__light, @font-family__sans-serif;\n@font-family__bold: @font-family-name__bold, @font-family__sans-serif;\n\n@font-size__6xl: 28px;\n@font-size__5xl: 26px;\n@font-size__4xl: 24px;\n@font-size__3xl: 22px;\n@font-size__2xl: 20px;\n@font-size__xl: 18px;\n@font-size__l: 16px;\n@font-size__m: 14px;\n@font-size__base: @font-size__m;\n@font-size__s: 12px;\n@font-size__xs: 10px;\n@font-size__xxs: 8px;\n\n// [MOBILE] base font size — drives the mobile type scale via inheritance from body\n@font-size__base__mobile: 11px;\n\n@font-weight__bold: 700;\n@font-weight__regular: 400;\n@font-weight__light: 300;\n\n@line-height__default: 1.5;\n\n.line-height(@heightValue)\n  when\n  not\n  (@heightValue = false)\n  and\n  not\n  (@heightValue = normal)\n  and\n  not\n  (ispercentage(@heightValue)) {\n  .font-size-value(@heightValue);\n  line-height: @fontValue;\n}\n\n.font-size-value(@_value) when not (@_value = false) and not (@_value = '') {\n  // Exact-pixel output: emit the design token verbatim as px. No rem/ratio, so\n  // sizes are never re-interpreted against the device/user root font-size.\n  @fontValue: unit((@_value) * 1, px);\n}\n\nhtml,\nbody {\n  font-size: @font-size__base;\n  // Single source of truth for body copy. Elements with NO font-size of their\n  // own inherit this, so they shift 14px -> 11px on mobile for free. Elements\n  // that set an explicit size are exact px and do NOT auto-shrink — to make one\n  // responsive, drop its declaration so it inherits.\n  @media @mobileM {\n    font-size: @font-size__base__mobile;\n  }\n}\n\nh1,\nh2,\nh4,\nh5,\nh6 {\n  font-weight: @font-weight__bold;\n  margin: @spacing__base 0;\n}\n\nh1 {\n  font-size: @font-size__6xl;\n  .line-height(@font-size__6xl);\n  @media @mobileM {\n    font-size: @font-size__4xl;\n    .line-height(@font-size__4xl);\n  }\n}\n\nh2,\nh3 {\n  font-size: @font-size__3xl;\n  .line-height(@font-size__4xl);\n  @media @mobileM {\n    font-size: @font-size__xl;\n    .line-height(@font-size__2xl);\n  }\n}\n\nh3 {\n  margin: @spacing__base 0;\n  font-weight: @font-weight__regular;

65\n}\n\nh4,\nh5,\nh6 {\n  font-size: inherit;\n}\n\n[class^='font-size__l'] {\n  font-size: @font-size__l;\n}\n","@import (reference) 'src/web/theme';\n\n.scanner {\n    width: 100%;\n}\n\n.container {\n    background-color: white;\n    padding: 10px;\n    border: 1px solid grey;\n    border-radius: 4px;\n    position: fixed;\n    z-index: 9999;\n    line-height: 0;\n}\n@media @mobileL {\n    .container {\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 100%;\n    }\n    .close {\n        .icomoonAfter('close', @font-size__5xl, 0, @color__white);\n      }\n}\n@media @desktopL {\n    .container {\n        max-width: 80em;\n        left: 50%;\n        top: 50%;\n        transform: translate(-50%, -50%);\n        min-width: 65em;\n    }\n    .close {\n        .icomoonAfter('close', @font-size__m, 0, @color__white);\n      }\n}\n.close {\n    position: absolute;\n    top: 10px;\n    right: 10px;\n    margin: 0;\n    padding: 20px;\n    background-color: rgba(255,255,255,0.5);\n\n    &:hover::after {\n      filter: invert(70%);\n    }\n  }\n\n.overlay {\n    position: fixed;\n    height: 100%;\n    width: 100%;\n    top: 0;\n    left: 0;\n    background-color: rgba(0, 0, 0, 0.5);\n    z-index: 9998;\n}","@import '/src/web/fonts/icomoon/variables';\n\n@icon__folder: './icons/';\n\n@icon__width-default: 20px;\n@icon__height-default: 20px;\n@icon__indent-default: 10px;\n\n.icon(\n  @name: '',\n  @width: @icon__width-default,\n  @height: @icon__height-default,\n  @indent: 0\n) {\n  display: flex;\n  align-items: center;\n  width: @width;\n  min-width: @width;\n  height: @height;\n  margin: @indent;\n  background-image: url(~'@{icon__folder}@{name}.svg');\n  background-size: @width @height;\n  background-repeat: no-repeat;\n}\n\n.iconSrc(@name) {\n  background-image: url(~'@{icon__folder}@{name}.svg');\n}\n\n.iconBefore(\n  @name: '',\n  @width: @icon__width-default,\n  @height: @icon__height-default,\n  @indent: 0 @icon__indent-default 0 0\n) {\n  display: flex;\n  align-items: center;\n\n  &:before {\n    display: inline-block;\n    width: @width;\n    min-width: @width;\n    height: @height;\n    margin: @indent;\n    background-image: url(~'@{icon__folder}@{name}.svg');\n    background-size: @width @height;\n    background-repeat: no-repeat;\n    content: '';\n  }\n}\n\n.iconBeforeSrc(@name) {\n  &:before {\n    background-image: url(~'@{icon__folder}@{name}.svg');\n  }\n}\n\n.iconAfter(\n  @name: '',\n  @width: @icon__width-default,\n  @height: @icon__height-default,\n  @indent: 0 0 0 @icon__indent-default\n) {\n  display: flex;\n  align-items: center;\n\n  &:after {\n    display: inline-block;\n    width: @width;\n    min-width: @width;\n    height: @height;\n    margin: @indent;\n    background-image: url(~'@{icon__folder}@{name}.svg');\n    background-size: @width @height;\n    background-repeat: no-repeat;\n    content: '';\n  }\n}\n\n.icomoonBefore(@name, @size, @margin: 0, @color: @color__primary) {\n  @icon: 'icon-@{name}';\n  display: flex;\n  align-items: center;\n  align-self: center;\n\n  &:before {\n    content: @@icon;\n    font-family: 'icomoon';\n    font-size: @size;\n    color: @color;\n    margin: @margin;\n    font-weight: @font-weight__regular;\n  }\n}\n\n.icomoonAfter(@name, @size, @margin: 0, @color: @color__primary) {\n  @icon: 'icon-@{name}';\n  display: flex;\n  align-items: center;\n  align-self: center;\n\n  &:after {\n    content: @@icon;\n    font-family: 'icomoon';\n    font-size: @size;\n    color: @color;\n    margin: @margin;\n    font-weight: @font-weight__regular;\n  }\n}\n\n.iconAfterSrc(@name) {\n  &:after {\n    background-image: url(~'@{icon__folder}@{name}.svg');\n  }\n}\n"],sourceRoot:""}]),a.locals={scanner:"scanner__W7vIh",container:"container__QoFUa",close:"close__bDmhJ",overlay:"overlay__F2Hmp"},e.a=a}}])