@nanoporetech-digital/components 2.3.1 → 2.6.0

package/dist/nano-components/p-7d351076.system.entry.js

@@ -0,0 +1,5 @@
+var __awaiter=this&&this.__awaiter||function(e,t,i,n){function o(e){return e instanceof i?e:new i((function(t){t(e)}))}return new(i||(i=Promise))((function(i,r){function a(e){try{l(n.next(e))}catch(t){r(t)}}function s(e){try{l(n["throw"](e))}catch(t){r(t)}}function l(e){e.done?i(e.value):o(e.value).then(a,s)}l((n=n.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var i={label:0,sent:function(){if(r[0]&1)throw r[1];return r[1]},trys:[],ops:[]},n,o,r,a;return a={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(a[Symbol.iterator]=function(){return this}),a;function s(e){return function(t){return l([e,t])}}function l(a){if(n)throw new TypeError("Generator is already executing.");while(i)try{if(n=1,o&&(r=a[0]&2?o["return"]:a[0]?o["throw"]||((r=o["return"])&&r.call(o),0):o.next)&&!(r=r.call(o,a[1])).done)return r;if(o=0,r)a=[a[0]&2,r.value];switch(a[0]){case 0:case 1:r=a;break;case 4:i.label++;return{value:a[1],done:false};case 5:i.label++;o=a[1];a=[0];continue;case 7:a=i.ops.pop();i.trys.pop();continue;default:if(!(r=i.trys,r=r.length>0&&r[r.length-1])&&(a[0]===6||a[0]===2)){i=0;continue}if(a[0]===3&&(!r||a[1]>r[0]&&a[1]<r[3])){i.label=a[1];break}if(a[0]===6&&i.label<r[1]){i.label=r[1];r=a;break}if(r&&i.label<r[2]){i.label=r[2];i.ops.push(a);break}if(r[2])i.ops.pop();i.trys.pop();continue}a=t.call(e,i)}catch(s){a=[6,s];o=0}finally{n=r=0}if(a[0]&5)throw a[1];return{value:a[0]?a[1]:void 0,done:true}}};
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */System.register(["./p-59b3d24b.system.js","./p-1c216ca4.system.js","./p-ef053a2f.system.js"],(function(e){"use strict";var t,i,n,o,r,a,s,l;return{setters:[function(e){t=e.r;i=e.c;n=e.h;o=e.e;r=e.g},function(e){a=e.c;s=e.r},function(e){l=e.d}],execute:function(){function d(e,t){function i(i){var n=e.getBoundingClientRect();var o=e.ownerDocument.defaultView;var r=n.left+o.pageXOffset;var a=n.top+o.pageYOffset;var s=i.pageX-r;var l=i.pageY-a;t(s,l)}function n(){document.removeEventListener("pointermove",i);document.removeEventListener("pointerup",n)}document.addEventListener("pointermove",i,{passive:true});document.addEventListener("pointerup",n)}var c=':host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--divider-width:12px;--divider-hit-area:14px;--min:0%;--max:100%;--background-color:#e4e6e8;--content-color:#918b86;display:-ms-grid;display:grid}.start,.end{overflow:hidden}.divider{-webkit-box-flex:0;-ms-flex:0 0 var(--divider-width);flex:0 0 var(--divider-width);display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background-color:var(--background-color);color:var(--content-color);z-index:1;font-size:0.8rem}.divider:focus{outline:none}:host(:not([disabled])) .divider:focus-visible{background-color:var(--nano-control-focus-color, rgba(144, 198, 231, 0.8))}:host([disabled]) .divider{cursor:not-allowed}:host(:not([vertical],[disabled])) .divider{cursor:col-resize}:host(:not([vertical])) .divider::after{display:-webkit-box;display:-ms-flexbox;display:flex;content:"";position:absolute;height:100%;left:calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);width:var(--divider-hit-area)}:host([vertical]){-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}:host([vertical]:not([disabled])) .divider{cursor:row-resize}:host([vertical]) .divider::after{content:"";position:absolute;width:100%;top:calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);height:var(--divider-hit-area)}';var h=e("nano_split_pane",function(){function e(e){var n=this;t(this,e);this.nanoReposition=i(this,"nanoReposition",7);this.nanoDragging=i(this,"nanoDragging",7);this.isAnimating=false;this.didLoad=false;this._shouldAnimate=true;this.vertical=false;this.disabled=false;this.snapThreshold=12;this.animationDuration=.6;this.handleDrag=function(e){if(n.disabled){return}e.preventDefault();d(n.host,(function(e,t){var i=n.vertical?t:e;n.nanoDragging.emit(i);if(n.primary==="end"){i=n.size-i}if(n.snap){var o=n.snap.split(" ");o.forEach((function(e){var t;if(e.endsWith("%")){t=n.size*(parseFloat(e)/100)}else{t=parseFloat(e)}if(i>=t-n.snapThreshold&&i<=t+n.snapThreshold){i=t}}))}n.shouldAnimate=false;n.position=a(n.pixelsToPercentage(i),0,100);s((function(){return n.shouldAnimate=true}))}))};this.handleKeyDown=function(e){if(n.disabled){return}if(["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End"].includes(e.key)){var t=n.position;var i=(e.shiftKey?10:1)*(n.primary==="end"?-1:1);e.preventDefault();if(e.key==="ArrowLeft"&&!n.vertical||e.key==="ArrowUp"&&n.vertical){t-=i}if(e.key==="ArrowRight"&&!n.vertical||e.key==="ArrowDown"&&n.vertical){t+=i}if(e.key==="Home"){t=n.primary==="end"?100:0}if(e.key==="End"){t=n.primary==="end"?0:100}n.shouldAnimate=false;n.position=a(t,0,100);s((function(){return n.shouldAnimate=true}))}};this.handleResize=function(){if(!n.didLoad||n.isAnimating)return;if(n.primary){n.shouldAnimate=false;n.position=n.pixelsToPercentage(n.cachedPositionInPixels);s((function(){return n.shouldAnimate=true}))}};this.handlePositionChange=l(this.handlePositionChange.bind(this),100)}Object.defineProperty(e.prototype,"size",{get:function(){var e=this.host.getBoundingClientRect(),t=e.width,i=e.height;return this.vertical?i:t},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"shouldAnimate",{get:function(){return this.didLoad&&this._shouldAnimate},set:function(e){this._shouldAnimate=e},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"position",{get:function(){return this._position},set:function(e){e=Math.min(Math.max(e,0),100);if(isNaN(e)||e===this._position)return;if(this.shouldAnimate&&this.animationDuration>0&&!isNaN(this.position)){this.animatePosition(e);return}this._position=e},enumerable:false,configurable:true});e.prototype.handlePositionChange=function(){this.cachedPositionInPixels=this.percentageToPixels(this.position);this.positionInPixels=this.percentageToPixels(this.position);this.nanoReposition.emit()};e.prototype.handlePositionInPixelsChange=function(){this.position=this.pixelsToPercentage(this.positionInPixels)};e.prototype.getPercentageToPixels=function(e){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){return[2,this.percentageToPixels(e)]}))}))};e.prototype.getPixelsToPercentage=function(e){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){return[2,this.pixelsToPercentage(e)]}))}))};e.prototype.animatePosition=function(e){var t=this;if(this.isAnimating)return;var i=this.animationDuration;var n=60;var o=this.position;var r=e-o;var a=o;var l=0;function d(e,t,i,n){if((e/=n/2)<1)return i/2*e*e+t;else return-i/2*(--e*(e-2)-1)+t}var c=function(){l+=1/n;a=d(l,o,r,i);if(e>o&&a>=e||e<o&&a<=e){t.position=e;t.shouldAnimate=true;t.isAnimating=false;return}t.position=a;s(c)};this.shouldAnimate=false;this.isAnimating=true;s(c)};e.prototype.percentageToPixels=function(e){return this.size*(e/100)};e.prototype.pixelsToPercentage=function(e){return e/this.size*100};e.prototype.attachRO=function(){var e=this;this.detachRO();this.ro=new ResizeObserver((function(){return e.handleResize()}));this.ro.observe(this.host)};e.prototype.detachRO=function(){if(!this.ro)return;this.ro.unobserve(this.host);this.ro=undefined};e.prototype.componentDidLoad=function(){var e=this;if(this.positionInPixels)this.handlePositionInPixelsChange();setTimeout((function(){return e.didLoad=true}))};e.prototype.connectedCallback=function(){this.cachedPositionInPixels=this.percentageToPixels(this.position);this.attachRO()};e.prototype.disconnectedCallback=function(){this.detachRO()};e.prototype.componentDidRender=function(){var e=this;s((function(){if(typeof e.position==="undefined"){e.position=50}}))};e.prototype.render=function(){if(typeof this.position==="undefined")return;var e={};var t=this.vertical?"gridTemplateRows":"gridTemplateColumns";var i="\n      clamp(\n        0%,\n        clamp(\n          var(--min),\n          "+this.position+"% - var(--divider-width) / 2,\n          var(--max)\n        ),\n        calc(100% - var(--divider-width))\n      )\n    ";var r="auto";if(this.primary==="end"){e[t]=r+" var(--divider-width) "+i}else{e[t]=i+" var(--divider-width) "+r}return n(o,{style:e},n("div",{part:"panel start",class:"start"},n("slot",{name:"start"})),n("div",{part:"divider",class:"divider",tabindex:this.disabled?undefined:"0",role:"separator","aria-label":"Resize",onKeyDown:this.handleKeyDown,onMouseDown:this.handleDrag,onTouchStart:this.handleDrag},n("slot",{name:"handle"},!this.disabled&&this.vertical?n("nano-icon",{slot:"handle",name:"solid/grip-lines"}):n("nano-icon",{slot:"handle",name:"solid/grip-lines-vertical"}))),n("div",{part:"panel end",class:"end"},n("slot",{name:"end"})))};Object.defineProperty(e.prototype,"host",{get:function(){return r(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{position:["handlePositionChange"],positionInPixels:["handlePositionInPixelsChange"]}},enumerable:false,configurable:true});return e}());h.style=c}}}));
+//# sourceMappingURL=p-7d351076.system.entry.js.map

package/dist/nano-components/p-7d351076.system.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["src/utils/drag.ts","src/components/split-pane/split-pane.scss?tag=nano-split-pane&encapsulation=shadow","src/components/split-pane/split-pane.tsx"],"names":["drag","container","onMove","move","pointerEvent","dims","getBoundingClientRect","defaultView","ownerDocument","offsetX","left","pageXOffset","offsetY","top","pageYOffset","x","pageX","y","pageY","stop","document","removeEventListener","addEventListener","passive","splitPaneCss","SplitPane","exports","class_1","hostRef","_this","this","isAnimating","didLoad","_shouldAnimate","vertical","disabled","snapThreshold","animationDuration","handleDrag","e","preventDefault","host","newPositionInPixels","nanoDragging","emit","primary","size","snap","snaps","split","forEach","value","snapPoint","endsWith","parseFloat","shouldAnimate","position","clamp","pixelsToPercentage","raf","handleKeyDown","event","includes","key","newPosition","incr","shiftKey","handleResize","cachedPositionInPixels","handlePositionChange","debounce","bind","Object","defineProperty","prototype","_a","width","height","sa","_position","pos","Math","min","max","isNaN","animatePosition","percentageToPixels","positionInPixels","nanoReposition","handlePositionInPixelsChange","getPercentageToPixels","getPixelsToPercentage","end","duration","fps","start","distance","time","easeInOutQuad","t","s","d","go","attachRO","detachRO","ro","ResizeObserver","observe","unobserve","undefined","componentDidLoad","setTimeout","connectedCallback","disconnectedCallback","componentDidRender","render","styles","gridTemplate","secondary","h","Host","style","part","class","name","tabindex","role","aria-label","onKeyDown","onMouseDown","onTouchStart","slot"],"mappings":"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","sourcesContent":["export function drag(\n  container: HTMLElement,\n  onMove: (x: number, y: number) => void\n) {\n  function move(pointerEvent: PointerEvent) {\n    const dims = container.getBoundingClientRect();\n    const defaultView = container.ownerDocument.defaultView!;\n    const offsetX = dims.left + defaultView.pageXOffset;\n    const offsetY = dims.top + defaultView.pageYOffset;\n    const x = pointerEvent.pageX - offsetX;\n    const y = pointerEvent.pageY - offsetY;\n\n    onMove(x, y);\n  }\n\n  function stop() {\n    document.removeEventListener('pointermove', move);\n    document.removeEventListener('pointerup', stop);\n  }\n\n  document.addEventListener('pointermove', move, { passive: true });\n  document.addEventListener('pointerup', stop);\n}\n","@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/nano-theme/components';\n@import '../../global/style/nano-theme/form';\n\n:host {\n  /**\n  * @prop --divider-width: The width of the visible divider. Default 4px.\n  * @prop --divider-hit-area: The invisible region around the divider where dragging can occur. This is\n  *  usually wider than the divider to facilitate easier dragging. Default 12px.\n  * @prop --min: The minimum allowed size of the primary panel. Default 0.\n  * @prop --max: The maximum allowed size of the primary panel. Default 100%.\n  * @prop --background-color: Handle background. Default #{map.get($colors, lightgrey)}.\n  * @prop --content-color: Handle color. Default #{map.get($colors, dimgrey)}.\n  */\n  --divider-width: 12px;\n  --divider-hit-area: 14px;\n  --min: 0%;\n  --max: 100%;\n  --background-color: #{map.get($colors, lightgrey)};\n  --content-color: #{map.get($colors, dimgrey)};\n\n  display: grid;\n}\n\n.start,\n.end {\n  overflow: hidden;\n}\n\n.divider {\n  flex: 0 0 var(--divider-width);\n  display: flex;\n  position: relative;\n  align-items: center;\n  justify-content: center;\n  background-color: var(--background-color);\n  color: var(--content-color);\n  z-index: 1;\n  font-size: 0.8rem;\n}\n\n.divider:focus {\n  outline: none;\n}\n\n:host(:not([disabled])) .divider:focus-visible {\n  background-color: #{$control-focus-color};\n}\n\n:host([disabled]) .divider {\n  cursor: not-allowed;\n}\n\n/* Horizontal */\n:host(:not([vertical], [disabled])) .divider {\n  cursor: col-resize;\n}\n\n:host(:not([vertical])) .divider::after {\n  display: flex;\n  content: '';\n  position: absolute;\n  height: 100%;\n  left: calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);\n  width: var(--divider-hit-area);\n}\n\n/* Vertical */\n:host([vertical]) {\n  flex-direction: column;\n}\n\n:host([vertical]:not([disabled])) .divider {\n  cursor: row-resize;\n}\n\n:host([vertical]) .divider::after {\n  content: '';\n  position: absolute;\n  width: 100%;\n  top: calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);\n  height: var(--divider-hit-area);\n}\n","import {\n  Prop,\n  Component,\n  Watch,\n  Event,\n  EventEmitter,\n  ComponentInterface,\n  Element,\n  Host,\n  h,\n  Method,\n} from '@stencil/core';\nimport { clamp, raf, debounce } from '../../utils';\nimport { drag } from '../../utils/drag';\n\n/**\n * Split panes display two adjacent panels, allowing the user to reposition them.\n *\n * @part start - The start panel.\n * @part end - The end panel.\n * @part panel - Targets both the start and end panels.\n * @part divider - The divider that separates the start and end panels.\n *\n * @slot start - The start panel.\n * @slot end - The end panel.\n * @slot handle - An optional handle to render at the center of the divider.\n */\n@Component({\n  tag: 'nano-split-pane',\n  styleUrl: 'split-pane.scss',\n  shadow: true,\n})\nexport class SplitPane implements ComponentInterface {\n  @Element() host: HTMLNanoSplitPaneElement;\n  private cachedPositionInPixels: number;\n  private ro: ResizeObserver;\n  private isAnimating = false;\n  private didLoad = false;\n\n  private get size() {\n    const { width, height } = this.host.getBoundingClientRect();\n    return this.vertical ? height : width;\n  }\n\n  private get shouldAnimate() {\n    return this.didLoad && this._shouldAnimate;\n  }\n  private set shouldAnimate(sa: boolean) {\n    this._shouldAnimate = sa;\n  }\n  private _shouldAnimate: boolean = true;\n\n  constructor() {\n    this.handlePositionChange = debounce(\n      this.handlePositionChange.bind(this),\n      100\n    );\n  }\n\n  /**\n   * The current position of the divider from the primary panel's edge as a percentage 0-100. Defaults to 50% of the\n   * container's initial size.\n   */\n  @Prop()\n  get position() {\n    return this._position;\n  }\n  set position(pos: number) {\n    // override too high / low\n    pos = Math.min(Math.max(pos, 0), 100);\n    if (isNaN(pos) || pos === this._position) return;\n\n    if (\n      this.shouldAnimate &&\n      this.animationDuration > 0 &&\n      !isNaN(this.position)\n    ) {\n      this.animatePosition(pos);\n      return;\n    }\n    this._position = pos;\n  }\n  private _position: number;\n\n  // eslint-disable-next-line @stencil/no-unused-watch\n  @Watch('position')\n  handlePositionChange() {\n    this.cachedPositionInPixels = this.percentageToPixels(this.position);\n    this.positionInPixels = this.percentageToPixels(this.position);\n    this.nanoReposition.emit();\n  }\n\n  /**\n   * The current position of the divider from the primary panel's edge in pixels.\n   */\n  @Prop({ mutable: true }) positionInPixels: number;\n\n  @Watch('positionInPixels')\n  handlePositionInPixelsChange() {\n    this.position = this.pixelsToPercentage(this.positionInPixels);\n  }\n\n  /** Draws the split panel in a vertical orientation with the start and end panels stacked. */\n  @Prop({ reflect: true }) vertical = false;\n\n  /** Disables resizing. Note that the position may still change as a result of resizing the host element. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * If no primary panel is designated, both panels will resize proportionally when the host element is resized. If a\n   * primary panel is designated, it will maintain its size and the other panel will grow or shrink as needed when the\n   * host element is resized.\n   */\n  @Prop() primary?: 'start' | 'end';\n\n  /**\n   * One or more space-separated values at which the divider should snap. Values can be in pixels or percentages, e.g.\n   * `\"100px 50%\"`.\n   */\n  @Prop() snap?: string;\n\n  /** How close the divider must be to a snap point until snapping occurs. */\n  @Prop() snapThreshold = 12;\n\n  /** When changing `position` via property, the pane will animate into position. Make `animationDuration` 0 to disable. */\n  @Prop() animationDuration = 0.6;\n\n  /** Emitted when the divider's position changes. */\n  @Event() nanoReposition: EventEmitter;\n\n  /** Emitted when the divider is being dragged. */\n  @Event() nanoDragging: EventEmitter<number>;\n\n  /** Utility to convert % to pixels */\n  @Method()\n  async getPercentageToPixels(value: number) {\n    return this.percentageToPixels(value);\n  }\n\n  /** Utility to convert pixels to % (`position`) */\n  @Method()\n  async getPixelsToPercentage(value: number) {\n    return this.pixelsToPercentage(value);\n  }\n\n  // Private logic\n\n  private animatePosition(end: number) {\n    if (this.isAnimating) return;\n\n    const duration = this.animationDuration; // seconds\n    const fps = 60;\n    const start = this.position;\n    const distance = end - start;\n\n    let position = start;\n    let time = 0;\n\n    function easeInOutQuad(t: number, s: number, e: number, d: number) {\n      if ((t /= d / 2) < 1) return (e / 2) * t * t + s;\n      else return (-e / 2) * (--t * (t - 2) - 1) + s;\n    }\n\n    const go = () => {\n      time += 1 / fps;\n      position = easeInOutQuad(time, start, distance, duration);\n\n      if (\n        (end > start && position >= end) ||\n        (end < start && position <= end)\n      ) {\n        this.position = end;\n        this.shouldAnimate = true;\n        this.isAnimating = false;\n        return;\n      }\n      this.position = position;\n      raf(go);\n    };\n\n    this.shouldAnimate = false;\n    this.isAnimating = true;\n    raf(go);\n  }\n\n  private percentageToPixels(value: number) {\n    return this.size * (value / 100);\n  }\n\n  private pixelsToPercentage(value: number) {\n    return (value / this.size) * 100;\n  }\n\n  private attachRO() {\n    this.detachRO();\n    this.ro = new ResizeObserver(() => this.handleResize());\n    this.ro.observe(this.host);\n  }\n\n  private detachRO() {\n    if (!this.ro) return;\n    this.ro.unobserve(this.host);\n    this.ro = undefined;\n  }\n\n  // Event handlers\n\n  private handleDrag = (e: Event) => {\n    if (this.disabled) {\n      return;\n    }\n\n    // Prevent text selection when dragging\n    e.preventDefault();\n\n    drag(this.host, (x, y) => {\n      let newPositionInPixels = this.vertical ? y : x;\n\n      this.nanoDragging.emit(newPositionInPixels);\n\n      // Flip for end panels\n      if (this.primary === 'end') {\n        newPositionInPixels = this.size - newPositionInPixels;\n      }\n\n      // Check snap points\n      if (this.snap) {\n        const snaps = this.snap.split(' ');\n\n        snaps.forEach((value) => {\n          let snapPoint: number;\n\n          if (value.endsWith('%')) {\n            snapPoint = this.size * (parseFloat(value) / 100);\n          } else {\n            snapPoint = parseFloat(value);\n          }\n\n          if (\n            newPositionInPixels >= snapPoint - this.snapThreshold &&\n            newPositionInPixels <= snapPoint + this.snapThreshold\n          ) {\n            newPositionInPixels = snapPoint;\n          }\n        });\n      }\n      this.shouldAnimate = false;\n      this.position = clamp(\n        this.pixelsToPercentage(newPositionInPixels),\n        0,\n        100\n      );\n      raf(() => (this.shouldAnimate = true));\n    });\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (this.disabled) {\n      return;\n    }\n\n    if (\n      [\n        'ArrowLeft',\n        'ArrowRight',\n        'ArrowUp',\n        'ArrowDown',\n        'Home',\n        'End',\n      ].includes(event.key)\n    ) {\n      let newPosition = this.position;\n      const incr =\n        (event.shiftKey ? 10 : 1) * (this.primary === 'end' ? -1 : 1);\n\n      event.preventDefault();\n\n      if (\n        (event.key === 'ArrowLeft' && !this.vertical) ||\n        (event.key === 'ArrowUp' && this.vertical)\n      ) {\n        newPosition -= incr;\n      }\n\n      if (\n        (event.key === 'ArrowRight' && !this.vertical) ||\n        (event.key === 'ArrowDown' && this.vertical)\n      ) {\n        newPosition += incr;\n      }\n\n      if (event.key === 'Home') {\n        newPosition = this.primary === 'end' ? 100 : 0;\n      }\n\n      if (event.key === 'End') {\n        newPosition = this.primary === 'end' ? 0 : 100;\n      }\n\n      this.shouldAnimate = false;\n\n      this.position = clamp(newPosition, 0, 100);\n      raf(() => (this.shouldAnimate = true));\n    }\n  };\n\n  private handleResize = () => {\n    if (!this.didLoad || this.isAnimating) return;\n\n    // Resize when a primary panel is set\n    if (this.primary) {\n      this.shouldAnimate = false;\n      this.position = this.pixelsToPercentage(this.cachedPositionInPixels);\n      raf(() => (this.shouldAnimate = true));\n    }\n  };\n\n  componentDidLoad(): void {\n    if (this.positionInPixels) this.handlePositionInPixelsChange();\n    setTimeout(() => (this.didLoad = true));\n  }\n\n  connectedCallback() {\n    this.cachedPositionInPixels = this.percentageToPixels(this.position);\n    this.attachRO();\n  }\n\n  disconnectedCallback() {\n    this.detachRO();\n  }\n\n  componentDidRender(): void {\n    // bit hacky ... because we use getter / setter for position, there's a render *before* `position` is passed in via attribute\n    // if we set a default position in the class, this causes the divider to jump (from default to user set position)\n    // so - wait a render, see if there's a position passed in via attribute, *then* set default if not\n    raf(() => {\n      if (typeof this.position === 'undefined') {\n        this.position = 50;\n      }\n    });\n  }\n\n  render() {\n    if (typeof this.position === 'undefined') return;\n    const styles: { gridTemplateRows?: string; gridTemplateColumns?: string } =\n      {};\n    const gridTemplate = this.vertical\n      ? 'gridTemplateRows'\n      : 'gridTemplateColumns';\n    const primary = `\n      clamp(\n        0%,\n        clamp(\n          var(--min),\n          ${this.position}% - var(--divider-width) / 2,\n          var(--max)\n        ),\n        calc(100% - var(--divider-width))\n      )\n    `;\n    const secondary = 'auto';\n\n    if (this.primary === 'end') {\n      styles[gridTemplate] = `${secondary} var(--divider-width) ${primary}`;\n    } else {\n      styles[gridTemplate] = `${primary} var(--divider-width) ${secondary}`;\n    }\n\n    return (\n      <Host style={styles}>\n        <div part=\"panel start\" class=\"start\">\n          <slot name=\"start\"></slot>\n        </div>\n        <div\n          part=\"divider\"\n          class=\"divider\"\n          tabindex={this.disabled ? undefined : '0'}\n          role=\"separator\"\n          aria-label=\"Resize\"\n          onKeyDown={this.handleKeyDown}\n          onMouseDown={this.handleDrag}\n          onTouchStart={this.handleDrag}\n        >\n          <slot name=\"handle\">\n            {!this.disabled && this.vertical ? (\n              <nano-icon slot=\"handle\" name=\"solid/grip-lines\" />\n            ) : (\n              <nano-icon slot=\"handle\" name=\"solid/grip-lines-vertical\" />\n            )}\n          </slot>\n        </div>\n        <div part=\"panel end\" class=\"end\">\n          <slot name=\"end\"></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/nano-components/p-93448bcd.system.entry.js.map

@@ -1 +1 @@
-{"version":3,"sources":["src/components/checkbox/checkbox.scss?tag=nano-checkbox&encapsulation=scoped","src/components/checkbox/checkbox.tsx"],"names":["checkboxCss","checkboxIds","Checkbox","exports","class_1","hostRef","_this","this","inputId","shouldReport","_invalid","inputType","hasFocus","checked","disabled","value","required","type","indeterminate","handleInvalid","ev","target","validity","valid","handleChange","handleFocus","nanoFocus","emit","handleBlur","nanoBlur","prototype","handleCheckedChange","input","name","form","host","closest","radios","Array","from","querySelectorAll","document","filter","radio","map","el","nanoChange","typeChange","handleIndeterminateChange","Object","defineProperty","getInputElement","reportValidity","validateFirst","isValid","invalid","errorMessage","validationMessage","setError","message","length","setCustomValidity","setFocus","focus","focusVisible","force","removeFocus","blur","isRadioChecked","setTimeout","componentWillLoad","componentDidLoad","observe","disconnectedCallback","unobserve","render","labelId","isRtl","ownerDocument","dir","h","Host","class","assign","createColorClasses","color","nanocb","nanocb--checked","nanocb--invalid","nanocb--disabled","nanocb--focused","nanocb--indeterminate","htmlFor","aria-labelledby","onBlur","onFocus","onChange","ref","id","onInvalid","label","hidden"],"mappings":"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","sourcesContent":["@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/base';\n\n:host {\n  /**\n   * @prop --control-invalid-style: Control box-shadow when invalid. Defaults to to #{$control-invalid-style};\n   * @prop --focus-shadow: Control focus box-shadow. Defaults to to #{$control-focus-style};\n   * @prop --padding: padding around radio and checkbox controls. Defaults to initial;\n   * @prop --control-padding: padding around tag and segmented controls text. Various defaults.\n\n   * @prop --check-bg-color: Initial Bg color of radio / checkbox controls. Changes for [checked] and [disabled] states. Defaults to #{map.get($colors, white)};\n   * @prop --check-border-style: Initial border style. Defaults to 1px solid #{map.get($colors, palegrey)};\n   * @prop --check-checked-bg-color: Checked bg of controls (not tag). Defaults to #{map.get($colors, darkgrey)};\n   * @prop --check-checked-border-color: Checked border color of radio / checkbox controls. Defaults to #{map.get($colors, darkgrey)};\n   * @prop --check-checked-higlight-color: Checked forgrdound / icon color. Defaults to #{map.get($colors, white)};\n   * @prop --check-base-size: Relative scaling size for check controls. Defaults to to inherit;\n\n   * @prop --cb-border-radius: Checkbox border radius. Defaults to to 2px and 5px on [has-focus];\n   * @prop --radio-border-radius: Radio border radius. Defaults to to 50%;\n   * @prop --tagbox-rgb: an rba list for tags which can be used to generate --tagbox-border-color and --tagbox-bg-color. Defaults to #{color-to-rgb-list(map.get($colors, lightblue))};\n   * @prop --tagbox-border-color: Defaults to rgba(var(--tagbox-rgb), .5);\n   * @prop --tagbox-bg-color: Defaults to rgba(var(--tagbox-rgb), .1);\n   * @prop --segment-color: Segment, unselected text color. (selected color is --check-checked-higlight-color). Defaults to #{map.get($colors, blue)};\n   * @prop --segment-border-radius: Defaults to 3px;\n   * @prop --segment-shadow: 0 1px 4px rgba(0,0,0,.2);\n  */\n\n  --focus-shadow: #{$control-focus-style};\n  --invalid-shadow: #{$control-invalid-style};\n  --padding: initial;\n  --check-bg-color: #{map.get($colors, white)};\n  --check-border-style: 1px solid #{map.get($colors, palegrey)};\n  --check-checked-bg-color: #{map.get($colors, darkgrey)};\n  --check-checked-border-color: #{map.get($colors, darkgrey)};\n  --check-checked-higlight-color: #{map.get($colors, white)};\n  --check-base-size: inherit;\n\n  // type specific\n\n  --tagbox-rgb: #{color-to-rgb-list(map.get($colors, lightblue))};\n  --tagbox-border-color: rgba(var(--tagbox-rgb), 0.5);\n  --tagbox-bg-color: rgba(var(--tagbox-rgb), 0.2);\n  --tagbox-border-radius: 0;\n  --segment-color: #{map.get($colors, blue)};\n  --segment-border-radius: 3px;\n  --segment-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);\n  --cb-border-radius: 2px;\n  --radio-border-radius: 50%;\n\n  display: inline-block;\n  max-width: 100%;\n\n  * {\n    box-sizing: inherit;\n  }\n}\n\n:host([type='tag']) {\n  text-transform: uppercase;\n\n  --control-padding: 0.2rem 1rem;\n}\n\n:host([type='segment']) {\n  --check-border-style: none;\n  --control-padding: 0.7em 1em 0.7em 1em;\n}\n\n:host([type='segment-pill']) {\n  --check-border-style: 1px solid #{rgba(map.get($colors, palegrey), 0.5)};\n  --segment-border-radius: 5px;\n  --control-padding: 0.7em 1em 0.7em 1em;\n}\n\n:host(.nano-color) {\n  --tagbox-rgb: var(--nano-color-base-rgb);\n  --focus-shadow: #{$control-focus-size} var(--nano-color-shade);\n}\n\n:host([checked]:not([checked='false'])) {\n  --tagbox-border-color: rgba(var(--tagbox-rgb), 0.8);\n  --tagbox-bg-color: rgba(var(--tagbox-rgb), 0.5);\n}\n\n:host([has-focus]:not([has-focus='false'])) {\n  --cb-border-radius: 5px;\n}\n\n:host([disabled]:not([disabled='false'])) {\n  opacity: 0.7;\n\n  --tagbox-rgb: #{color-to-rgb-list(map.get($colors, mediumgrey))};\n  --check-bg-color: #{rgba(map.get($colors, mediumgrey), 0.5)};\n  --check-checked-bg-color: #{rgba(map.get($colors, mediumgrey), 0.5)};\n  --segment-color: #{map.get($colors, darkgrey)};\n}\n\n.nanocb {\n  padding: var(--padding);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  line-height: 1.2;\n  position: relative;\n\n  &__input {\n    @include border-radius(var(--cb-border-radius, 3px));\n\n    font-size: var(--check-base-size);\n    position: relative;\n    height: 1.5em;\n    width: 1.5em;\n    min-width: 1.5em;\n    border: var(--check-border-style);\n    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);\n\n    &::before {\n      @include border-radius(var(--cb-border-radius));\n\n      position: absolute;\n      content: '';\n      left: 0.625em;\n      top: 0.625em;\n      width: 0;\n      height: 0;\n      border: 2px solid var(--check-checked-higlight-color);\n      transform: scale(0);\n    }\n\n    &--radio {\n      @include border-radius(var(--radio-border-radius));\n\n      background-color: var(--check-bg-color);\n    }\n\n    &--checkbox {\n      background-color: var(--check-bg-color);\n\n      &::after {\n        @include border-radius(var(--cb-border-radius));\n\n        position: absolute;\n        content: '';\n        left: 0.75em;\n        top: 0.75em;\n        height: 0;\n        width: 0;\n        border: solid var(--check-checked-higlight-color);\n        border-width: 0 0.1875em 0.1875em 0;\n        transform: rotate(0deg) scale(0);\n        opacity: 1;\n        transition: all 0.15s ease-out;\n\n        .nanocb--indeterminate & {\n          border-width: 0 0 0.1875em 0;\n        }\n      }\n    }\n\n    &--segment,\n    &--segment-pill {\n      @include visually-hide();\n\n      &::before {\n        display: none;\n      }\n    }\n\n    &--tag {\n      @include visually-hide();\n\n      &::before {\n        display: none;\n      }\n    }\n  }\n\n  &--invalid:not(.nanocb--focused) {\n    .nanocb__input {\n      box-shadow: 0 0 15px rgba(0, 0, 0, 0.2), var(--invalid-shadow);\n\n      &--tag + .nanocb__label,\n      &--segment + .nanocb__label,\n      &--segment-pill + .nanocb__label {\n        box-shadow: var(--invalid-shadow);\n        z-index: 1;\n      }\n    }\n  }\n\n  input {\n    @include visually-hide();\n\n    &:focus ~ .nanocb__input {\n      box-shadow: 0 0 15px rgba(0, 0, 0, 0.2), var(--focus-shadow);\n    }\n\n    &.focus-visible:focus ~ .nanocb__input {\n      &--tag + .nanocb__label,\n      &--segment + .nanocb__label,\n      &--segment-pill + .nanocb__label {\n        box-shadow: var(--focus-shadow);\n        z-index: 1;\n      }\n    }\n\n    &:checked ~ .nanocb__input {\n      @include border-radius(var(--cb-border-radius));\n\n      background-color: var(--check-checked-bg-color);\n      transform: rotate(0deg) scale(1);\n      opacity: 1;\n      border: 0.125em solid var(--check-checked-border-color);\n\n      &--segment + .nanocb__label,\n      &--segment-pill + .nanocb__label {\n        color: var(--check-checked-higlight-color);\n        background-color: var(--check-checked-bg-color);\n        box-shadow: inset 0 3px 4px rgba(0, 0, 0, 0.2);\n      }\n\n      &--radio {\n        border-radius: var(--radio-border-radius);\n        border-width: 0.3125em;\n        background-color: var(--check-checked-higlight-color);\n\n        &::after {\n          border: solid var(--check-checked-border-color);\n          border-width: 0 0.125em 0.125em 0;\n          opacity: 0;\n        }\n\n        &::before {\n          border-radius: var(--radio-border-radius);\n        }\n      }\n\n      &--checkbox {\n        &::after {\n          transform: rotate(45deg) scale(1);\n          opacity: 1;\n          left: 0.475em;\n          top: 0.1875em;\n          width: 0.375em;\n          height: 0.75em;\n          border-radius: 0;\n        }\n      }\n\n      &--tag + .nanocb__label::after {\n        transform: rotate(45deg);\n      }\n    }\n\n    &:indeterminate ~ .nanocb__input--checkbox {\n      @include border-radius(var(--input-border-radius, 5px));\n\n      background-color: var(--check-checked-bg-color);\n      transform: rotate(0deg) scale(1);\n      opacity: 1;\n      border: 0.125em solid var(--check-checked-bg-color);\n\n      &::after {\n        transform: scale(1);\n        opacity: 1;\n        left: 0.3125em;\n        top: 0;\n        width: 0.7em;\n        height: 0.7em;\n        border-radius: 0;\n      }\n    }\n  }\n\n  &__label {\n    @include padding(0, 0, 0, 10px);\n\n    display: flex;\n    align-items: center;\n    font-stretch: condensed;\n    line-height: 1;\n    flex: 1;\n    justify-content: space-between;\n\n    &--segment,\n    &--segment-pill {\n      border: var(--check-border-style);\n      border-radius: var(--segment-border-radius);\n      box-shadow: var(--segment-shadow);\n      display: inline-flex;\n      padding: var(--control-padding);\n      background: var(--check-bg-color);\n      color: var(--segment-color);\n      align-items: center;\n      width: 100%;\n    }\n\n    &--segment-pill {\n      // first\n      @include ltr-host(':first-of-type') {\n        border-radius:\n          var(--segment-border-radius) 0 0\n          var(--segment-border-radius);\n        border-right: none;\n      }\n\n      @include rtl-host(':first-of-type') {\n        border-radius:\n          0 var(--segment-border-radius)\n          var(--segment-border-radius) 0;\n        border-left: none;\n      }\n      // middle\n      @include ltr-host(':not(:last-of-type):not(:first-of-type)') {\n        border-radius: 0 0 0 0;\n        border-right: none;\n      }\n\n      @include rtl-host(':not(:last-of-type):not(:first-of-type)') {\n        border-left: none;\n      }\n      // last\n      @include ltr-host(':last-of-type') {\n        border-radius:\n          0 var(--segment-border-radius)\n          var(--segment-border-radius) 0;\n      }\n\n      @include rtl-host(':last-of-type') {\n        border-radius:\n          var(--segment-border-radius) 0 0\n          var(--segment-border-radius);\n      }\n      // single\n      @include host(':first-of-type:last-of-type') {\n        border-radius: var(--segment-border-radius);\n        border: var(--check-border-style);\n      }\n    }\n\n    &--tag {\n      letter-spacing: 2px;\n      font-weight: 500;\n      font-size: 0.65em;\n      line-height: 1.4;\n      padding: var(--control-padding);\n      border: 2px solid #b5aea7;\n      border-color: var(--tagbox-border-color);\n      background-color: var(--tagbox-bg-color);\n      transition: all 0.2s;\n      border-radius: var(--cb-border-radius);\n      width: 100%;\n\n      &::after {\n        content: '+';\n\n        @include margin(0, 0, 0, 0.3125em);\n\n        font-weight: 200;\n        position: relative;\n        font-family: inherit;\n        font-size: 1.8em;\n        display: inline-block;\n        transform: rotate(0deg);\n        transform-origin: center;\n      }\n\n      span {\n        display: block;\n      }\n    }\n  }\n}\n","import {\n  Component,\n  Prop,\n  Event,\n  EventEmitter,\n  h,\n  ComponentInterface,\n  State,\n  Watch,\n  Method,\n  Element,\n  Host,\n} from '@stencil/core';\nimport { CheckboxChangeEventDetail, ControlValidity } from '../../interface';\nimport { Color } from '../../interface';\nimport { createColorClasses } from '../../utils';\nimport { focusVisible } from '../../utils/focus-visible';\n\nlet checkboxIds = 0;\n\n/**\n * `nano-checkbox` is used to let a user choose one or more options from a limited number of options.\n * They appear as checked when activated.\n * They can be checked by mouse, keyboard, touch or programmatically by setting the checked property.\n *\n * @slot - if you do not set a label attribute, you can use this slot for more complex markup\n */\n@Component({\n  tag: 'nano-checkbox',\n  styleUrl: 'checkbox.scss',\n  scoped: true,\n})\nexport class Checkbox implements ComponentInterface {\n  private inputId = `nano-cb-${checkboxIds++}`;\n  private input: HTMLInputElement;\n  private shouldReport = false;\n\n  @Element() private host: HTMLNanoCheckboxElement;\n\n  @State() _invalid = false;\n  @State() inputType: 'checkbox' | 'radio' = 'checkbox';\n\n  /** @internal */\n  @Prop({ mutable: true, reflect: true }) hasFocus = false;\n\n  /**\n   * checked property that can be used to get/set the value. accepts only boolean values\n   */\n  @Prop({ mutable: true, reflect: true }) checked: boolean = false;\n\n  @Watch('checked')\n  async handleCheckedChange() {\n    this.input.checked = this.checked;\n\n    if (this.inputType === 'radio' && this.name && this.checked) {\n      let form = this.host.closest('form');\n      let radios: Element[];\n      if (form) {\n        radios = Array.from(\n          form.querySelectorAll(`nano-checkbox[name=\"${this.name}\"]`)\n        );\n      } else {\n        radios = Array.from(\n          document.querySelectorAll(`nano-checkbox[name=\"${this.name}\"]`)\n        ).filter((radio) => !radio.closest('form'));\n      }\n      radios.map((el: HTMLNanoCheckboxElement) => {\n        if (el !== this.host) el.checked = false;\n      });\n    }\n    this.nanoChange.emit({ value: this.value, checked: this.checked });\n  }\n\n  /**\n   * If `true`, the user cannot interact with the checkbox.\n   */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * The value of a checkbox is analogous to the value of an `<input type='checkbox'>`,\n   * it's only present when `checked` is true.\n   */\n  @Prop() value: string = 'on';\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name: string;\n\n  /**\n   * Set to true to make the field required.\n   */\n  @Prop() required: boolean = false;\n\n  /**\n   * Controls the underlying field type and style.\n   */\n  @Prop({ reflect: true }) type:\n    | 'radio'\n    | 'checkbox'\n    | 'tag'\n    | 'segment'\n    | 'segment-pill' = 'checkbox';\n\n  @Watch('type')\n  typeChange() {\n    if (this.type === 'checkbox' || this.type === 'tag')\n      this.inputType = 'checkbox';\n    else this.inputType = 'radio';\n  }\n\n  /**\n   * label property that can be used to set the label text. Alternatively you may use a label slot.\n   */\n  @Prop() label?: string;\n\n  /**\n   * If `true`, the checkbox will visually appear as indeterminate (only relevant for type=\"checkbox\")\n   */\n  @Prop({ mutable: true, reflect: true }) indeterminate: boolean = false;\n\n  @Watch('indeterminate')\n  handleIndeterminateChange() {\n    this.checked = false;\n    this.input.indeterminate = this.indeterminate;\n  }\n\n  /**\n   * This will be true when the control is in an invalid state.\n   * Validity is determined by the `required` prop. Or if custom validity message is set. @readonly\n   */\n  @Prop({ reflect: true })\n  get invalid() {\n    if (!this.shouldReport) return false;\n    return !this.input.validity.valid;\n  }\n\n  /**\n   * Color to use from your application's color palette.\n   */\n  @Prop() color?: Color;\n\n  /**\n   * Emited when the checkbox is toggled\n   */\n  @Event() nanoChange: EventEmitter<CheckboxChangeEventDetail>;\n\n  /**\n   * Emited when the checkbox is focused\n   */\n  @Event() nanoFocus: EventEmitter;\n\n  /**\n   * Emited when the checkbox is blurred\n   */\n  @Event() nanoBlur: EventEmitter;\n\n  // public methods\n\n  /**\n   * Returns the native input control\n   */\n  @Method()\n  async getInputElement() {\n    if (this.input) return this.input;\n  }\n\n  /**\n   * Get the current state of the control.\n   * @param validateFirst - perform validation first before reporting\n   * @returns `Promise<{ isValid: boolean, errorMessage: string }>`\n   */\n  @Method()\n  async reportValidity(\n    validateFirst: boolean = false\n  ): Promise<ControlValidity> {\n    if (validateFirst) {\n      this.shouldReport = true;\n      this._invalid = !this.input.reportValidity();\n    }\n    return {\n      isValid: !this.invalid,\n      errorMessage: this.input.validationMessage,\n    };\n  }\n\n  /**\n   * Sets a custom validation message.\n   * If `message` is not empty, the field will be considered invalid. Use in conjunction with `nano-checkbox-group`\n   */\n  @Method()\n  async setError(message: string) {\n    if (!this.input) return;\n\n    this._invalid = !!message.length;\n    this.input.setCustomValidity(message);\n  }\n\n  /**\n   * Sets focus on the checkbox.\n   */\n  @Method()\n  async setFocus() {\n    if (this.input) {\n      this.input.focus();\n      focusVisible.force(this.input);\n    }\n  }\n\n  /**\n   * Removes focus from the checkbox.\n   */\n  @Method()\n  async removeFocus() {\n    if (this.input) {\n      this.input.blur();\n      focusVisible.force(this.input, false);\n    }\n  }\n\n  // private handlers\n\n  private handleInvalid = (ev: Event) => {\n    this.shouldReport = true;\n    this._invalid = !(ev.target as HTMLInputElement).validity.valid;\n  };\n\n  private handleChange = (ev: InputEvent) => {\n    this.checked = (ev.target as HTMLInputElement).checked;\n    this.indeterminate = false;\n  };\n\n  private handleFocus = () => {\n    this.hasFocus = true;\n    this.nanoFocus.emit();\n  };\n\n  private handleBlur = () => {\n    this.hasFocus = false;\n    this.nanoBlur.emit();\n  };\n\n  /* Although many radio components can be 'checked',\n  the underlying control may not be. Check */\n  private isRadioChecked() {\n    setTimeout(() => (this.checked = this.input.checked), 20);\n  }\n\n  // Stencil hooks\n\n  componentWillLoad() {\n    this.typeChange();\n  }\n\n  componentDidLoad() {\n    this.input.indeterminate = this.indeterminate;\n    this.isRadioChecked();\n    focusVisible.observe(this.input);\n  }\n\n  disconnectedCallback() {\n    focusVisible.unobserve(this.input);\n  }\n\n  render() {\n    const labelId = this.inputId + '-lbl';\n    let isRtl = (this.host.ownerDocument as Document).dir === 'rtl';\n\n    return (\n      <Host\n        class={{ ...createColorClasses(this.color) }}\n        dir={isRtl ? 'rtl' : null}\n      >\n        <label\n          class={{\n            nanocb: true,\n            'nanocb--checked': this.checked,\n            'nanocb--invalid': this.invalid,\n            'nanocb--disabled': this.disabled,\n            'nanocb--focused': this.hasFocus,\n            'nanocb--indeterminate': this.indeterminate,\n          }}\n          htmlFor={this.inputId}\n        >\n          <input\n            type={this.inputType}\n            name={this.name}\n            required={this.required}\n            checked={this.checked}\n            disabled={this.disabled}\n            value={this.value}\n            aria-labelledby={labelId}\n            onBlur={this.handleBlur}\n            onFocus={this.handleFocus}\n            onChange={this.handleChange}\n            ref={(input) => (this.input = input)}\n            id={this.inputId}\n            onInvalid={this.handleInvalid}\n          />\n          <span class={'nanocb__input nanocb__input--' + this.type}></span>\n\n          <div id={labelId} class={'nanocb__label nanocb__label--' + this.type}>\n            {this.label && !!this.label.length && <span>{this.label}</span>}\n            <span hidden={this.label && !!this.label.length}>\n              <slot />\n            </span>\n          </div>\n        </label>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"sources":["src/components/checkbox/checkbox.scss?tag=nano-checkbox&encapsulation=scoped","src/components/checkbox/checkbox.tsx"],"names":["checkboxCss","checkboxIds","Checkbox","exports","class_1","hostRef","_this","this","inputId","shouldReport","_invalid","inputType","hasFocus","checked","disabled","value","required","type","indeterminate","handleInvalid","ev","target","validity","valid","handleChange","handleFocus","nanoFocus","emit","handleBlur","nanoBlur","prototype","handleCheckedChange","input","name","form","host","closest","radios","Array","from","querySelectorAll","document","filter","radio","map","el","nanoChange","typeChange","handleIndeterminateChange","Object","defineProperty","getInputElement","reportValidity","validateFirst","isValid","invalid","errorMessage","validationMessage","setError","message","length","setCustomValidity","setFocus","focus","focusVisible","force","removeFocus","blur","isRadioChecked","setTimeout","componentWillLoad","componentDidLoad","observe","disconnectedCallback","unobserve","render","labelId","isRtl","ownerDocument","dir","h","Host","class","assign","createColorClasses","color","nanocb","nanocb--checked","nanocb--invalid","nanocb--disabled","nanocb--focused","nanocb--indeterminate","htmlFor","aria-labelledby","onBlur","onFocus","onChange","ref","id","onInvalid","label","hidden"],"mappings":";;;iQAAA,IAAMA,EAAc,ohWCkBpB,IAAIC,EAAc,MAcLC,EAAQC,EAAA,gBAAA,WALrB,SAAAC,EAAAC,GAAA,IAAAC,EAAAC,8HAMUA,KAAAC,QAAU,WAAWP,IAErBM,KAAAE,aAAe,MAIdF,KAAAG,SAAW,MACXH,KAAAI,UAAkC,WAGHJ,KAAAK,SAAW,MAKXL,KAAAM,QAAmB,MA4BlCN,KAAAO,SAAoB,MAMpBP,KAAAQ,MAAgB,KAUhBR,KAAAS,SAAoB,MAKpBT,KAAAU,KAKJ,WAiBmBV,KAAAW,cAAyB,MAuGzDX,KAAAY,cAAgB,SAACC,GACvBd,EAAKG,aAAe,KACpBH,EAAKI,UAAaU,EAAGC,OAA4BC,SAASC,OAGpDhB,KAAAiB,aAAe,SAACJ,GACtBd,EAAKO,QAAWO,EAAGC,OAA4BR,QAC/CP,EAAKY,cAAgB,OAGfX,KAAAkB,YAAc,WACpBnB,EAAKM,SAAW,KAChBN,EAAKoB,UAAUC,QAGTpB,KAAAqB,WAAa,WACnBtB,EAAKM,SAAW,MAChBN,EAAKuB,SAASF,QA5LVvB,EAAA0B,UAAAC,oBAAN,mHACExB,KAAKyB,MAAMnB,QAAUN,KAAKM,QAE1B,GAAIN,KAAKI,YAAc,SAAWJ,KAAK0B,MAAQ1B,KAAKM,QAAS,CACvDqB,EAAO3B,KAAK4B,KAAKC,QAAQ,QACzBC,OAAiB,EACrB,GAAIH,EAAM,CACRG,EAASC,MAAMC,KACbL,EAAKM,iBAAiB,uBAAuBjC,KAAK0B,KAAI,WAEnD,CACLI,EAASC,MAAMC,KACbE,SAASD,iBAAiB,uBAAuBjC,KAAK0B,KAAI,OAC1DS,QAAO,SAACC,GAAU,OAACA,EAAMP,QAAQ,WAErCC,EAAOO,KAAI,SAACC,GACV,GAAIA,IAAOvC,EAAK6B,KAAMU,EAAGhC,QAAU,SAGvCN,KAAKuC,WAAWnB,KAAK,CAAEZ,MAAOR,KAAKQ,MAAOF,QAASN,KAAKM,2BAmC1DT,EAAA0B,UAAAiB,WAAA,WACE,GAAIxC,KAAKU,OAAS,YAAcV,KAAKU,OAAS,MAC5CV,KAAKI,UAAY,gBACdJ,KAAKI,UAAY,SAcxBP,EAAA0B,UAAAkB,0BAAA,WACEzC,KAAKM,QAAU,MACfN,KAAKyB,MAAMd,cAAgBX,KAAKW,eAOlC+B,OAAAC,eACI9C,EAAA0B,UAAA,UAAO,KADX,WAEE,IAAKvB,KAAKE,aAAc,OAAO,MAC/B,OAAQF,KAAKyB,MAAMV,SAASC,4CA6BxBnB,EAAA0B,UAAAqB,gBAAN,gGACE,GAAI5C,KAAKyB,MAAO,MAAA,CAAA,EAAOzB,KAAKyB,wBASxB5B,EAAA0B,UAAAsB,eAAN,SACEC,GAAA,GAAAA,SAAA,EAAA,CAAAA,EAAA,2FAEA,GAAIA,EAAe,CACjB9C,KAAKE,aAAe,KACpBF,KAAKG,UAAYH,KAAKyB,MAAMoB,iBAE9B,MAAA,CAAA,EAAO,CACLE,SAAU/C,KAAKgD,QACfC,aAAcjD,KAAKyB,MAAMyB,2BASvBrD,EAAA0B,UAAA4B,SAAN,SAAeC,wFACb,IAAKpD,KAAKyB,MAAO,MAAA,CAAA,GAEjBzB,KAAKG,WAAaiD,EAAQC,OAC1BrD,KAAKyB,MAAM6B,kBAAkBF,oBAOzBvD,EAAA0B,UAAAgC,SAAN,gGACE,GAAIvD,KAAKyB,MAAO,CACdzB,KAAKyB,MAAM+B,QACXC,EAAaC,MAAM1D,KAAKyB,wBAQtB5B,EAAA0B,UAAAoC,YAAN,gGACE,GAAI3D,KAAKyB,MAAO,CACdzB,KAAKyB,MAAMmC,OACXH,EAAaC,MAAM1D,KAAKyB,MAAO,wBA4B3B5B,EAAA0B,UAAAsC,eAAA,WAAA,IAAA9D,EAAAC,KACN8D,YAAW,WAAA,OAAO/D,EAAKO,QAAUP,EAAK0B,MAAMnB,UAAU,KAKxDT,EAAA0B,UAAAwC,kBAAA,WACE/D,KAAKwC,cAGP3C,EAAA0B,UAAAyC,iBAAA,WACEhE,KAAKyB,MAAMd,cAAgBX,KAAKW,cAChCX,KAAK6D,iBACLJ,EAAaQ,QAAQjE,KAAKyB,QAG5B5B,EAAA0B,UAAA2C,qBAAA,WACET,EAAaU,UAAUnE,KAAKyB,QAG9B5B,EAAA0B,UAAA6C,OAAA,WAAA,IAAArE,EAAAC,KACE,IAAMqE,EAAUrE,KAAKC,QAAU,OAC/B,IAAIqE,EAAStE,KAAK4B,KAAK2C,cAA2BC,MAAQ,MAE1D,OACEC,EAACC,EAAI,CACHC,MAAKjC,OAAAkC,OAAA,GAAOC,EAAmB7E,KAAK8E,QACpCN,IAAKF,EAAQ,MAAQ,MAErBG,EAAA,QAAA,CACEE,MAAO,CACLI,OAAQ,KACRC,kBAAmBhF,KAAKM,QACxB2E,kBAAmBjF,KAAKgD,QACxBkC,mBAAoBlF,KAAKO,SACzB4E,kBAAmBnF,KAAKK,SACxB+E,wBAAyBpF,KAAKW,eAEhC0E,QAASrF,KAAKC,SAEdwE,EAAA,QAAA,CACE/D,KAAMV,KAAKI,UACXsB,KAAM1B,KAAK0B,KACXjB,SAAUT,KAAKS,SACfH,QAASN,KAAKM,QACdC,SAAUP,KAAKO,SACfC,MAAOR,KAAKQ,MAAK8E,kBACAjB,EACjBkB,OAAQvF,KAAKqB,WACbmE,QAASxF,KAAKkB,YACduE,SAAUzF,KAAKiB,aACfyE,IAAK,SAACjE,GAAK,OAAM1B,EAAK0B,MAAQA,GAC9BkE,GAAI3F,KAAKC,QACT2F,UAAW5F,KAAKY,gBAElB6D,EAAA,OAAA,CAAME,MAAO,gCAAkC3E,KAAKU,OAEpD+D,EAAA,MAAA,CAAKkB,GAAItB,EAASM,MAAO,gCAAkC3E,KAAKU,MAC7DV,KAAK6F,SAAW7F,KAAK6F,MAAMxC,QAAUoB,EAAA,OAAA,KAAOzE,KAAK6F,OAClDpB,EAAA,OAAA,CAAMqB,OAAQ9F,KAAK6F,SAAW7F,KAAK6F,MAAMxC,QACvCoB,EAAA,OAAA,mUAhRO","sourcesContent":["@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/base';\n\n:host {\n  /**\n   * @prop --control-invalid-style: Control box-shadow when invalid. Defaults to to #{$control-invalid-style};\n   * @prop --focus-shadow: Control focus box-shadow. Defaults to to #{$control-focus-style};\n   * @prop --padding: padding around radio and checkbox controls. Defaults to initial;\n   * @prop --control-padding: padding around tag and segmented controls text. Various defaults.\n\n   * @prop --check-bg-color: Initial Bg color of radio / checkbox controls. Changes for [checked] and [disabled] states. Defaults to #{map.get($colors, white)};\n   * @prop --check-border-style: Initial border style. Defaults to 1px solid #{map.get($colors, palegrey)};\n   * @prop --check-checked-bg-color: Checked bg of controls (not tag). Defaults to #{map.get($colors, darkgrey)};\n   * @prop --check-checked-border-color: Checked border color of radio / checkbox controls. Defaults to #{map.get($colors, darkgrey)};\n   * @prop --check-checked-higlight-color: Checked forgrdound / icon color. Defaults to #{map.get($colors, white)};\n   * @prop --check-base-size: Relative scaling size for check controls. Defaults to to inherit;\n\n   * @prop --cb-border-radius: Checkbox border radius. Defaults to to 2px and 5px on [has-focus];\n   * @prop --radio-border-radius: Radio border radius. Defaults to to 50%;\n   * @prop --tagbox-rgb: an rba list for tags which can be used to generate --tagbox-border-color and --tagbox-bg-color. Defaults to #{color-to-rgb-list(map.get($colors, lightblue))};\n   * @prop --tagbox-border-color: Defaults to rgba(var(--tagbox-rgb), .5);\n   * @prop --tagbox-bg-color: Defaults to rgba(var(--tagbox-rgb), .1);\n   * @prop --segment-color: Segment, unselected text color. (selected color is --check-checked-higlight-color). Defaults to #{map.get($colors, blue)};\n   * @prop --segment-border-radius: Defaults to 3px;\n   * @prop --segment-shadow: 0 1px 4px rgba(0,0,0,.2);\n  */\n\n  --focus-shadow: #{$control-focus-style};\n  --invalid-shadow: #{$control-invalid-style};\n  --padding: initial;\n  --check-bg-color: #{map.get($colors, white)};\n  --check-border-style: 1px solid #{map.get($colors, palegrey)};\n  --check-checked-bg-color: #{map.get($colors, darkgrey)};\n  --check-checked-border-color: #{map.get($colors, darkgrey)};\n  --check-checked-higlight-color: #{map.get($colors, white)};\n  --check-base-size: inherit;\n\n  // type specific\n\n  --tagbox-rgb: #{color-to-rgb-list(map.get($colors, lightblue))};\n  --tagbox-border-color: rgba(var(--tagbox-rgb), 0.5);\n  --tagbox-bg-color: rgba(var(--tagbox-rgb), 0.2);\n  --tagbox-border-radius: 0;\n  --segment-color: #{map.get($colors, blue)};\n  --segment-border-radius: 3px;\n  --segment-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);\n  --cb-border-radius: 2px;\n  --radio-border-radius: 50%;\n\n  display: inline-block;\n  max-width: 100%;\n\n  * {\n    box-sizing: inherit;\n  }\n}\n\n:host([type='tag']) {\n  text-transform: uppercase;\n\n  --control-padding: 0.2rem 1rem;\n}\n\n:host([type='segment']) {\n  --check-border-style: none;\n  --control-padding: 0.7em 1em 0.7em 1em;\n}\n\n:host([type='segment-pill']) {\n  --check-border-style: 1px solid #{rgba(map.get($colors, palegrey), 0.5)};\n  --segment-border-radius: 5px;\n  --control-padding: 0.7em 1em 0.7em 1em;\n}\n\n:host(.nano-color) {\n  --tagbox-rgb: var(--nano-color-base-rgb);\n  --focus-shadow: #{$control-focus-size} var(--nano-color-shade);\n}\n\n:host([checked]:not([checked='false'])) {\n  --tagbox-border-color: rgba(var(--tagbox-rgb), 0.8);\n  --tagbox-bg-color: rgba(var(--tagbox-rgb), 0.5);\n}\n\n:host([has-focus]:not([has-focus='false'])) {\n  --cb-border-radius: 5px;\n}\n\n:host([disabled]:not([disabled='false'])) {\n  opacity: 0.7;\n\n  --tagbox-rgb: #{color-to-rgb-list(map.get($colors, mediumgrey))};\n  --check-bg-color: #{rgba(map.get($colors, mediumgrey), 0.5)};\n  --check-checked-bg-color: #{rgba(map.get($colors, mediumgrey), 0.5)};\n  --segment-color: #{map.get($colors, darkgrey)};\n}\n\n.nanocb {\n  padding: var(--padding);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  line-height: 1.2;\n  position: relative;\n\n  &__input {\n    @include border-radius(var(--cb-border-radius, 3px));\n\n    font-size: var(--check-base-size);\n    position: relative;\n    height: 1.5em;\n    width: 1.5em;\n    min-width: 1.5em;\n    border: var(--check-border-style);\n    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);\n\n    &::before {\n      @include border-radius(var(--cb-border-radius));\n\n      position: absolute;\n      content: '';\n      left: 0.625em;\n      top: 0.625em;\n      width: 0;\n      height: 0;\n      border: 2px solid var(--check-checked-higlight-color);\n      transform: scale(0);\n    }\n\n    &--radio {\n      @include border-radius(var(--radio-border-radius));\n\n      background-color: var(--check-bg-color);\n    }\n\n    &--checkbox {\n      background-color: var(--check-bg-color);\n\n      &::after {\n        @include border-radius(var(--cb-border-radius));\n\n        position: absolute;\n        content: '';\n        left: 0.75em;\n        top: 0.75em;\n        height: 0;\n        width: 0;\n        border: solid var(--check-checked-higlight-color);\n        border-width: 0 0.1875em 0.1875em 0;\n        transform: rotate(0deg) scale(0);\n        opacity: 1;\n        transition: all 0.15s ease-out;\n\n        .nanocb--indeterminate & {\n          border-width: 0 0 0.1875em 0;\n        }\n      }\n    }\n\n    &--segment,\n    &--segment-pill {\n      @include visually-hide();\n\n      &::before {\n        display: none;\n      }\n    }\n\n    &--tag {\n      @include visually-hide();\n\n      &::before {\n        display: none;\n      }\n    }\n  }\n\n  &--invalid:not(.nanocb--focused) {\n    .nanocb__input {\n      box-shadow: 0 0 15px rgba(0, 0, 0, 0.2), var(--invalid-shadow);\n\n      &--tag + .nanocb__label,\n      &--segment + .nanocb__label,\n      &--segment-pill + .nanocb__label {\n        box-shadow: var(--invalid-shadow);\n        z-index: 1;\n      }\n    }\n  }\n\n  input {\n    @include visually-hide();\n\n    &:focus ~ .nanocb__input {\n      box-shadow: 0 0 15px rgba(0, 0, 0, 0.2), var(--focus-shadow);\n    }\n\n    &.focus-visible:focus ~ .nanocb__input {\n      &--tag + .nanocb__label,\n      &--segment + .nanocb__label,\n      &--segment-pill + .nanocb__label {\n        box-shadow: var(--focus-shadow);\n        z-index: 1;\n      }\n    }\n\n    &:checked ~ .nanocb__input {\n      @include border-radius(var(--cb-border-radius));\n\n      background-color: var(--check-checked-bg-color);\n      transform: rotate(0deg) scale(1);\n      opacity: 1;\n      border: 0.125em solid var(--check-checked-border-color);\n\n      &--segment + .nanocb__label,\n      &--segment-pill + .nanocb__label {\n        color: var(--check-checked-higlight-color);\n        background-color: var(--check-checked-bg-color);\n        box-shadow: inset 0 3px 4px rgba(0, 0, 0, 0.2);\n      }\n\n      &--radio {\n        border-radius: var(--radio-border-radius);\n        border-width: 0.3125em;\n        background-color: var(--check-checked-higlight-color);\n\n        &::after {\n          border: solid var(--check-checked-border-color);\n          border-width: 0 0.125em 0.125em 0;\n          opacity: 0;\n        }\n\n        &::before {\n          border-radius: var(--radio-border-radius);\n        }\n      }\n\n      &--checkbox {\n        &::after {\n          transform: rotate(45deg) scale(1);\n          opacity: 1;\n          left: 0.475em;\n          top: 0.1875em;\n          width: 0.375em;\n          height: 0.75em;\n          border-radius: 0;\n        }\n      }\n\n      &--tag + .nanocb__label::after {\n        transform: rotate(45deg);\n      }\n    }\n\n    &:indeterminate ~ .nanocb__input--checkbox {\n      @include border-radius(var(--input-border-radius, 5px));\n\n      background-color: var(--check-checked-bg-color);\n      transform: rotate(0deg) scale(1);\n      opacity: 1;\n      border: 0.125em solid var(--check-checked-bg-color);\n\n      &::after {\n        transform: scale(1);\n        opacity: 1;\n        left: 0.3125em;\n        top: 0;\n        width: 0.7em;\n        height: 0.7em;\n        border-radius: 0;\n      }\n    }\n  }\n\n  &__label {\n    @include padding(0, 0, 0, 10px);\n\n    display: flex;\n    align-items: center;\n    font-stretch: condensed;\n    line-height: 1;\n    flex: 1;\n    justify-content: space-between;\n\n    &--segment,\n    &--segment-pill {\n      border: var(--check-border-style);\n      border-radius: var(--segment-border-radius);\n      box-shadow: var(--segment-shadow);\n      display: inline-flex;\n      padding: var(--control-padding);\n      background: var(--check-bg-color);\n      color: var(--segment-color);\n      align-items: center;\n      width: 100%;\n    }\n\n    &--segment-pill {\n      // first\n      @include ltr-host(':first-of-type') {\n        border-radius:\n          var(--segment-border-radius) 0 0\n          var(--segment-border-radius);\n        border-right: none;\n      }\n\n      @include rtl-host(':first-of-type') {\n        border-radius:\n          0 var(--segment-border-radius)\n          var(--segment-border-radius) 0;\n        border-left: none;\n      }\n      // middle\n      @include ltr-host(':not(:last-of-type):not(:first-of-type)') {\n        border-radius: 0 0 0 0;\n        border-right: none;\n      }\n\n      @include rtl-host(':not(:last-of-type):not(:first-of-type)') {\n        border-left: none;\n      }\n      // last\n      @include ltr-host(':last-of-type') {\n        border-radius:\n          0 var(--segment-border-radius)\n          var(--segment-border-radius) 0;\n      }\n\n      @include rtl-host(':last-of-type') {\n        border-radius:\n          var(--segment-border-radius) 0 0\n          var(--segment-border-radius);\n      }\n      // single\n      @include host(':first-of-type:last-of-type') {\n        border-radius: var(--segment-border-radius);\n        border: var(--check-border-style);\n      }\n    }\n\n    &--tag {\n      letter-spacing: 2px;\n      font-weight: 500;\n      font-size: 0.65em;\n      line-height: 1.4;\n      padding: var(--control-padding);\n      border: 2px solid #b5aea7;\n      border-color: var(--tagbox-border-color);\n      background-color: var(--tagbox-bg-color);\n      transition: all 0.2s;\n      border-radius: var(--cb-border-radius);\n      width: 100%;\n\n      &::after {\n        content: '+';\n\n        @include margin(0, 0, 0, 0.3125em);\n\n        font-weight: 200;\n        position: relative;\n        font-family: inherit;\n        font-size: 1.8em;\n        display: inline-block;\n        transform: rotate(0deg);\n        transform-origin: center;\n      }\n\n      span {\n        display: block;\n      }\n    }\n  }\n}\n","import {\n  Component,\n  Prop,\n  Event,\n  EventEmitter,\n  h,\n  ComponentInterface,\n  State,\n  Watch,\n  Method,\n  Element,\n  Host,\n} from '@stencil/core';\nimport { CheckboxChangeEventDetail, ControlValidity } from '../../interface';\nimport { Color } from '../../interface';\nimport { createColorClasses } from '../../utils';\nimport { focusVisible } from '../../utils/focus-visible';\n\nlet checkboxIds = 0;\n\n/**\n * `nano-checkbox` is used to let a user choose one or more options from a limited number of options.\n * They appear as checked when activated.\n * They can be checked by mouse, keyboard, touch or programmatically by setting the checked property.\n *\n * @slot - if you do not set a label attribute, you can use this slot for more complex markup\n */\n@Component({\n  tag: 'nano-checkbox',\n  styleUrl: 'checkbox.scss',\n  scoped: true,\n})\nexport class Checkbox implements ComponentInterface {\n  private inputId = `nano-cb-${checkboxIds++}`;\n  private input: HTMLInputElement;\n  private shouldReport = false;\n\n  @Element() private host: HTMLNanoCheckboxElement;\n\n  @State() _invalid = false;\n  @State() inputType: 'checkbox' | 'radio' = 'checkbox';\n\n  /** @internal */\n  @Prop({ mutable: true, reflect: true }) hasFocus = false;\n\n  /**\n   * checked property that can be used to get/set the value. accepts only boolean values\n   */\n  @Prop({ mutable: true, reflect: true }) checked: boolean = false;\n\n  @Watch('checked')\n  async handleCheckedChange() {\n    this.input.checked = this.checked;\n\n    if (this.inputType === 'radio' && this.name && this.checked) {\n      let form = this.host.closest('form');\n      let radios: Element[];\n      if (form) {\n        radios = Array.from(\n          form.querySelectorAll(`nano-checkbox[name=\"${this.name}\"]`)\n        );\n      } else {\n        radios = Array.from(\n          document.querySelectorAll(`nano-checkbox[name=\"${this.name}\"]`)\n        ).filter((radio) => !radio.closest('form'));\n      }\n      radios.map((el: HTMLNanoCheckboxElement) => {\n        if (el !== this.host) el.checked = false;\n      });\n    }\n    this.nanoChange.emit({ value: this.value, checked: this.checked });\n  }\n\n  /**\n   * If `true`, the user cannot interact with the checkbox.\n   */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * The value of a checkbox is analogous to the value of an `<input type='checkbox'>`,\n   * it's only present when `checked` is true.\n   */\n  @Prop({ reflect: true }) value: string = 'on';\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop({ reflect: true }) name: string;\n\n  /**\n   * Set to true to make the field required.\n   */\n  @Prop({ reflect: true }) required: boolean = false;\n\n  /**\n   * Controls the underlying field type and style.\n   */\n  @Prop({ reflect: true }) type:\n    | 'radio'\n    | 'checkbox'\n    | 'tag'\n    | 'segment'\n    | 'segment-pill' = 'checkbox';\n\n  @Watch('type')\n  typeChange() {\n    if (this.type === 'checkbox' || this.type === 'tag')\n      this.inputType = 'checkbox';\n    else this.inputType = 'radio';\n  }\n\n  /**\n   * label property that can be used to set the label text. Alternatively you may use a label slot.\n   */\n  @Prop() label?: string;\n\n  /**\n   * If `true`, the checkbox will visually appear as indeterminate (only relevant for type=\"checkbox\")\n   */\n  @Prop({ mutable: true, reflect: true }) indeterminate: boolean = false;\n\n  @Watch('indeterminate')\n  handleIndeterminateChange() {\n    this.checked = false;\n    this.input.indeterminate = this.indeterminate;\n  }\n\n  /**\n   * This will be true when the control is in an invalid state.\n   * Validity is determined by the `required` prop. Or if custom validity message is set. @readonly\n   */\n  @Prop({ reflect: true })\n  get invalid() {\n    if (!this.shouldReport) return false;\n    return !this.input.validity.valid;\n  }\n\n  /**\n   * Color to use from your application's color palette.\n   */\n  @Prop() color?: Color;\n\n  /**\n   * Emited when the checkbox is toggled\n   */\n  @Event() nanoChange: EventEmitter<CheckboxChangeEventDetail>;\n\n  /**\n   * Emited when the checkbox is focused\n   */\n  @Event() nanoFocus: EventEmitter;\n\n  /**\n   * Emited when the checkbox is blurred\n   */\n  @Event() nanoBlur: EventEmitter;\n\n  // public methods\n\n  /**\n   * Returns the native input control\n   */\n  @Method()\n  async getInputElement() {\n    if (this.input) return this.input;\n  }\n\n  /**\n   * Get the current state of the control.\n   * @param validateFirst - perform validation first before reporting\n   * @returns `Promise<{ isValid: boolean, errorMessage: string }>`\n   */\n  @Method()\n  async reportValidity(\n    validateFirst: boolean = false\n  ): Promise<ControlValidity> {\n    if (validateFirst) {\n      this.shouldReport = true;\n      this._invalid = !this.input.reportValidity();\n    }\n    return {\n      isValid: !this.invalid,\n      errorMessage: this.input.validationMessage,\n    };\n  }\n\n  /**\n   * Sets a custom validation message.\n   * If `message` is not empty, the field will be considered invalid. Use in conjunction with `nano-checkbox-group`\n   */\n  @Method()\n  async setError(message: string) {\n    if (!this.input) return;\n\n    this._invalid = !!message.length;\n    this.input.setCustomValidity(message);\n  }\n\n  /**\n   * Sets focus on the checkbox.\n   */\n  @Method()\n  async setFocus() {\n    if (this.input) {\n      this.input.focus();\n      focusVisible.force(this.input);\n    }\n  }\n\n  /**\n   * Removes focus from the checkbox.\n   */\n  @Method()\n  async removeFocus() {\n    if (this.input) {\n      this.input.blur();\n      focusVisible.force(this.input, false);\n    }\n  }\n\n  // private handlers\n\n  private handleInvalid = (ev: Event) => {\n    this.shouldReport = true;\n    this._invalid = !(ev.target as HTMLInputElement).validity.valid;\n  };\n\n  private handleChange = (ev: InputEvent) => {\n    this.checked = (ev.target as HTMLInputElement).checked;\n    this.indeterminate = false;\n  };\n\n  private handleFocus = () => {\n    this.hasFocus = true;\n    this.nanoFocus.emit();\n  };\n\n  private handleBlur = () => {\n    this.hasFocus = false;\n    this.nanoBlur.emit();\n  };\n\n  /* Although many radio components can be 'checked',\n  the underlying control may not be. Check */\n  private isRadioChecked() {\n    setTimeout(() => (this.checked = this.input.checked), 20);\n  }\n\n  // Stencil hooks\n\n  componentWillLoad() {\n    this.typeChange();\n  }\n\n  componentDidLoad() {\n    this.input.indeterminate = this.indeterminate;\n    this.isRadioChecked();\n    focusVisible.observe(this.input);\n  }\n\n  disconnectedCallback() {\n    focusVisible.unobserve(this.input);\n  }\n\n  render() {\n    const labelId = this.inputId + '-lbl';\n    let isRtl = (this.host.ownerDocument as Document).dir === 'rtl';\n\n    return (\n      <Host\n        class={{ ...createColorClasses(this.color) }}\n        dir={isRtl ? 'rtl' : null}\n      >\n        <label\n          class={{\n            nanocb: true,\n            'nanocb--checked': this.checked,\n            'nanocb--invalid': this.invalid,\n            'nanocb--disabled': this.disabled,\n            'nanocb--focused': this.hasFocus,\n            'nanocb--indeterminate': this.indeterminate,\n          }}\n          htmlFor={this.inputId}\n        >\n          <input\n            type={this.inputType}\n            name={this.name}\n            required={this.required}\n            checked={this.checked}\n            disabled={this.disabled}\n            value={this.value}\n            aria-labelledby={labelId}\n            onBlur={this.handleBlur}\n            onFocus={this.handleFocus}\n            onChange={this.handleChange}\n            ref={(input) => (this.input = input)}\n            id={this.inputId}\n            onInvalid={this.handleInvalid}\n          />\n          <span class={'nanocb__input nanocb__input--' + this.type}></span>\n\n          <div id={labelId} class={'nanocb__label nanocb__label--' + this.type}>\n            {this.label && !!this.label.length && <span>{this.label}</span>}\n            <span hidden={this.label && !!this.label.length}>\n              <slot />\n            </span>\n          </div>\n        </label>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/nano-components/{p-d35d468b.system.js → p-9745d44e.system.js}

@@ -1,5 +1,5 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-System.register(["./p-1c216ca4.system.js"],(function(e){"use strict";var t;return{setters:[function(e){t=e.r}],execute:function(){var r="top";var n="bottom";var i="right";var a="left";var o="auto";var s=[r,n,i,a];var f="start";var p="end";var u="clippingParents";var c="viewport";var v="popper";var l="reference";var d=s.reduce((function(e,t){return e.concat([t+"-"+f,t+"-"+p])}),[]);var h=[].concat(s,[o]).reduce((function(e,t){return e.concat([t,t+"-"+f,t+"-"+p])}),[]);var m="beforeRead";var g="read";var y="afterRead";var b="beforeMain";var w="main";var x="afterMain";var O="beforeWrite";var E="write";var j="afterWrite";var A=[m,g,y,b,w,x,O,E,j];function L(e){return e?(e.nodeName||"").toLowerCase():null}function D(e){if(e==null){return window}if(e.toString()!=="[object Window]"){var t=e.ownerDocument;return t?t.defaultView||window:window}return e}function k(e){var t=D(e).Element;return e instanceof t||e instanceof Element}function W(e){var t=D(e).HTMLElement;return e instanceof t||e instanceof HTMLElement}function T(e){if(typeof ShadowRoot==="undefined"){return false}var t=D(e).ShadowRoot;return e instanceof t||e instanceof ShadowRoot}function P(e){var t=e.state;Object.keys(t.elements).forEach((function(e){var r=t.styles[e]||{};var n=t.attributes[e]||{};var i=t.elements[e];if(!W(i)||!L(i)){return}Object.assign(i.style,r);Object.keys(n).forEach((function(e){var t=n[e];if(t===false){i.removeAttribute(e)}else{i.setAttribute(e,t===true?"":t)}}))}))}function M(e){var t=e.state;var r={popper:{position:t.options.strategy,left:"0",top:"0",margin:"0"},arrow:{position:"absolute"},reference:{}};Object.assign(t.elements.popper.style,r.popper);t.styles=r;if(t.elements.arrow){Object.assign(t.elements.arrow.style,r.arrow)}return function(){Object.keys(t.elements).forEach((function(e){var n=t.elements[e];var i=t.attributes[e]||{};var a=Object.keys(t.styles.hasOwnProperty(e)?t.styles[e]:r[e]);var o=a.reduce((function(e,t){e[t]="";return e}),{});if(!W(n)||!L(n)){return}Object.assign(n.style,o);Object.keys(i).forEach((function(e){n.removeAttribute(e)}))}))}}var C={name:"applyStyles",enabled:true,phase:"write",fn:P,effect:M,requires:["computeStyles"]};function H(e){return e.split("-")[0]}var B=Math.max;var S=Math.min;var R=Math.round;function V(e,t){if(t===void 0){t=false}var r=e.getBoundingClientRect();var n=1;var i=1;if(W(e)&&t){var a=e.offsetHeight;var o=e.offsetWidth;if(o>0){n=R(r.width)/o||1}if(a>0){i=R(r.height)/a||1}}return{width:r.width/n,height:r.height/i,top:r.top/i,right:r.right/n,bottom:r.bottom/i,left:r.left/n,x:r.left/n,y:r.top/i}}function q(e){var t=V(e);var r=e.offsetWidth;var n=e.offsetHeight;if(Math.abs(t.width-r)<=1){r=t.width}if(Math.abs(t.height-n)<=1){n=t.height}return{x:e.offsetLeft,y:e.offsetTop,width:r,height:n}}function N(e,t){var r=t.getRootNode&&t.getRootNode();if(e.contains(t)){return true}else if(r&&T(r)){var n=t;do{if(n&&e.isSameNode(n)){return true}n=n.parentNode||n.host}while(n)}return false}function F(e){return D(e).getComputedStyle(e)}function I(e){return["table","td","th"].indexOf(L(e))>=0}function U(e){return((k(e)?e.ownerDocument:e.document)||window.document).documentElement}function z(e){if(L(e)==="html"){return e}return e.assignedSlot||e.parentNode||(T(e)?e.host:null)||U(e)}function _(e){if(!W(e)||F(e).position==="fixed"){return null}return e.offsetParent}function X(e){var t=navigator.userAgent.toLowerCase().indexOf("firefox")!==-1;var r=navigator.userAgent.indexOf("Trident")!==-1;if(r&&W(e)){var n=F(e);if(n.position==="fixed"){return null}}var i=z(e);if(T(i)){i=i.host}while(W(i)&&["html","body"].indexOf(L(i))<0){var a=F(i);if(a.transform!=="none"||a.perspective!=="none"||a.contain==="paint"||["transform","perspective"].indexOf(a.willChange)!==-1||t&&a.willChange==="filter"||t&&a.filter&&a.filter!=="none"){return i}else{i=i.parentNode}}return null}function Y(e){var t=D(e);var r=_(e);while(r&&I(r)&&F(r).position==="static"){r=_(r)}if(r&&(L(r)==="html"||L(r)==="body"&&F(r).position==="static")){return t}return r||X(e)||t}function G(e){return["top","bottom"].indexOf(e)>=0?"x":"y"}function J(e,t,r){return B(e,S(t,r))}function K(e,t,r){var n=J(e,t,r);return n>r?r:n}function Q(){return{top:0,right:0,bottom:0,left:0}}function Z(e){return Object.assign({},Q(),e)}function $(e,t){return t.reduce((function(t,r){t[r]=e;return t}),{})}var ee=function e(t,r){t=typeof t==="function"?t(Object.assign({},r.rects,{placement:r.placement})):t;return Z(typeof t!=="number"?t:$(t,s))};function te(e){var t;var o=e.state,s=e.name,f=e.options;var p=o.elements.arrow;var u=o.modifiersData.popperOffsets;var c=H(o.placement);var v=G(c);var l=[a,i].indexOf(c)>=0;var d=l?"height":"width";if(!p||!u){return}var h=ee(f.padding,o);var m=q(p);var g=v==="y"?r:a;var y=v==="y"?n:i;var b=o.rects.reference[d]+o.rects.reference[v]-u[v]-o.rects.popper[d];var w=u[v]-o.rects.reference[v];var x=Y(p);var O=x?v==="y"?x.clientHeight||0:x.clientWidth||0:0;var E=b/2-w/2;var j=h[g];var A=O-m[d]-h[y];var L=O/2-m[d]/2+E;var D=J(j,L,A);var k=v;o.modifiersData[s]=(t={},t[k]=D,t.centerOffset=D-L,t)}function re(e){var t=e.state,r=e.options;var n=r.element,i=n===void 0?"[data-popper-arrow]":n;if(i==null){return}if(typeof i==="string"){i=t.elements.popper.querySelector(i);if(!i){return}}if(!N(t.elements.popper,i)){return}t.elements.arrow=i}var ne={name:"arrow",enabled:true,phase:"main",fn:te,effect:re,requires:["popperOffsets"],requiresIfExists:["preventOverflow"]};function ie(e){return e.split("-")[1]}var ae={top:"auto",right:"auto",bottom:"auto",left:"auto"};function oe(e){var t=e.x,r=e.y;var n=window;var i=n.devicePixelRatio||1;return{x:R(t*i)/i||0,y:R(r*i)/i||0}}function se(e){var t;var o=e.popper,s=e.popperRect,f=e.placement,u=e.variation,c=e.offsets,v=e.position,l=e.gpuAcceleration,d=e.adaptive,h=e.roundOffsets,m=e.isFixed;var g=c.x,y=g===void 0?0:g,b=c.y,w=b===void 0?0:b;var x=typeof h==="function"?h({x:y,y:w}):{x:y,y:w};y=x.x;w=x.y;var O=c.hasOwnProperty("x");var E=c.hasOwnProperty("y");var j=a;var A=r;var L=window;if(d){var k=Y(o);var W="clientHeight";var T="clientWidth";if(k===D(o)){k=U(o);if(F(k).position!=="static"&&v==="absolute"){W="scrollHeight";T="scrollWidth"}}k=k;if(f===r||(f===a||f===i)&&u===p){A=n;var P=m&&k===L&&L.visualViewport?L.visualViewport.height:k[W];w-=P-s.height;w*=l?1:-1}if(f===a||(f===r||f===n)&&u===p){j=i;var M=m&&k===L&&L.visualViewport?L.visualViewport.width:k[T];y-=M-s.width;y*=l?1:-1}}var C=Object.assign({position:v},d&&ae);var H=h===true?oe({x:y,y:w}):{x:y,y:w};y=H.x;w=H.y;if(l){var B;return Object.assign({},C,(B={},B[A]=E?"0":"",B[j]=O?"0":"",B.transform=(L.devicePixelRatio||1)<=1?"translate("+y+"px, "+w+"px)":"translate3d("+y+"px, "+w+"px, 0)",B))}return Object.assign({},C,(t={},t[A]=E?w+"px":"",t[j]=O?y+"px":"",t.transform="",t))}function fe(e){var t=e.state,r=e.options;var n=r.gpuAcceleration,i=n===void 0?true:n,a=r.adaptive,o=a===void 0?true:a,s=r.roundOffsets,f=s===void 0?true:s;var p={placement:H(t.placement),variation:ie(t.placement),popper:t.elements.popper,popperRect:t.rects.popper,gpuAcceleration:i,isFixed:t.options.strategy==="fixed"};if(t.modifiersData.popperOffsets!=null){t.styles.popper=Object.assign({},t.styles.popper,se(Object.assign({},p,{offsets:t.modifiersData.popperOffsets,position:t.options.strategy,adaptive:o,roundOffsets:f})))}if(t.modifiersData.arrow!=null){t.styles.arrow=Object.assign({},t.styles.arrow,se(Object.assign({},p,{offsets:t.modifiersData.arrow,position:"absolute",adaptive:false,roundOffsets:f})))}t.attributes.popper=Object.assign({},t.attributes.popper,{"data-popper-placement":t.placement})}var pe={name:"computeStyles",enabled:true,phase:"beforeWrite",fn:fe,data:{}};var ue={passive:true};function ce(e){var t=e.state,r=e.instance,n=e.options;var i=n.scroll,a=i===void 0?true:i,o=n.resize,s=o===void 0?true:o;var f=D(t.elements.popper);var p=[].concat(t.scrollParents.reference,t.scrollParents.popper);if(a){p.forEach((function(e){e.addEventListener("scroll",r.update,ue)}))}if(s){f.addEventListener("resize",r.update,ue)}return function(){if(a){p.forEach((function(e){e.removeEventListener("scroll",r.update,ue)}))}if(s){f.removeEventListener("resize",r.update,ue)}}}var ve={name:"eventListeners",enabled:true,phase:"write",fn:function e(){},effect:ce,data:{}};var le={left:"right",right:"left",bottom:"top",top:"bottom"};function de(e){return e.replace(/left|right|bottom|top/g,(function(e){return le[e]}))}var he={start:"end",end:"start"};function me(e){return e.replace(/start|end/g,(function(e){return he[e]}))}function ge(e){var t=D(e);var r=t.pageXOffset;var n=t.pageYOffset;return{scrollLeft:r,scrollTop:n}}function ye(e){return V(U(e)).left+ge(e).scrollLeft}function be(e){var t=D(e);var r=U(e);var n=t.visualViewport;var i=r.clientWidth;var a=r.clientHeight;var o=0;var s=0;if(n){i=n.width;a=n.height;if(!/^((?!chrome|android).)*safari/i.test(navigator.userAgent)){o=n.offsetLeft;s=n.offsetTop}}return{width:i,height:a,x:o+ye(e),y:s}}function we(e){var t;var r=U(e);var n=ge(e);var i=(t=e.ownerDocument)==null?void 0:t.body;var a=B(r.scrollWidth,r.clientWidth,i?i.scrollWidth:0,i?i.clientWidth:0);var o=B(r.scrollHeight,r.clientHeight,i?i.scrollHeight:0,i?i.clientHeight:0);var s=-n.scrollLeft+ye(e);var f=-n.scrollTop;if(F(i||r).direction==="rtl"){s+=B(r.clientWidth,i?i.clientWidth:0)-a}return{width:a,height:o,x:s,y:f}}function xe(e){var t=F(e),r=t.overflow,n=t.overflowX,i=t.overflowY;return/auto|scroll|overlay|hidden/.test(r+i+n)}function Oe(e){if(["html","body","#document"].indexOf(L(e))>=0){return e.ownerDocument.body}if(W(e)&&xe(e)){return e}return Oe(z(e))}function Ee(e,t){var r;if(t===void 0){t=[]}var n=Oe(e);var i=n===((r=e.ownerDocument)==null?void 0:r.body);var a=D(n);var o=i?[a].concat(a.visualViewport||[],xe(n)?n:[]):n;var s=t.concat(o);return i?s:s.concat(Ee(z(o)))}function je(e){return Object.assign({},e,{left:e.x,top:e.y,right:e.x+e.width,bottom:e.y+e.height})}function Ae(e){var t=V(e);t.top=t.top+e.clientTop;t.left=t.left+e.clientLeft;t.bottom=t.top+e.clientHeight;t.right=t.left+e.clientWidth;t.width=e.clientWidth;t.height=e.clientHeight;t.x=t.left;t.y=t.top;return t}function Le(e,t){return t===c?je(be(e)):k(t)?Ae(t):je(we(U(e)))}function De(e){var t=Ee(z(e));var r=["absolute","fixed"].indexOf(F(e).position)>=0;var n=r&&W(e)?Y(e):e;if(!k(n)){return[]}return t.filter((function(e){return k(e)&&N(e,n)&&L(e)!=="body"}))}function ke(e,t,r){var n=t==="clippingParents"?De(e):[].concat(t);var i=[].concat(n,[r]);var a=i[0];var o=i.reduce((function(t,r){var n=Le(e,r);t.top=B(n.top,t.top);t.right=S(n.right,t.right);t.bottom=S(n.bottom,t.bottom);t.left=B(n.left,t.left);return t}),Le(e,a));o.width=o.right-o.left;o.height=o.bottom-o.top;o.x=o.left;o.y=o.top;return o}function We(e){var t=e.reference,o=e.element,s=e.placement;var u=s?H(s):null;var c=s?ie(s):null;var v=t.x+t.width/2-o.width/2;var l=t.y+t.height/2-o.height/2;var d;switch(u){case r:d={x:v,y:t.y-o.height};break;case n:d={x:v,y:t.y+t.height};break;case i:d={x:t.x+t.width,y:l};break;case a:d={x:t.x-o.width,y:l};break;default:d={x:t.x,y:t.y}}var h=u?G(u):null;if(h!=null){var m=h==="y"?"height":"width";switch(c){case f:d[h]=d[h]-(t[m]/2-o[m]/2);break;case p:d[h]=d[h]+(t[m]/2-o[m]/2);break}}return d}function Te(e,t){if(t===void 0){t={}}var a=t,o=a.placement,f=o===void 0?e.placement:o,p=a.boundary,d=p===void 0?u:p,h=a.rootBoundary,m=h===void 0?c:h,g=a.elementContext,y=g===void 0?v:g,b=a.altBoundary,w=b===void 0?false:b,x=a.padding,O=x===void 0?0:x;var E=Z(typeof O!=="number"?O:$(O,s));var j=y===v?l:v;var A=e.rects.popper;var L=e.elements[w?j:y];var D=ke(k(L)?L:L.contextElement||U(e.elements.popper),d,m);var W=V(e.elements.reference);var T=We({reference:W,element:A,strategy:"absolute",placement:f});var P=je(Object.assign({},A,T));var M=y===v?P:W;var C={top:D.top-M.top+E.top,bottom:M.bottom-D.bottom+E.bottom,left:D.left-M.left+E.left,right:M.right-D.right+E.right};var H=e.modifiersData.offset;if(y===v&&H){var B=H[f];Object.keys(C).forEach((function(e){var t=[i,n].indexOf(e)>=0?1:-1;var a=[r,n].indexOf(e)>=0?"y":"x";C[e]+=B[a]*t}))}return C}function Pe(e,t){if(t===void 0){t={}}var r=t,n=r.placement,i=r.boundary,a=r.rootBoundary,o=r.padding,f=r.flipVariations,p=r.allowedAutoPlacements,u=p===void 0?h:p;var c=ie(n);var v=c?f?d:d.filter((function(e){return ie(e)===c})):s;var l=v.filter((function(e){return u.indexOf(e)>=0}));if(l.length===0){l=v}var m=l.reduce((function(t,r){t[r]=Te(e,{placement:r,boundary:i,rootBoundary:a,padding:o})[H(r)];return t}),{});return Object.keys(m).sort((function(e,t){return m[e]-m[t]}))}function Me(e){if(H(e)===o){return[]}var t=de(e);return[me(e),t,me(t)]}function Ce(e){var t=e.state,s=e.options,p=e.name;if(t.modifiersData[p]._skip){return}var u=s.mainAxis,c=u===void 0?true:u,v=s.altAxis,l=v===void 0?true:v,d=s.fallbackPlacements,h=s.padding,m=s.boundary,g=s.rootBoundary,y=s.altBoundary,b=s.flipVariations,w=b===void 0?true:b,x=s.allowedAutoPlacements;var O=t.options.placement;var E=H(O);var j=E===O;var A=d||(j||!w?[de(O)]:Me(O));var L=[O].concat(A).reduce((function(e,r){return e.concat(H(r)===o?Pe(t,{placement:r,boundary:m,rootBoundary:g,padding:h,flipVariations:w,allowedAutoPlacements:x}):r)}),[]);var D=t.rects.reference;var k=t.rects.popper;var W=new Map;var T=true;var P=L[0];for(var M=0;M<L.length;M++){var C=L[M];var B=H(C);var S=ie(C)===f;var R=[r,n].indexOf(B)>=0;var V=R?"width":"height";var q=Te(t,{placement:C,boundary:m,rootBoundary:g,altBoundary:y,padding:h});var N=R?S?i:a:S?n:r;if(D[V]>k[V]){N=de(N)}var F=de(N);var I=[];if(c){I.push(q[B]<=0)}if(l){I.push(q[N]<=0,q[F]<=0)}if(I.every((function(e){return e}))){P=C;T=false;break}W.set(C,I)}if(T){var U=w?3:1;var z=function e(t){var r=L.find((function(e){var r=W.get(e);if(r){return r.slice(0,t).every((function(e){return e}))}}));if(r){P=r;return"break"}};for(var _=U;_>0;_--){var X=z(_);if(X==="break")break}}if(t.placement!==P){t.modifiersData[p]._skip=true;t.placement=P;t.reset=true}}var He={name:"flip",enabled:true,phase:"main",fn:Ce,requiresIfExists:["offset"],data:{_skip:false}};function Be(e,t,r){if(r===void 0){r={x:0,y:0}}return{top:e.top-t.height-r.y,right:e.right-t.width+r.x,bottom:e.bottom-t.height+r.y,left:e.left-t.width-r.x}}function Se(e){return[r,i,n,a].some((function(t){return e[t]>=0}))}function Re(e){var t=e.state,r=e.name;var n=t.rects.reference;var i=t.rects.popper;var a=t.modifiersData.preventOverflow;var o=Te(t,{elementContext:"reference"});var s=Te(t,{altBoundary:true});var f=Be(o,n);var p=Be(s,i,a);var u=Se(f);var c=Se(p);t.modifiersData[r]={referenceClippingOffsets:f,popperEscapeOffsets:p,isReferenceHidden:u,hasPopperEscaped:c};t.attributes.popper=Object.assign({},t.attributes.popper,{"data-popper-reference-hidden":u,"data-popper-escaped":c})}var Ve={name:"hide",enabled:true,phase:"main",requiresIfExists:["preventOverflow"],fn:Re};function qe(e,t,n){var o=H(e);var s=[a,r].indexOf(o)>=0?-1:1;var f=typeof n==="function"?n(Object.assign({},t,{placement:e})):n,p=f[0],u=f[1];p=p||0;u=(u||0)*s;return[a,i].indexOf(o)>=0?{x:u,y:p}:{x:p,y:u}}function Ne(e){var t=e.state,r=e.options,n=e.name;var i=r.offset,a=i===void 0?[0,0]:i;var o=h.reduce((function(e,r){e[r]=qe(r,t.rects,a);return e}),{});var s=o[t.placement],f=s.x,p=s.y;if(t.modifiersData.popperOffsets!=null){t.modifiersData.popperOffsets.x+=f;t.modifiersData.popperOffsets.y+=p}t.modifiersData[n]=o}var Fe={name:"offset",enabled:true,phase:"main",requires:["popperOffsets"],fn:Ne};function Ie(e){var t=e.state,r=e.name;t.modifiersData[r]=We({reference:t.rects.reference,element:t.rects.popper,strategy:"absolute",placement:t.placement})}var Ue={name:"popperOffsets",enabled:true,phase:"read",fn:Ie,data:{}};function ze(e){return e==="x"?"y":"x"}function _e(e){var t=e.state,o=e.options,s=e.name;var p=o.mainAxis,u=p===void 0?true:p,c=o.altAxis,v=c===void 0?false:c,l=o.boundary,d=o.rootBoundary,h=o.altBoundary,m=o.padding,g=o.tether,y=g===void 0?true:g,b=o.tetherOffset,w=b===void 0?0:b;var x=Te(t,{boundary:l,rootBoundary:d,padding:m,altBoundary:h});var O=H(t.placement);var E=ie(t.placement);var j=!E;var A=G(O);var L=ze(A);var D=t.modifiersData.popperOffsets;var k=t.rects.reference;var W=t.rects.popper;var T=typeof w==="function"?w(Object.assign({},t.rects,{placement:t.placement})):w;var P=typeof T==="number"?{mainAxis:T,altAxis:T}:Object.assign({mainAxis:0,altAxis:0},T);var M=t.modifiersData.offset?t.modifiersData.offset[t.placement]:null;var C={x:0,y:0};if(!D){return}if(u){var R;var V=A==="y"?r:a;var N=A==="y"?n:i;var F=A==="y"?"height":"width";var I=D[A];var U=I+x[V];var z=I-x[N];var _=y?-W[F]/2:0;var X=E===f?k[F]:W[F];var Z=E===f?-W[F]:-k[F];var $=t.elements.arrow;var ee=y&&$?q($):{width:0,height:0};var te=t.modifiersData["arrow#persistent"]?t.modifiersData["arrow#persistent"].padding:Q();var re=te[V];var ne=te[N];var ae=J(0,k[F],ee[F]);var oe=j?k[F]/2-_-ae-re-P.mainAxis:X-ae-re-P.mainAxis;var se=j?-k[F]/2+_+ae+ne+P.mainAxis:Z+ae+ne+P.mainAxis;var fe=t.elements.arrow&&Y(t.elements.arrow);var pe=fe?A==="y"?fe.clientTop||0:fe.clientLeft||0:0;var ue=(R=M==null?void 0:M[A])!=null?R:0;var ce=I+oe-ue-pe;var ve=I+se-ue;var le=J(y?S(U,ce):U,I,y?B(z,ve):z);D[A]=le;C[A]=le-I}if(v){var de;var he=A==="x"?r:a;var me=A==="x"?n:i;var ge=D[L];var ye=L==="y"?"height":"width";var be=ge+x[he];var we=ge-x[me];var xe=[r,a].indexOf(O)!==-1;var Oe=(de=M==null?void 0:M[L])!=null?de:0;var Ee=xe?be:ge-k[ye]-W[ye]-Oe+P.altAxis;var je=xe?ge+k[ye]+W[ye]-Oe-P.altAxis:we;var Ae=y&&xe?K(Ee,ge,je):J(y?Ee:be,ge,y?je:we);D[L]=Ae;C[L]=Ae-ge}t.modifiersData[s]=C}var Xe={name:"preventOverflow",enabled:true,phase:"main",fn:_e,requiresIfExists:["offset"]};function Ye(e){return{scrollLeft:e.scrollLeft,scrollTop:e.scrollTop}}function Ge(e){if(e===D(e)||!W(e)){return ge(e)}else{return Ye(e)}}function Je(e){var t=e.getBoundingClientRect();var r=R(t.width)/e.offsetWidth||1;var n=R(t.height)/e.offsetHeight||1;return r!==1||n!==1}function Ke(e,t,r){if(r===void 0){r=false}var n=W(t);var i=W(t)&&Je(t);var a=U(t);var o=V(e,i);var s={scrollLeft:0,scrollTop:0};var f={x:0,y:0};if(n||!n&&!r){if(L(t)!=="body"||xe(a)){s=Ge(t)}if(W(t)){f=V(t,true);f.x+=t.clientLeft;f.y+=t.clientTop}else if(a){f.x=ye(a)}}return{x:o.left+s.scrollLeft-f.x,y:o.top+s.scrollTop-f.y,width:o.width,height:o.height}}function Qe(e){var t=new Map;var r=new Set;var n=[];e.forEach((function(e){t.set(e.name,e)}));function i(e){r.add(e.name);var a=[].concat(e.requires||[],e.requiresIfExists||[]);a.forEach((function(e){if(!r.has(e)){var n=t.get(e);if(n){i(n)}}}));n.push(e)}e.forEach((function(e){if(!r.has(e.name)){i(e)}}));return n}function Ze(e){var t=Qe(e);return A.reduce((function(e,r){return e.concat(t.filter((function(e){return e.phase===r})))}),[])}function $e(e){var t;return function(){if(!t){t=new Promise((function(r){Promise.resolve().then((function(){t=undefined;r(e())}))}))}return t}}function et(e){var t=e.reduce((function(e,t){var r=e[t.name];e[t.name]=r?Object.assign({},r,t,{options:Object.assign({},r.options,t.options),data:Object.assign({},r.data,t.data)}):t;return e}),{});return Object.keys(t).map((function(e){return t[e]}))}var tt={placement:"bottom",modifiers:[],strategy:"absolute"};function rt(){for(var e=arguments.length,t=new Array(e),r=0;r<e;r++){t[r]=arguments[r]}return!t.some((function(e){return!(e&&typeof e.getBoundingClientRect==="function")}))}function nt(e){if(e===void 0){e={}}var t=e,r=t.defaultModifiers,n=r===void 0?[]:r,i=t.defaultOptions,a=i===void 0?tt:i;return function e(t,r,i){if(i===void 0){i=a}var o={placement:"bottom",orderedModifiers:[],options:Object.assign({},tt,a),modifiersData:{},elements:{reference:t,popper:r},attributes:{},styles:{}};var s=[];var f=false;var p={state:o,setOptions:function e(i){var s=typeof i==="function"?i(o.options):i;c();o.options=Object.assign({},a,o.options,s);o.scrollParents={reference:k(t)?Ee(t):t.contextElement?Ee(t.contextElement):[],popper:Ee(r)};var f=Ze(et([].concat(n,o.options.modifiers)));o.orderedModifiers=f.filter((function(e){return e.enabled}));u();return p.update()},forceUpdate:function e(){if(f){return}var t=o.elements,r=t.reference,n=t.popper;if(!rt(r,n)){return}o.rects={reference:Ke(r,Y(n),o.options.strategy==="fixed"),popper:q(n)};o.reset=false;o.placement=o.options.placement;o.orderedModifiers.forEach((function(e){return o.modifiersData[e.name]=Object.assign({},e.data)}));for(var i=0;i<o.orderedModifiers.length;i++){if(o.reset===true){o.reset=false;i=-1;continue}var a=o.orderedModifiers[i],s=a.fn,u=a.options,c=u===void 0?{}:u,v=a.name;if(typeof s==="function"){o=s({state:o,options:c,name:v,instance:p})||o}}},update:$e((function(){return new Promise((function(e){p.forceUpdate();e(o)}))})),destroy:function e(){c();f=true}};if(!rt(t,r)){return p}p.setOptions(i).then((function(e){if(!f&&i.onFirstUpdate){i.onFirstUpdate(e)}}));function u(){o.orderedModifiers.forEach((function(e){var t=e.name,r=e.options,n=r===void 0?{}:r,i=e.effect;if(typeof i==="function"){var a=i({state:o,name:t,instance:p,options:n});var f=function e(){};s.push(a||f)}}))}function c(){s.forEach((function(e){return e()}));s=[]}return p}}var it=[ve,Ue,pe,C,Fe,He,Xe,ne,Ve];var at=nt({defaultModifiers:it});var ot=function(){function e(e,t,r){this.handleTransitionEnd=this.handleTransitionEnd.bind(this);this.anchor=e;this.popover=t;this.options=Object.assign({skidding:0,distance:0,placement:"bottom-start",strategy:"absolute",transitionElement:this.popover,visibleClass:"popover-visible",onAfterShow:function(){},onAfterHide:function(){},onTransitionEnd:function(){}},r);this.popover.hidden=true;this.popover.classList.remove(this.options.visibleClass);this.popover.addEventListener("transitionend",this.handleTransitionEnd)}e.prototype.handleTransitionEnd=function(e){var t=e.target;if(t===this.options.transitionElement){this.options.onTransitionEnd.call(this,e);if(this.isVisible===false&&!this.popover.hidden){this.popover.hidden=true;this.popover.classList.remove(this.options.visibleClass);this.options.onAfterHide.call(this)}}};e.prototype.destroy=function(){this.popover.removeEventListener("transitionend",this.handleTransitionEnd);if(this.popper){this.popper.destroy();this.popper=null}};e.prototype.show=function(){var e=this;this.isVisible=true;this.popover.hidden=false;t((function(){return e.popover.classList.add(e.options.visibleClass)}));if(this.popper){this.popper.destroy()}this.popper=at(this.anchor,this.popover,{placement:this.options.placement,strategy:this.options.strategy,modifiers:[{name:"sameWidth",enabled:true,fn:function(e){var t=e.state;t.styles.popper.minWidth=t.rects.reference.width+"px"},phase:"beforeWrite",requires:["computeStyles"]},{name:"flip",options:{boundary:"viewport"}},{name:"offset",options:{padding:5,offset:[this.options.skidding,this.options.distance]}}]});this.popover.addEventListener("transitionend",(function(){return e.options.onAfterShow.call(e)}),{once:true});requestAnimationFrame((function(){return e.popper.update()}))};e.prototype.hide=function(){this.isVisible=false;this.popover.classList.remove(this.options.visibleClass)};e.prototype.setOptions=function(e){var t=this;this.options=Object.assign(this.options,e);this.isVisible?this.popover.classList.add(this.options.visibleClass):this.popover.classList.remove(this.options.visibleClass);if(this.popper){this.popper.setOptions({placement:this.options.placement,strategy:this.options.strategy});requestAnimationFrame((function(){return t.popper.update()}))}};return e}();e("P",ot)}}}));
-//# sourceMappingURL=p-d35d468b.system.js.map
+System.register(["./p-1c216ca4.system.js"],(function(e){"use strict";var t;return{setters:[function(e){t=e.r}],execute:function(){var r="top";var n="bottom";var i="right";var o="left";var a="auto";var s=[r,n,i,o];var f="start";var p="end";var c="clippingParents";var u="viewport";var v="popper";var l="reference";var d=s.reduce((function(e,t){return e.concat([t+"-"+f,t+"-"+p])}),[]);var h=[].concat(s,[a]).reduce((function(e,t){return e.concat([t,t+"-"+f,t+"-"+p])}),[]);var m="beforeRead";var g="read";var y="afterRead";var b="beforeMain";var w="main";var x="afterMain";var O="beforeWrite";var E="write";var j="afterWrite";var A=[m,g,y,b,w,x,O,E,j];function L(e){return e?(e.nodeName||"").toLowerCase():null}function D(e){if(e==null){return window}if(e.toString()!=="[object Window]"){var t=e.ownerDocument;return t?t.defaultView||window:window}return e}function k(e){var t=D(e).Element;return e instanceof t||e instanceof Element}function W(e){var t=D(e).HTMLElement;return e instanceof t||e instanceof HTMLElement}function T(e){if(typeof ShadowRoot==="undefined"){return false}var t=D(e).ShadowRoot;return e instanceof t||e instanceof ShadowRoot}function P(e){var t=e.state;Object.keys(t.elements).forEach((function(e){var r=t.styles[e]||{};var n=t.attributes[e]||{};var i=t.elements[e];if(!W(i)||!L(i)){return}Object.assign(i.style,r);Object.keys(n).forEach((function(e){var t=n[e];if(t===false){i.removeAttribute(e)}else{i.setAttribute(e,t===true?"":t)}}))}))}function M(e){var t=e.state;var r={popper:{position:t.options.strategy,left:"0",top:"0",margin:"0"},arrow:{position:"absolute"},reference:{}};Object.assign(t.elements.popper.style,r.popper);t.styles=r;if(t.elements.arrow){Object.assign(t.elements.arrow.style,r.arrow)}return function(){Object.keys(t.elements).forEach((function(e){var n=t.elements[e];var i=t.attributes[e]||{};var o=Object.keys(t.styles.hasOwnProperty(e)?t.styles[e]:r[e]);var a=o.reduce((function(e,t){e[t]="";return e}),{});if(!W(n)||!L(n)){return}Object.assign(n.style,a);Object.keys(i).forEach((function(e){n.removeAttribute(e)}))}))}}var C={name:"applyStyles",enabled:true,phase:"write",fn:P,effect:M,requires:["computeStyles"]};function H(e){return e.split("-")[0]}var B=Math.max;var S=Math.min;var R=Math.round;function V(e,t){if(t===void 0){t=false}var r=e.getBoundingClientRect();var n=1;var i=1;if(W(e)&&t){var o=e.offsetHeight;var a=e.offsetWidth;if(a>0){n=R(r.width)/a||1}if(o>0){i=R(r.height)/o||1}}return{width:r.width/n,height:r.height/i,top:r.top/i,right:r.right/n,bottom:r.bottom/i,left:r.left/n,x:r.left/n,y:r.top/i}}function q(e){var t=V(e);var r=e.offsetWidth;var n=e.offsetHeight;if(Math.abs(t.width-r)<=1){r=t.width}if(Math.abs(t.height-n)<=1){n=t.height}return{x:e.offsetLeft,y:e.offsetTop,width:r,height:n}}function N(e,t){var r=t.getRootNode&&t.getRootNode();if(e.contains(t)){return true}else if(r&&T(r)){var n=t;do{if(n&&e.isSameNode(n)){return true}n=n.parentNode||n.host}while(n)}return false}function F(e){return D(e).getComputedStyle(e)}function I(e){return["table","td","th"].indexOf(L(e))>=0}function U(e){return((k(e)?e.ownerDocument:e.document)||window.document).documentElement}function z(e){if(L(e)==="html"){return e}return e.assignedSlot||e.parentNode||(T(e)?e.host:null)||U(e)}function _(e){if(!W(e)||F(e).position==="fixed"){return null}return e.offsetParent}function X(e){var t=navigator.userAgent.toLowerCase().indexOf("firefox")!==-1;var r=navigator.userAgent.indexOf("Trident")!==-1;if(r&&W(e)){var n=F(e);if(n.position==="fixed"){return null}}var i=z(e);if(T(i)){i=i.host}while(W(i)&&["html","body"].indexOf(L(i))<0){var o=F(i);if(o.transform!=="none"||o.perspective!=="none"||o.contain==="paint"||["transform","perspective"].indexOf(o.willChange)!==-1||t&&o.willChange==="filter"||t&&o.filter&&o.filter!=="none"){return i}else{i=i.parentNode}}return null}function Y(e){var t=D(e);var r=_(e);while(r&&I(r)&&F(r).position==="static"){r=_(r)}if(r&&(L(r)==="html"||L(r)==="body"&&F(r).position==="static")){return t}return r||X(e)||t}function G(e){return["top","bottom"].indexOf(e)>=0?"x":"y"}function J(e,t,r){return B(e,S(t,r))}function K(e,t,r){var n=J(e,t,r);return n>r?r:n}function Q(){return{top:0,right:0,bottom:0,left:0}}function Z(e){return Object.assign({},Q(),e)}function $(e,t){return t.reduce((function(t,r){t[r]=e;return t}),{})}var ee=function e(t,r){t=typeof t==="function"?t(Object.assign({},r.rects,{placement:r.placement})):t;return Z(typeof t!=="number"?t:$(t,s))};function te(e){var t;var a=e.state,s=e.name,f=e.options;var p=a.elements.arrow;var c=a.modifiersData.popperOffsets;var u=H(a.placement);var v=G(u);var l=[o,i].indexOf(u)>=0;var d=l?"height":"width";if(!p||!c){return}var h=ee(f.padding,a);var m=q(p);var g=v==="y"?r:o;var y=v==="y"?n:i;var b=a.rects.reference[d]+a.rects.reference[v]-c[v]-a.rects.popper[d];var w=c[v]-a.rects.reference[v];var x=Y(p);var O=x?v==="y"?x.clientHeight||0:x.clientWidth||0:0;var E=b/2-w/2;var j=h[g];var A=O-m[d]-h[y];var L=O/2-m[d]/2+E;var D=J(j,L,A);var k=v;a.modifiersData[s]=(t={},t[k]=D,t.centerOffset=D-L,t)}function re(e){var t=e.state,r=e.options;var n=r.element,i=n===void 0?"[data-popper-arrow]":n;if(i==null){return}if(typeof i==="string"){i=t.elements.popper.querySelector(i);if(!i){return}}if(!N(t.elements.popper,i)){return}t.elements.arrow=i}var ne={name:"arrow",enabled:true,phase:"main",fn:te,effect:re,requires:["popperOffsets"],requiresIfExists:["preventOverflow"]};function ie(e){return e.split("-")[1]}var oe={top:"auto",right:"auto",bottom:"auto",left:"auto"};function ae(e){var t=e.x,r=e.y;var n=window;var i=n.devicePixelRatio||1;return{x:R(t*i)/i||0,y:R(r*i)/i||0}}function se(e){var t;var a=e.popper,s=e.popperRect,f=e.placement,c=e.variation,u=e.offsets,v=e.position,l=e.gpuAcceleration,d=e.adaptive,h=e.roundOffsets,m=e.isFixed;var g=u.x,y=g===void 0?0:g,b=u.y,w=b===void 0?0:b;var x=typeof h==="function"?h({x:y,y:w}):{x:y,y:w};y=x.x;w=x.y;var O=u.hasOwnProperty("x");var E=u.hasOwnProperty("y");var j=o;var A=r;var L=window;if(d){var k=Y(a);var W="clientHeight";var T="clientWidth";if(k===D(a)){k=U(a);if(F(k).position!=="static"&&v==="absolute"){W="scrollHeight";T="scrollWidth"}}k=k;if(f===r||(f===o||f===i)&&c===p){A=n;var P=m&&k===L&&L.visualViewport?L.visualViewport.height:k[W];w-=P-s.height;w*=l?1:-1}if(f===o||(f===r||f===n)&&c===p){j=i;var M=m&&k===L&&L.visualViewport?L.visualViewport.width:k[T];y-=M-s.width;y*=l?1:-1}}var C=Object.assign({position:v},d&&oe);var H=h===true?ae({x:y,y:w}):{x:y,y:w};y=H.x;w=H.y;if(l){var B;return Object.assign({},C,(B={},B[A]=E?"0":"",B[j]=O?"0":"",B.transform=(L.devicePixelRatio||1)<=1?"translate("+y+"px, "+w+"px)":"translate3d("+y+"px, "+w+"px, 0)",B))}return Object.assign({},C,(t={},t[A]=E?w+"px":"",t[j]=O?y+"px":"",t.transform="",t))}function fe(e){var t=e.state,r=e.options;var n=r.gpuAcceleration,i=n===void 0?true:n,o=r.adaptive,a=o===void 0?true:o,s=r.roundOffsets,f=s===void 0?true:s;var p={placement:H(t.placement),variation:ie(t.placement),popper:t.elements.popper,popperRect:t.rects.popper,gpuAcceleration:i,isFixed:t.options.strategy==="fixed"};if(t.modifiersData.popperOffsets!=null){t.styles.popper=Object.assign({},t.styles.popper,se(Object.assign({},p,{offsets:t.modifiersData.popperOffsets,position:t.options.strategy,adaptive:a,roundOffsets:f})))}if(t.modifiersData.arrow!=null){t.styles.arrow=Object.assign({},t.styles.arrow,se(Object.assign({},p,{offsets:t.modifiersData.arrow,position:"absolute",adaptive:false,roundOffsets:f})))}t.attributes.popper=Object.assign({},t.attributes.popper,{"data-popper-placement":t.placement})}var pe={name:"computeStyles",enabled:true,phase:"beforeWrite",fn:fe,data:{}};var ce={passive:true};function ue(e){var t=e.state,r=e.instance,n=e.options;var i=n.scroll,o=i===void 0?true:i,a=n.resize,s=a===void 0?true:a;var f=D(t.elements.popper);var p=[].concat(t.scrollParents.reference,t.scrollParents.popper);if(o){p.forEach((function(e){e.addEventListener("scroll",r.update,ce)}))}if(s){f.addEventListener("resize",r.update,ce)}return function(){if(o){p.forEach((function(e){e.removeEventListener("scroll",r.update,ce)}))}if(s){f.removeEventListener("resize",r.update,ce)}}}var ve={name:"eventListeners",enabled:true,phase:"write",fn:function e(){},effect:ue,data:{}};var le={left:"right",right:"left",bottom:"top",top:"bottom"};function de(e){return e.replace(/left|right|bottom|top/g,(function(e){return le[e]}))}var he={start:"end",end:"start"};function me(e){return e.replace(/start|end/g,(function(e){return he[e]}))}function ge(e){var t=D(e);var r=t.pageXOffset;var n=t.pageYOffset;return{scrollLeft:r,scrollTop:n}}function ye(e){return V(U(e)).left+ge(e).scrollLeft}function be(e){var t=D(e);var r=U(e);var n=t.visualViewport;var i=r.clientWidth;var o=r.clientHeight;var a=0;var s=0;if(n){i=n.width;o=n.height;if(!/^((?!chrome|android).)*safari/i.test(navigator.userAgent)){a=n.offsetLeft;s=n.offsetTop}}return{width:i,height:o,x:a+ye(e),y:s}}function we(e){var t;var r=U(e);var n=ge(e);var i=(t=e.ownerDocument)==null?void 0:t.body;var o=B(r.scrollWidth,r.clientWidth,i?i.scrollWidth:0,i?i.clientWidth:0);var a=B(r.scrollHeight,r.clientHeight,i?i.scrollHeight:0,i?i.clientHeight:0);var s=-n.scrollLeft+ye(e);var f=-n.scrollTop;if(F(i||r).direction==="rtl"){s+=B(r.clientWidth,i?i.clientWidth:0)-o}return{width:o,height:a,x:s,y:f}}function xe(e){var t=F(e),r=t.overflow,n=t.overflowX,i=t.overflowY;return/auto|scroll|overlay|hidden/.test(r+i+n)}function Oe(e){if(["html","body","#document"].indexOf(L(e))>=0){return e.ownerDocument.body}if(W(e)&&xe(e)){return e}return Oe(z(e))}function Ee(e,t){var r;if(t===void 0){t=[]}var n=Oe(e);var i=n===((r=e.ownerDocument)==null?void 0:r.body);var o=D(n);var a=i?[o].concat(o.visualViewport||[],xe(n)?n:[]):n;var s=t.concat(a);return i?s:s.concat(Ee(z(a)))}function je(e){return Object.assign({},e,{left:e.x,top:e.y,right:e.x+e.width,bottom:e.y+e.height})}function Ae(e){var t=V(e);t.top=t.top+e.clientTop;t.left=t.left+e.clientLeft;t.bottom=t.top+e.clientHeight;t.right=t.left+e.clientWidth;t.width=e.clientWidth;t.height=e.clientHeight;t.x=t.left;t.y=t.top;return t}function Le(e,t){return t===u?je(be(e)):k(t)?Ae(t):je(we(U(e)))}function De(e){var t=Ee(z(e));var r=["absolute","fixed"].indexOf(F(e).position)>=0;var n=r&&W(e)?Y(e):e;if(!k(n)){return[]}return t.filter((function(e){return k(e)&&N(e,n)&&L(e)!=="body"}))}function ke(e,t,r){var n=t==="clippingParents"?De(e):[].concat(t);var i=[].concat(n,[r]);var o=i[0];var a=i.reduce((function(t,r){var n=Le(e,r);t.top=B(n.top,t.top);t.right=S(n.right,t.right);t.bottom=S(n.bottom,t.bottom);t.left=B(n.left,t.left);return t}),Le(e,o));a.width=a.right-a.left;a.height=a.bottom-a.top;a.x=a.left;a.y=a.top;return a}function We(e){var t=e.reference,a=e.element,s=e.placement;var c=s?H(s):null;var u=s?ie(s):null;var v=t.x+t.width/2-a.width/2;var l=t.y+t.height/2-a.height/2;var d;switch(c){case r:d={x:v,y:t.y-a.height};break;case n:d={x:v,y:t.y+t.height};break;case i:d={x:t.x+t.width,y:l};break;case o:d={x:t.x-a.width,y:l};break;default:d={x:t.x,y:t.y}}var h=c?G(c):null;if(h!=null){var m=h==="y"?"height":"width";switch(u){case f:d[h]=d[h]-(t[m]/2-a[m]/2);break;case p:d[h]=d[h]+(t[m]/2-a[m]/2);break}}return d}function Te(e,t){if(t===void 0){t={}}var o=t,a=o.placement,f=a===void 0?e.placement:a,p=o.boundary,d=p===void 0?c:p,h=o.rootBoundary,m=h===void 0?u:h,g=o.elementContext,y=g===void 0?v:g,b=o.altBoundary,w=b===void 0?false:b,x=o.padding,O=x===void 0?0:x;var E=Z(typeof O!=="number"?O:$(O,s));var j=y===v?l:v;var A=e.rects.popper;var L=e.elements[w?j:y];var D=ke(k(L)?L:L.contextElement||U(e.elements.popper),d,m);var W=V(e.elements.reference);var T=We({reference:W,element:A,strategy:"absolute",placement:f});var P=je(Object.assign({},A,T));var M=y===v?P:W;var C={top:D.top-M.top+E.top,bottom:M.bottom-D.bottom+E.bottom,left:D.left-M.left+E.left,right:M.right-D.right+E.right};var H=e.modifiersData.offset;if(y===v&&H){var B=H[f];Object.keys(C).forEach((function(e){var t=[i,n].indexOf(e)>=0?1:-1;var o=[r,n].indexOf(e)>=0?"y":"x";C[e]+=B[o]*t}))}return C}function Pe(e,t){if(t===void 0){t={}}var r=t,n=r.placement,i=r.boundary,o=r.rootBoundary,a=r.padding,f=r.flipVariations,p=r.allowedAutoPlacements,c=p===void 0?h:p;var u=ie(n);var v=u?f?d:d.filter((function(e){return ie(e)===u})):s;var l=v.filter((function(e){return c.indexOf(e)>=0}));if(l.length===0){l=v}var m=l.reduce((function(t,r){t[r]=Te(e,{placement:r,boundary:i,rootBoundary:o,padding:a})[H(r)];return t}),{});return Object.keys(m).sort((function(e,t){return m[e]-m[t]}))}function Me(e){if(H(e)===a){return[]}var t=de(e);return[me(e),t,me(t)]}function Ce(e){var t=e.state,s=e.options,p=e.name;if(t.modifiersData[p]._skip){return}var c=s.mainAxis,u=c===void 0?true:c,v=s.altAxis,l=v===void 0?true:v,d=s.fallbackPlacements,h=s.padding,m=s.boundary,g=s.rootBoundary,y=s.altBoundary,b=s.flipVariations,w=b===void 0?true:b,x=s.allowedAutoPlacements;var O=t.options.placement;var E=H(O);var j=E===O;var A=d||(j||!w?[de(O)]:Me(O));var L=[O].concat(A).reduce((function(e,r){return e.concat(H(r)===a?Pe(t,{placement:r,boundary:m,rootBoundary:g,padding:h,flipVariations:w,allowedAutoPlacements:x}):r)}),[]);var D=t.rects.reference;var k=t.rects.popper;var W=new Map;var T=true;var P=L[0];for(var M=0;M<L.length;M++){var C=L[M];var B=H(C);var S=ie(C)===f;var R=[r,n].indexOf(B)>=0;var V=R?"width":"height";var q=Te(t,{placement:C,boundary:m,rootBoundary:g,altBoundary:y,padding:h});var N=R?S?i:o:S?n:r;if(D[V]>k[V]){N=de(N)}var F=de(N);var I=[];if(u){I.push(q[B]<=0)}if(l){I.push(q[N]<=0,q[F]<=0)}if(I.every((function(e){return e}))){P=C;T=false;break}W.set(C,I)}if(T){var U=w?3:1;var z=function e(t){var r=L.find((function(e){var r=W.get(e);if(r){return r.slice(0,t).every((function(e){return e}))}}));if(r){P=r;return"break"}};for(var _=U;_>0;_--){var X=z(_);if(X==="break")break}}if(t.placement!==P){t.modifiersData[p]._skip=true;t.placement=P;t.reset=true}}var He={name:"flip",enabled:true,phase:"main",fn:Ce,requiresIfExists:["offset"],data:{_skip:false}};function Be(e,t,r){if(r===void 0){r={x:0,y:0}}return{top:e.top-t.height-r.y,right:e.right-t.width+r.x,bottom:e.bottom-t.height+r.y,left:e.left-t.width-r.x}}function Se(e){return[r,i,n,o].some((function(t){return e[t]>=0}))}function Re(e){var t=e.state,r=e.name;var n=t.rects.reference;var i=t.rects.popper;var o=t.modifiersData.preventOverflow;var a=Te(t,{elementContext:"reference"});var s=Te(t,{altBoundary:true});var f=Be(a,n);var p=Be(s,i,o);var c=Se(f);var u=Se(p);t.modifiersData[r]={referenceClippingOffsets:f,popperEscapeOffsets:p,isReferenceHidden:c,hasPopperEscaped:u};t.attributes.popper=Object.assign({},t.attributes.popper,{"data-popper-reference-hidden":c,"data-popper-escaped":u})}var Ve={name:"hide",enabled:true,phase:"main",requiresIfExists:["preventOverflow"],fn:Re};function qe(e,t,n){var a=H(e);var s=[o,r].indexOf(a)>=0?-1:1;var f=typeof n==="function"?n(Object.assign({},t,{placement:e})):n,p=f[0],c=f[1];p=p||0;c=(c||0)*s;return[o,i].indexOf(a)>=0?{x:c,y:p}:{x:p,y:c}}function Ne(e){var t=e.state,r=e.options,n=e.name;var i=r.offset,o=i===void 0?[0,0]:i;var a=h.reduce((function(e,r){e[r]=qe(r,t.rects,o);return e}),{});var s=a[t.placement],f=s.x,p=s.y;if(t.modifiersData.popperOffsets!=null){t.modifiersData.popperOffsets.x+=f;t.modifiersData.popperOffsets.y+=p}t.modifiersData[n]=a}var Fe={name:"offset",enabled:true,phase:"main",requires:["popperOffsets"],fn:Ne};function Ie(e){var t=e.state,r=e.name;t.modifiersData[r]=We({reference:t.rects.reference,element:t.rects.popper,strategy:"absolute",placement:t.placement})}var Ue={name:"popperOffsets",enabled:true,phase:"read",fn:Ie,data:{}};function ze(e){return e==="x"?"y":"x"}function _e(e){var t=e.state,a=e.options,s=e.name;var p=a.mainAxis,c=p===void 0?true:p,u=a.altAxis,v=u===void 0?false:u,l=a.boundary,d=a.rootBoundary,h=a.altBoundary,m=a.padding,g=a.tether,y=g===void 0?true:g,b=a.tetherOffset,w=b===void 0?0:b;var x=Te(t,{boundary:l,rootBoundary:d,padding:m,altBoundary:h});var O=H(t.placement);var E=ie(t.placement);var j=!E;var A=G(O);var L=ze(A);var D=t.modifiersData.popperOffsets;var k=t.rects.reference;var W=t.rects.popper;var T=typeof w==="function"?w(Object.assign({},t.rects,{placement:t.placement})):w;var P=typeof T==="number"?{mainAxis:T,altAxis:T}:Object.assign({mainAxis:0,altAxis:0},T);var M=t.modifiersData.offset?t.modifiersData.offset[t.placement]:null;var C={x:0,y:0};if(!D){return}if(c){var R;var V=A==="y"?r:o;var N=A==="y"?n:i;var F=A==="y"?"height":"width";var I=D[A];var U=I+x[V];var z=I-x[N];var _=y?-W[F]/2:0;var X=E===f?k[F]:W[F];var Z=E===f?-W[F]:-k[F];var $=t.elements.arrow;var ee=y&&$?q($):{width:0,height:0};var te=t.modifiersData["arrow#persistent"]?t.modifiersData["arrow#persistent"].padding:Q();var re=te[V];var ne=te[N];var oe=J(0,k[F],ee[F]);var ae=j?k[F]/2-_-oe-re-P.mainAxis:X-oe-re-P.mainAxis;var se=j?-k[F]/2+_+oe+ne+P.mainAxis:Z+oe+ne+P.mainAxis;var fe=t.elements.arrow&&Y(t.elements.arrow);var pe=fe?A==="y"?fe.clientTop||0:fe.clientLeft||0:0;var ce=(R=M==null?void 0:M[A])!=null?R:0;var ue=I+ae-ce-pe;var ve=I+se-ce;var le=J(y?S(U,ue):U,I,y?B(z,ve):z);D[A]=le;C[A]=le-I}if(v){var de;var he=A==="x"?r:o;var me=A==="x"?n:i;var ge=D[L];var ye=L==="y"?"height":"width";var be=ge+x[he];var we=ge-x[me];var xe=[r,o].indexOf(O)!==-1;var Oe=(de=M==null?void 0:M[L])!=null?de:0;var Ee=xe?be:ge-k[ye]-W[ye]-Oe+P.altAxis;var je=xe?ge+k[ye]+W[ye]-Oe-P.altAxis:we;var Ae=y&&xe?K(Ee,ge,je):J(y?Ee:be,ge,y?je:we);D[L]=Ae;C[L]=Ae-ge}t.modifiersData[s]=C}var Xe={name:"preventOverflow",enabled:true,phase:"main",fn:_e,requiresIfExists:["offset"]};function Ye(e){return{scrollLeft:e.scrollLeft,scrollTop:e.scrollTop}}function Ge(e){if(e===D(e)||!W(e)){return ge(e)}else{return Ye(e)}}function Je(e){var t=e.getBoundingClientRect();var r=R(t.width)/e.offsetWidth||1;var n=R(t.height)/e.offsetHeight||1;return r!==1||n!==1}function Ke(e,t,r){if(r===void 0){r=false}var n=W(t);var i=W(t)&&Je(t);var o=U(t);var a=V(e,i);var s={scrollLeft:0,scrollTop:0};var f={x:0,y:0};if(n||!n&&!r){if(L(t)!=="body"||xe(o)){s=Ge(t)}if(W(t)){f=V(t,true);f.x+=t.clientLeft;f.y+=t.clientTop}else if(o){f.x=ye(o)}}return{x:a.left+s.scrollLeft-f.x,y:a.top+s.scrollTop-f.y,width:a.width,height:a.height}}function Qe(e){var t=new Map;var r=new Set;var n=[];e.forEach((function(e){t.set(e.name,e)}));function i(e){r.add(e.name);var o=[].concat(e.requires||[],e.requiresIfExists||[]);o.forEach((function(e){if(!r.has(e)){var n=t.get(e);if(n){i(n)}}}));n.push(e)}e.forEach((function(e){if(!r.has(e.name)){i(e)}}));return n}function Ze(e){var t=Qe(e);return A.reduce((function(e,r){return e.concat(t.filter((function(e){return e.phase===r})))}),[])}function $e(e){var t;return function(){if(!t){t=new Promise((function(r){Promise.resolve().then((function(){t=undefined;r(e())}))}))}return t}}function et(e){var t=e.reduce((function(e,t){var r=e[t.name];e[t.name]=r?Object.assign({},r,t,{options:Object.assign({},r.options,t.options),data:Object.assign({},r.data,t.data)}):t;return e}),{});return Object.keys(t).map((function(e){return t[e]}))}var tt={placement:"bottom",modifiers:[],strategy:"absolute"};function rt(){for(var e=arguments.length,t=new Array(e),r=0;r<e;r++){t[r]=arguments[r]}return!t.some((function(e){return!(e&&typeof e.getBoundingClientRect==="function")}))}function nt(e){if(e===void 0){e={}}var t=e,r=t.defaultModifiers,n=r===void 0?[]:r,i=t.defaultOptions,o=i===void 0?tt:i;return function e(t,r,i){if(i===void 0){i=o}var a={placement:"bottom",orderedModifiers:[],options:Object.assign({},tt,o),modifiersData:{},elements:{reference:t,popper:r},attributes:{},styles:{}};var s=[];var f=false;var p={state:a,setOptions:function e(i){var s=typeof i==="function"?i(a.options):i;u();a.options=Object.assign({},o,a.options,s);a.scrollParents={reference:k(t)?Ee(t):t.contextElement?Ee(t.contextElement):[],popper:Ee(r)};var f=Ze(et([].concat(n,a.options.modifiers)));a.orderedModifiers=f.filter((function(e){return e.enabled}));c();return p.update()},forceUpdate:function e(){if(f){return}var t=a.elements,r=t.reference,n=t.popper;if(!rt(r,n)){return}a.rects={reference:Ke(r,Y(n),a.options.strategy==="fixed"),popper:q(n)};a.reset=false;a.placement=a.options.placement;a.orderedModifiers.forEach((function(e){return a.modifiersData[e.name]=Object.assign({},e.data)}));for(var i=0;i<a.orderedModifiers.length;i++){if(a.reset===true){a.reset=false;i=-1;continue}var o=a.orderedModifiers[i],s=o.fn,c=o.options,u=c===void 0?{}:c,v=o.name;if(typeof s==="function"){a=s({state:a,options:u,name:v,instance:p})||a}}},update:$e((function(){return new Promise((function(e){p.forceUpdate();e(a)}))})),destroy:function e(){u();f=true}};if(!rt(t,r)){return p}p.setOptions(i).then((function(e){if(!f&&i.onFirstUpdate){i.onFirstUpdate(e)}}));function c(){a.orderedModifiers.forEach((function(e){var t=e.name,r=e.options,n=r===void 0?{}:r,i=e.effect;if(typeof i==="function"){var o=i({state:a,name:t,instance:p,options:n});var f=function e(){};s.push(o||f)}}))}function u(){s.forEach((function(e){return e()}));s=[]}return p}}var it=[ve,Ue,pe,C,Fe,He,Xe,ne,Ve];var ot=nt({defaultModifiers:it});var at=function(){function e(e,t,r){this.handleTransitionEnd=this.handleTransitionEnd.bind(this);this.anchor=e;this.popover=t;this.options=Object.assign({skidding:0,distance:0,placement:"bottom-start",strategy:"absolute",transitionElement:this.popover,visibleClass:"popover-visible",onAfterShow:function(){},onAfterHide:function(){},onTransitionEnd:function(){}},r);this.popover.hidden=true;this.popover.classList.remove(this.options.visibleClass);this.popover.addEventListener("transitionend",this.handleTransitionEnd)}e.prototype.handleTransitionEnd=function(e){var t=e.target;if(t===this.options.transitionElement){this.options.onTransitionEnd.call(this,e);if(this.isVisible===false&&!this.popover.hidden){this.popover.hidden=true;this.popover.classList.remove(this.options.visibleClass);this.options.onAfterHide.call(this)}}};e.prototype.destroy=function(){this.popover.removeEventListener("transitionend",this.handleTransitionEnd);if(this.popper){this.popper.destroy();this.popper=null}};e.prototype.show=function(){var e=this;this.isVisible=true;this.popover.hidden=false;t((function(){return e.popover.classList.add(e.options.visibleClass)}));if(this.popper){this.popper.destroy()}var r=this.options.placement.includes("center")?"top":this.options.placement;this.popper=ot(this.anchor,this.popover,{placement:r,strategy:this.options.strategy,modifiers:[{name:"sameWidth",enabled:true,fn:function(e){var t=e.state;t.styles.popper.minWidth=t.rects.reference.width+"px"},phase:"beforeWrite",requires:["computeStyles"]},{name:"flip",options:{boundary:"viewport"}},{name:"offset",options:{padding:5,offset:function(t){var r=t.reference,n=t.placement,i=t.popper;if(e.options.placement!=="center")return[e.options.skidding,e.options.distance];return[e.options.skidding,["top","bottom"].includes(n)?-r.height-(i.height-r.height)/2:-r.width-(i.width-r.width)/2]}}}]});this.popover.addEventListener("transitionend",(function(){return e.options.onAfterShow.call(e)}),{once:true});requestAnimationFrame((function(){return e.popper.update()}))};e.prototype.hide=function(){this.isVisible=false;this.popover.classList.remove(this.options.visibleClass)};e.prototype.setOptions=function(e){var t=this;this.options=Object.assign(this.options,e);this.isVisible?this.popover.classList.add(this.options.visibleClass):this.popover.classList.remove(this.options.visibleClass);var r=this.options.placement.includes("center")?"top":this.options.placement;if(this.popper){this.popper.setOptions({placement:r,strategy:this.options.strategy});requestAnimationFrame((function(){return t.popper.update()}))}};return e}();e("P",at)}}}));
+//# sourceMappingURL=p-9745d44e.system.js.map