import { i, r, x } from './query-assigned-elements-fea1f631.js';
|
import { e } from './custom-element-30fc6381.js';
|
import { n, B as BaseElement } from './base.component-813fc7cf.js';
|
import '@dh-software/furnview-icons';
|
|
var css_248z = i`.close-symbol{cursor:pointer;height:100%;position:relative;width:100%}.close-symbol.loading{z-index:999}.close-symbol.loading:after,.close-symbol.loading:before{background:#fff}.close-symbol:after,.close-symbol:before{background:var(--close-symbol-background,#888);-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;content:" ";height:1px;margin:0;padding:0;position:absolute;top:50%;width:100%}.close-symbol:after:hover,.close-symbol:before:hover{background:var(--close-symbol-background-hover,#333)}.close-symbol:after{-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);transform:rotate(-45deg)}.close-symbol:before{-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);transform:rotate(45deg)}:host(.active) .circle-number-symbol{border:var(--circle-number-symbol-border-active,2px solid #000)}.circle-number-symbol{align-items:center;background:var(--circle-number-symbol-background,var(--primary-color,red));border:var(--circle-number-symbol-border,2px solid #fff);border-radius:50%;box-shadow:var(--circle-number-symbol-box-shadow,1px 2px 5px 0 #000);color:var(--circle-number-symbol-color,var(--primary-text-color,#000));display:flex;height:var(--circle-number-symbol-size,30px);justify-content:center;position:relative;width:var(--circle-number-symbol-size,30px)}.custom-symbol{cursor:pointer;display:flex;left:10px;position:relative}.custom-symbol.up:after{background-image:var(--custom-symbol-image-down,url("/webui/images/minus.svg"));content:"";height:18px}.custom-symbol.down:after{background-image:var(--custom-symbol-image-down,url("/webui/images/plus.svg"));content:"";height:18px}.custom-symbol:after{color:#1e1e1e;margin:auto 0;padding:0 0 2px;pointer-events:none;transform:translateX(-15px);width:18px}.accordion-symbol{cursor:pointer;display:flex;left:10px;position:relative}.accordion-symbol.up:after{content:"-";font-size:xx-large;transform:scaleX(2) translateX(-4px)}.accordion-symbol.down:after{content:"+";font-size:xx-large}.accordion-symbol:after{color:#1e1e1e;margin:auto 0;padding:0 0 2px;pointer-events:none;transform:translateX(-15px);width:18px}.chevron-symbol{cursor:pointer;left:10px;position:relative}.chevron-symbol.up:after{content:"<"}.chevron-symbol.down:after{content:">"}.chevron-symbol:after{color:inherit;font:17px Consolas,monospace;padding:0 0 2px;pointer-events:none;position:absolute;-webkit-transform:rotate(90deg) translateX(-100%);-moz-transform:rotate(90deg) translateX(-100%);-ms-transform:rotate(90deg) translateX(-100%);transform:rotate(90deg) translateX(-100%)}@media (width >= 980px){.only-mobile{display:none!important}}@media (width <= 980px){.only-desktop{display:none!important}}.bold{font-weight:var(--global-font-weight-bold,600)}*{font-family:var(--global-font,Roboto);font-weight:var(--global-font-weight,400);-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.container{display:flex;margin:10px 0}.container.column{flex-direction:column}.container.column.reverse{flex-direction:column-reverse}.container.row{flex-direction:row}.container.row.reverse{flex-direction:row-reverse}.fluid{flex:1}.fluid.space-after{margin-right:55px}.hidden{display:none!important}.mobile-mode-hide,:host(.mobile-mode-hide){display:none!important}.invisible{visibility:hidden!important}.invisible-scroll,:host(.invisible-scroll){margin-right:-22px;overflow:hidden}.invisible-scroll>:first-child,:host(.invisible-scroll)>:first-child{box-sizing:content-box;overflow-x:hidden;overflow-y:scroll;padding-right:22px}.invisible-scroll.bottom,:host(.invisible-scroll.bottom){margin-right:unset;overflow:hidden}.invisible-scroll.bottom>:first-child,:host(.invisible-scroll.bottom)>:first-child{box-sizing:content-box;margin-bottom:-22px;overflow-x:scroll;overflow-y:hidden;padding-bottom:22px;padding-right:unset}:host([disabled]){filter:contrast(.5) grayscale(1);pointer-events:none}*{scrollbar-color:#5c5c5c hsla(0,0%,100%,.004);scrollbar-width:thin}[disabled]{filter:contrast(.5) grayscale(1);pointer-events:none}::-webkit-scrollbar{height:8px;width:8px}::-webkit-scrollbar,::-webkit-scrollbar-corner{background:hsla(0,0%,100%,0)}::-webkit-scrollbar-thumb{background:#5c5c5c;-webkit-border-radius:8px}::-webkit-scrollbar-button,::-webkit-scrollbar-button:horizontal:end:decrement,::-webkit-scrollbar-button:horizontal:end:increment,::-webkit-scrollbar-button:vertical:end:decrement,::-webkit-scrollbar-button:vertical:start:increment{background-color:transparent;border:none;color:transparent}:host{display:flex;flex-direction:column;height:100%;padding:var(--catalog-selector-padding,unset)}:host .title-container{color:var(--catalog-selector-title-color,#000);font-size:var(--catalog-selector-title-font-size,24px);font-weight:var(--catalog-selector-title-font-weight,var(--global-font-weight-bold,600));margin-bottom:var(--catalog-selector-title-margin-bottom,unset);text-align:var(--catalog-selector-title-text-align,left)}:host .options-container{padding-left:var(--catalog-selector-options-space-left,0);padding-right:var(--catalog-selector-options-space-right,0);width:calc(100% - var(--catalog-selector-options-space-left, 0px) - var(--catalog-selector-options-space-right, 0px))}:host .options-container .options-inner-container{display:grid;gap:var(--catalog-selector-gap,8px);grid-template-columns:repeat(var(--catalog-selector-columns-count,2),calc((100% - (var(--catalog-selector-columns-count, 2) - 1)*var(--catalog-selector-gap, 8px))/var(--catalog-selector-columns-count, 2)))}:host .divider-container{padding:var(--catalog-selector-divider-space-top,5px) var(--catalog-selector-divider-space-right,unset) var(--catalog-selector-divider-space-bottom,5px) var(--catalog-selector-divider-space-left,unset);width:calc(100% - var(--catalog-selector-divider-space-left, unset) - var(--catalog-selector-divider-space-right, unset))}:host .catalogs-container{height:100%;overflow:var(--catalog-selector-catalogs-overflow,auto);position:relative;scrollbar-width:var(--catalog-selector-scroll-width,none);-ms-scrollbar-width:var(--catalog-selector-scroll-width,none)}:host .catalogs-container::-webkit-scrollbar{display:var(--catalog-selector-scroll-display,none)}:host .catalogs-container .catalogs-inner-container{display:block;height:var(--catalog-selector-catalogs-inner-container-height,fit-content);position:absolute;width:var(--catalog-selector-catalogs-inner-container-width,fit-content)}:host(.hide-divider) .divider-container{display:none}@media (width <= 520px){:host(.mobile-hide-title) .title-container{display:none}:host .divider-container{padding:var(--catalog-selector-divider-space-mobile-top,var(--catalog-selector-divider-space-top,5px)) var(--catalog-selector-divider-space-mobile-right,var(--catalog-selector-divider-space-right,unset)) var(--catalog-selector-divider-space-mobile-bottom,var(--catalog-selector-divider-space-bottom,5px)) var(--catalog-selector-divider-space-mobile-left,var(--catalog-selector-divider-space-left,unset));width:calc(100% - var(--catalog-selector-divider-space-mobile-left, var(--catalog-selector-divider-space-left, unset)) - var(--catalog-selector-divider-space-mobile-right, var(--catalog-selector-divider-space-right, unset)))}:host .catalogs-container{overflow:var(--catalog-selector-catalogs-mobile-overflow,var(--catalog-selector-catalogs-overflow,auto))}:host .catalogs-container .catalogs-inner-container{height:var(--catalog-selector-catalogs-inner-container-mobile-height,var(--catalog-selector-catalogs-inner-container-height,fit-content));width:var(--catalog-selector-catalogs-inner-container-mobile-width,var(--catalog-selector-catalogs-inner-container-width,fit-content))}}@media (width >= 520px) and (width <= 980px){:host(.mobile-hide-title) .title-container{display:none}:host .divider-container{padding:var(--catalog-selector-divider-space-mobile-top,var(--catalog-selector-divider-space-top,5px)) var(--catalog-selector-divider-space-mobile-right,var(--catalog-selector-divider-space-right,unset)) var(--catalog-selector-divider-space-mobile-bottom,var(--catalog-selector-divider-space-bottom,5px)) var(--catalog-selector-divider-space-mobile-left,var(--catalog-selector-divider-space-left,unset));width:calc(100% - var(--catalog-selector-divider-space-mobile-left, var(--catalog-selector-divider-space-left, unset)) - var(--catalog-selector-divider-space-mobile-right, var(--catalog-selector-divider-space-right, unset)))}:host .catalogs-container{overflow:var(--catalog-selector-catalogs-mobile-overflow,var(--catalog-selector-catalogs-overflow,auto))}:host .catalogs-container .catalogs-inner-container{height:var(--catalog-selector-catalogs-inner-container-mobile-height,var(--catalog-selector-catalogs-inner-container-height,fit-content));width:var(--catalog-selector-catalogs-inner-container-mobile-width,var(--catalog-selector-catalogs-inner-container-width,fit-content))}}`;
|
|
var __defProp = Object.defineProperty;
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
var __getProtoOf = Object.getPrototypeOf;
|
var __reflectGet = Reflect.get;
|
var __decorateClass = (decorators, target, key, kind) => {
|
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
|
for (var i = decorators.length - 1, decorator; i >= 0; i--)
|
if (decorator = decorators[i])
|
result = (kind ? decorator(target, key, result) : decorator(result)) || result;
|
if (kind && result)
|
__defProp(target, key, result);
|
return result;
|
};
|
var __superStaticGet = (obj, member) => __reflectGet(__getProtoOf(obj), member, obj);
|
let CatalogSelectorComponent = class extends BaseElement {
|
constructor() {
|
super();
|
this.options = [];
|
this.addEventListener("disable-all-options", (e) => {
|
e.stopPropagation();
|
e.preventDefault();
|
const options = this.querySelectorAll(":scope > fv-catalog-selector-option");
|
options.forEach((option) => {
|
option.classList.remove("active");
|
});
|
});
|
this.addEventListener("show-catalog", (e) => {
|
var _a, _b;
|
e.stopPropagation();
|
e.preventDefault();
|
const event = e;
|
const catalogName = ((_a = event.detail) == null ? void 0 : _a.catalog) ? (_b = event.detail) == null ? void 0 : _b.catalog : "";
|
const catalogs = this.querySelectorAll(":scope > [catalog-name]");
|
catalogs.forEach((catalog) => {
|
if (event.detail && event.detail.properties) {
|
const propertyNames = Object.keys(event.detail.properties);
|
for (const propertyName of propertyNames) {
|
const property2 = event.detail.properties[propertyName];
|
if (typeof property2 === "boolean" && property2)
|
catalog.setAttribute(propertyName, "");
|
else if (typeof property2 === "boolean" && !property2)
|
catalog.removeAttribute(propertyName);
|
else if (typeof property2 === "object")
|
catalog.setAttribute(propertyName, JSON.stringify(property2));
|
else {
|
catalog.setAttribute(propertyName, property2);
|
}
|
}
|
}
|
if (catalog.getAttribute("catalog-name") === catalogName) {
|
catalog.classList.remove("hidden");
|
return;
|
}
|
catalog.classList.add("hidden");
|
});
|
});
|
}
|
createGeneratedOptions() {
|
const generated = document.querySelectorAll("[generated]");
|
generated.forEach((el) => {
|
this.removeChild(el);
|
});
|
this.options.forEach((option) => {
|
const optionElement = document.createElement(option.tag);
|
optionElement.setAttribute("generated", "");
|
optionElement.setAttribute("catalog", option.catalog);
|
optionElement.setAttribute("slot", "options");
|
optionElement.setAttribute("catalog-attributes", JSON.stringify(option.attributes));
|
optionElement.setAttribute("i18n", option.txt);
|
this.appendChild(optionElement);
|
});
|
}
|
render() {
|
this.createGeneratedOptions();
|
return x`
|
<div class="title-container">
|
<slot class="title" name="title"></slot>
|
</div>
|
<div class="options-container">
|
<div class="options-inner-container">
|
<slot class="options" name="options"></slot>
|
</div>
|
</div>
|
<div class="post-options-space-container">
|
<slot class="divider" name="post-options-space"></slot>
|
</div>
|
<div class="divider-container">
|
<slot class="divider" name="divider"></slot>
|
</div>
|
<div class="catalogs-container">
|
<div class="catalogs-inner-container">
|
<slot class="catalogs" name="catalogs"></slot>
|
</div>
|
</div>
|
`;
|
}
|
updated(_changedProperties) {
|
super.updated(_changedProperties);
|
const optionsElement = this.renderRoot.querySelector(".options");
|
if (optionsElement) {
|
let anyActive = false;
|
for (let index = 0; index < optionsElement.children.length; ++index) {
|
anyActive = optionsElement.children[index].classList.contains("active");
|
}
|
if (anyActive == false) {
|
const first = optionsElement.firstElementChild;
|
if (first) {
|
first.click();
|
}
|
}
|
}
|
}
|
};
|
CatalogSelectorComponent.styles = [
|
__superStaticGet(CatalogSelectorComponent, "styles") || [],
|
i`${r(css_248z)}`
|
];
|
__decorateClass([
|
n({ type: Array, reflect: true, attribute: "options" })
|
], CatalogSelectorComponent.prototype, "options", 2);
|
CatalogSelectorComponent = __decorateClass([
|
e("fv-catalog-selector")
|
], CatalogSelectorComponent);
|
|
export { CatalogSelectorComponent };
|
