import { r as registerInstance, h, H as Host } from './index-67f7ec52.js';
import { i as isScheduler, o as of, d as delay } from './delay-d08c267f.js';
import { e as isArray, O as Observable, d as async } from './scheduleArray-b9669898.js';

function isNumeric(val) {
    return !isArray(val) && (val - parseFloat(val) + 1) >= 0;
}

function timer(dueTime = 0, periodOrScheduler, scheduler) {
    let period = -1;
    if (isNumeric(periodOrScheduler)) {
        period = Number(periodOrScheduler) < 1 && 1 || Number(periodOrScheduler);
    }
    else if (isScheduler(periodOrScheduler)) {
        scheduler = periodOrScheduler;
    }
    if (!isScheduler(scheduler)) {
        scheduler = async;
    }
    return new Observable(subscriber => {
        const due = isNumeric(dueTime)
            ? dueTime
            : (+dueTime - scheduler.now());
        return scheduler.schedule(dispatch, due, {
            index: 0, period, subscriber
        });
    });
}
function dispatch(state) {
    const { index, period, subscriber } = state;
    subscriber.next(index);
    if (subscriber.closed) {
        return;
    }
    else if (period === -1) {
        return subscriber.complete();
    }
    state.index = index + 1;
    this.schedule(state, period);
}

const getLocalResourceUrl = (relativePath) => {
    const resourcesUrlElement = document.querySelector('script[data-fl-namespace="design-system"][data-fl-resources-url]');
    const resourcesUrl = (resourcesUrlElement && resourcesUrlElement.getAttribute('data-fl-resources-url')) || '';
    try {
        return new URL(relativePath, resourcesUrl).href;
    }
    catch (error) {
        return `${resourcesUrl}/${relativePath}`;
    }
};

const styleGuideCss = "";

const FlareStyleGuide = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.data = [
      'Apple',
      'Application',
      'Appetizer',
      'Anna',
      'Banana',
      'Archery',
      'Apogee'
    ].map((v) => ({
      label: v,
      value: v
    }));
    this.searchFunction = (query) => {
      const results = this.data.filter((item) => item.label.toLowerCase().includes(query.toLowerCase()));
      return of(results).pipe(delay(1000)).toPromise();
    };
  }
  render() {
    return (h(Host, null, h("link", { rel: "stylesheet", href: getLocalResourceUrl('beacon.css'), media: "all" }), this.themeCssUrl && h("link", { rel: "stylesheet", href: this.themeCssUrl, media: "all" }), h("div", { class: "container m-3 p-5 shadow" }, h("h1", null, "Beacon"), h("h5", null, "Flare-Apollo Component Library \uD83D\uDE80"), h("div", { class: "row" }, h("div", { class: "col" }, h("ul", { class: "list-group" }, h("li", { class: "list-group-item" }, h("small", { class: "text-muted" }, "Typography"), h("div", { class: "col" }, h("h1", null, "h1 Heading"), h("h2", null, "h2 Sub-heading"), h("h3", null, "h3 Sub-heading"), h("h4", null, "h4 Sub-heading"), h("p", null, "Paragraph"), h("div", { class: "d-flex flex-column" }, h("strong", null, "Strong"), h("small", null, "small"), h("a", { href: "https://www.flarehr.com", target: "_blank" }, "Weblink")))), h("li", { class: "list-group-item" }, h("small", { class: "text-muted" }, "Buttons"), h("div", { class: "col-3 my-2" }, this.renderButtonVariants())), h("li", { class: "list-group-item" }, h("small", { class: "text-muted" }, "Loading indicator"), h("div", { class: "col" }, h("fl-loading-indicator", null), h("fl-loading-indicator", { theme: "dark" }))), h("li", { class: "list-group-item" }, h("small", { class: "text-muted" }, "Dropdown"), h("div", { class: "col-4" }, h("fl-dropdown", { options: this.data }))), h("li", { class: "list-group-item" }, h("small", { class: "text-muted" }, "Async Dropdown"), h("div", { class: "col-4" }, h("fl-dropdown-async", { "min-search-string-length": "2", searchFunction: this.searchFunction }))), h("li", { class: "list-group-item" }, h("small", { class: "text-muted" }, "Promise Button"), h("div", { class: "col-3 my-2" }, h("fl-promise-button", { isBlockElement: true, promiseFn: () => this.takeTime() }, "Promise Button block")), h("div", { class: "col-3 my-2" }, h("fl-promise-button", { promiseFn: () => this.takeTime() }, "Promise Button")), h("div", { class: "col-3 my-2" }, h("fl-promise-button", { variant: "secondary", promiseFn: () => this.takeTime() }, "Secondary Promise Button"))), h("li", { class: "list-group-item" }, h("small", { class: "text-muted" }, "Radio buttons"), h("div", { class: "col my-2" }, h("div", { class: "form-check fl-radio-container" }, h("input", { class: "form-check-input", type: "radio", name: "flexRadioDefault", id: "flexRadioDefault" }), h("label", { class: "form-check-label", htmlFor: "flexRadioDefault" }, "Default radio")))), h("li", { class: "list-group-item" }, h("small", { class: "text-muted" }, "Checkboxes"), h("div", { class: "col my-2" }, h("div", { class: "form-check fl-checkbox-container" }, h("input", { class: "form-check-input", type: "checkbox", id: "flexCheckDefault" }), h("label", { class: "form-check-label", htmlFor: "flexCheckDefault" }, "Default checkbox"))))))))));
  }
  renderButtonVariants() {
    return (h("ul", { class: "list-group" }, h("li", { class: "list-group-item" }, h("i", null, "Primary"), h("fl-button", { isBlockElement: true }, "Button")), h("li", { class: "list-group-item" }, h("i", null, "Primary, disabled"), h("fl-button", { isBlockElement: true, disabled: true }, "Button")), h("li", { class: "list-group-item" }, h("i", null, "Primary Outline"), h("fl-button", { isBlockElement: true, outline: true }, "Button")), h("li", { class: "list-group-item" }, h("i", null, "Primary Outline, disabled"), h("fl-button", { isBlockElement: true, disabled: true, outline: true }, "Button")), h("li", { class: "list-group-item" }, h("i", null, "Secondary"), h("fl-button", { isBlockElement: true, variant: "secondary" }, "Button")), h("li", { class: "list-group-item" }, h("i", null, "Secondary, disabled"), h("fl-button", { isBlockElement: true, disabled: true, variant: "secondary" }, "Button")), h("li", { class: "list-group-item" }, h("i", null, "Secondary Outline"), h("fl-button", { isBlockElement: true, variant: "secondary", outline: true }, "Button")), h("li", { class: "list-group-item" }, h("i", null, "Secondary Outline, disabled"), h("fl-button", { isBlockElement: true, disabled: true, variant: "secondary", outline: true }, "Button"))));
  }
  async takeTime() {
    return timer(Math.random() * 2000 + 2000).toPromise();
  }
};
FlareStyleGuide.style = styleGuideCss;

export { FlareStyleGuide as fl_style_guide };
