@claromentis/design-system/dist/esm/cla-badge_29.entry.js

Claromentis Design System Component Library

import { r as registerInstance, h, g as getElement, c as createEvent, e as Host, f as getAssetPath } from './index-f2c46e82.js';

/**
 * Submit the closest form in the given element's ancestry.
 *
 * @see https://github.com/ionic-team/ionic/blob/e5c8c10/core/src/components/button/button.tsx#L110-L131
 * @param {HTMLElement} element - The element to submit a form for.
 * @param {string} [type] - The type of form submission. `'reset'` or `'submit'`, defaults to `'submit'`.
 * @param {string} [name] - The name of the button to use for the submission.
 * @param {any} [value] - The value of the button to use for the submission.
 * @return {void}
 */
function submitClosestForm(element, type = 'submit', name, value) {
  if (!element.ownerDocument) {
    return;
  }
  // Find the closest form
  const form = element.closest('form');
  if (!form) {
    return;
  }
  // Create a fake button element
  const fakeButton = element.ownerDocument.createElement('button');
  if (name != null) {
    fakeButton.name = name;
  }
  if (value != null) {
    fakeButton.value = value;
  }
  fakeButton.type = type;
  fakeButton.style.display = 'none';
  // Use the fake button element to submit the form
  form.appendChild(fakeButton);
  fakeButton.click();
  fakeButton.remove();
}
/**
 * Determine whether an element has a Shadow DOM.
 *
 * @see https://github.com/ionic-team/ionic/blob/f9483a0/core/src/utils/helpers.ts#L13-L15
 * @param {HTMLElement} element - The element to detect Shadow DOM for.
 * @return {boolean} - Whether the element has a Shadow DOM.
 */
function hasShadowDom(element) {
  return !!element.shadowRoot && !!element.attachShadow;
}
/**
 * Propagate a focus event on a given element.
 *
 * @param {HTMLElement} element - The element to propagate the focus event on.
 * @param {FocusEvent} event - The focus event to propagate.
 */
function propagateFocusEvent(element, event) {
  element.dispatchEvent(cloneFocusEvent(event));
}
/**
 * Clone a focus event in a way that's compatible with Internet Explorer.
 *
 * @param {FocusEvent} event
 * @return {FocusEvent}
 */
function cloneFocusEvent(event) {
  if (typeof Event === 'function') {
    return new FocusEvent(event.type, { relatedTarget: event.target });
  }
  // // IE
  // let target = event.currentTarget as Element;
  // let eventClone = target.ownerDocument.createEvent('FocusEvent');
  // eventClone.initFocusEvent(event.type, event.bubbles, event.cancelable, event.view, event.detail, event.target);
  //
  // return eventClone;
}
/***
* Polyfill for IE11 missing NodeList.forEach
*/
function NodeListForEachIe11() {
  if ('NodeList' in window && !NodeList.prototype.forEach) {
    NodeList.prototype.forEach = function (callback, thisArg) {
      thisArg = thisArg || window;
      for (var i = 0; i < this.length; i++) {
        callback.call(thisArg, this[i], i, this);
      }
    };
  }
}
/**
 * Finds the cla-label within cla-item
 *
 * @param {HTMLElement} componentEl
 * @return {componentEl.label}
 */
function findItemLabel(componentEl) {
  const itemEl = componentEl.closest('cla-item');
  if (itemEl) {
    return itemEl.querySelector('cla-label');
  }
  return console.error('Error: Please wrap label and corresponding element within a <cla-item>. Refer to readme for details');
}
/**
 * Is the cla-picker-group multiselectable or not
 *
 * @param {HTMLElement} componentEl
 *
 *
 */
function pickerGroupMultiselect(componentEl) {
  const pickerGroup = componentEl.closest('cla-picker-group');
  if (pickerGroup === null) {
    console.error('Error: Please use <cla-picker> within a <cla-picker-group>. Refer to readme for details');
    return false;
  }
  return pickerGroup.getAttribute('multiselectable') === "true";
}
/**
 * Is the cla-nav inline or block
 *
 * @param {HTMLElement} componentEl
 */
function claNavInline(componentEl) {
  const claNav = componentEl.closest('cla-nav');
  return claNav.getAttribute('inline') === "true";
}
/**
 * Is the cla-card-image aspect ratio fixed
 *
 * @param {HTMLElement} componentEl
 */
function claImgFixed(componentEl) {
  const claImg = componentEl.closest('cla-card-media');
  return claImg.getAttribute('preserveaspect') === "true";
}
/***
* check if element is in the viewport
* @param {Element} elem
* @return {boolean} is the element within the viewport?
*/
function isInViewport(elem) {
  var bounding = elem.getBoundingClientRect();
  return (bounding.top >= 0 &&
    bounding.left >= 0 &&
    bounding.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
    bounding.right <= (window.innerWidth || document.documentElement.clientWidth));
}
/***
* finds the pixel width of text
* @param {String} text
* @return {Integer}
*/
function textWidth(text) {
  const tempSpan = document.createElement('span');
  tempSpan.innerHTML = text;
  document.body.appendChild(tempSpan);
  // Get the width of the span then remove it
  const textWidth = tempSpan.offsetWidth;
  tempSpan.remove();
  return textWidth;
}
/***
 * determines whether a colour value is light or dark
 * @param  HSL, HEX or RGB color
 * @return {String}
 */
function lightOrDark(color) {
  // Variables for red, green, blue values
  let r, g, b, hsp;
  // Check the format of the color, HEX or RGB?
  if (color.match(/^rgb/)) {
    // If HEX --> store the red, green, blue values in separate variables
    color = color.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+(?:\.\d+)?))?\)$/);
    r = color[1];
    g = color[2];
    b = color[3];
  }
  else if (color.match(/^hsl/)) {
    let sep = color.indexOf(",") > -1 ? "," : " ";
    color = color.substr(4).split(")")[0].split(sep);
    let h = color[0], s = color[1].substr(0, color[1].length - 1) / 100, l = color[2].substr(0, color[2].length - 1) / 100, c = (1 - Math.abs(2 * l - 1)) * s, x = c * (1 - Math.abs((h / 60) % 2 - 1)), m = l - c / 2;
    if (0 <= h && h < 60) {
      r = c;
      g = x;
      b = 0;
    }
    else if (60 <= h && h < 120) {
      r = x;
      g = c;
      b = 0;
    }
    else if (120 <= h && h < 180) {
      r = 0;
      g = c;
      b = x;
    }
    else if (180 <= h && h < 240) {
      r = 0;
      g = x;
      b = c;
    }
    else if (240 <= h && h < 300) {
      r = x;
      g = 0;
      b = c;
    }
    else if (300 <= h && h < 360) {
      r = c;
      g = 0;
      b = x;
    }
    r = Math.round((r + m) * 255);
    g = Math.round((g + m) * 255);
    b = Math.round((b + m) * 255);
  }
  else {
    // If RGB --> Convert it to HEX: http://gist.github.com/983661
    color = +("0x" + color.slice(1).replace(color.length < 5 && /./g, '$&$&'));
    r = color >> 16;
    g = color >> 8 & 255;
    b = color & 255;
  }
  // HSP (Highly Sensitive Poo) equation from http://alienryderflex.com/hsp.html
  hsp = Math.sqrt(0.299 * (r * r) +
    0.587 * (g * g) +
    0.114 * (b * b));
  // Using the HSP value, determine whether the color is light or dark
  if (hsp > 127.5) {
    return 'light';
  }
  else {
    return 'dark';
  }
}

const claBadgeCss = "@charset \"UTF-8\";:root{--white:#FFF;--black:#000;--brand-blue:var(--blue-500);--brand-grey:var(--gray-500);--headings-color:var(--gray-800);--subheadings-color:var(--gray-700);--body-color:var(--gray-900);--ui-bg-color-enabled:var(--gray-100);--ui-border-color-enabled:var(--gray-400);--ui-bg-color-disabled:var(--gray-100);--ui-border-color-disabled:var(--gray-300);--ui-text-color-disabled:var(--gray-500);--ui-box-shadow-focus:var(--blue-200);--ui-border-color-focus:var(--blue-600);--ui-border-color-focus-hover:var(--gray-600);--ui-bg-color-focus-hover:var(--gray-200);--ui-color-active:var(--blue-600);--ui-bg-color-active:var(--blue-700);--ui-color-active-hover:var(--blue-700);--ui-bg-color-active-hover:var(--gray-200);--ui-bg-color-hover:var(--gray-100);--ui-border-color-hover:var(--gray-500);--input-bg-color-enabled:var(--gray-100);--input-border-color-enabled:var(--gray-400);--input-bg-color-dark-enabled:var(--gray-400);--input-bg-color-disabled:var(--gray-100);--input-border-color-disabled:var(--gray-300);--input-text-color-disabled:var(--gray-500);--input-box-shadow-focus:var(--blue-200);--input-border-color-focus:var(--blue-600);--input-border-color-focus-hover:var(--gray-600);--input-bg-color-focus-hover:var(--gray-200);--input-color-active:var(--blue-600);--input-bg-color-active:var(--blue-200);--input-color-active-hover:var(--blue-700);--input-bg-color-active-hover:var(--gray-200);--input-bg-color-hover:var(--gray-100);--input-border-color-hover:var(--gray-500);--input-bg-dark-color-hover:var(--input-border-color-hover);--inverted-background:var(--gray-900);--inverted-border-color:var(--gray-700)}*,*::before,*::after{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{margin:0;font-family:-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";font-size:1rem;font-weight:400;line-height:1.5;color:#212529;text-align:left;background-color:#fff}[tabindex=\"-1\"]:focus:not(:focus-visible){outline:0 !important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:0.5rem}p{margin-top:0;margin-bottom:1rem}abbr[title],abbr[data-original-title]{text-decoration:underline;text-decoration:underline dotted;cursor:help;border-bottom:0;text-decoration-skip-ink:none}address{margin-bottom:1rem;font-style:normal;line-height:inherit}ol,ul,dl{margin-top:0;margin-bottom:1rem}ol ol,ul ul,ol ul,ul ol{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:0.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}a{color:#007bff;text-decoration:none;background-color:transparent}a:hover{color:#0056b3;text-decoration:underline}a:not([href]):not([class]){color:inherit;text-decoration:none}a:not([href]):not([class]):hover{color:inherit;text-decoration:none}pre,code,kbd,samp{font-family:SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;font-size:1em}pre{margin-top:0;margin-bottom:1rem;overflow:auto;-ms-overflow-style:scrollbar}figure{margin:0 0 1rem}img{vertical-align:middle;border-style:none}svg{overflow:hidden;vertical-align:middle}table{border-collapse:collapse}caption{padding-top:0.75rem;padding-bottom:0.75rem;color:#6c757d;text-align:left;caption-side:bottom}th{text-align:inherit;text-align:-webkit-match-parent}label{display:inline-block;margin-bottom:0.5rem}button{border-radius:0}button:focus:not(:focus-visible){outline:0}input,button,select,optgroup,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,input{overflow:visible}button,select{text-transform:none}[role=button]{cursor:pointer}select{word-wrap:normal}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button:not(:disabled),[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled){cursor:pointer}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{padding:0;border-style:none}input[type=radio],input[type=checkbox]{box-sizing:border-box;padding:0}textarea{overflow:auto;resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;max-width:100%;padding:0;margin-bottom:0.5rem;font-size:1.5rem;line-height:inherit;color:inherit;white-space:normal}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:none}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}output{display:inline-block}summary{display:list-item;cursor:pointer}template{display:none}[hidden]{display:none !important}h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{margin-bottom:0.5rem;font-weight:500;line-height:1.2}h1,.h1{font-size:2.5rem}h2,.h2{font-size:2rem}h3,.h3{font-size:1.75rem}h4,.h4{font-size:1.5rem}h5,.h5{font-size:1.25rem}h6,.h6{font-size:1rem}.lead{font-size:1.25rem;font-weight:300}.display-1{font-size:6rem;font-weight:300;line-height:1.2}.display-2{font-size:5.5rem;font-weight:300;line-height:1.2}.display-3{font-size:4.5rem;font-weight:300;line-height:1.2}.display-4{font-size:3.5rem;font-weight:300;line-height:1.2}hr{margin-top:1rem;margin-bottom:1rem;border:0;border-top:1px solid rgba(0, 0, 0, 0.1)}small,.small{font-size:0.875em;font-weight:400}mark,.mark{padding:0.2em;background-color:#fcf8e3}.list-unstyled{padding-left:0;list-style:none}.list-inline{padding-left:0;list-style:none}.list-inline-item{display:inline-block}.list-inline-item:not(:last-child){margin-right:0.5rem}.initialism{font-size:90%;text-transform:uppercase}.blockquote{margin-bottom:1rem;font-size:1.25rem}.blockquote-footer{display:block;font-size:0.875em;color:#6c757d}.blockquote-footer::before{content:\"— \"}.badge{display:inline-block;padding:4px 6px;font-size:calc(12px);font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:0.25rem;transition:color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out}@media (prefers-reduced-motion: reduce){.badge{transition:none}}a.badge:hover,a.badge:focus{text-decoration:none}.badge:empty{display:none}.btn .badge{position:relative;top:-1px}.badge-pill{padding-right:4px;padding-left:4px;border-radius:10rem}.badge-primary{color:#fff;background-color:#4399df}a.badge-primary:hover,a.badge-primary:focus{color:#fff;background-color:#2380cd}a.badge-primary:focus,a.badge-primary.focus{outline:0;box-shadow:0 0 0 0.2rem rgba(67, 153, 223, 0.5)}.badge-secondary{color:#212529;background-color:#edf2f7}a.badge-secondary:hover,a.badge-secondary:focus{color:#212529;background-color:#cad9e7}a.badge-secondary:focus,a.badge-secondary.focus{outline:0;box-shadow:0 0 0 0.2rem rgba(237, 242, 247, 0.5)}.badge-success{color:#fff;background-color:#3ba06a}a.badge-success:hover,a.badge-success:focus{color:#fff;background-color:#2d7b52}a.badge-success:focus,a.badge-success.focus{outline:0;box-shadow:0 0 0 0.2rem rgba(59, 160, 106, 0.5)}.badge-danger{color:#fff;background-color:#e24040}a.badge-danger:hover,a.badge-danger:focus{color:#fff;background-color:#d11f1f}a.badge-danger:focus,a.badge-danger.focus{outline:0;box-shadow:0 0 0 0.2rem rgba(226, 64, 64, 0.5)}.badge-warning{color:#212529;background-color:#e8c554}a.badge-warning:hover,a.badge-warning:focus{color:#212529;background-color:#e2b628}a.badge-warning:focus,a.badge-warning.focus{outline:0;box-shadow:0 0 0 0.2rem rgba(232, 197, 84, 0.5)}.badge-info{color:#fff;background-color:#4399df}a.badge-info:hover,a.badge-info:focus{color:#fff;background-color:#2380cd}a.badge-info:focus,a.badge-info.focus{outline:0;box-shadow:0 0 0 0.2rem rgba(67, 153, 223, 0.5)}.badge-dark{color:#fff;background-color:#2e3747}a.badge-dark:hover,a.badge-dark:focus{color:#fff;background-color:#1a1f28}a.badge-dark:focus,a.badge-dark.focus{outline:0;box-shadow:0 0 0 0.2rem rgba(46, 55, 71, 0.5)}.badge-light{color:#212529;background-color:#f8fafc}a.badge-light:hover,a.badge-light:focus{color:#212529;background-color:#d3e3ee}a.badge-light:focus,a.badge-light.focus{outline:0;box-shadow:0 0 0 0.2rem rgba(248, 250, 252, 0.5)}.badge{display:inline-flex;align-items:center;font-weight:300}.badge-gold{color:var(--body-color);background-image:linear-gradient(105deg, #ffcb19 0%, #f9b867 97%)}.badge-gold ::slotted(*){--cla-icon-color:var(--body-color)}.badge-pill{padding-right:8px;padding-left:8px}.badge-lg{padding:8px 10px}.dark{color:var(--white)}.light{color:var(--black)}::slotted(*){margin-right:5px}";

const Badge = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.styleclass = "badge badge-primary";
    this.colour = null;
  }
  render() {
    if (this.colour) {
      return (h("span", { class: `${this.styleclass} ` + `${lightOrDark(this.colour)}`, style: { backgroundColor: `${this.colour}` } }, h("slot", null)));
    }
    else {
      return (h("span", { class: this.styleclass }, h("slot", null)));
    }
  }
};
Badge.style = claBadgeCss;

const claBannerCss = "@charset \"UTF-8\";:root{--white:#FFF;--black:#000;--brand-blue:var(--blue-500);--brand-grey:var(--gray-500);--headings-color:var(--gray-800);--subheadings-color:var(--gray-700);--body-color:var(--gray-900);--ui-bg-color-enabled:var(--gray-100);--ui-border-color-enabled:var(--gray-400);--ui-bg-color-disabled:var(--gray-100);--ui-border-color-disabled:var(--gray-300);--ui-text-color-disabled:var(--gray-500);--ui-box-shadow-focus:var(--blue-200);--ui-border-color-focus:var(--blue-600);--ui-border-color-focus-hover:var(--gray-600);--ui-bg-color-focus-hover:var(--gray-200);--ui-color-active:var(--blue-600);--ui-bg-color-active:var(--blue-700);--ui-color-active-hover:var(--blue-700);--ui-bg-color-active-hover:var(--gray-200);--ui-bg-color-hover:var(--gray-100);--ui-border-color-hover:var(--gray-500);--input-bg-color-enabled:var(--gray-100);--input-border-color-enabled:var(--gray-400);--input-bg-color-dark-enabled:var(--gray-400);--input-bg-color-disabled:var(--gray-100);--input-border-color-disabled:var(--gray-300);--input-text-color-disabled:var(--gray-500);--input-box-shadow-focus:var(--blue-200);--input-border-color-focus:var(--blue-600);--input-border-color-focus-hover:var(--gray-600);--input-bg-color-focus-hover:var(--gray-200);--input-color-active:var(--blue-600);--input-bg-color-active:var(--blue-200);--input-color-active-hover:var(--blue-700);--input-bg-color-active-hover:var(--gray-200);--input-bg-color-hover:var(--gray-100);--input-border-color-hover:var(--gray-500);--input-bg-dark-color-hover:var(--input-border-color-hover);--inverted-background:var(--gray-900);--inverted-border-color:var(--gray-700)}*,*::before,*::after{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{margin:0;font-family:-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";font-size:1rem;font-weight:400;line-height:1.5;color:#212529;text-align:left;background-color:#fff}[tabindex=\"-1\"]:focus:not(:focus-visible){outline:0 !important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:0.5rem}p{margin-top:0;margin-bottom:1rem}abbr[title],abbr[data-original-title]{text-decoration:underline;text-decoration:underline dotted;cursor:help;border-bottom:0;text-decoration-skip-ink:none}address{margin-bottom:1rem;font-style:normal;line-height:inherit}ol,ul,dl{margin-top:0;margin-bottom:1rem}ol ol,ul ul,ol ul,ul ol{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:0.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}a{color:#007bff;text-decoration:none;background-color:transparent}a:hover{color:#0056b3;text-decoration:underline}a:not([href]):not([class]){color:inherit;text-decoration:none}a:not([href]):not([class]):hover{color:inherit;text-decoration:none}pre,code,kbd,samp{font-family:SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;font-size:1em}pre{margin-top:0;margin-bottom:1rem;overflow:auto;-ms-overflow-style:scrollbar}figure{margin:0 0 1rem}img{vertical-align:middle;border-style:none}svg{overflow:hidden;vertical-align:middle}table{border-collapse:collapse}caption{padding-top:0.75rem;padding-bottom:0.75rem;color:#6c757d;text-align:left;caption-side:bottom}th{text-align:inherit;text-align:-webkit-match-parent}label{display:inline-block;margin-bottom:0.5rem}button{border-radius:0}button:focus:not(:focus-visible){outline:0}input,button,select,optgroup,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,input{overflow:visible}button,select{text-transform:none}[role=button]{cursor:pointer}select{word-wrap:normal}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button:not(:disabled),[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled){cursor:pointer}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{padding:0;border-style:none}input[type=radio],input[type=checkbox]{box-sizing:border-box;padding:0}textarea{overflow:auto;resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;max-width:100%;padding:0;margin-bottom:0.5rem;font-size:1.5rem;line-height:inherit;color:inherit;white-space:normal}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:none}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}output{display:inline-block}summary{display:list-item;cursor:pointer}template{display:none}[hidden]{display:none !important}h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{margin-bottom:0.5rem;font-weight:500;line-height:1.2}h1,.h1{font-size:2.5rem}h2,.h2{font-size:2rem}h3,.h3{font-size:1.75rem}h4,.h4{font-size:1.5rem}h5,.h5{font-size:1.25rem}h6,.h6{font-size:1rem}.lead{font-size:1.25rem;font-weight:300}.display-1{font-size:6rem;font-weight:300;line-height:1.2}.display-2{font-size:5.5rem;font-weight:300;line-height:1.2}.display-3{font-size:4.5rem;font-weight:300;line-height:1.2}.display-4{font-size:3.5rem;font-weight:300;line-height:1.2}hr{margin-top:1rem;margin-bottom:1rem;border:0;border-top:1px solid rgba(0, 0, 0, 0.1)}small,.small{font-size:0.875em;font-weight:400}mark,.mark{padding:0.2em;background-color:#fcf8e3}.list-unstyled{padding-left:0;list-style:none}.list-inline{padding-left:0;list-style:none}.list-inline-item{display:inline-block}.list-inline-item:not(:last-child){margin-right:0.5rem}.initialism{font-size:90%;text-transform:uppercase}.blockquote{margin-bottom:1rem;font-size:1.25rem}.blockquote-footer{display:block;font-size:0.875em;color:#6c757d}.blockquote-footer::before{content:\"— \"}.banner-outer{position:fixed;left:0;right:0;z-index:9999;padding:0;margin-left:20px;margin-right:20px}.banner-bottom{bottom:0}.banner-bottom .banner{margin-bottom:20px}.banner-top{top:0}.banner-top .banner{margin-top:20px}.banner{background:var(--white);max-width:900px;margin:0 auto;-webkit-box-shadow:0 0 20px 10px rgba(0, 0, 0, 0.08);box-shadow:0 0 20px 10px rgba(0, 0, 0, 0.08);border-radius:10px}";

const Banner = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.position = 'bottom';
  }
  /**
  * Get the map of CSS classes for the banner.
  *
  * @return CssClassMap
  */
  getClassMap() {
    const position = this.position;
    return {
      'banner-outer': true,
      [`banner-top`]: position === 'top',
      [`banner-bottom`]: position === 'bottom',
    };
  }
  render() {
    return (h("div", { class: this.getClassMap() }, h("div", { class: "banner" }, h("slot", null))));
  }
};
Banner.style = claBannerCss;

const claButtonCss = "@charset \"UTF-8\";:root{--white:#FFF;--black:#000;--brand-blue:var(--blue-500);--brand-grey:var(--gray-500);--headings-color:var(--gray-800);--subheadings-color:var(--gray-700);--body-color:var(--gray-900);--ui-bg-color-enabled:var(--gray-100);--ui-border-color-enabled:var(--gray-400);--ui-bg-color-disabled:var(--gray-100);--ui-border-color-disabled:var(--gray-300);--ui-text-color-disabled:var(--gray-500);--ui-box-shadow-focus:var(--blue-200);--ui-border-color-focus:var(--blue-600);--ui-border-color-focus-hover:var(--gray-600);--ui-bg-color-focus-hover:var(--gray-200);--ui-color-active:var(--blue-600);--ui-bg-color-active:var(--blue-700);--ui-color-active-hover:var(--blue-700);--ui-bg-color-active-hover:var(--gray-200);--ui-bg-color-hover:var(--gray-100);--ui-border-color-hover:var(--gray-500);--input-bg-color-enabled:var(--gray-100);--input-border-color-enabled:var(--gray-400);--input-bg-color-dark-enabled:var(--gray-400);--input-bg-color-disabled:var(--gray-100);--input-border-color-disabled:var(--gray-300);--input-text-color-disabled:var(--gray-500);--input-box-shadow-focus:var(--blue-200);--input-border-color-focus:var(--blue-600);--input-border-color-focus-hover:var(--gray-600);--input-bg-color-focus-hover:var(--gray-200);--input-color-active:var(--blue-600);--input-bg-color-active:var(--blue-200);--input-color-active-hover:var(--blue-700);--input-bg-color-active-hover:var(--gray-200);--input-bg-color-hover:var(--gray-100);--input-border-color-hover:var(--gray-500);--input-bg-dark-color-hover:var(--input-border-color-hover);--inverted-background:var(--gray-900);--inverted-border-color:var(--gray-700)}*,*::before,*::after{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{margin:0;font-family:-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";font-size:1rem;font-weight:400;line-height:1.5;color:#212529;text-align:left;background-color:#fff}[tabindex=\"-1\"]:focus:not(:focus-visible){outline:0 !important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:0.5rem}p{margin-top:0;margin-bottom:1rem}abbr[title],abbr[data-original-title]{text-decoration:underline;text-decoration:underline dotted;cursor:help;border-bottom:0;text-decoration-skip-ink:none}address{margin-bottom:1rem;font-style:normal;line-height:inherit}ol,ul,dl{margin-top:0;margin-bottom:1rem}ol ol,ul ul,ol ul,ul ol{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:0.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}a{color:#007bff;text-decoration:none;background-color:transparent}a:hover{color:#0056b3;text-decoration:underline}a:not([href]):not([class]){color:inherit;text-decoration:none}a:not([href]):not([class]):hover{color:inherit;text-decoration:none}pre,code,kbd,samp{font-family:SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;font-size:1em}pre{margin-top:0;margin-bottom:1rem;overflow:auto;-ms-overflow-style:scrollbar}figure{margin:0 0 1rem}img{vertical-align:middle;border-style:none}svg{overflow:hidden;vertical-align:middle}table{border-collapse:collapse}caption{padding-top:0.75rem;padding-bottom:0.75rem;color:#6c757d;text-align:left;caption-side:bottom}th{text-align:inherit;text-align:-webkit-match-parent}label{display:inline-block;margin-bottom:0.5rem}button{border-radius:0}button:focus:not(:focus-visible){outline:0}input,button,select,optgroup,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,input{overflow:visible}button,select{text-transform:none}[role=button]{cursor:pointer}select{word-wrap:normal}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button:not(:disabled),[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled){cursor:pointer}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{padding:0;border-style:none}input[type=radio],input[type=checkbox]{box-sizing:border-box;padding:0}textarea{overflow:auto;resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;max-width:100%;padding:0;margin-bottom:0.5rem;font-size:1.5rem;line-height:inherit;color:inherit;white-space:normal}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:none}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}output{display:inline-block}summary{display:list-item;cursor:pointer}template{display:none}[hidden]{display:none !important}h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{margin-bottom:0.5rem;font-weight:500;line-height:1.2}h1,.h1{font-size:2.5rem}h2,.h2{font-size:2rem}h3,.h3{font-size:1.75rem}h4,.h4{font-size:1.5rem}h5,.h5{font-size:1.25rem}h6,.h6{font-size:1rem}.lead{font-size:1.25rem;font-weight:300}.display-1{font-size:6rem;font-weight:300;line-height:1.2}.display-2{font-size:5.5rem;font-weight:300;line-height:1.2}.display-3{font-size:4.5rem;font-weight:300;line-height:1.2}.display-4{font-size:3.5rem;font-weight:300;line-height:1.2}hr{margin-top:1rem;margin-bottom:1rem;border:0;border-top:1px solid rgba(0, 0, 0, 0.1)}small,.small{font-size:0.875em;font-weight:400}mark,.mark{padding:0.2em;background-color:#fcf8e3}.list-unstyled{padding-left:0;list-style:none}.list-inline{padding-left:0;list-style:none}.list-inline-item{display:inline-block}.list-inline-item:not(:last-child){margin-right:0.5rem}.initialism{font-size:90%;text-transform:uppercase}.blockquote{margin-bottom:1rem;font-size:1.25rem}.blockquote-footer{display:block;font-size:0.875em;color:#6c757d}.blockquote-footer::before{content:\"— \"}.btn{display:inline-block;font-weight:400;color:#212529;text-align:center;vertical-align:middle;user-select:none;background-color:transparent;border:1px solid transparent;padding:6px 12px;font-size:calc(14px);line-height:1.5;border-radius:0.25rem;transition:color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out}@media (prefers-reduced-motion: reduce){.btn{transition:none}}.btn:hover{color:#212529;text-decoration:none}.btn:focus,.btn.focus{outline:0;box-shadow:0 0 0 0.2rem rgba(0, 123, 255, 0.25)}.btn.disabled,.btn:disabled{opacity:0.65}.btn:not(:disabled):not(.disabled){cursor:pointer}a.btn.disabled,fieldset:disabled a.btn{pointer-events:none}.btn-primary{color:#fff;background-color:#4399df;border-color:#4399df}.btn-primary:hover{color:#fff;background-color:#2587d8;border-color:#2380cd}.btn-primary:focus,.btn-primary.focus{color:#fff;background-color:#2587d8;border-color:#2380cd;box-shadow:0 0 0 0.2rem rgba(95, 168, 228, 0.5)}.btn-primary.disabled,.btn-primary:disabled{color:#fff;background-color:#4399df;border-color:#4399df}.btn-primary:not(:disabled):not(.disabled):active,.btn-primary:not(:disabled):not(.disabled).active,.show>.btn-primary.dropdown-toggle{color:#fff;background-color:#2380cd;border-color:#217ac2}.btn-primary:not(:disabled):not(.disabled):active:focus,.btn-primary:not(:disabled):not(.disabled).active:focus,.show>.btn-primary.dropdown-toggle:focus{box-shadow:0 0 0 0.2rem rgba(95, 168, 228, 0.5)}.btn-secondary{color:#212529;background-color:#edf2f7;border-color:#edf2f7}.btn-secondary:hover{color:#212529;background-color:#d3dfeb;border-color:#cad9e7}.btn-secondary:focus,.btn-secondary.focus{color:#212529;background-color:#d3dfeb;border-color:#cad9e7;box-shadow:0 0 0 0.2rem rgba(206, 211, 216, 0.5)}.btn-secondary.disabled,.btn-secondary:disabled{color:#212529;background-color:#edf2f7;border-color:#edf2f7}.btn-secondary:not(:disabled):not(.disabled):active,.btn-secondary:not(:disabled):not(.disabled).active,.show>.btn-secondary.dropdown-toggle{color:#212529;background-color:#cad9e7;border-color:#c1d2e3}.btn-secondary:not(:disabled):not(.disabled):active:focus,.btn-secondary:not(:disabled):not(.disabled).active:focus,.show>.btn-secondary.dropdown-toggle:focus{box-shadow:0 0 0 0.2rem rgba(206, 211, 216, 0.5)}.btn-success{color:#fff;background-color:#3ba06a;border-color:#3ba06a}.btn-success:hover{color:#fff;background-color:#318458;border-color:#2d7b52}.btn-success:focus,.btn-success.focus{color:#fff;background-color:#318458;border-color:#2d7b52;box-shadow:0 0 0 0.2rem rgba(88, 174, 128, 0.5)}.btn-success.disabled,.btn-success:disabled{color:#fff;background-color:#3ba06a;border-color:#3ba06a}.btn-success:not(:disabled):not(.disabled):active,.btn-success:not(:disabled):not(.disabled).active,.show>.btn-success.dropdown-toggle{color:#fff;background-color:#2d7b52;border-color:#2a724b}.btn-success:not(:disabled):not(.disabled):active:focus,.btn-success:not(:disabled):not(.disabled).active:focus,.show>.btn-success.dropdown-toggle:focus{box-shadow:0 0 0 0.2rem rgba(88, 174, 128, 0.5)}.btn-danger{color:#fff;background-color:#e24040;border-color:#e24040}.btn-danger:hover{color:#fff;background-color:#dc2121;border-color:#d11f1f}.btn-danger:focus,.btn-danger.focus{color:#fff;background-color:#dc2121;border-color:#d11f1f;box-shadow:0 0 0 0.2rem rgba(230, 93, 93, 0.5)}.btn-danger.disabled,.btn-danger:disabled{color:#fff;background-color:#e24040;border-color:#e24040}.btn-danger:not(:disabled):not(.disabled):active,.btn-danger:not(:disabled):not(.disabled).active,.show>.btn-danger.dropdown-toggle{color:#fff;background-color:#d11f1f;border-color:#c51e1e}.btn-danger:not(:disabled):not(.disabled):active:focus,.btn-danger:not(:disabled):not(.disabled).active:focus,.show>.btn-danger.dropdown-toggle:focus{box-shadow:0 0 0 0.2rem rgba(230, 93, 93, 0.5)}.btn-warning{color:#212529;background-color:#e8c554;border-color:#e8c554}.btn-warning:hover{color:#212529;background-color:#e3ba33;border-color:#e2b628}.btn-warning:focus,.btn-warning.focus{color:#212529;background-color:#e3ba33;border-color:#e2b628;box-shadow:0 0 0 0.2rem rgba(202, 173, 78, 0.5)}.btn-warning.disabled,.btn-warning:disabled{color:#212529;background-color:#e8c554;border-color:#e8c554}.btn-warning:not(:disabled):not(.disabled):active,.btn-warning:not(:disabled):not(.disabled).active,.show>.btn-warning.dropdown-toggle{color:#212529;background-color:#e2b628;border-color:#deb11e}.btn-warning:not(:disabled):not(.disabled):active:focus,.btn-warning:not(:disabled):not(.disabled).active:focus,.show>.btn-warning.dropdown-toggle:focus{box-shadow:0 0 0 0.2rem rgba(202, 173, 78, 0.5)}.btn-info{color:#fff;background-color:#4399df;border-color:#4399df}.btn-info:hover{color:#fff;background-color:#2587d8;border-color:#2380cd}.btn-info:focus,.btn-info.focus{color:#fff;background-color:#2587d8;border-color:#2380cd;box-shadow:0 0 0 0.2rem rgba(95, 168, 228, 0.5)}.btn-info.disabled,.btn-info:disabled{color:#fff;background-color:#4399df;border-color:#4399df}.btn-info:not(:disabled):not(.disabled):active,.btn-info:not(:disabled):not(.disabled).active,.show>.btn-info.dropdown-toggle{color:#fff;background-color:#2380cd;border-color:#217ac2}.btn-info:not(:disabled):not(.disabled):active:focus,.btn-info:not(:disabled):not(.disabled).active:focus,.show>.btn-info.dropdown-toggle:focus{box-shadow:0 0 0 0.2rem rgba(95, 168, 228, 0.5)}.btn-dark{color:#fff;background-color:#2e3747;border-color:#2e3747}.btn-dark:hover{color:#fff;background-color:#1f2530;border-color:#1a1f28}.btn-dark:focus,.btn-dark.focus{color:#fff;background-color:#1f2530;border-color:#1a1f28;box-shadow:0 0 0 0.2rem rgba(77, 85, 99, 0.5)}.btn-dark.disabled,.btn-dark:disabled{color:#fff;background-color:#2e3747;border-color:#2e3747}.btn-dark:not(:disabled):not(.disabled):active,.btn-dark:not(:disabled):not(.disabled).active,.show>.btn-dark.dropdown-toggle{color:#fff;background-color:#1a1f28;border-color:#151920}.btn-dark:not(:disabled):not(.disabled):active:focus,.btn-dark:not(:disabled):not(.disabled).active:focus,.show>.btn-dark.dropdown-toggle:focus{box-shadow:0 0 0 0.2rem rgba(77, 85, 99, 0.5)}.btn-light{color:#212529;background-color:#f8fafc;border-color:#f8fafc}.btn-light:hover{color:#212529;background-color:#dce9f2;border-color:#d3e3ee}.btn-light:focus,.btn-light.focus{color:#212529;background-color:#dce9f2;border-color:#d3e3ee;box-shadow:0 0 0 0.2rem rgba(216, 218, 220, 0.5)}.btn-light.disabled,.btn-light:disabled{color:#212529;background-color:#f8fafc;border-color:#f8fafc}.btn-light:not(:disabled):not(.disabled):active,.btn-light:not(:disabled):not(.disabled).active,.show>.btn-light.dropdown-toggle{color:#212529;background-color:#d3e3ee;border-color:#c9ddeb}.btn-light:not(:disabled):not(.disabled):active:focus,.btn-light:not(:disabled):not(.disabled).active:focus,.show>.btn-light.dropdown-toggle:focus{box-shadow:0 0 0 0.2rem rgba(216, 218, 220, 0.5)}.btn-outline-primary{color:#4399df;border-color:#4399df}.btn-outline-primary:hover{color:#fff;background-color:#4399df;border-color:#4399df}.btn-outline-primary:focus,.btn-outline-primary.focus{box-shadow:0 0 0 0.2rem rgba(67, 153, 223, 0.5)}.btn-outline-primary.disabled,.btn-outline-primary:disabled{color:#4399df;background-color:transparent}.btn-outline-primary:not(:disabled):not(.disabled):active,.btn-outline-primary:not(:disabled):not(.disabled).active,.show>.btn-outline-primary.dropdown-toggle{color:#fff;background-color:#4399df;border-color:#4399df}.btn-outline-primary:not(:disabled):not(.disabled):active:focus,.btn-outline-primary:not(:disabled):not(.disabled).active:focus,.show>.btn-outline-primary.dropdown-toggle:focus{box-shadow:0 0 0 0.2rem rgba(67, 153, 223, 0.5)}.btn-outline-secondary{color:#edf2f7;border-color:#edf2f7}.btn-outline-secondary:hover{color:#212529;background-color:#edf2f7;border-color:#edf2f7}.btn-outline-secondary:focus,.btn-outline-secondary.focus{box-shadow:0 0 0 0.2rem rgba(237, 242, 247, 0.5)}.btn-outline-secondary.disabled,.btn-outline-secondary:disabled{color:#edf2f7;background-color:transparent}.btn-outline-secondary:not(:disabled):not(.disabled):active,.btn-outline-secondary:not(:disabled):not(.disabled).active,.show>.btn-outline-secondary.dropdown-toggle{color:#212529;background-color:#edf2f7;border-color:#edf2f7}.btn-outline-secondary:not(:disabled):not(.disabled):active:focus,.btn-outline-secondary:not(:disabled):not(.disabled).active:focus,.show>.btn-outline-secondary.dropdown-toggle:focus{box-shadow:0 0 0 0.2rem rgba(237, 242, 247, 0.5)}.btn-outline-success{color:#3ba06a;border-color:#3ba06a}.btn-outline-success:hover{color:#fff;background-color:#3ba06a;border-color:#3ba06a}.btn-outline-success:focus,.btn-outline-success.focus{box-shadow:0 0 0 0.2rem rgba(59, 160, 106, 0.5)}.btn-outline-success.disabled,.btn-outline-success:disabled{color:#3ba06a;background-color:transparent}.btn-outline-success:not(:disabled):not(.disabled):active,.btn-outline-success:not(:disabled):not(.disabled).active,.show>.btn-outline-success.dropdown-toggle{color:#fff;background-color:#3ba06a;border-color:#3ba06a}.btn-outline-success:not(:disabled):not(.disabled):active:focus,.btn-outline-success:not(:disabled):not(.disabled).active:focus,.show>.btn-outline-success.dropdown-toggle:focus{box-shadow:0 0 0 0.2rem rgba(59, 160, 106, 0.5)}.btn-outline-danger{color:#e24040;border-color:#e24040}.btn-outline-danger:hover{color:#fff;background-color:#e24040;border-color:#e24040}.btn-outline-danger:focus,.btn-outline-danger.focus{box-shadow:0 0 0 0.2rem rgba(226, 64, 64, 0.5)}.btn-outline-danger.disabled,.btn-outline-danger:disabled{color:#e24040;background-color:transparent}.btn-outline-danger:not(:disabled):not(.disabled):active,.btn-outline-danger:not(:disabled):not(.disabled).active,.show>.btn-outline-danger.dropdown-toggle{color:#fff;background-color:#e24040;border-color:#e24040}.btn-outline-danger:not(:disabled):not(.disabled):active:focus,.btn-outline-danger:not(:disabled):not(.disabled).active:focus,.show>.btn-outline-danger.dropdown-toggle:focus{box-shadow:0 0 0 0.2rem rgba(226, 64, 64, 0.5)}.btn-outline-warning{color:#e8c554;border-color:#e8c554}.btn-outline-warning:hover{color:#212529;background-color:#e8c554;border-color:#e8c554}.btn-outline-warning:focus,.btn-outline-warning.focus{box-shadow:0 0 0 0.2rem rgba(232, 197, 84, 0.5)}.btn-outline-warning.disabled,.btn-outline-warning:disabled{color:#e8c554;background-color:transparent}.btn-outline-warning:not(:disabled):not(.disabled):active,.btn-outline-warning:not(:disabled):not(.disabled).active,.show>.btn-outline-warning.dropdown-toggle{color:#212529;background-color:#e8c554;border-color:#e8c554}.btn-outline-warning:not(:disabled):not(.disabled):active:focus,.btn-outline-warning:not(:disabled):not(.disabled).active:focus,.show>.btn-outline-warning.dropdown-toggle:focus{box-shadow:0 0 0 0.2rem rgba(232, 197, 84, 0.5)}.btn-outline-info{color:#4399df;border-color:#4399df}.btn-outline-info:hover{color:#fff;background-color:#4399df;border-color:#4399df}.btn-outline-info:focus,.btn-outline-info.focus{box-shadow:0 0 0 0.2rem rgba(67, 153, 223, 0.5)}.btn-outline-info.disabled,.btn-outline-info:disabled{color:#4399df;background-color:transparent}.btn-outline-info:not(:disabled):not(.disabled):active,.btn-outline-info:not(:disabled):not(.disabled).active,.show>.btn-outline-info.dropdown-toggle{color:#fff;background-color:#4399df;border-color:#4399df}.btn-outline-info:not(:disabled):not(.disabled):active:focus,.btn-outline-info:not(:disabled):not(.disabled).active:focus,.show>.btn-outline-info.dropdown-toggle:focus{box-shadow:0 0 0 0.2rem rgba(67, 153, 223, 0.5)}.btn-outline-dark{color:#2e3747;border-color:#2e3747}.btn-outline-dark:hover{color:#fff;background-color:#2e3747;border-color:#2e3747}.btn-outline-dark:focus,.btn-outline-dark.focus{box-shadow:0 0 0 0.2rem rgba(46, 55, 71, 0.5)}.btn-outline-dark.disabled,.btn-outline-dark:disabled{color:#2e3747;background-color:transparent}.btn-outline-dark:not(:disabled):not(.disabled):active,.btn-outline-dark:not(:disabled):not(.disabled).active,.show>.btn-outline-dark.dropdown-toggle{color:#fff;background-color:#2e3747;border-color:#2e3747}.btn-outline-dark:not(:disabled):not(.disabled):active:focus,.btn-outline-dark:not(:disabled):not(.disabled).active:focus,.show>.btn-outline-dark.dropdown-toggle:focus{box-shadow:0 0 0 0.2rem rgba(46, 55, 71, 0.5)}.btn-outline-light{color:#f8fafc;border-color:#f8fafc}.btn-outline-light:hover{color:#212529;background-color:#f8fafc;border-color:#f8fafc}.btn-outline-light:focus,.btn-outline-light.focus{box-shadow:0 0 0 0.2rem rgba(248, 250, 252, 0.5)}.btn-outline-light.disabled,.btn-outline-light:disabled{color:#f8fafc;background-color:transparent}.btn-outline-light:not(:disabled):not(.disabled):active,.btn-outline-light:not(:disabled):not(.disabled).active,.show>.btn-outline-light.dropdown-toggle{color:#212529;background-color:#f8fafc;border-color:#f8fafc}.btn-outline-light:not(:disabled):not(.disabled):active:focus,.btn-outline-light:not(:disabled):not(.disabled).active:focus,.show>.btn-outline-light.dropdown-toggle:focus{box-shadow:0 0 0 0.2rem rgba(248, 250, 252, 0.5)}.btn-link{font-weight:400;color:#007bff;text-decoration:none}.btn-link:hover{color:#0056b3;text-decoration:underline}.btn-link:focus,.btn-link.focus{text-decoration:underline}.btn-link:disabled,.btn-link.disabled{color:#6c757d;pointer-events:none}.btn-lg{padding:10px 16px;font-size:calc(18px);line-height:1.5;border-radius:0.3rem}.btn-sm{padding:4px 10px;font-size:calc(12px);line-height:1.5;border-radius:0.2rem}.btn-block{display:block;width:100%}.btn-block+.btn-block{margin-top:0.5rem}input[type=submit].btn-block,input[type=reset].btn-block,input[type=button].btn-block{width:100%}.btn-block{margin-top:0.5rem}";

const Button = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    /**
     * Propagate a focus event.
     *
     * Used to propagate `<button>` focus events through the Shadow DOM boundary
     * in the case that they aren't by the browser.
     *
     * @param {FocusEvent} event
     */
    this.onFocusEvent = (event) => {
      propagateFocusEvent(this.element, event);
    };
    this.type = 'button';
    this.name = undefined;
    this.value = undefined;
    this.color = undefined;
    this.size = 'default';
    this.block = undefined;
    this.outline = false;
    this.disabled = false;
  }
  /**
   * Submit or reset the closest form on click when in the Shadow DOM.
   */
  onClick() {
    if (this.type === 'button') {
      return;
    }
    if (hasShadowDom(this.element)) {
      submitClosestForm(this.element, this.type, this.name, this.value);
    }
  }
  /**
   * Get the map of CSS classes for the button.
   *
   * @return CssClassMap
   */
  getClassMap() {
    const outline = this.outline;
    const block = this.block;
    const size = this.size;
    return {
      'btn': true,
      [`btn-block`]: block,
      [`btn-${this.color}`]: !outline,
      [`btn-outline-${this.color}`]: outline,
      [`btn-lg`]: size === 'large',
      [`btn-sm`]: size === 'small'
    };
  }
  /**
   * Render the component.
   */
  render() {
    return (h("button", { type: this.type, name: this.name, value: this.value, class: this.getClassMap(), disabled: this.disabled, onFocus: this.onFocusEvent, onBlur: this.onFocusEvent }, h("slot", null)));
  }
  get element() { return getElement(this); }
};
Button.style = claButtonCss;

const claCardCss = "@charset \"UTF-8\";:root{--white:#FFF;--black:#000;--brand-blue:var(--blue-500);--brand-grey:var(--gray-500);--headings-color:var(--gray-800);--subheadings-color:var(--gray-700);--body-color:var(--gray-900);--ui-bg-color-enabled:var(--gray-100);--ui-border-color-enabled:var(--gray-400);--ui-bg-color-disabled:var(--gray-100);--ui-border-color-disabled:var(--gray-300);--ui-text-color-disabled:var(--gray-500);--ui-box-shadow-focus:var(--blue-200);--ui-border-color-focus:var(--blue-600);--ui-border-color-focus-hover:var(--gray-600);--ui-bg-color-focus-hover:var(--gray-200);--ui-color-active:var(--blue-600);--ui-bg-color-active:var(--blue-700);--ui-color-active-hover:var(--blue-700);--ui-bg-color-active-hover:var(--gray-200);--ui-bg-color-hover:var(--gray-100);--ui-border-color-hover:var(--gray-500);--input-bg-color-enabled:var(--gray-100);--input-border-color-enabled:var(--gray-400);--input-bg-color-dark-enabled:var(--gray-400);--input-bg-color-disabled:var(--gray-100);--input-border-color-disabled:var(--gray-300);--input-text-color-disabled:var(--gray-500);--input-box-shadow-focus:var(--blue-200);--input-border-color-focus:var(--blue-600);--input-border-color-focus-hover:var(--gray-600);--input-bg-color-focus-hover:var(--gray-200);--input-color-active:var(--blue-600);--input-bg-color-active:var(--blue-200);--input-color-active-hover:var(--blue-700);--input-bg-color-active-hover:var(--gray-200);--input-bg-color-hover:var(--gray-100);--input-border-color-hover:var(--gray-500);--input-bg-dark-color-hover:var(--input-border-color-hover);--inverted-background:var(--gray-900);--inverted-border-color:var(--gray-700)}*,*::before,*::after{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{margin:0;font-family:-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";font-size:1rem;font-weight:400;line-height:1.5;color:#212529;text-align:left;background-color:#fff}[tabindex=\"-1\"]:focus:not(:focus-visible){outline:0 !important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:0.5rem}p{margin-top:0;margin-bottom:1rem}abbr[title],abbr[data-original-title]{text-decoration:underline;text-decoration:underline dotted;cursor:help;border-bottom:0;text-decoration-skip-ink:none}address{margin-bottom:1rem;font-style:normal;line-height:inherit}ol,ul,dl{margin-top:0;margin-bottom:1rem}ol ol,ul ul,ol ul,ul ol{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:0.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}a{color:#007bff;text-decoration:none;background-color:transparent}a:hover{color:#0056b3;text-decoration:underline}a:not([href]):not([class]){color:inherit;text-decoration:none}a:not([href]):not([class]):hover{color:inherit;text-decoration:none}pre,code,kbd,samp{font-family:SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;font-size:1em}pre{margin-top:0;margin-bottom:1rem;overflow:auto;-ms-overflow-style:scrollbar}figure{margin:0 0 1rem}img{vertical-align:middle;border-style:none}svg{overflow:hidden;vertical-align:middle}table{border-collapse:collapse}caption{padding-top:0.75rem;padding-bottom:0.75rem;color:#6c757d;text-align:left;caption-side:bottom}th{text-align:inherit;text-align:-webkit-match-parent}label{display:inline-block;margin-bottom:0.5rem}button{border-radius:0}button:focus:not(:focus-visible){outline:0}input,button,select,optgroup,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,input{overflow:visible}button,select{text-transform:none}[role=button]{cursor:pointer}select{word-wrap:normal}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button:not(:disabled),[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled){cursor:pointer}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{padding:0;border-style:none}input[type=radio],input[type=checkbox]{box-sizing:border-box;padding:0}textarea{overflow:auto;resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}