@searchcraft/javascript-sdk 0.8.1 → 0.9.0

package/dist/collection/components/searchcraft-search-results-per-page/searchcraft-search-results-per-page.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"searchcraft-search-results-per-page.js","sourceRoot":"","sources":["../../../../src/components/searchcraft-search-results-per-page/searchcraft-search-results-per-page.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useSearchcraftStore } from '@provider/store';\nimport { Component, h, State, Prop } from '@stencil/core';\nimport classNames from 'classnames';\n\nimport { parseCustomStyles } from '@utils';\n\n/**\n * This web component is designed to choose the number of search results displayed.\n *\n * ## Usage\n * ```html\n * <!-- index.html -->\n * <searchcraft-search-results-per-page increment=\"20\" />\n * ```\n */\n@Component({\n  tag: 'searchcraft-search-results-per-page',\n  shadow: false,\n})\nexport class SearchcraftSearchResultsPerPage {\n  /**\n   * The amount the options will increase (e.g. 20 = [20, 40, 60, 80, 100]).\n   * The base value is defined by the `searchResultsPerPage` option in the configuration.\n   */\n  @Prop() increment: string | number = 20;\n  /**\n   * The custom styles object.\n   */\n  @Prop() customStyles?: string;\n\n  // store vars\n  @State() searchTerm;\n  @State() searchResultsPage;\n  @State() searchResultsPerPage;\n  @State() searchResultsCount;\n  @State() searchResultsPagesCount;\n\n  // local vars\n  @State() initialSearchResultsPerPage;\n\n  // store functions\n  @State() setSearchResultsPerPage: (perPage: number) => void = () => {};\n  @State() setSearchResultsPage: (page: number) => void = () => {};\n\n  private unsubscribe: () => void = () => {};\n\n  componentDidLoad() {\n    this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n      // store vars\n      this.searchTerm = state.searchTerm;\n      this.searchResultsPerPage = state.searchResultsPerPage;\n      this.searchResultsPage = state.searchResultsPage;\n      this.searchResultsCount = state.searchResultsCount;\n\n      // local vars\n      this.searchResultsPagesCount = Math.ceil(\n        this.searchResultsCount / this.searchResultsPerPage,\n      );\n\n      // store functions\n      this.setSearchResultsPage = state.setSearchResultsPage;\n      this.setSearchResultsPerPage = state.setSearchResultsPerPage;\n    });\n\n    this.initialSearchResultsPerPage =\n      useSearchcraftStore.getState().searchResultsPerPage;\n  }\n\n  disconnectedCallback() {\n    this.unsubscribe?.();\n  }\n\n  render() {\n    // early return if there isn't a searchTerm or there is 1 or fewer pages of results\n    if (!this.searchTerm || this.searchResultsPagesCount <= 1) {\n      return;\n    }\n\n    return (\n      <div\n        class={classNames(\n          'searchcraft-search-results-per-page',\n          parseCustomStyles(this.customStyles || {}),\n        )}\n      >\n        <div class='searchcraft-search-results-per-page-select'>\n          <label\n            class='searchcraft-search-results-per-page-select-label'\n            htmlFor='searchcraft-search-results-per-page-select-input'\n          >\n            Results Per Page\n          </label>\n          <div class='searchcraft-search-results-per-page-select-input'>\n            <searchcraft-select\n              inputId='searchcraft-search-results-per-page-select-input'\n              name='results-per-page'\n              options={[...Array(5)].map((_, index) => {\n                const value =\n                  this.initialSearchResultsPerPage +\n                  Number(this.increment) * index;\n                return {\n                  label: `${value}`,\n                  value,\n                };\n              })}\n              onSelectChange={(event) => {\n                this.setSearchResultsPerPage(Number(event.detail));\n                this.setSearchResultsPage(1);\n              }}\n            />\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/components/searchcraft-select/searchcraft-select.js

@@ -1,261 +0,0 @@
-import { h, } from "@stencil/core";
-import classNames from "classnames";
-import { parseCustomStyles } from "../../utils/index";
-/**
- * This web component is designed to allow users to select between a group of options.
- *
- * ## Usage
- * ```html
- * <!-- index.html -->
- * <searchcraft-select
- *  inputId="searchcraft-select"
- *  name="searchcraft-select"
- *  options="[{ label: 'label', value: 'value' }]"
- * />
- * ```
- */
-export class SearchcraftSelect {
-    /**
-     * The caption displayed below the select input.
-     */
-    caption;
-    /**
-     * Whether the select input is disabled.
-     */
-    disabled = false;
-    /**
-     * The ID for the select input.
-     */
-    inputId;
-    /**
-     * The label of the select input.
-     */
-    label;
-    /**
-     * The ID for the label of the select input.
-     */
-    labelId;
-    /**
-     * The name of the select input.
-     */
-    name;
-    /**
-     * The options for the select input.
-     */
-    options = [];
-    /**
-     * A custom styles object.
-     */
-    customStyles;
-    /**
-     * The event fired when the select is changed.
-     */
-    selectChange;
-    searchResultsPerPage;
-    setSearchResultsPage = () => { };
-    setSearchResultsPerPage = () => { };
-    handleSelectChange = (event) => {
-        this.selectChange.emit(event.target.value);
-    };
-    handleGoToPage(page) {
-        this.setSearchResultsPage(page);
-    }
-    render() {
-        return (h("div", { key: '5024d49d89a3649a5de591d37ded304a9dfb36d9', class: classNames('searchcraft-select', parseCustomStyles(this.customStyles || {})) }, this.label && (h("label", { key: '005aea9b190e5a6c041721e20395be23f76faab6', class: 'searchcraft-select-label', id: this.labelId || `${this.inputId}-label`, htmlFor: this.inputId }, this.label)), h("div", { key: '209d56844c0bcd241e73bafcad24fac927fe7ffa', class: 'searchcraft-select-input-wrapper' }, h("select", { key: '010c9e596ef45a303f84c0ac0fa54ab67556d7b6', "aria-labelledby": this.label ? this.labelId || `${this.inputId}-label` : undefined, class: 'searchcraft-select-input', disabled: this.disabled, id: this.inputId, name: this.name, onChange: this.handleSelectChange }, (typeof this.options === 'string'
-            ? JSON.parse(this.options)
-            : this.options).map(({ label, value, selected }) => {
-            return (h("option", { key: value, value: value, selected: selected }, label));
-        })), h("svg", { key: '51d9fb79381468ee0992475ba376df5a5961116c', class: 'searchcraft-select-input-icon', width: '20', height: '20', viewBox: '0 0 20 20', fill: 'none', xmlns: 'http://www.w3.org/2000/svg' }, h("title", { key: '59186138953557764915d41708d4bcc23a9bb97f' }, "Select dropdown icon"), h("path", { key: 'ec2c962df16cb68bdaf3e2c32e57d875a63957a9', d: 'M5 7.5L10 12.5L15 7.5', stroke: 'currentColor', "stroke-width": '1.5', "stroke-linecap": 'round', "stroke-linejoin": 'round' }))), this.caption && (h("p", { key: '742bc2dbd8371938894d49bb37d429d1b7a07d7a', class: 'searchcraft-select-caption' }, this.caption))));
-    }
-    static get is() { return "searchcraft-select"; }
-    static get properties() {
-        return {
-            "caption": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string | undefined",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "The caption displayed below the select input."
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "caption",
-                "reflect": false
-            },
-            "disabled": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean | undefined",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Whether the select input is disabled."
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "disabled",
-                "reflect": false,
-                "defaultValue": "false"
-            },
-            "inputId": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": true,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The ID for the select input."
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "input-id",
-                "reflect": false
-            },
-            "label": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string | undefined",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "The label of the select input."
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "label",
-                "reflect": false
-            },
-            "labelId": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string | undefined",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "The ID for the label of the select input."
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "label-id",
-                "reflect": false
-            },
-            "name": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": true,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The name of the select input."
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "name",
-                "reflect": false
-            },
-            "options": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "SearchcraftSelectOption[] | string",
-                    "resolved": "SearchcraftSelectOption[] | string",
-                    "references": {
-                        "SearchcraftSelectOption": {
-                            "location": "local",
-                            "path": "/opt/atlassian/pipelines/agent/build/packages/javascript-sdk/src/components/searchcraft-select/searchcraft-select.tsx",
-                            "id": "src/components/searchcraft-select/searchcraft-select.tsx::SearchcraftSelectOption"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The options for the select input."
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "options",
-                "reflect": false,
-                "defaultValue": "[]"
-            },
-            "customStyles": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string | undefined",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "A custom styles object."
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "custom-styles",
-                "reflect": false
-            }
-        };
-    }
-    static get states() {
-        return {
-            "searchResultsPerPage": {},
-            "setSearchResultsPage": {},
-            "setSearchResultsPerPage": {}
-        };
-    }
-    static get events() {
-        return [{
-                "method": "selectChange",
-                "name": "selectChange",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "The event fired when the select is changed."
-                },
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                }
-            }];
-    }
-}
-//# sourceMappingURL=searchcraft-select.js.map

package/dist/collection/components/searchcraft-select/searchcraft-select.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"searchcraft-select.js","sourceRoot":"","sources":["../../../../src/components/searchcraft-select/searchcraft-select.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  h,\n  State,\n  Prop,\n  type EventEmitter,\n  Event,\n} from '@stencil/core';\nimport classNames from 'classnames';\n\nimport { parseCustomStyles } from '@utils';\n\nexport type SearchcraftSelectOption = {\n  label: string;\n  value: string | number;\n  selected?: boolean;\n};\n\n/**\n * This web component is designed to allow users to select between a group of options.\n *\n * ## Usage\n * ```html\n * <!-- index.html -->\n * <searchcraft-select\n *  inputId=\"searchcraft-select\"\n *  name=\"searchcraft-select\"\n *  options=\"[{ label: 'label', value: 'value' }]\"\n * />\n * ```\n */\n@Component({\n  tag: 'searchcraft-select',\n  shadow: false,\n})\nexport class SearchcraftSelect {\n  /**\n   * The caption displayed below the select input.\n   */\n  @Prop() caption?: string;\n  /**\n   * Whether the select input is disabled.\n   */\n  @Prop() disabled?: boolean = false;\n  /**\n   * The ID for the select input.\n   */\n  @Prop() inputId!: string;\n  /**\n   * The label of the select input.\n   */\n  @Prop() label?: string;\n  /**\n   * The ID for the label of the select input.\n   */\n  @Prop() labelId?: string;\n  /**\n   * The name of the select input.\n   */\n  @Prop() name!: string;\n  /**\n   * The options for the select input.\n   */\n  @Prop() options: SearchcraftSelectOption[] | string = [];\n  /**\n   * A custom styles object.\n   */\n  @Prop() customStyles?: string;\n  /**\n   * The event fired when the select is changed.\n   */\n  @Event() selectChange!: EventEmitter<string>;\n\n  @State() searchResultsPerPage;\n\n  @State() setSearchResultsPage: (page: number) => void = () => {};\n  @State() setSearchResultsPerPage: (perPage: number) => void = () => {};\n\n  private handleSelectChange = (event) => {\n    this.selectChange.emit(event.target.value);\n  };\n\n  handleGoToPage(page: number) {\n    this.setSearchResultsPage(page);\n  }\n\n  render() {\n    return (\n      <div\n        class={classNames(\n          'searchcraft-select',\n          parseCustomStyles(this.customStyles || {}),\n        )}\n      >\n        {this.label && (\n          <label\n            class='searchcraft-select-label'\n            id={this.labelId || `${this.inputId}-label`}\n            htmlFor={this.inputId}\n          >\n            {this.label}\n          </label>\n        )}\n        <div class='searchcraft-select-input-wrapper'>\n          <select\n            aria-labelledby={\n              this.label ? this.labelId || `${this.inputId}-label` : undefined\n            }\n            class='searchcraft-select-input'\n            disabled={this.disabled}\n            id={this.inputId}\n            name={this.name}\n            onChange={this.handleSelectChange}\n          >\n            {(typeof this.options === 'string'\n              ? JSON.parse(this.options)\n              : this.options\n            ).map(({ label, value, selected }) => {\n              return (\n                <option key={value} value={value} selected={selected}>\n                  {label}\n                </option>\n              );\n            })}\n          </select>\n          <svg\n            class='searchcraft-select-input-icon'\n            width='20'\n            height='20'\n            viewBox='0 0 20 20'\n            fill='none'\n            xmlns='http://www.w3.org/2000/svg'\n          >\n            <title>Select dropdown icon</title>\n            <path\n              d='M5 7.5L10 12.5L15 7.5'\n              stroke='currentColor'\n              stroke-width='1.5'\n              stroke-linecap='round'\n              stroke-linejoin='round'\n            />\n          </svg>\n        </div>\n        {this.caption && (\n          <p class='searchcraft-select-caption'>{this.caption}</p>\n        )}\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/components/searchcraft-slider/searchcraft-slider.js

@@ -1,194 +0,0 @@
-import { h, } from "@stencil/core";
-import { getMillis } from "../../utils/index";
-import classNames from "classnames";
-/**
- * This web component is designed to allow users to select a value from a range defined by a minimum and maximum value.
- * The component renders a slider interface, which can be used to visually choose a value between two boundaries.
- * It is consumed by the `searchcraft-filter-panel` component.
- */
-export class SearchcraftSlider {
-    /**
-     * The maximum value allowed.
-     */
-    max = 100;
-    /**
-     * The minimum value allowed.
-     */
-    min = 0;
-    /**
-     * The granularity that the value must adhere to.
-     */
-    granularity = getMillis('month');
-    /** The type of data allowed. */
-    dataType = 'number';
-    endValue = this.max;
-    startValue = this.min;
-    lastFocusedHandle = 'max';
-    /**
-     * When the range has changed.
-     * */
-    rangeChanged;
-    componentDidLoad() {
-        this.startValue = this.min;
-        this.endValue = this.max;
-    }
-    emitUpdate = async () => {
-        this.rangeChanged?.emit({
-            startValue: this.startValue,
-            endValue: this.endValue,
-        });
-    };
-    handleStartValueChange = (event) => {
-        const inputElement = event.target;
-        const value = Number.parseInt(inputElement.value, 10);
-        this.lastFocusedHandle = 'min';
-        if (value <= this.endValue) {
-            this.startValue = value;
-            this.emitUpdate();
-        }
-        else {
-            this.startValue = this.endValue;
-            inputElement.value = `${this.endValue}`;
-        }
-    };
-    handleEndValueChange = (event) => {
-        const inputElement = event.target;
-        const value = Number.parseInt(inputElement.value, 10);
-        this.lastFocusedHandle = 'max';
-        if (value >= this.startValue) {
-            this.endValue = value;
-            this.emitUpdate();
-        }
-        else {
-            this.endValue = this.startValue;
-            inputElement.value = `${this.startValue}`;
-        }
-    };
-    render() {
-        const rangeMin = this.min;
-        const rangeMax = this.max;
-        const startPercent = ((this.startValue - rangeMin) / (rangeMax - rangeMin)) * 100;
-        const endPercent = ((this.endValue - rangeMin) / (rangeMax - rangeMin)) * 100;
-        const startLabel = this.dataType === 'number'
-            ? this.startValue
-            : new Date(this.startValue).getFullYear();
-        const endLabel = this.dataType === 'number'
-            ? this.endValue
-            : new Date(this.endValue).getFullYear();
-        return (h("div", { key: 'c5dd33e5dbeb14c6acf1a3caa2101c8aff186abf', class: 'searchcraft-slider-container' }, h("div", { key: '208354ad0176cfaa498ac4bb58cc584dd1976026', class: 'searchcraft-slider-range-container' }, h("div", { key: '9ad0890810211c2d5b9e4588d67d43a85f76f0bb', class: 'searchcraft-slider-active-range', style: {
-                left: `${startPercent}%`,
-                width: `${endPercent - startPercent}%`,
-            } }), h("input", { key: '80d5d3847424991564fff0b6d16a0659b35fdcc2', class: classNames('searchcraft-slider-input', 'searchcraft-slider-input-min-handle'), max: this.max, min: this.min, onInput: this.handleStartValueChange.bind(this), step: this.granularity, style: { zIndex: this.lastFocusedHandle === 'min' ? '2' : '1' }, type: 'range', value: this.startValue }), h("input", { key: '063f4fc243a64dc3743d6cd8fbe6776e65f0d79e', class: classNames('searchcraft-slider-input', 'searchcraft-slider-input-max-handle'), max: this.max, min: this.min, onInput: this.handleEndValueChange.bind(this), step: this.granularity, style: { zIndex: this.lastFocusedHandle === 'max' ? '2' : '1' }, type: 'range', value: this.endValue })), h("div", { key: '148f3b70984ae66b0fe765d0351df380719fb5d8', class: 'searchcraft-slider-label-container' }, h("span", { key: 'e5f1ad86454262abcb5261eba7b3555e59822b49', class: 'searchcraft-slider-label' }, startLabel), h("span", { key: 'beac7a99a5a8fc1416712e4877eaf65574d8a42e', class: 'searchcraft-slider-label' }, endLabel))));
-    }
-    static get is() { return "searchcraft-slider"; }
-    static get properties() {
-        return {
-            "max": {
-                "type": "number",
-                "mutable": false,
-                "complexType": {
-                    "original": "number",
-                    "resolved": "number",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The maximum value allowed."
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "max",
-                "reflect": false,
-                "defaultValue": "100"
-            },
-            "min": {
-                "type": "number",
-                "mutable": false,
-                "complexType": {
-                    "original": "number",
-                    "resolved": "number",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The minimum value allowed."
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "min",
-                "reflect": false,
-                "defaultValue": "0"
-            },
-            "granularity": {
-                "type": "number",
-                "mutable": false,
-                "complexType": {
-                    "original": "number",
-                    "resolved": "number",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The granularity that the value must adhere to."
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "granularity",
-                "reflect": false,
-                "defaultValue": "getMillis('month')"
-            },
-            "dataType": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'number' | 'date'",
-                    "resolved": "\"date\" | \"number\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The type of data allowed."
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "data-type",
-                "reflect": false,
-                "defaultValue": "'number'"
-            }
-        };
-    }
-    static get states() {
-        return {
-            "endValue": {},
-            "startValue": {},
-            "lastFocusedHandle": {}
-        };
-    }
-    static get events() {
-        return [{
-                "method": "rangeChanged",
-                "name": "rangeChanged",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "When the range has changed."
-                },
-                "complexType": {
-                    "original": "any",
-                    "resolved": "any",
-                    "references": {}
-                }
-            }];
-    }
-}
-//# sourceMappingURL=searchcraft-slider.js.map

package/dist/collection/components/searchcraft-slider/searchcraft-slider.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"searchcraft-slider.js","sourceRoot":"","sources":["../../../../src/components/searchcraft-slider/searchcraft-slider.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Event,\n  type EventEmitter,\n  h,\n  State,\n  Prop,\n} from '@stencil/core';\nimport { getMillis } from '@utils';\nimport classNames from 'classnames';\n\n/**\n * This web component is designed to allow users to select a value from a range defined by a minimum and maximum value.\n * The component renders a slider interface, which can be used to visually choose a value between two boundaries.\n * It is consumed by the `searchcraft-filter-panel` component.\n */\n@Component({\n  tag: 'searchcraft-slider',\n  shadow: false,\n})\nexport class SearchcraftSlider {\n  /**\n   * The maximum value allowed.\n   */\n  @Prop() max = 100;\n  /**\n   * The minimum value allowed.\n   */\n  @Prop() min = 0;\n  /**\n   * The granularity that the value must adhere to.\n   */\n  @Prop() granularity: number = getMillis('month');\n  /** The type of data allowed. */\n  @Prop() dataType: 'number' | 'date' = 'number';\n\n  @State() endValue = this.max;\n  @State() startValue = this.min;\n  @State() lastFocusedHandle: 'min' | 'max' = 'max';\n\n  /**\n   * When the range has changed.\n   * */\n  @Event() rangeChanged:\n    | EventEmitter<{ startValue: number; endValue: number }>\n    | undefined;\n\n  componentDidLoad() {\n    this.startValue = this.min;\n    this.endValue = this.max;\n  }\n\n  private emitUpdate = async () => {\n    this.rangeChanged?.emit({\n      startValue: this.startValue,\n      endValue: this.endValue,\n    });\n  };\n\n  private handleStartValueChange = (event: InputEvent) => {\n    const inputElement = event.target as HTMLInputElement;\n    const value = Number.parseInt(inputElement.value, 10);\n    this.lastFocusedHandle = 'min';\n    if (value <= this.endValue) {\n      this.startValue = value;\n      this.emitUpdate();\n    } else {\n      this.startValue = this.endValue;\n      inputElement.value = `${this.endValue}`;\n    }\n  };\n\n  private handleEndValueChange = (event: InputEvent) => {\n    const inputElement = event.target as HTMLInputElement;\n    const value = Number.parseInt(inputElement.value, 10);\n    this.lastFocusedHandle = 'max';\n    if (value >= this.startValue) {\n      this.endValue = value;\n      this.emitUpdate();\n    } else {\n      this.endValue = this.startValue;\n      inputElement.value = `${this.startValue}`;\n    }\n  };\n\n  render() {\n    const rangeMin = this.min;\n    const rangeMax = this.max;\n    const startPercent =\n      ((this.startValue - rangeMin) / (rangeMax - rangeMin)) * 100;\n    const endPercent =\n      ((this.endValue - rangeMin) / (rangeMax - rangeMin)) * 100;\n\n    const startLabel =\n      this.dataType === 'number'\n        ? this.startValue\n        : new Date(this.startValue).getFullYear();\n\n    const endLabel =\n      this.dataType === 'number'\n        ? this.endValue\n        : new Date(this.endValue).getFullYear();\n\n    return (\n      <div class='searchcraft-slider-container'>\n        <div class='searchcraft-slider-range-container'>\n          <div\n            class='searchcraft-slider-active-range'\n            style={{\n              left: `${startPercent}%`,\n              width: `${endPercent - startPercent}%`,\n            }}\n          />\n          <input\n            class={classNames(\n              'searchcraft-slider-input',\n              'searchcraft-slider-input-min-handle',\n            )}\n            max={this.max}\n            min={this.min}\n            onInput={this.handleStartValueChange.bind(this)}\n            step={this.granularity}\n            style={{ zIndex: this.lastFocusedHandle === 'min' ? '2' : '1' }}\n            type='range'\n            value={this.startValue}\n          />\n          <input\n            class={classNames(\n              'searchcraft-slider-input',\n              'searchcraft-slider-input-max-handle',\n            )}\n            max={this.max}\n            min={this.min}\n            onInput={this.handleEndValueChange.bind(this)}\n            step={this.granularity}\n            style={{ zIndex: this.lastFocusedHandle === 'max' ? '2' : '1' }}\n            type='range'\n            value={this.endValue}\n          />\n        </div>\n        <div class='searchcraft-slider-label-container'>\n          <span class='searchcraft-slider-label'>{startLabel}</span>\n          <span class='searchcraft-slider-label'>{endLabel}</span>\n        </div>\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/components/searchcraft-theme/searchcraft-theme.js

@@ -1,97 +0,0 @@
-import styles from "../../themes/hologram.css?raw";
-/**
- * This web component adds Searchcraft's built-in css theme to your page's <head> tag.
- * It does not render anything visible, its only function is to manage the css styles on the page.
- *
- * ## Usage
- * ```html
- * <!-- index.html -->
- * <searchcraft-theme theme="light" custom-theme="{}" />
- * ```
- */
-export class SearchcraftTheme {
-    /**
-     * The name of the theme.
-     */
-    theme = 'light';
-    /**
-     * The custom theme configuration object.
-     */
-    customTheme = '[]';
-    camelToKebab = (string) => {
-        return string
-            .replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`) // Convert uppercase letters to `-lowercase`
-            .toLowerCase(); // Ensure the whole string is in lowercase
-    };
-    componentDidLoad() {
-        // Inject style element
-        const styleElement = document.querySelector('#searchcraft-theme') ||
-            document.createElement('style');
-        styleElement.innerHTML = styles;
-        styleElement.id = 'searchcraft-theme';
-        const head = document.head || document.getElementsByTagName('head')[0];
-        if (!head.contains(styleElement)) {
-            if (head.firstChild) {
-                head.insertBefore(styleElement, head.firstChild);
-            }
-            else {
-                head.appendChild(styleElement);
-            }
-        }
-        // Add theme name to body
-        document.body.dataset.theme = this.theme;
-        // Add CSS variables from customTheme configuration to document
-        Object.entries(JSON.parse(this.customTheme)).map(([key, value]) => {
-            document.documentElement.style.setProperty(`--${this.camelToKebab(key)}`, `${value}`);
-        });
-    }
-    render() {
-        return;
-    }
-    static get is() { return "searchcraft-theme"; }
-    static get properties() {
-        return {
-            "theme": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The name of the theme."
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "theme",
-                "reflect": false,
-                "defaultValue": "'light'"
-            },
-            "customTheme": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The custom theme configuration object."
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "custom-theme",
-                "reflect": false,
-                "defaultValue": "'[]'"
-            }
-        };
-    }
-}
-//# sourceMappingURL=searchcraft-theme.js.map

package/dist/collection/components/searchcraft-theme/searchcraft-theme.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"searchcraft-theme.js","sourceRoot":"","sources":["../../../../src/components/searchcraft-theme/searchcraft-theme.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,MAAM,MAAM,+BAA+B,CAAC;AAEnD;;;;;;;;;GASG;AAKH,MAAM,OAAO,gBAAgB;IAC3B;;OAEG;IACK,KAAK,GAAG,OAAO,CAAC;IACxB;;OAEG;IACK,WAAW,GAAG,IAAI,CAAC;IAEnB,YAAY,GAAG,CAAC,MAAM,EAAE,EAAE;QAChC,OAAO,MAAM;aACV,OAAO,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,IAAI,KAAK,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC,4CAA4C;aACpG,WAAW,EAAE,CAAC,CAAC,0CAA0C;IAC9D,CAAC,CAAC;IAEF,gBAAgB;QACd,uBAAuB;QACvB,MAAM,YAAY,GAChB,QAAQ,CAAC,aAAa,CAAC,oBAAoB,CAAC;YAC5C,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QAClC,YAAY,CAAC,SAAS,GAAG,MAAM,CAAC;QAChC,YAAY,CAAC,EAAE,GAAG,mBAAmB,CAAC;QAEtC,MAAM,IAAI,GAAG,QAAQ,CAAC,IAAI,IAAI,QAAQ,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;QAEvE,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAC,EAAE,CAAC;YACjC,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;gBACpB,IAAI,CAAC,YAAY,CAAC,YAAY,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;YACnD,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,CAAC;YACjC,CAAC;QACH,CAAC;QAED,yBAAyB;QACzB,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;QAEzC,+DAA+D;QAC/D,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE;YAChE,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAC,WAAW,CACxC,KAAK,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,EAAE,EAC7B,GAAG,KAAK,EAAE,CACX,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC;IAED,MAAM;QACJ,OAAO;IACT,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop } from '@stencil/core';\nimport styles from '../../themes/hologram.css?raw';\n\n/**\n * This web component adds Searchcraft's built-in css theme to your page's <head> tag.\n * It does not render anything visible, its only function is to manage the css styles on the page.\n *\n * ## Usage\n * ```html\n * <!-- index.html -->\n * <searchcraft-theme theme=\"light\" custom-theme=\"{}\" />\n * ```\n */\n@Component({\n  tag: 'searchcraft-theme',\n  shadow: false,\n})\nexport class SearchcraftTheme {\n  /**\n   * The name of the theme.\n   */\n  @Prop() theme = 'light';\n  /**\n   * The custom theme configuration object.\n   */\n  @Prop() customTheme = '[]';\n\n  private camelToKebab = (string) => {\n    return string\n      .replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`) // Convert uppercase letters to `-lowercase`\n      .toLowerCase(); // Ensure the whole string is in lowercase\n  };\n\n  componentDidLoad() {\n    // Inject style element\n    const styleElement =\n      document.querySelector('#searchcraft-theme') ||\n      document.createElement('style');\n    styleElement.innerHTML = styles;\n    styleElement.id = 'searchcraft-theme';\n\n    const head = document.head || document.getElementsByTagName('head')[0];\n\n    if (!head.contains(styleElement)) {\n      if (head.firstChild) {\n        head.insertBefore(styleElement, head.firstChild);\n      } else {\n        head.appendChild(styleElement);\n      }\n    }\n\n    // Add theme name to body\n    document.body.dataset.theme = this.theme;\n\n    // Add CSS variables from customTheme configuration to document\n    Object.entries(JSON.parse(this.customTheme)).map(([key, value]) => {\n      document.documentElement.style.setProperty(\n        `--${this.camelToKebab(key)}`,\n        `${value}`,\n      );\n    });\n  }\n\n  render() {\n    return;\n  }\n}\n"]}