@public-ui/hydrate 4.6.0-rc.0 → 4.6.0-rc.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +365 -456
- package/dist/index.mjs +365 -456
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -193,7 +193,7 @@ function _mergeNamespaces(n, m) {
|
|
|
193
193
|
|
|
194
194
|
const NAMESPACE = 'kolibri';
|
|
195
195
|
const BUILD = /* kolibri */ { hotModuleReplacement: false, hydratedSelectorName: "hydrated", slotRelocation: true, state: true, updatable: true};
|
|
196
|
-
const Env = /* kolibri */ {"kolibriVersion":"4.6.0-rc.
|
|
196
|
+
const Env = /* kolibri */ {"kolibriVersion":"4.6.0-rc.2"};
|
|
197
197
|
|
|
198
198
|
function getDefaultExportFromCjs (x) {
|
|
199
199
|
return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
|
|
@@ -569,7 +569,7 @@ function requireLoglevel () {
|
|
|
569
569
|
var loglevelExports = requireLoglevel();
|
|
570
570
|
var f$1 = /*@__PURE__*/getDefaultExportFromCjs(loglevelExports);
|
|
571
571
|
|
|
572
|
-
const x=()=>{const
|
|
572
|
+
const x=()=>{const t=typeof process<"u"&&process.env?process.env:{},e=t.NODE_ENV==="test",s="VITEST"in t,o="JEST_WORKER_ID"in t,a="PLAYWRIGHT_TEST_BASE_URL"in t,r=t.CI==="true",i=t.TEST==="true"||t.IS_TEST==="true",c=typeof navigator<"u"&&navigator.webdriver===true,m=typeof navigator<"u"&&/playwright|puppeteer|webdriver|selenium|testcafe/i.test(navigator.userAgent);return e||s||o||a||r||i||c||m},n$1={A11yUi:{CSS_STYLE_CACHE:new Map,FEATURES:{},IS_TEST_ENVIRONMENT:x(),PERFORMANCE_MEASURES:new Map,STYLING_TASK_QUEUE:new Map,THEMES:new Map,THEME_FEATURES:{}}};let u$1=false;const K=/^[a-z][a-z0-9]{1,}(-[a-z0-9]+)?$/,B=t=>typeof t=="string"&&K.test(t),U=t=>{if(!B(t))throw new Error(`[Theming] The theme identifier "${typeof t=="string"?t:""}" (Type: ${typeof t}) is not valid. Please use only follow this pattern: /^[a-z][a-z0-9]{1,}(-[a-z0-9]+)?$/`)},b=t=>t.replace(/\/\*[\s\S]*?\*\//g,"").replace(/\s*([{},;])\s*/g,"$1").replace(/:\s+/g,":").replace(/\s+/g," ").replace(/;\}/g,"}").trim(),D=(t,e,s,o)=>p(t,e,s,o),p=(t,e,s,o)=>{o=o??{},o.append=o.append??false,U(t),!u$1&&(u$1=true,f$1.warn(`[Theming] The theme process is locked. This means that the theme "${t}" should not be patched.
|
|
573
573
|
|
|
574
574
|
import { register } from 'adopted-style-sheets';
|
|
575
575
|
import { defineCustomElements } from '...';
|
|
@@ -579,7 +579,7 @@ const x=()=>{const e=typeof process<"u"&&process.env?process.env:{},t=e.NODE_ENV
|
|
|
579
579
|
.then(() => {
|
|
580
580
|
// run your app or website
|
|
581
581
|
})
|
|
582
|
-
.catch(console.warn);`));let a=n$1.A11yUi.THEMES.get(
|
|
582
|
+
.catch(console.warn);`));let a=n$1.A11yUi.THEMES.get(t);if(a||(a=new Map,n$1.A11yUi.THEMES.set(t,a)),o.append&&a.has(e)){const r=a.get(e);a.set(e,b(`${r}${s}`));}else a.set(e,b(s));},z=(t,e,s,o)=>g(t,e,s,o),g=(t,e,s,o)=>(U(t),typeof e=="object"&&e!==null&&Object.getOwnPropertyNames(e).forEach(a=>{const r=e[a],i=a.toLowerCase(),c=typeof o?.transformTagName=="function"&&!["GLOBAL","PROPERTIES"].includes(a)?o.transformTagName(i):a;typeof r=="string"&&r.length>0&&p(t,c.toUpperCase(),r,s);}),t),C=t=>{if(t instanceof HTMLElement){if(typeof t.dataset.theme=="string")return t;{let e=t.parentNode;for(;typeof ShadowRoot<"u"&&e instanceof ShadowRoot;)e=e.host;return C(e)}}else return null},M=(t={})=>t.themeEncroachCss==="false"||t.themeReset==="true"?false:{mode:t.themeEncroachCssMode==="after"||t.themeEncroachCssMode==="before"?t.themeEncroachCssMode:"before"},y=()=>typeof n$1.A11yUi.Theme=="object"&&n$1.A11yUi.Theme!==null&&typeof n$1.A11yUi.Theme.cache=="boolean"&&typeof n$1.A11yUi.Theme.encroachCss=="object"&&n$1.A11yUi.Theme.encroachCss!==null&&typeof n$1.A11yUi.Theme.encroachCss.mode=="string"&&typeof n$1.A11yUi.Theme.name=="string",w=t=>{if(y())return n$1.A11yUi.Theme;{const e={cache:true,encroachCss:M(),loglevel:"silent",mode:"csr",name:null},s=C(t);return s instanceof HTMLElement&&(e.cache=s.dataset.themeCache!=="false",e.encroachCss=M(s.dataset),e.loglevel=s.dataset.themeLoglevel==="debug"?s.dataset.themeLoglevel:"silent",e.mode=s.dataset.themeMode==="ssr"?s.dataset.themeMode:"csr",e.name=s.dataset.theme||null),e}},v=t=>w(t).name,R=()=>y()?n$1.A11yUi.Theme.name:null,X=(t,e)=>{const s=n$1.A11yUi.FEATURES[t];if(s!==void 0)return s;const o=v(e??null)??R();if(o!==null){const a=n$1.A11yUi.THEME_FEATURES[o];if(a&&a[t]!==void 0)return a[t]}};const _=new Set,L=new Map,oe=/--[^;]+/g,ae=/:/,ne=typeof MutationObserver<"u";let F=25,H=()=>{F=Math.min(25+Math.log2(n$1.A11yUi.STYLING_TASK_QUEUE.size+1)*20,250);};const re=(t,e)=>{let s=e.match(oe);if(Array.isArray(s)){s=s.filter(a=>ae.test(a));const o=document.createElement("style");o.innerHTML=`.${t} {${s.join(";")}}`,document.querySelector("head")?.appendChild(o);}_.add(t);},T=(t,e)=>{const s=n$1.A11yUi.THEMES.get(t);if(s instanceof Map){const o=s.get(e);if(o!==void 0)return o}return ""},ie=t=>{const e=t.firstChild;if(!(!(e instanceof HTMLStyleElement)||e.dataset.themingFallback!==void 0))for(const s of Array.from(t.childNodes))if(s instanceof HTMLStyleElement&&s.tagName==="STYLE"&&s.dataset.themingFallback===void 0)t.removeChild(s);else break},ce=(t,e)=>{try{if(n$1.A11yUi.Theme?.mode==="ssr")throw new Error("SSR");const s=e.filter(o=>typeof o=="string"&&o.length>0).map(o=>{let a=L.get(o);return a||(a=new CSSStyleSheet,a.replaceSync(o),L.set(o,a)),a});t.adoptedStyleSheets=s;}catch{for(let o=e.length-1;o>=0;o--){const a=e[o];if(typeof a!="string"||a.length===0)continue;const r=e.length-1-o,i=document.createElement("style");switch(i.dataset.themingFallback="",r){case 4:i.dataset.themingBaseA11y="";break;case 3:i.dataset.themingBaseGlobal="";break;case 2:i.dataset.themingBaseComponent="";break;case 1:i.dataset.themingCustomGlobal="";break;case 0:i.dataset.themingCustomComponent="";break;default:i.dataset.themingUnknown="";break}i.innerHTML=a,t.insertBefore(i,t.firstChild);}}},le=(t,e,s)=>{if(s===false||s?.mode!=="before"&&s?.mode!=="after")return;const o=Array.from(t.childNodes).filter(r=>r instanceof HTMLStyleElement&&r.tagName==="STYLE");let a;try{a=Array.from(t.adoptedStyleSheets);}catch{a=[];}if(!(o.length===0&&a.length===0))if(s.mode==="before"){const r=[...a.map(i=>Array.from(i.cssRules).map(c=>c.cssText).join("")),...o.map(i=>i.innerHTML)];e.unshift(...r);}else o.forEach(r=>e.push(r.innerHTML)),a.forEach(r=>e.push(Array.from(r.cssRules).map(i=>i.cssText).join("")));},me=(t,e,s)=>{const o=e.name||"default";let a;try{if(t.shadowRoot===null)throw new Error("ShadowRoot is null");a=t.shadowRoot;}catch{a=t;}const r=n$1.A11yUi.CSS_STYLE_CACHE.get(o)?.get(t.tagName);if(r)O(t,a,r,s);else {const i=T(o,"PROPERTIES"),c=T(o,"GLOBAL"),m=T(o,t.tagName);_.has(o)===false&&re(o,c);const d=[i,c,m];if(le(a,d,e.encroachCss),e.cache===true){let h=n$1.A11yUi.CSS_STYLE_CACHE.get(o);h||(h=new Map,n$1.A11yUi.CSS_STYLE_CACHE.set(o,h)),h.set(t.tagName,d);}O(t,a,d,s);}},O=(t,e,s,o)=>{const a=n$1.A11yUi.Theme?.loglevel==="debug",r=a?performance.now():0;if(ie(e),ce(e,s),Te(t),requestAnimationFrame(o),a){const i=performance.now()-r,c=n$1.A11yUi.PERFORMANCE_MEASURES.get(t.tagName);c?(c.count+=1,c.totalTime+=i):n$1.A11yUi.PERFORMANCE_MEASURES.set(t.tagName,{count:1,totalTime:i});}},I=t=>{const e=n$1.A11yUi.STYLING_TASK_QUEUE.get(t);if(e){const{resetCss:s,themeDetails:o}=e;me(t,o,s);}},he=100;let S=(t,e=0)=>{if(e>=he)return;const s=setTimeout(()=>{clearTimeout(s),t.classList.contains("hydrated")?I(t):S(t,e+1);},F);};const fe={attributes:true,attributeFilter:["class"],childList:false,subtree:false},ue={attributes:true,attributeFilter:[],childList:false,subtree:false},P=ne?new MutationObserver((t,e)=>{const s=[];for(const o of t){const a=o.target;a.classList.contains("hydrated")&&n$1.A11yUi.STYLING_TASK_QUEUE.has(a)&&(I(a),s.push(a));}for(const o of s)e.observe(o,ue);}):null;P&&(S=t=>P.observe(t,fe),H=()=>{});const $=new Map;let j=(t,e)=>{if(e){const a=$.get(e);if(a!==void 0)return a}const s=getComputedStyle(t).getPropertyValue("--theme-visibility-delay").trim();let o;if(s.endsWith("ms"))o=parseFloat(s);else if(s.endsWith("s"))o=parseFloat(s)*1e3;else {const a=parseFloat(s);o=isNaN(a)?0:a;}return e&&$.set(e,o),o};n$1.A11yUi.IS_TEST_ENVIRONMENT&&(j=()=>0);const Y=(t,e)=>{t.style.setProperty("visibility",e),t.dataset.themed="";},ye=(t,e)=>{const s=t.style.visibility||null,o=e.name||"default";n$1.A11yUi.STYLING_TASK_QUEUE.set(t,{resetCss:()=>{const a=j(t,o);a>0?setTimeout(()=>{Y(t,s);},a):Y(t,s);},themeDetails:e}),e.mode!=="ssr"&&t.style.setProperty("visibility","hidden","important"),S(t);},Te=t=>{n$1.A11yUi.STYLING_TASK_QUEUE.delete(t),H();},de=(t,e)=>{ye(t,{...n$1.A11yUi.Theme,...e});};
|
|
583
583
|
|
|
584
584
|
var KeyEnum;
|
|
585
585
|
(function (KeyEnum) {
|
|
@@ -627,34 +627,35 @@ var KeyEnum;
|
|
|
627
627
|
KeyEnum[KeyEnum["pagination"] = 41] = "pagination";
|
|
628
628
|
KeyEnum[KeyEnum["pagination-position-bottom"] = 42] = "pagination-position-bottom";
|
|
629
629
|
KeyEnum[KeyEnum["pagination-position-top"] = 43] = "pagination-position-top";
|
|
630
|
-
KeyEnum[KeyEnum["
|
|
631
|
-
KeyEnum[KeyEnum["
|
|
632
|
-
KeyEnum[KeyEnum["show-
|
|
633
|
-
KeyEnum[KeyEnum["
|
|
634
|
-
KeyEnum[KeyEnum["
|
|
635
|
-
KeyEnum[KeyEnum["
|
|
636
|
-
KeyEnum[KeyEnum["
|
|
637
|
-
KeyEnum[KeyEnum["table-data-
|
|
638
|
-
KeyEnum[KeyEnum["table-
|
|
639
|
-
KeyEnum[KeyEnum["table-
|
|
640
|
-
KeyEnum[KeyEnum["table-selection
|
|
641
|
-
KeyEnum[KeyEnum["table-selection-
|
|
642
|
-
KeyEnum[KeyEnum["table-selection-
|
|
643
|
-
KeyEnum[KeyEnum["table-
|
|
644
|
-
KeyEnum[KeyEnum["table-settings
|
|
645
|
-
KeyEnum[KeyEnum["table-settings-
|
|
646
|
-
KeyEnum[KeyEnum["table-settings-
|
|
647
|
-
KeyEnum[KeyEnum["table-settings-column-
|
|
648
|
-
KeyEnum[KeyEnum["table-settings-column-
|
|
649
|
-
KeyEnum[KeyEnum["table-settings-
|
|
650
|
-
KeyEnum[KeyEnum["table-settings-
|
|
651
|
-
KeyEnum[KeyEnum["table-settings-move-
|
|
652
|
-
KeyEnum[KeyEnum["table-settings-
|
|
653
|
-
KeyEnum[KeyEnum["table-
|
|
654
|
-
KeyEnum[KeyEnum["table-
|
|
655
|
-
KeyEnum[KeyEnum["
|
|
656
|
-
KeyEnum[KeyEnum["
|
|
657
|
-
KeyEnum[KeyEnum["
|
|
630
|
+
KeyEnum[KeyEnum["progress"] = 44] = "progress";
|
|
631
|
+
KeyEnum[KeyEnum["readonly"] = 45] = "readonly";
|
|
632
|
+
KeyEnum[KeyEnum["show-password"] = 46] = "show-password";
|
|
633
|
+
KeyEnum[KeyEnum["show-suggestions"] = 47] = "show-suggestions";
|
|
634
|
+
KeyEnum[KeyEnum["sort"] = 48] = "sort";
|
|
635
|
+
KeyEnum[KeyEnum["split-button-dropdown-label-open"] = 49] = "split-button-dropdown-label-open";
|
|
636
|
+
KeyEnum[KeyEnum["success"] = 50] = "success";
|
|
637
|
+
KeyEnum[KeyEnum["table-data-loading"] = 51] = "table-data-loading";
|
|
638
|
+
KeyEnum[KeyEnum["table-data-loaded"] = 52] = "table-data-loaded";
|
|
639
|
+
KeyEnum[KeyEnum["table-pagination-label"] = 53] = "table-pagination-label";
|
|
640
|
+
KeyEnum[KeyEnum["table-selection"] = 54] = "table-selection";
|
|
641
|
+
KeyEnum[KeyEnum["table-selection-all"] = 55] = "table-selection-all";
|
|
642
|
+
KeyEnum[KeyEnum["table-selection-indeterminate"] = 56] = "table-selection-indeterminate";
|
|
643
|
+
KeyEnum[KeyEnum["table-selection-none"] = 57] = "table-selection-none";
|
|
644
|
+
KeyEnum[KeyEnum["table-settings"] = 58] = "table-settings";
|
|
645
|
+
KeyEnum[KeyEnum["table-settings-apply"] = 59] = "table-settings-apply";
|
|
646
|
+
KeyEnum[KeyEnum["table-settings-cancel"] = 60] = "table-settings-cancel";
|
|
647
|
+
KeyEnum[KeyEnum["table-settings-column-hidable"] = 61] = "table-settings-column-hidable";
|
|
648
|
+
KeyEnum[KeyEnum["table-settings-column-not-hidable"] = 62] = "table-settings-column-not-hidable";
|
|
649
|
+
KeyEnum[KeyEnum["table-settings-column-width"] = 63] = "table-settings-column-width";
|
|
650
|
+
KeyEnum[KeyEnum["table-settings-error-all-invisible"] = 64] = "table-settings-error-all-invisible";
|
|
651
|
+
KeyEnum[KeyEnum["table-settings-move-down"] = 65] = "table-settings-move-down";
|
|
652
|
+
KeyEnum[KeyEnum["table-settings-move-up"] = 66] = "table-settings-move-up";
|
|
653
|
+
KeyEnum[KeyEnum["table-settings-not-move"] = 67] = "table-settings-not-move";
|
|
654
|
+
KeyEnum[KeyEnum["table-sort-order"] = 68] = "table-sort-order";
|
|
655
|
+
KeyEnum[KeyEnum["table-visible-range"] = 69] = "table-visible-range";
|
|
656
|
+
KeyEnum[KeyEnum["toast-close-all"] = 70] = "toast-close-all";
|
|
657
|
+
KeyEnum[KeyEnum["version"] = 71] = "version";
|
|
658
|
+
KeyEnum[KeyEnum["warning"] = 72] = "warning";
|
|
658
659
|
})(KeyEnum || (KeyEnum = {}));
|
|
659
660
|
|
|
660
661
|
var TagEnum;
|
|
@@ -4488,7 +4489,7 @@ const appGlobalScript = script || (() => {});
|
|
|
4488
4489
|
const globalScripts = appGlobalScript;
|
|
4489
4490
|
|
|
4490
4491
|
/*
|
|
4491
|
-
Stencil Hydrate Platform v4.45.
|
|
4492
|
+
Stencil Hydrate Platform v4.45.3 | MIT Licensed | https://stenciljs.com
|
|
4492
4493
|
*/
|
|
4493
4494
|
var __create = Object.create;
|
|
4494
4495
|
var __defProp = Object.defineProperty;
|
|
@@ -4978,6 +4979,7 @@ function getHostSlotNodes(childNodes, hostName, slotName) {
|
|
|
4978
4979
|
if (typeof slotName !== "undefined") return slottedNodes;
|
|
4979
4980
|
}
|
|
4980
4981
|
slottedNodes = [...slottedNodes, ...getHostSlotNodes(internalCall(childNode, "childNodes"), hostName, slotName)];
|
|
4982
|
+
if (typeof slotName !== "undefined" && slottedNodes.length) return slottedNodes;
|
|
4981
4983
|
}
|
|
4982
4984
|
return slottedNodes;
|
|
4983
4985
|
}
|
|
@@ -5131,7 +5133,7 @@ var addStyle = (styleContainerNode, cmpMeta, mode) => {
|
|
|
5131
5133
|
}
|
|
5132
5134
|
const existingStyleElm = styleContainerNode.querySelector(`[${HYDRATED_STYLE_ID}="${scopeId2}"]`);
|
|
5133
5135
|
if (existingStyleElm) {
|
|
5134
|
-
|
|
5136
|
+
appliedStyles.add(scopeId2);
|
|
5135
5137
|
} else if (!appliedStyles.has(scopeId2)) {
|
|
5136
5138
|
styleElm = win.document.createElement("style");
|
|
5137
5139
|
styleElm.textContent = style;
|
|
@@ -5139,7 +5141,7 @@ var addStyle = (styleContainerNode, cmpMeta, mode) => {
|
|
|
5139
5141
|
if (nonce != null) {
|
|
5140
5142
|
styleElm.setAttribute("nonce", nonce);
|
|
5141
5143
|
}
|
|
5142
|
-
|
|
5144
|
+
{
|
|
5143
5145
|
styleElm.setAttribute(HYDRATED_STYLE_ID, scopeId2);
|
|
5144
5146
|
}
|
|
5145
5147
|
if (!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */)) {
|
|
@@ -5473,7 +5475,7 @@ var clientHydrate = (parentVNode, childRenderNodes, slotNodes, shadowRootNodes,
|
|
|
5473
5475
|
let i2;
|
|
5474
5476
|
if (node.nodeType === 1 /* ElementNode */) {
|
|
5475
5477
|
childNodeType = node.getAttribute(HYDRATE_CHILD_ID);
|
|
5476
|
-
if (childNodeType) {
|
|
5478
|
+
if (childNodeType && node !== hostElm) {
|
|
5477
5479
|
childIdSplt = childNodeType.split(".");
|
|
5478
5480
|
if (childIdSplt[0] === hostId || childIdSplt[0] === "0") {
|
|
5479
5481
|
childVNode = createSimpleVNode({
|
|
@@ -6299,21 +6301,6 @@ var getElement = (ref) => {
|
|
|
6299
6301
|
var _a2;
|
|
6300
6302
|
return (_a2 = getHostRef(ref)) == null ? void 0 : _a2.$hostElement$ ;
|
|
6301
6303
|
};
|
|
6302
|
-
|
|
6303
|
-
// src/runtime/event-emitter.ts
|
|
6304
|
-
var createEvent = (ref, name, flags) => {
|
|
6305
|
-
const elm = getElement(ref);
|
|
6306
|
-
return {
|
|
6307
|
-
emit: (detail) => {
|
|
6308
|
-
return emitEvent(elm, name, {
|
|
6309
|
-
bubbles: true,
|
|
6310
|
-
composed: true,
|
|
6311
|
-
cancelable: true,
|
|
6312
|
-
detail
|
|
6313
|
-
});
|
|
6314
|
-
}
|
|
6315
|
-
};
|
|
6316
|
-
};
|
|
6317
6304
|
var emitEvent = (elm, name, opts) => {
|
|
6318
6305
|
const ev = plt.ce(name, opts);
|
|
6319
6306
|
elm.dispatchEvent(ev);
|
|
@@ -7643,7 +7630,7 @@ var Fragment = (_, children) => children;
|
|
|
7643
7630
|
var addHostEventListeners = (elm, hostRef, listeners, attachParentListeners) => {
|
|
7644
7631
|
if (listeners && win.document) {
|
|
7645
7632
|
listeners.map(([flags, name, method]) => {
|
|
7646
|
-
const target =
|
|
7633
|
+
const target = elm;
|
|
7647
7634
|
const handler = hostListenerProxy(hostRef, method);
|
|
7648
7635
|
const opts = hostListenerOpts(flags);
|
|
7649
7636
|
plt.ael(target, name, handler, opts);
|
|
@@ -7665,12 +7652,6 @@ var hostListenerProxy = (hostRef, methodName) => (ev) => {
|
|
|
7665
7652
|
consoleError(e, hostRef.$hostElement$);
|
|
7666
7653
|
}
|
|
7667
7654
|
};
|
|
7668
|
-
var getHostListenerTarget = (doc, elm, flags) => {
|
|
7669
|
-
if (flags & 8 /* TargetWindow */) {
|
|
7670
|
-
return win;
|
|
7671
|
-
}
|
|
7672
|
-
return elm;
|
|
7673
|
-
};
|
|
7674
7655
|
var hostListenerOpts = (flags) => (flags & 2 /* Capture */) !== 0;
|
|
7675
7656
|
function transformTag(tag) {
|
|
7676
7657
|
return tag;
|
|
@@ -10113,6 +10094,7 @@ const SAFE_CLASS_NAME_RE = /^[a-zA-Z][a-zA-Z0-9_-]{0,60}$/;
|
|
|
10113
10094
|
const isSafeClassName = (value) => typeof value === 'string' && SAFE_CLASS_NAME_RE.test(value);
|
|
10114
10095
|
const isValidLabel = isValidLabelString;
|
|
10115
10096
|
const isValidLabelWithExpertSlot = (value) => value === '' || isValidLabelSegments(value);
|
|
10097
|
+
const isValidLabelDecorative = (value) => value === '' || isValidLabel(value);
|
|
10116
10098
|
|
|
10117
10099
|
function validateCustomClass(value) {
|
|
10118
10100
|
return value === '' || isSafeClassName(value);
|
|
@@ -10411,6 +10393,10 @@ const labelAlignProp = createPropDefinition('labelAlign', 'right', (value) => {
|
|
|
10411
10393
|
throw new Error(`Invalid label alignment: ${str}`);
|
|
10412
10394
|
});
|
|
10413
10395
|
|
|
10396
|
+
const labelDecorativeProp = createPropDefinition('label', undefined, normalizeString, isValidLabelDecorative, {
|
|
10397
|
+
hints: labelHints,
|
|
10398
|
+
});
|
|
10399
|
+
|
|
10414
10400
|
const labelLangSegmentsProp = createPropDefinition('label', undefined, normalizeLabelSegments, isValidLabelSegments, {
|
|
10415
10401
|
hints: labelHints,
|
|
10416
10402
|
});
|
|
@@ -11134,8 +11120,9 @@ const defaultStyleCss$O = () => `@charset "UTF-8"; @layer kol-a11y, kol-global,
|
|
|
11134
11120
|
|
|
11135
11121
|
class KolAbbr extends BaseWebComponent {
|
|
11136
11122
|
constructor(hostRef) {
|
|
11137
|
-
super();
|
|
11138
|
-
|
|
11123
|
+
super(...arguments);
|
|
11124
|
+
if (new.target === KolAbbr)
|
|
11125
|
+
registerInstance(this, hostRef);
|
|
11139
11126
|
this.propsConfig = abbrPropsConfig;
|
|
11140
11127
|
this._label = undefined;
|
|
11141
11128
|
}
|
|
@@ -11146,7 +11133,7 @@ class KolAbbr extends BaseWebComponent {
|
|
|
11146
11133
|
this.watchLabel(this._label);
|
|
11147
11134
|
}
|
|
11148
11135
|
render() {
|
|
11149
|
-
return (hAsync(Host, { key: '
|
|
11136
|
+
return (hAsync(Host, { key: '2ee63ca84e842ca638b9e40340aac3a13f1e1fd2' }, hAsync(AbbrFC, { key: '15e6509c32336b2f3b6215e6f4524cea65ee26c4', label: this.getRenderProp('label') })));
|
|
11150
11137
|
}
|
|
11151
11138
|
static get watchers() { return {
|
|
11152
11139
|
"_label": [{
|
|
@@ -20867,12 +20854,13 @@ const createRelatedUniqueId = (baseId, suffix) => {
|
|
|
20867
20854
|
return isNonce ? `${baseId.slice(0, separatorIndex)}-${suffix}-${lastSegment}` : `${baseId}-${suffix}`;
|
|
20868
20855
|
};
|
|
20869
20856
|
|
|
20870
|
-
const defaultStyleCss$N = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=
|
|
20857
|
+
const defaultStyleCss$N = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-accordion { } .kol-accordion__heading { display: flex; min-height: var(--a11y-min-size); } .kol-accordion__heading:not([aria-disabled=true]) { cursor: pointer; } .kol-accordion__heading { } .kol-accordion__heading::before { content: ""; } .kol-accordion__heading { } .kol-accordion__heading > .kol-headline { display: flex; flex: 1; margin: 0; text-align: left; font-weight: 400; } .kol-accordion__heading > .kol-headline > .kol-span { flex: 1 0 100%; align-items: flex-start; } @media (prefers-reduced-motion) { .kol-accordion__wrapper-animation, .kol-accordion__wrapper { transition: none !important; } } .kol-accordion { } @media print { .kol-accordion:not(.kol-accordion--open) .kol-accordion__wrapper-animation { display: none; } } .kol-accordion__wrapper { transform: translateZ(0); display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: 0fr; transition: grid-template-rows var(--collapsible-transition-duration, 0.3s); } .kol-accordion__wrapper-animation { opacity: 0; transform: scaleY(0); transform-origin: top; min-height: 0; visibility: hidden; transition: transform var(--collapsible-transition-duration, 0.3s), opacity var(--collapsible-transition-duration, 0.3s), visibility var(--collapsible-transition-duration, 0.3s); } .kol-accordion--open .kol-accordion__wrapper { grid-template-rows: 1fr; } .kol-accordion--open .kol-accordion__wrapper-animation { opacity: 1; transform: scaleY(1); visibility: visible; } .kol-accordion--open:focus-within { position: relative; z-index: 100; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } }`;
|
|
20871
20858
|
|
|
20872
20859
|
class KolAccordion extends BaseWebComponent {
|
|
20873
20860
|
constructor(hostRef) {
|
|
20874
|
-
super();
|
|
20875
|
-
|
|
20861
|
+
super(...arguments);
|
|
20862
|
+
if (new.target === KolAccordion)
|
|
20863
|
+
registerInstance(this, hostRef);
|
|
20876
20864
|
this.accordionId = createUniqueId('accordion');
|
|
20877
20865
|
this.controlId = createRelatedUniqueId(this.accordionId, 'control');
|
|
20878
20866
|
this.detailsOpen = false;
|
|
@@ -20939,7 +20927,7 @@ class KolAccordion extends BaseWebComponent {
|
|
|
20939
20927
|
this.openAnimation.dispose();
|
|
20940
20928
|
}
|
|
20941
20929
|
render() {
|
|
20942
|
-
return (hAsync(Host, { key: '
|
|
20930
|
+
return (hAsync(Host, { key: 'fe83d27f74efae425c3d35782f1714ba8f8c501b' }, hAsync(CollapsibleFC, { key: 'd162255bd8d6d611d60b0f1d05fd2e09adaa01a2', block: "kol-accordion", controlId: this.controlId, detailsOpen: this.detailsOpen, disabled: this.getRenderProp('disabled'), expanded: this.expanded, handleToggle: this.handleToggle, headingId: this.headingId, icons: this.getRenderProp('open') ? 'kolicon-chevron-down' : 'kolicon-chevron-right', label: this.getRenderProp('label'), level: this.getRenderProp('level'), on: this.getRenderProp('on'), open: this.getRenderProp('open'), refHeadingButton: this.ctaRef, transitionMs: this.transitionMs }, hAsync("slot", { key: 'e048d507c3af993c510af9d48ccb1281331ee0fe' }))));
|
|
20943
20931
|
}
|
|
20944
20932
|
get host() { return getElement(this); }
|
|
20945
20933
|
static get watchers() { return {
|
|
@@ -21036,6 +21024,7 @@ var locale_de = {
|
|
|
21036
21024
|
pagination: 'Paginierung',
|
|
21037
21025
|
'pagination-position-bottom': 'unten',
|
|
21038
21026
|
'pagination-position-top': 'oben',
|
|
21027
|
+
progress: 'Fortschritt',
|
|
21039
21028
|
readonly: 'schreibgeschützt',
|
|
21040
21029
|
'show-password': 'Passwort einblenden',
|
|
21041
21030
|
'show-suggestions': 'Vorschläge anzeigen',
|
|
@@ -21111,6 +21100,7 @@ var locale_en = {
|
|
|
21111
21100
|
pagination: 'Pagination',
|
|
21112
21101
|
'pagination-position-bottom': 'bottom',
|
|
21113
21102
|
'pagination-position-top': 'top',
|
|
21103
|
+
progress: 'Progress',
|
|
21114
21104
|
readonly: 'read-only',
|
|
21115
21105
|
'show-password': 'Show password',
|
|
21116
21106
|
'show-suggestions': 'Show suggestions',
|
|
@@ -23220,12 +23210,13 @@ class TooltipBehavior extends BaseBehavior {
|
|
|
23220
23210
|
}
|
|
23221
23211
|
}
|
|
23222
23212
|
|
|
23223
|
-
const defaultStyleCss$M = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=
|
|
23213
|
+
const defaultStyleCss$M = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } }`;
|
|
23224
23214
|
|
|
23225
23215
|
class KolAlert extends BaseWebComponent {
|
|
23226
23216
|
constructor(hostRef) {
|
|
23227
|
-
super();
|
|
23228
|
-
|
|
23217
|
+
super(...arguments);
|
|
23218
|
+
if (new.target === KolAlert)
|
|
23219
|
+
registerInstance(this, hostRef);
|
|
23229
23220
|
this.headingId = createUniqueId('alert-heading');
|
|
23230
23221
|
this.closerAriaDescriptionId = nonce();
|
|
23231
23222
|
this.translateCloseAlert = translate('kol-close-alert');
|
|
@@ -23314,7 +23305,7 @@ class KolAlert extends BaseWebComponent {
|
|
|
23314
23305
|
this.alertTimeout = setTimeout(() => this.handleAlertTimeout(), 10000);
|
|
23315
23306
|
}
|
|
23316
23307
|
render() {
|
|
23317
|
-
return (hAsync(Host, { key: '
|
|
23308
|
+
return (hAsync(Host, { key: '5753d80e812d3a51c88557561e20af9a0a531587' }, hAsync(AlertFC, { key: '75ecec655beb2cca1c939e0551010642fbd57375', alert: this.getRenderProp('alert'), handleCloserClick: this.handleCloserClick, closerAriaDescriptionId: this.closerAriaDescriptionId, hasCloser: this.getRenderProp('hasCloser'), headingId: this.headingId, label: this.getRenderProp('label'), level: this.getRenderProp('level'), refCloserButton: this.closerRef, refCloserTooltip: this.closerTooltipBehavior.setTooltipElementRef, type: this.getRenderProp('type'), variant: this.getRenderProp('variant') }, hAsync("slot", { key: '7d714fd6d9ca75dd17eec734f7f0a590f66d860f' }))));
|
|
23318
23309
|
}
|
|
23319
23310
|
get host() { return getElement(this); }
|
|
23320
23311
|
static get watchers() { return {
|
|
@@ -23400,8 +23391,9 @@ const normalizeInitials = (value) => {
|
|
|
23400
23391
|
};
|
|
23401
23392
|
class KolAvatar extends BaseWebComponent {
|
|
23402
23393
|
constructor(hostRef) {
|
|
23403
|
-
super();
|
|
23404
|
-
|
|
23394
|
+
super(...arguments);
|
|
23395
|
+
if (new.target === KolAvatar)
|
|
23396
|
+
registerInstance(this, hostRef);
|
|
23405
23397
|
this.initials = '';
|
|
23406
23398
|
this.propsConfig = avatarPropsConfig;
|
|
23407
23399
|
this._color = undefined;
|
|
@@ -23428,7 +23420,7 @@ class KolAvatar extends BaseWebComponent {
|
|
|
23428
23420
|
srcProp.apply(this._src, (v) => this.setRenderProp('src', v));
|
|
23429
23421
|
}
|
|
23430
23422
|
render() {
|
|
23431
|
-
return (hAsync(Host, { key: '
|
|
23423
|
+
return (hAsync(Host, { key: 'e3616a4b07d13b3582a77d5bc8d64c9a6031e39b' }, hAsync(AvatarFC, { key: '0f8a9d71c76d321e697119712e19effe2e9f35c4', color: this.getRenderProp('color'), label: this.getRenderProp('label'), src: this.getRenderProp('src'), initials: this.initials })));
|
|
23432
23424
|
}
|
|
23433
23425
|
static get watchers() { return {
|
|
23434
23426
|
"_color": [{
|
|
@@ -23517,13 +23509,14 @@ function resolveButtonProps(props, host) {
|
|
|
23517
23509
|
return resolved;
|
|
23518
23510
|
}
|
|
23519
23511
|
|
|
23520
|
-
const defaultStyleCss$K = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=
|
|
23512
|
+
const defaultStyleCss$K = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-badge { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); display: flex; align-items: center; justify-content: space-between; } .kol-badge > br { user-select: none; } .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-badge .kol-badge__smart-button { width: auto; order: 3; } }`;
|
|
23521
23513
|
|
|
23522
23514
|
featureHint(`[KolBadge] Optimierung des _color-Properties (rgba, rgb, hex usw.).`);
|
|
23523
23515
|
class KolBadge extends BaseWebComponent {
|
|
23524
23516
|
constructor(hostRef) {
|
|
23525
|
-
super();
|
|
23526
|
-
|
|
23517
|
+
super(...arguments);
|
|
23518
|
+
if (new.target === KolBadge)
|
|
23519
|
+
registerInstance(this, hostRef);
|
|
23527
23520
|
this.labelId = createUniqueId('badge-label');
|
|
23528
23521
|
this.ariaDescriptionId = nonce();
|
|
23529
23522
|
this.ctaRef = createCtaRef();
|
|
@@ -23616,7 +23609,7 @@ class KolBadge extends BaseWebComponent {
|
|
|
23616
23609
|
render() {
|
|
23617
23610
|
const smartButton = this.getRenderProp('smartButton');
|
|
23618
23611
|
const resolvedButton = this.smartButtonProps;
|
|
23619
|
-
return (hAsync(Host, { key: '
|
|
23612
|
+
return (hAsync(Host, { key: '92a82608b8424d8b91480b7dd132afc12fec8717' }, hAsync(BadgeFC, { key: '3a0ec94ab587dc7b6e49f2530ad61d7fb590b501', color: this.getRenderProp('color'), icons: this.getRenderProp('icons'), label: this.getRenderProp('label'), smartButton: typeof smartButton === 'object' && smartButton !== null && resolvedButton !== undefined
|
|
23620
23613
|
? {
|
|
23621
23614
|
ariaDescriptionId: this.ariaDescriptionId,
|
|
23622
23615
|
handleBlur: this.handleBlur,
|
|
@@ -23724,7 +23717,7 @@ const LinkFC = (props, children) => {
|
|
|
23724
23717
|
'hide-label': hideLabel === true,
|
|
23725
23718
|
inline: inline === true,
|
|
23726
23719
|
standalone: inline === false,
|
|
23727
|
-
} }, hAsync("a", Object.assign({ ref: refAnchor }, tagAttrs, { href: tagAttrs.href, accessKey: accessKey || undefined, "aria-current": ariaCurrent || undefined, "aria-controls": ariaControls || undefined, "aria-describedby": trimmedAriaDescription ? ariaDescriptionId : undefined, "aria-disabled": disabled ? 'true' : undefined, "aria-expanded": ariaExpanded === '' ? undefined : ariaExpanded, "aria-owns": ariaOwns || undefined, "aria-label": hideLabel && trimLabel(label) !== '' ? `${trimLabel(label)}${isExternal ? ` (${translateOpenLinkInTab})` : ''}` : undefined, "aria-keyshortcuts": shortKey || undefined, class: linkBem('interactive-element') }, on, { onClick: handleAnchorClick, onMouseDown: disabled ? preventFocus : undefined, role: roleValue, tabIndex: disabled ? -1 : tabIndex }), hAsync(SpanFC, { class: "kol-link__text", badgeText: accessKey || shortKey, icons: icons, hideLabel: hideLabel, label: expertSlot ? '' : label || href }, children.length > 0 ? children : hAsync("slot", { name: "expert", slot: "expert" })), isExternal && (hAsync(IconFC, { class: "kol-link__icon", label: hideLabel ? '' : translateOpenLinkInTab, icons: 'kolicon-link-external', "aria-hidden": hideLabel }))), hideLabel === true && !expertSlot && (hAsync("div", { class: "kol-link__tooltip" }, hAsync(TooltipFC, { badgeText: accessKey || shortKey || '', label:
|
|
23720
|
+
} }, hAsync("a", Object.assign({ ref: refAnchor }, tagAttrs, { href: tagAttrs.href, accessKey: accessKey || undefined, "aria-current": ariaCurrent || undefined, "aria-controls": ariaControls || undefined, "aria-describedby": trimmedAriaDescription ? ariaDescriptionId : undefined, "aria-disabled": disabled ? 'true' : undefined, "aria-expanded": ariaExpanded === '' ? undefined : ariaExpanded, "aria-owns": ariaOwns || undefined, "aria-label": hideLabel && trimLabel(label) !== '' ? `${trimLabel(label)}${isExternal ? ` (${translateOpenLinkInTab})` : ''}` : undefined, "aria-keyshortcuts": shortKey || undefined, class: linkBem('interactive-element') }, on, { onClick: handleAnchorClick, onMouseDown: disabled ? preventFocus : undefined, role: roleValue, tabIndex: disabled ? -1 : tabIndex }), hAsync(SpanFC, { class: "kol-link__text", badgeText: accessKey || shortKey, icons: icons, hideLabel: hideLabel, label: expertSlot ? '' : label || href }, children.length > 0 ? children : hAsync("slot", { name: "expert", slot: "expert" })), isExternal && (hAsync(IconFC, { class: "kol-link__icon", label: hideLabel ? '' : translateOpenLinkInTab, icons: 'kolicon-link-external', "aria-hidden": hideLabel }))), hideLabel === true && !expertSlot && (hAsync("div", { class: "kol-link__tooltip" }, hAsync(TooltipFC, { badgeText: accessKey || shortKey || '', label: trimLabel(label) !== '' ? label : typeof href === 'string' ? href : '', refFloating: refTooltip }))), trimmedAriaDescription && hAsync(AriaDescriptionSpanFC, { description: trimmedAriaDescription, descriptionId: ariaDescriptionId })));
|
|
23728
23721
|
};
|
|
23729
23722
|
|
|
23730
23723
|
const breadcrumbBem = bem.forBlock('kol-breadcrumb');
|
|
@@ -23855,12 +23848,13 @@ const onLocationChange = (callback, eager = true) => {
|
|
|
23855
23848
|
};
|
|
23856
23849
|
};
|
|
23857
23850
|
|
|
23858
|
-
const defaultStyleCss$J = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=
|
|
23851
|
+
const defaultStyleCss$J = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-link { display: inline-flex; max-width: fit-content; } .kol-link--standalone { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: stretch; } .kol-link--standalone .kol-link__interactive-element { align-items: stretch; } .kol-link--standalone .kol-link__text { display: inline-flex; flex: 1 1 100%; place-items: center; } .kol-link__interactive-element { display: inline-flex; flex: 1; align-items: baseline; place-items: center; text-align: left; text-decoration-line: none; } .kol-link__interactive-element:focus:not([aria-disabled], [disabled]) .kol-span__label, .kol-link__interactive-element:hover:not([aria-disabled], [disabled]) .kol-span__label { text-decoration-thickness: 0.2em; } .kol-link .kol-span__label { text-decoration-line: underline; } .kol-link__icon { display: inline-flex; } .kol-breadcrumb__list, .kol-breadcrumb__list-element { display: flex; margin: 0; padding: 0; flex-wrap: wrap; place-items: center; list-style: none; } .kol-breadcrumb__list-element:first-child:last-child { min-height: var(--a11y-min-size); } }`;
|
|
23859
23852
|
|
|
23860
23853
|
class KolBreadcrumb extends BaseWebComponent {
|
|
23861
23854
|
constructor(hostRef) {
|
|
23862
|
-
super();
|
|
23863
|
-
|
|
23855
|
+
super(...arguments);
|
|
23856
|
+
if (new.target === KolBreadcrumb)
|
|
23857
|
+
registerInstance(this, hostRef);
|
|
23864
23858
|
this.linkItems = [];
|
|
23865
23859
|
this.showCurrentPage = true;
|
|
23866
23860
|
this.propsConfig = breadcrumbPropsConfig;
|
|
@@ -23904,7 +23898,7 @@ class KolBreadcrumb extends BaseWebComponent {
|
|
|
23904
23898
|
}
|
|
23905
23899
|
render() {
|
|
23906
23900
|
this.showCurrentPage = X('breadcrumbCurrentPage', this.host) !== 'hide';
|
|
23907
|
-
return (hAsync(Host, { key: '
|
|
23901
|
+
return (hAsync(Host, { key: '8a8c9137c0491103f54d65dfe8db53c0c7d629b6' }, hAsync(BreadcrumbFC, { key: 'ab994f68a8b57e4dae385927a592db76907537cc', label: this.getRenderProp('label'), links: this.getRenderProp('links'), linkItems: this.linkItems, showCurrentPage: this.showCurrentPage })));
|
|
23908
23902
|
}
|
|
23909
23903
|
get host() { return getElement(this); }
|
|
23910
23904
|
static get watchers() { return {
|
|
@@ -24447,12 +24441,13 @@ class BaseButtonWebComponent extends BaseWebComponent {
|
|
|
24447
24441
|
}
|
|
24448
24442
|
}
|
|
24449
24443
|
|
|
24450
|
-
const defaultStyleCss$I = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=
|
|
24444
|
+
const defaultStyleCss$I = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-button__interactive-element::before { content: ""; } .kol-button__text { flex: 1 0 100%; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } }`;
|
|
24451
24445
|
|
|
24452
24446
|
class KolButton extends BaseButtonWebComponent {
|
|
24453
24447
|
constructor(hostRef) {
|
|
24454
24448
|
super();
|
|
24455
|
-
|
|
24449
|
+
if (new.target === KolButton)
|
|
24450
|
+
registerInstance(this, hostRef);
|
|
24456
24451
|
this.ariaDescriptionId = nonce();
|
|
24457
24452
|
this._accessKey = undefined;
|
|
24458
24453
|
this._ariaControls = undefined;
|
|
@@ -24575,7 +24570,7 @@ class KolButton extends BaseButtonWebComponent {
|
|
|
24575
24570
|
this.destroyTooltipBehavior();
|
|
24576
24571
|
}
|
|
24577
24572
|
render() {
|
|
24578
|
-
return hAsync(Host, { key: '
|
|
24573
|
+
return hAsync(Host, { key: '9ed43938721a6b3e26e7024c1b0498f585f10158' }, this.renderButtonFC());
|
|
24579
24574
|
}
|
|
24580
24575
|
get host() { return getElement(this); }
|
|
24581
24576
|
static get watchers() { return {
|
|
@@ -24684,12 +24679,13 @@ __decorate([
|
|
|
24684
24679
|
delegateClick('ctaRef')
|
|
24685
24680
|
], KolButton.prototype, "click", null);
|
|
24686
24681
|
|
|
24687
|
-
const defaultStyleCss$H = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=
|
|
24682
|
+
const defaultStyleCss$H = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-button { display: inline-flex; max-width: fit-content; } .kol-button--standalone { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: stretch; } .kol-button--standalone .kol-button__interactive-element { align-items: stretch; } .kol-button--standalone .kol-button__text { display: inline-flex; flex: 1 1 100%; place-items: center; } .kol-button__interactive-element { display: inline-flex; flex: 1; align-items: baseline; place-items: center; text-align: left; text-decoration-line: none; } .kol-button__interactive-element:focus:not([aria-disabled], [disabled]) .kol-span__label, .kol-button__interactive-element:hover:not([aria-disabled], [disabled]) .kol-span__label { text-decoration-thickness: 0.2em; } .kol-button .kol-span__label { text-decoration-line: underline; } .kol-button__icon { display: inline-flex; } .kol-button--inline { min-width: unset; min-height: unset; } .kol-button--inline .kol-button__interactive-element { min-width: unset; min-height: unset; } }`;
|
|
24688
24683
|
|
|
24689
24684
|
class KolButtonLink extends BaseButtonWebComponent {
|
|
24690
24685
|
constructor(hostRef) {
|
|
24691
24686
|
super();
|
|
24692
|
-
|
|
24687
|
+
if (new.target === KolButtonLink)
|
|
24688
|
+
registerInstance(this, hostRef);
|
|
24693
24689
|
this.ariaDescriptionId = nonce();
|
|
24694
24690
|
this._accessKey = undefined;
|
|
24695
24691
|
this._ariaControls = undefined;
|
|
@@ -24805,7 +24801,7 @@ class KolButtonLink extends BaseButtonWebComponent {
|
|
|
24805
24801
|
this.destroyTooltipBehavior();
|
|
24806
24802
|
}
|
|
24807
24803
|
render() {
|
|
24808
|
-
return hAsync(Host, { key: '
|
|
24804
|
+
return hAsync(Host, { key: '30df0e7cb4eaf8c950f1ea6cd87719b954e8a311' }, this.renderButtonFC());
|
|
24809
24805
|
}
|
|
24810
24806
|
get host() { return getElement(this); }
|
|
24811
24807
|
static get watchers() { return {
|
|
@@ -25004,12 +25000,13 @@ class BaseCardWebComponent extends BaseWebComponent {
|
|
|
25004
25000
|
}
|
|
25005
25001
|
}
|
|
25006
25002
|
|
|
25007
|
-
const defaultStyleCss$G = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=
|
|
25003
|
+
const defaultStyleCss$G = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card :host { display: inline-block; } .kol-card .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-card .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-card .kol-button__interactive-element::before { content: ""; } .kol-card .kol-button__text { flex: 1 0 100%; } .kol-card .kol-button { } .kol-card .kol-button__tooltip { height: 0; } .kol-card .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-card .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-card { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); display: grid; height: 100%; overflow: visible; grid-template-areas: "header close" "content content"; grid-template-columns: 1fr min-content; grid-template-rows: min-content 1fr; } .kol-card__header { align-self: start; grid-area: header; } .kol-card__content { align-self: stretch; grid-area: content; } .kol-card__close-button { grid-area: close; } .kol-card:has(.kol-card__link) { position: relative; } .kol-card__link::after { position: absolute; inset: 0; content: ""; cursor: pointer; } }`;
|
|
25008
25004
|
|
|
25009
25005
|
class KolCard extends BaseCardWebComponent {
|
|
25010
25006
|
constructor(hostRef) {
|
|
25011
|
-
super();
|
|
25012
|
-
|
|
25007
|
+
super(...arguments);
|
|
25008
|
+
if (new.target === KolCard)
|
|
25009
|
+
registerInstance(this, hostRef);
|
|
25013
25010
|
this.ariaDescriptionId = nonce();
|
|
25014
25011
|
this.headingId = createUniqueId('card-heading');
|
|
25015
25012
|
this._hasCloser = false;
|
|
@@ -25061,7 +25058,7 @@ class KolCard extends BaseCardWebComponent {
|
|
|
25061
25058
|
return hAsync("slot", null);
|
|
25062
25059
|
}
|
|
25063
25060
|
render() {
|
|
25064
|
-
return hAsync(Host, { key: '
|
|
25061
|
+
return hAsync(Host, { key: '916261d714a813041360e0b82ffa1d3fc26d56e8' }, this.renderCardFC());
|
|
25065
25062
|
}
|
|
25066
25063
|
get host() { return getElement(this); }
|
|
25067
25064
|
static get watchers() { return {
|
|
@@ -25114,58 +25111,6 @@ __decorate([
|
|
|
25114
25111
|
delegateClick('ctaRef')
|
|
25115
25112
|
], KolCard.prototype, "click", null);
|
|
25116
25113
|
|
|
25117
|
-
const clickButtonPropsConfig = {
|
|
25118
|
-
required: [labelProp],
|
|
25119
|
-
};
|
|
25120
|
-
|
|
25121
|
-
const clickButtonBem = bem.forBlock('kol-click-button');
|
|
25122
|
-
const BEM_CLASS_CLICK_BUTTON = clickButtonBem();
|
|
25123
|
-
const BEM_CLASS_CLICK_BUTTON__LABEL = clickButtonBem('label');
|
|
25124
|
-
const ClickButtonFC = ({ label, handleClick, refButton }) => (hAsync("button", { class: BEM_CLASS_CLICK_BUTTON, ref: refButton, onClick: handleClick }, hAsync("span", { class: BEM_CLASS_CLICK_BUTTON__LABEL }, label)));
|
|
25125
|
-
|
|
25126
|
-
class KolClickButton extends BaseWebComponent {
|
|
25127
|
-
constructor(hostRef) {
|
|
25128
|
-
super();
|
|
25129
|
-
registerInstance(this, hostRef);
|
|
25130
|
-
this.buttonRef = createCtaRef();
|
|
25131
|
-
this.propsConfig = clickButtonPropsConfig;
|
|
25132
|
-
this.handleClick = () => {
|
|
25133
|
-
console.log(this, 'button clicked');
|
|
25134
|
-
};
|
|
25135
|
-
}
|
|
25136
|
-
watchLabel(value) {
|
|
25137
|
-
labelProp.apply(value, (v) => this.setRenderProp('label', v), this.isRequired('label'));
|
|
25138
|
-
}
|
|
25139
|
-
focus(options) {
|
|
25140
|
-
return Promise.resolve();
|
|
25141
|
-
}
|
|
25142
|
-
componentWillLoad() {
|
|
25143
|
-
labelProp.apply(this._label, (v) => this.setRenderProp('label', v), this.isRequired('label'));
|
|
25144
|
-
}
|
|
25145
|
-
render() {
|
|
25146
|
-
return (hAsync(Host, { key: '68662016b5d2179edaae6a9e66b3e72c5f2fd348' }, hAsync(ClickButtonFC, { key: '57077649088fd0de8425ab61f4923d317a15a7f5', label: this.getRenderProp('label'), refButton: this.buttonRef, handleClick: this.handleClick })));
|
|
25147
|
-
}
|
|
25148
|
-
static get watchers() { return {
|
|
25149
|
-
"_label": [{
|
|
25150
|
-
"watchLabel": 0
|
|
25151
|
-
}]
|
|
25152
|
-
}; }
|
|
25153
|
-
static get cmpMeta() { return {
|
|
25154
|
-
"$flags$": 521,
|
|
25155
|
-
"$tagName$": "kol-click-button",
|
|
25156
|
-
"$members$": {
|
|
25157
|
-
"_label": [1],
|
|
25158
|
-
"focus": [64]
|
|
25159
|
-
},
|
|
25160
|
-
"$listeners$": undefined,
|
|
25161
|
-
"$lazyBundleId$": "-",
|
|
25162
|
-
"$attrsToReflect$": []
|
|
25163
|
-
}; }
|
|
25164
|
-
}
|
|
25165
|
-
__decorate([
|
|
25166
|
-
delegateFocus('buttonRef')
|
|
25167
|
-
], KolClickButton.prototype, "focus", null);
|
|
25168
|
-
|
|
25169
25114
|
const createButtonItem$1 = (getFlagHost) => {
|
|
25170
25115
|
const tooltipBehavior = new TooltipBehavior(BaseWebComponent.stateLess);
|
|
25171
25116
|
const ctaRef = createCtaRef();
|
|
@@ -25349,7 +25294,7 @@ const FormFieldFC = (props, children) => {
|
|
|
25349
25294
|
|
|
25350
25295
|
const optionsGroupBem = getBlockBem('kol-custom-suggestions-options-group');
|
|
25351
25296
|
const optionBem = getBlockBem('kol-custom-suggestions-option');
|
|
25352
|
-
const CustomSuggestionsOptionsGroupFC = ({ blockSuggestionMouseOver, onKeyDown, style, hidden, id }, children) => (hAsync("ul", { id: id, role: "listbox", style: style, class: optionsGroupBem({ 'cursor-hidden': blockSuggestionMouseOver, open: !hidden }), hidden: hidden, onKeyDown: onKeyDown }, children));
|
|
25297
|
+
const CustomSuggestionsOptionsGroupFC = ({ 'aria-labelledby': ariaLabelledBy, blockSuggestionMouseOver, onKeyDown, style, hidden, id }, children) => (hAsync("ul", { "aria-labelledby": ariaLabelledBy, id: id, role: "listbox", style: style, class: optionsGroupBem({ 'cursor-hidden': blockSuggestionMouseOver, open: !hidden }), hidden: hidden, onKeyDown: onKeyDown }, children));
|
|
25353
25298
|
const highlightSearchTerm = (text, searchTerm) => {
|
|
25354
25299
|
if (!(searchTerm === null || searchTerm === void 0 ? void 0 : searchTerm.trim()))
|
|
25355
25300
|
return text;
|
|
@@ -26039,12 +25984,13 @@ const GROUP_CLASSES = {
|
|
|
26039
25984
|
};
|
|
26040
25985
|
const ListboxGroupFC = ({ block }, children) => hAsync("div", { class: GROUP_CLASSES[block] }, children);
|
|
26041
25986
|
|
|
26042
|
-
const defaultStyleCss$F = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-custom-suggestions-option { line-height: 1.5; white-space: normal; overflow-wrap: break-word; } .kol-custom-suggestions-option:not(.kol-custom-suggestions-option--disabled) { cursor: pointer; } .kol-custom-suggestions-options-group--cursor-hidden .kol-custom-suggestions-option { cursor: none !important; } .kol-custom-suggestions-option--disabled, .kol-custom-suggestions-option--disabled * { cursor: not-allowed; } .kol-custom-suggestions-options-group { background-color: white; display: block; position: absolute; z-index: 2; max-height: calc(250 * 1rem / var(--kolibri-root-font-size, 16)); margin: 0; padding: 0; overflow-x: hidden; overflow-y: auto; list-style-type: none; } .kol-input-container:has(.kol-custom-suggestions-options-group--open) { z-index: 10; } .kol-custom-suggestions-toggle { display: flex; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; justify-content: center; cursor: default; } .kol-custom-suggestions-toggle.kol-custom-suggestions-toggle--disabled { cursor: not-allowed; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-combobox { } .kol-combobox__group .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-combobox__group :host { display: inline-block; } .kol-combobox__group .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-combobox__group .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-combobox__group .kol-button__interactive-element::before { content: ""; } .kol-combobox__group .kol-button__text { flex: 1 0 100%; } .kol-combobox__group .kol-button { } .kol-combobox__group .kol-button__tooltip { height: 0; } .kol-combobox__group .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-combobox__group .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-combobox-toggle { min-height: 0; flex: 0; align-self: stretch; } .kol-combobox--open .kol-combobox-toggle { transform: rotate(180deg); } }`;
|
|
25987
|
+
const defaultStyleCss$F = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-custom-suggestions-option { line-height: 1.5; white-space: normal; overflow-wrap: break-word; } .kol-custom-suggestions-option:not(.kol-custom-suggestions-option--disabled) { cursor: pointer; } .kol-custom-suggestions-options-group--cursor-hidden .kol-custom-suggestions-option { cursor: none !important; } .kol-custom-suggestions-option--disabled, .kol-custom-suggestions-option--disabled * { cursor: not-allowed; } .kol-custom-suggestions-options-group { background-color: white; display: block; position: absolute; z-index: 2; max-height: calc(250 * 1rem / var(--kolibri-root-font-size, 16)); margin: 0; padding: 0; overflow-x: hidden; overflow-y: auto; list-style-type: none; } .kol-input-container:has(.kol-custom-suggestions-options-group--open) { z-index: 10; } .kol-custom-suggestions-toggle { display: flex; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; justify-content: center; cursor: default; } .kol-custom-suggestions-toggle.kol-custom-suggestions-toggle--disabled { cursor: not-allowed; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-combobox { } .kol-combobox__group .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-combobox__group :host { display: inline-block; } .kol-combobox__group .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-combobox__group .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-combobox__group .kol-button__interactive-element::before { content: ""; } .kol-combobox__group .kol-button__text { flex: 1 0 100%; } .kol-combobox__group .kol-button { } .kol-combobox__group .kol-button__tooltip { height: 0; } .kol-combobox__group .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-combobox__group .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-combobox-toggle { min-height: 0; flex: 0; align-self: stretch; } .kol-combobox--open .kol-combobox-toggle { transform: rotate(180deg); } }`;
|
|
26043
25988
|
|
|
26044
25989
|
class KolCombobox extends BaseListboxWebComponent {
|
|
26045
25990
|
constructor(hostRef) {
|
|
26046
25991
|
super();
|
|
26047
|
-
|
|
25992
|
+
if (new.target === KolCombobox)
|
|
25993
|
+
registerInstance(this, hostRef);
|
|
26048
25994
|
this.id = createUniqueId('combobox');
|
|
26049
25995
|
this.infoPopoverOpen = false;
|
|
26050
25996
|
this.inputHasFocus = false;
|
|
@@ -26380,7 +26326,7 @@ class KolCombobox extends BaseListboxWebComponent {
|
|
|
26380
26326
|
return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ id,
|
|
26381
26327
|
hideLabel,
|
|
26382
26328
|
label,
|
|
26383
|
-
disabled, name: this.getRenderProp('name') || undefined }, (accessKey ? { accessKey } : {})), { value: this.getRenderProp('value'), required: this.getRenderProp('required') }), (placeholder ? { placeholder } : {})), { touched: this.getRenderProp('touched'), msg: this.getRenderProp('msg') }), (shortKey ? { 'aria-keyshortcuts': shortKey } : {})), { ref: this.ctaRef, class: 'kol-combobox__input', type: 'text', role: 'combobox', 'aria-activedescendant': this.getActiveDescendant(), 'aria-autocomplete': '
|
|
26329
|
+
disabled, name: this.getRenderProp('name') || undefined }, (accessKey ? { accessKey } : {})), { value: this.getRenderProp('value'), required: this.getRenderProp('required') }), (placeholder ? { placeholder } : {})), { touched: this.getRenderProp('touched'), msg: this.getRenderProp('msg') }), (shortKey ? { 'aria-keyshortcuts': shortKey } : {})), { ref: this.ctaRef, class: 'kol-combobox__input', type: 'text', role: 'combobox', 'aria-activedescendant': this.getActiveDescendant(), 'aria-autocomplete': 'list', 'aria-controls': createRelatedUniqueId(id, 'listbox'), 'aria-describedby': ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, 'aria-expanded': this.isOpen ? 'true' : 'false', 'aria-label': hideLabel && typeof label === 'string' ? label : undefined, 'aria-labelledby': createRelatedUniqueId(id, 'label'), autocapitalize: 'off', autocorrect: 'off', autocomplete: 'off', onBlur: this.handleInputBlur, onChange: this.handleComboboxChange, onClick: this.handleClick, onFocus: this.handleFocus, onInput: this.handleComboboxInput, onKeyDown: this.handleKeyDown, ariaDescribedBy, 'aria-invalid': hasError ? 'true' : undefined });
|
|
26384
26330
|
}
|
|
26385
26331
|
renderOptions() {
|
|
26386
26332
|
const value = this.getRenderProp('value');
|
|
@@ -26412,13 +26358,13 @@ class KolCombobox extends BaseListboxWebComponent {
|
|
|
26412
26358
|
render() {
|
|
26413
26359
|
const isDisabled = this.getRenderProp('disabled') === true;
|
|
26414
26360
|
const { startAdornment, endAdornment } = getInputAdornments({ icons: this.getRenderProp('icons') });
|
|
26415
|
-
return (hAsync(Host, { key: '
|
|
26361
|
+
return (hAsync(Host, { key: '0c05822b15984bdc3532b9a79fb5c059de9bff57' }, hAsync(FormFieldFC, Object.assign({ key: '145a6885cf2091df4928d7b814a7a323913ab8a2' }, this.getFormFieldProps({
|
|
26416
26362
|
class: clsx('kol-combobox', { 'has-value': this.hasValue, 'kol-combobox--open': this.isOpen }),
|
|
26417
26363
|
accessKey: this.getRenderProp('accessKey') || undefined,
|
|
26418
26364
|
shortKey: this.getRenderProp('shortKey') || undefined,
|
|
26419
26365
|
required: this.getRenderProp('required'),
|
|
26420
26366
|
variant: this.getRenderProp('variant'),
|
|
26421
|
-
})), hAsync(InputContainerFC, { key: '
|
|
26367
|
+
})), hAsync(InputContainerFC, { key: '4f401e2b893d91ddbb1b0a46405445182c1c77ce', disabled: isDisabled, msg: this.getRenderProp('msg'), touched: this.getRenderProp('touched'), startAdornment: startAdornment, endAdornment: endAdornment }, hAsync(ListboxGroupFC, { key: '8f6c478ef7575f0048b29a0c3c0b2d7d6f0bc955', block: "kol-combobox" }, hAsync(InputFC, Object.assign({ key: 'fd611d1eac02a9506f3ae771722fabae0fdd3d80' }, this.getInputProps())), this.getRenderProp('value') && this.getRenderProp('hasClearButton') && (hAsync(ButtonFC, Object.assign({ key: '4f2a719306f763c44fa0db9a41eea881a8ef6c7a' }, this.clearButton.getFcProps({
|
|
26422
26368
|
_icons: 'kolicon-cross',
|
|
26423
26369
|
_label: this.translateDeleteSelection,
|
|
26424
26370
|
_hideLabel: true,
|
|
@@ -26434,7 +26380,7 @@ class KolCombobox extends BaseListboxWebComponent {
|
|
|
26434
26380
|
hidden: isDisabled,
|
|
26435
26381
|
onBlur: this.stopClearButtonFocusEvent,
|
|
26436
26382
|
onFocus: this.stopClearButtonFocusEvent,
|
|
26437
|
-
})))), hAsync(ComboboxToggleFC, { key: '
|
|
26383
|
+
})))), hAsync(ComboboxToggleFC, { key: '606aa1a136ee653ccdc5d08f0bc7c63345956f7c', disabled: isDisabled, expanded: this.isOpen, handleClick: this.toggleListbox, label: this.translateShowSuggestions, listboxId: createRelatedUniqueId(this.id, 'listbox') })), hAsync(CustomSuggestionsOptionsGroupFC, { key: 'fdd860c7e3fe2f58931054edb1d6399c18ff7a39', blockSuggestionMouseOver: this.blockSuggestionMouseOver, onKeyDown: this.handleDropdownKeyDown, hidden: !this.isOpen || isDisabled, id: createRelatedUniqueId(this.id, 'listbox'), "aria-labelledby": createRelatedUniqueId(this.id, 'label') }, this.renderOptions())))));
|
|
26438
26384
|
}
|
|
26439
26385
|
get host() { return getElement(this); }
|
|
26440
26386
|
static get watchers() { return {
|
|
@@ -26556,12 +26502,13 @@ __decorate([
|
|
|
26556
26502
|
delegateClick('ctaRef')
|
|
26557
26503
|
], KolCombobox.prototype, "click", null);
|
|
26558
26504
|
|
|
26559
|
-
const defaultStyleCss$E = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=
|
|
26505
|
+
const defaultStyleCss$E = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { :host { display: inline-block; } .kol-details { } .kol-details__heading { display: flex; min-height: var(--a11y-min-size); } .kol-details__heading:not([aria-disabled=true]) { cursor: pointer; } .kol-details__heading { } .kol-details__heading::before { content: ""; } .kol-details__heading { } .kol-details__heading > .kol-headline { display: flex; flex: 1; margin: 0; text-align: left; font-weight: 400; } .kol-details__heading > .kol-headline > .kol-span { flex: 1 0 100%; align-items: flex-start; } @media (prefers-reduced-motion) { .kol-details__wrapper-animation, .kol-details__wrapper { transition: none !important; } } .kol-details { } @media print { .kol-details:not(.kol-details--open) .kol-details__wrapper-animation { display: none; } } .kol-details__wrapper { transform: translateZ(0); display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: 0fr; transition: grid-template-rows var(--collapsible-transition-duration, 0.3s); } .kol-details__wrapper-animation { opacity: 0; transform: scaleY(0); transform-origin: top; min-height: 0; visibility: hidden; transition: transform var(--collapsible-transition-duration, 0.3s), opacity var(--collapsible-transition-duration, 0.3s), visibility var(--collapsible-transition-duration, 0.3s); } .kol-details--open .kol-details__wrapper { grid-template-rows: 1fr; } .kol-details--open .kol-details__wrapper-animation { opacity: 1; transform: scaleY(1); visibility: visible; } .kol-details--open:focus-within { position: relative; z-index: 100; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-details--open .kol-details__heading .kol-icon { transform: rotate(90deg); } }`;
|
|
26560
26506
|
|
|
26561
26507
|
class KolDetails extends BaseWebComponent {
|
|
26562
26508
|
constructor(hostRef) {
|
|
26563
|
-
super();
|
|
26564
|
-
|
|
26509
|
+
super(...arguments);
|
|
26510
|
+
if (new.target === KolDetails)
|
|
26511
|
+
registerInstance(this, hostRef);
|
|
26565
26512
|
this.detailsId = createUniqueId('details');
|
|
26566
26513
|
this.controlId = createRelatedUniqueId(this.detailsId, 'control');
|
|
26567
26514
|
this.detailsOpen = false;
|
|
@@ -26628,7 +26575,7 @@ class KolDetails extends BaseWebComponent {
|
|
|
26628
26575
|
this.openAnimation.dispose();
|
|
26629
26576
|
}
|
|
26630
26577
|
render() {
|
|
26631
|
-
return (hAsync(Host, { key: '
|
|
26578
|
+
return (hAsync(Host, { key: 'b5a35968058d7262f0d4fc0f1d13b49e02f4033e' }, hAsync(CollapsibleFC, { key: 'f82fdcb5684df1d8d2182fd142c41941a53350c3', block: "kol-details", contentClass: "indented-text", controlId: this.controlId, detailsOpen: this.detailsOpen, disabled: this.getRenderProp('disabled'), expanded: this.expanded, handleToggle: this.handleToggle, headingId: this.headingId, icons: "kolicon-chevron-right", label: this.getRenderProp('label'), level: this.getRenderProp('level'), on: this.getRenderProp('on'), open: this.getRenderProp('open'), refHeadingButton: this.ctaRef, transitionMs: this.transitionMs }, hAsync("slot", { key: '33775c434926dcb6dfa6471c80f39ffe5aabc29c' }))));
|
|
26632
26579
|
}
|
|
26633
26580
|
get host() { return getElement(this); }
|
|
26634
26581
|
static get watchers() { return {
|
|
@@ -26859,12 +26806,13 @@ class BaseDialogWebComponent extends BaseWebComponent {
|
|
|
26859
26806
|
}
|
|
26860
26807
|
}
|
|
26861
26808
|
|
|
26862
|
-
const defaultStyleCss$D = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card :host { display: inline-block; } .kol-card .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-card .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-card .kol-button__interactive-element::before { content: ""; } .kol-card .kol-button__text { flex: 1 0 100%; } .kol-card .kol-button { } .kol-card .kol-button__tooltip { height: 0; } .kol-card .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-card .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-card { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); display: grid; height: 100%; overflow: visible; grid-template-areas: "header close" "content content"; grid-template-columns: 1fr min-content; grid-template-rows: min-content 1fr; } .kol-card__header { align-self: start; grid-area: header; } .kol-card__content { align-self: stretch; grid-area: content; } .kol-card__close-button { grid-area: close; } .kol-card:has(.kol-card__link) { position: relative; } .kol-card__link::after { position: absolute; inset: 0; content: ""; cursor: pointer; } .kol-dialog, .kol-modal { min-height: var(--a11y-min-size); padding: 0; border: 0; overscroll-behavior: contain; } .kol-dialog__close-button, .kol-modal__close-button { position: absolute; top: calc(1 * 1rem / var(--kolibri-root-font-size, 16)); right: calc(1 * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; } }`;
|
|
26809
|
+
const defaultStyleCss$D = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card :host { display: inline-block; } .kol-card .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-card .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-card .kol-button__interactive-element::before { content: ""; } .kol-card .kol-button__text { flex: 1 0 100%; } .kol-card .kol-button { } .kol-card .kol-button__tooltip { height: 0; } .kol-card .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-card .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-card { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); display: grid; height: 100%; overflow: visible; grid-template-areas: "header close" "content content"; grid-template-columns: 1fr min-content; grid-template-rows: min-content 1fr; } .kol-card__header { align-self: start; grid-area: header; } .kol-card__content { align-self: stretch; grid-area: content; } .kol-card__close-button { grid-area: close; } .kol-card:has(.kol-card__link) { position: relative; } .kol-card__link::after { position: absolute; inset: 0; content: ""; cursor: pointer; } .kol-dialog, .kol-modal { min-height: var(--a11y-min-size); padding: 0; border: 0; overscroll-behavior: contain; } .kol-dialog__close-button, .kol-modal__close-button { position: absolute; top: calc(1 * 1rem / var(--kolibri-root-font-size, 16)); right: calc(1 * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; } }`;
|
|
26863
26810
|
|
|
26864
26811
|
class KolDialog extends BaseDialogWebComponent {
|
|
26865
26812
|
constructor(hostRef) {
|
|
26866
|
-
super();
|
|
26867
|
-
|
|
26813
|
+
super(...arguments);
|
|
26814
|
+
if (new.target === KolDialog)
|
|
26815
|
+
registerInstance(this, hostRef);
|
|
26868
26816
|
this.ariaDescriptionId = nonce();
|
|
26869
26817
|
this.headingId = createUniqueId('dialog-heading');
|
|
26870
26818
|
this.modal = true;
|
|
@@ -26924,7 +26872,7 @@ class KolDialog extends BaseDialogWebComponent {
|
|
|
26924
26872
|
return hAsync("slot", null);
|
|
26925
26873
|
}
|
|
26926
26874
|
render() {
|
|
26927
|
-
return hAsync(Host, { key: '
|
|
26875
|
+
return hAsync(Host, { key: '77a90db335d0d9d277fc8acd3fde91e3ac0a7309' }, this.renderDialogFC());
|
|
26928
26876
|
}
|
|
26929
26877
|
get host() { return getElement(this); }
|
|
26930
26878
|
static get watchers() { return {
|
|
@@ -26984,12 +26932,13 @@ const DrawerFC = (props, children) => {
|
|
|
26984
26932
|
return (hAsync(BemRootNodeFC, { block: "kol-drawer" }, hAsync(DialogFC, { blockClass: BEM_CLASS_DRAWER__DIALOG, handleCancel: handleCancel, handleClose: handleClose, label: label, labelledBy: headingId, modal: modal, refDialog: refDialog }, hAsync("div", { class: drawerBem('wrapper', { [align]: true, 'is-closing': !expanded, open: expanded }), onAnimationEnd: handleAnimationEnd, ref: refWrapper }, hAsync(CardFC, Object.assign({}, cardProps), hAsync("div", { class: BEM_CLASS_DRAWER__CONTENT }, children))))));
|
|
26985
26933
|
};
|
|
26986
26934
|
|
|
26987
|
-
const defaultStyleCss$C = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card :host { display: inline-block; } .kol-card .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-card .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-card .kol-button__interactive-element::before { content: ""; } .kol-card .kol-button__text { flex: 1 0 100%; } .kol-card .kol-button { } .kol-card .kol-button__tooltip { height: 0; } .kol-card .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-card .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-card { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); display: grid; height: 100%; overflow: visible; grid-template-areas: "header close" "content content"; grid-template-columns: 1fr min-content; grid-template-rows: min-content 1fr; } .kol-card__header { align-self: start; grid-area: header; } .kol-card__content { align-self: stretch; grid-area: content; } .kol-card__close-button { grid-area: close; } .kol-card:has(.kol-card__link) { position: relative; } .kol-card__link::after { position: absolute; inset: 0; content: ""; cursor: pointer; } .kol-drawer__dialog { padding: 0; border: none; overscroll-behavior: contain; } .kol-drawer__wrapper { position: fixed; overflow: auto; overscroll-behavior: contain; } .kol-drawer__wrapper--left, .kol-drawer__wrapper--right { top: 0; max-width: 100vw; height: 100vh; } .kol-drawer__wrapper--left .kol-drawer__content, .kol-drawer__wrapper--right .kol-drawer__content { height: 100%; } .kol-drawer__wrapper--left { left: 0; } .kol-drawer__wrapper--right { right: 0; } .kol-drawer__wrapper--bottom, .kol-drawer__wrapper--top { left: 0; width: 100vw; max-height: 100vh; } .kol-drawer__wrapper--bottom .kol-drawer__content, .kol-drawer__wrapper--top .kol-drawer__content { width: 100%; } .kol-drawer__wrapper--bottom { bottom: 0; } .kol-drawer__wrapper--top { top: 0; } .kol-drawer__content { position: relative; } .kol-drawer__dialog .kol-card__content { overflow-y: auto; overscroll-behavior: contain; } }`;
|
|
26935
|
+
const defaultStyleCss$C = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card :host { display: inline-block; } .kol-card .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-card .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-card .kol-button__interactive-element::before { content: ""; } .kol-card .kol-button__text { flex: 1 0 100%; } .kol-card .kol-button { } .kol-card .kol-button__tooltip { height: 0; } .kol-card .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-card .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-card { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); display: grid; height: 100%; overflow: visible; grid-template-areas: "header close" "content content"; grid-template-columns: 1fr min-content; grid-template-rows: min-content 1fr; } .kol-card__header { align-self: start; grid-area: header; } .kol-card__content { align-self: stretch; grid-area: content; } .kol-card__close-button { grid-area: close; } .kol-card:has(.kol-card__link) { position: relative; } .kol-card__link::after { position: absolute; inset: 0; content: ""; cursor: pointer; } .kol-drawer__dialog { padding: 0; border: none; overscroll-behavior: contain; } .kol-drawer__wrapper { position: fixed; overflow: auto; overscroll-behavior: contain; } .kol-drawer__wrapper--left, .kol-drawer__wrapper--right { top: 0; max-width: 100vw; height: 100vh; } .kol-drawer__wrapper--left .kol-drawer__content, .kol-drawer__wrapper--right .kol-drawer__content { height: 100%; } .kol-drawer__wrapper--left { left: 0; } .kol-drawer__wrapper--right { right: 0; } .kol-drawer__wrapper--bottom, .kol-drawer__wrapper--top { left: 0; width: 100vw; max-height: 100vh; } .kol-drawer__wrapper--bottom .kol-drawer__content, .kol-drawer__wrapper--top .kol-drawer__content { width: 100%; } .kol-drawer__wrapper--bottom { bottom: 0; } .kol-drawer__wrapper--top { top: 0; } .kol-drawer__content { position: relative; } .kol-drawer__dialog .kol-card__content { overflow-y: auto; overscroll-behavior: contain; } }`;
|
|
26988
26936
|
|
|
26989
26937
|
class KolDrawer extends BaseWebComponent {
|
|
26990
26938
|
constructor(hostRef) {
|
|
26991
|
-
super();
|
|
26992
|
-
|
|
26939
|
+
super(...arguments);
|
|
26940
|
+
if (new.target === KolDrawer)
|
|
26941
|
+
registerInstance(this, hostRef);
|
|
26993
26942
|
this.ariaDescriptionId = nonce();
|
|
26994
26943
|
this.expanded = false;
|
|
26995
26944
|
this.headingId = createUniqueId('drawer-heading');
|
|
@@ -27159,7 +27108,7 @@ class KolDrawer extends BaseWebComponent {
|
|
|
27159
27108
|
};
|
|
27160
27109
|
}
|
|
27161
27110
|
render() {
|
|
27162
|
-
return (hAsync(Host, { key: '
|
|
27111
|
+
return (hAsync(Host, { key: 'ad4de4ff863ff47eabe84d49a1cec176e5bcbcc4' }, hAsync(DrawerFC, { key: '5efc03976a9adcc7a0fac3477ffe3065496b3eb0', align: this.getRenderProp('align'), ariaDescriptionId: this.getState('ariaDescriptionId'), cardProps: this.buildCardProps(), expanded: this.getState('expanded'), handleAnimationEnd: this.handleAnimationEnd, handleCancel: this.handleCancel, handleClose: this.handleClose, hasCloser: this.getRenderProp('hasCloser'), headingId: this.getState('headingId'), label: this.getRenderProp('label'), level: this.getRenderProp('level'), modal: this.getState('modal'), on: this.getRenderProp('on'), refDialog: this.dialogRef, refWrapper: this.wrapperRef }, hAsync("slot", { key: 'de3f2fb2326f7b3e707c4ad46e3d01b326ab2c27' }))));
|
|
27163
27112
|
}
|
|
27164
27113
|
get host() { return getElement(this); }
|
|
27165
27114
|
static get watchers() { return {
|
|
@@ -27257,7 +27206,7 @@ const createFormErrorLinkItem = (error, handleSelector) => {
|
|
|
27257
27206
|
};
|
|
27258
27207
|
};
|
|
27259
27208
|
|
|
27260
|
-
const defaultStyleCss$B = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-link { display: inline-flex; max-width: fit-content; } .kol-link--standalone { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: stretch; } .kol-link--standalone .kol-link__interactive-element { align-items: stretch; } .kol-link--standalone .kol-link__text { display: inline-flex; flex: 1 1 100%; place-items: center; } .kol-link__interactive-element { display: inline-flex; flex: 1; align-items: baseline; place-items: center; text-align: left; text-decoration-line: none; } .kol-link__interactive-element:focus:not([aria-disabled], [disabled]) .kol-span__label, .kol-link__interactive-element:hover:not([aria-disabled], [disabled]) .kol-span__label { text-decoration-thickness: 0.2em; } .kol-link .kol-span__label { text-decoration-line: underline; } .kol-link__icon { display: inline-flex; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } }`;
|
|
27209
|
+
const defaultStyleCss$B = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-link { display: inline-flex; max-width: fit-content; } .kol-link--standalone { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: stretch; } .kol-link--standalone .kol-link__interactive-element { align-items: stretch; } .kol-link--standalone .kol-link__text { display: inline-flex; flex: 1 1 100%; place-items: center; } .kol-link__interactive-element { display: inline-flex; flex: 1; align-items: baseline; place-items: center; text-align: left; text-decoration-line: none; } .kol-link__interactive-element:focus:not([aria-disabled], [disabled]) .kol-span__label, .kol-link__interactive-element:hover:not([aria-disabled], [disabled]) .kol-span__label { text-decoration-thickness: 0.2em; } .kol-link .kol-span__label { text-decoration-line: underline; } .kol-link__icon { display: inline-flex; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } }`;
|
|
27261
27210
|
|
|
27262
27211
|
const SCROLL_OPTIONS_FALLBACK = {
|
|
27263
27212
|
behavior: 'smooth',
|
|
@@ -27266,8 +27215,9 @@ const SCROLL_OPTIONS_FALLBACK = {
|
|
|
27266
27215
|
const FOCUS_ERROR_LIST_DELAY = 250;
|
|
27267
27216
|
class KolForm extends BaseWebComponent {
|
|
27268
27217
|
constructor(hostRef) {
|
|
27269
|
-
super();
|
|
27270
|
-
|
|
27218
|
+
super(...arguments);
|
|
27219
|
+
if (new.target === KolForm)
|
|
27220
|
+
registerInstance(this, hostRef);
|
|
27271
27221
|
this.errorLinkItems = [];
|
|
27272
27222
|
this.alertHeadingId = createUniqueId('alert-heading');
|
|
27273
27223
|
this.closerAriaDescriptionId = nonce();
|
|
@@ -27327,7 +27277,7 @@ class KolForm extends BaseWebComponent {
|
|
|
27327
27277
|
this.watchRequiredText(this._requiredText);
|
|
27328
27278
|
}
|
|
27329
27279
|
render() {
|
|
27330
|
-
return (hAsync(Host, { key: '
|
|
27280
|
+
return (hAsync(Host, { key: '2284d41789f347a59938107849bd2e8210b4cd09' }, hAsync(FormFC, { key: '1f534946f50caf5d70d43b48dae7deec2105b714', alertHeadingId: this.alertHeadingId, closerAriaDescriptionId: this.closerAriaDescriptionId, errorList: this.getRenderProp('errorList'), errorLinkItems: this.errorLinkItems, handleReset: this.handleReset, handleSubmit: this.handleSubmit, on: this.getRenderProp('on'), requiredText: this.getRenderProp('requiredText') })));
|
|
27331
27281
|
}
|
|
27332
27282
|
get host() { return getElement(this); }
|
|
27333
27283
|
static get watchers() { return {
|
|
@@ -27383,8 +27333,9 @@ const defaultStyleCss$A = () => `@charset "UTF-8"; @layer kol-a11y, kol-global,
|
|
|
27383
27333
|
|
|
27384
27334
|
class KolHeading extends BaseWebComponent {
|
|
27385
27335
|
constructor(hostRef) {
|
|
27386
|
-
super();
|
|
27387
|
-
|
|
27336
|
+
super(...arguments);
|
|
27337
|
+
if (new.target === KolHeading)
|
|
27338
|
+
registerInstance(this, hostRef);
|
|
27388
27339
|
this.propsConfig = headingPropsConfig;
|
|
27389
27340
|
this._level = 0;
|
|
27390
27341
|
this._secondaryHeadline = undefined;
|
|
@@ -27404,7 +27355,7 @@ class KolHeading extends BaseWebComponent {
|
|
|
27404
27355
|
secondaryHeadlineProp.apply(this._secondaryHeadline, (v) => this.setRenderProp('secondaryHeadline', v));
|
|
27405
27356
|
}
|
|
27406
27357
|
render() {
|
|
27407
|
-
return (hAsync(Host, { key: '
|
|
27358
|
+
return (hAsync(Host, { key: '63a24d9208c82a7f3b7cbbe9c2fd475ae2a8a37c' }, hAsync(HeadingFC, { key: '26af307dd787477b1842dfcdab9302c8506ce7bb', label: this.getRenderProp('label'), level: this.getRenderProp('level'), secondaryHeadline: this.getRenderProp('secondaryHeadline') })));
|
|
27408
27359
|
}
|
|
27409
27360
|
static get watchers() { return {
|
|
27410
27361
|
"_label": [{
|
|
@@ -27435,29 +27386,30 @@ class KolHeading extends BaseWebComponent {
|
|
|
27435
27386
|
}
|
|
27436
27387
|
|
|
27437
27388
|
const iconPropsConfig = {
|
|
27438
|
-
required: [iconsProp,
|
|
27389
|
+
required: [iconsProp, labelDecorativeProp],
|
|
27439
27390
|
};
|
|
27440
27391
|
|
|
27441
|
-
const defaultStyleCss$z = () => `@font-face{font-family:"kolicons";src:url("kolicons.eot?t=
|
|
27392
|
+
const defaultStyleCss$z = () => `@font-face{font-family:"kolicons";src:url("kolicons.eot?t=1794582088003");src:url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg");}@layer kol-component{[class^=kolicon-],[class*=" kolicon-"]{font-family:"kolicons";font-style:normal;font-weight:400;line-height:1em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.kolicon-alert-error::before{content:"\\ea01"}.kolicon-alert-info::before{content:"\\ea02"}.kolicon-alert-success::before{content:"\\ea03"}.kolicon-alert-warning::before{content:"\\ea04"}.kolicon-check::before{content:"\\ea05"}.kolicon-chevron-double-left::before{content:"\\ea06"}.kolicon-chevron-double-right::before{content:"\\ea07"}.kolicon-chevron-down::before{content:"\\ea08"}.kolicon-chevron-left::before{content:"\\ea09"}.kolicon-chevron-right::before{content:"\\ea0a"}.kolicon-chevron-up::before{content:"\\ea0b"}.kolicon-cogwheel::before{content:"\\ea0c"}.kolicon-cross::before{content:"\\ea0d"}.kolicon-eye-closed::before{content:"\\ea0e"}.kolicon-eye::before{content:"\\ea0f"}.kolicon-house::before{content:"\\ea10"}.kolicon-kolibri::before{content:"\\ea11"}.kolicon-link-external::before{content:"\\ea12"}.kolicon-link::before{content:"\\ea13"}.kolicon-minus::before{content:"\\ea14"}.kolicon-pin-pinned::before{content:"\\ea15"}.kolicon-pin-unpinned::before{content:"\\ea16"}.kolicon-plus::before{content:"\\ea17"}.kolicon-settings::before{content:"\\ea18"}.kolicon-sort-asc::before{content:"\\ea19"}.kolicon-sort-desc::before{content:"\\ea1a"}.kolicon-sort-neutral::before{content:"\\ea1b"}.kolicon-up::before{content:"\\ea1c"}.kolicon-version::before{content:"\\ea1d"}}@layer kol-component{.kol-icon{color:inherit;display:inline-block;font-size:inherit;font-weight:inherit;line-height:inherit}}`;
|
|
27442
27393
|
|
|
27443
27394
|
class KolIcon extends BaseWebComponent {
|
|
27444
27395
|
constructor(hostRef) {
|
|
27445
|
-
super();
|
|
27446
|
-
|
|
27396
|
+
super(...arguments);
|
|
27397
|
+
if (new.target === KolIcon)
|
|
27398
|
+
registerInstance(this, hostRef);
|
|
27447
27399
|
this.propsConfig = iconPropsConfig;
|
|
27448
27400
|
}
|
|
27449
27401
|
watchIcons(value) {
|
|
27450
27402
|
iconsProp.apply(value, (v) => this.setRenderProp('icons', v));
|
|
27451
27403
|
}
|
|
27452
27404
|
watchLabel(value) {
|
|
27453
|
-
|
|
27405
|
+
labelDecorativeProp.apply(value, (v) => this.setRenderProp('label', v), this.isRequired('label'));
|
|
27454
27406
|
}
|
|
27455
27407
|
componentWillLoad() {
|
|
27456
27408
|
iconsProp.apply(this._icons, (v) => this.setRenderProp('icons', v));
|
|
27457
|
-
|
|
27409
|
+
labelDecorativeProp.apply(this._label, (v) => this.setRenderProp('label', v), this.isRequired('label'));
|
|
27458
27410
|
}
|
|
27459
27411
|
render() {
|
|
27460
|
-
return (hAsync(Host, { key: '
|
|
27412
|
+
return (hAsync(Host, { key: 'a53255b542b20f7d10c3fc81c430f8e49885991b' }, hAsync(IconFC, { key: 'c5863392f1de5f8c37f8a90458e641141a525528', icons: this.getRenderProp('icons'), label: this.getRenderProp('label') })));
|
|
27461
27413
|
}
|
|
27462
27414
|
static get watchers() { return {
|
|
27463
27415
|
"_icons": [{
|
|
@@ -27499,8 +27451,9 @@ const defaultStyleCss$y = () => `@charset "UTF-8"; @layer kol-a11y, kol-global,
|
|
|
27499
27451
|
|
|
27500
27452
|
class KolImage extends BaseWebComponent {
|
|
27501
27453
|
constructor(hostRef) {
|
|
27502
|
-
super();
|
|
27503
|
-
|
|
27454
|
+
super(...arguments);
|
|
27455
|
+
if (new.target === KolImage)
|
|
27456
|
+
registerInstance(this, hostRef);
|
|
27504
27457
|
this.propsConfig = imagePropsConfig;
|
|
27505
27458
|
this._loading = undefined;
|
|
27506
27459
|
this._sizes = undefined;
|
|
@@ -27548,7 +27501,7 @@ class KolImage extends BaseWebComponent {
|
|
|
27548
27501
|
srcsetProp.apply(this._srcset, (v) => this.setRenderProp('srcset', v));
|
|
27549
27502
|
}
|
|
27550
27503
|
render() {
|
|
27551
|
-
return (hAsync(Host, { key: '
|
|
27504
|
+
return (hAsync(Host, { key: 'ac348dc672f7785f384470b77120889410349503' }, hAsync(ImageFC, { key: '0812cc9b1a6770e3462f9d6f7bc33237ccf4dac3', alt: this.getRenderProp('alt'), loading: this.getRenderProp('loading'), sizes: this.getRenderProp('sizes'), src: this.getRenderProp('src'), srcset: this.getRenderProp('srcset'), handleError: this.handleError, handleLoad: this.handleLoad })));
|
|
27552
27505
|
}
|
|
27553
27506
|
get host() { return getElement(this); }
|
|
27554
27507
|
static get watchers() { return {
|
|
@@ -27628,12 +27581,13 @@ const inputCheckboxPropsConfig = {
|
|
|
27628
27581
|
],
|
|
27629
27582
|
};
|
|
27630
27583
|
|
|
27631
|
-
const defaultStyleCss$x = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-field-control { display: grid; min-height: var(--a11y-min-size); align-items: center; justify-content: left; grid-template-areas: "input label"; grid-template-columns: auto 1fr; grid-template-rows: auto; } .kol-field-control:has(.kol-field-control__hint) { grid-template-areas: "input label" "hint hint"; grid-template-columns: auto 1fr; grid-template-rows: auto auto; } .kol-field-control--label-align-left:not(.kol-field-control--hide-label) { grid-template-areas: "label input"; grid-template-columns: 1fr auto; grid-template-rows: auto; } .kol-field-control--label-align-left:not(.kol-field-control--hide-label):has(.kol-field-control__hint) { grid-template-areas: "label input" "hint hint"; grid-template-columns: 1fr auto; grid-template-rows: auto auto; } .kol-field-control__input { display: flex; min-height: var(--a11y-min-size); align-items: center; grid-area: input; } .kol-field-control__label { display: flex; min-height: var(--a11y-min-size); flex-grow: 1; align-items: center; cursor: pointer; grid-area: label; } .kol-field-control__label--visually-hidden { display: none; height: 0; margin: 0; padding: 0; visibility: hidden; } .kol-field-control__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-field-control__hint { grid-area: hint; } .kol-field-control--disabled .kol-field-control__label { cursor: not-allowed; } .kol-field-control--required .kol-field-control__label-text:has(.kol-span__slot[hidden])::after, .kol-field-control--required .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-form-field { display: grid; } .kol-form-field__label-text { display: ruby; } .kol-checkbox { display: flex; position: relative; align-items: center; cursor: pointer; } .kol-checkbox--disabled { cursor: not-allowed; } .kol-checkbox .kol-input { background-color: white; border-style: solid; margin: 0; border-width: 2px; appearance: none; cursor: inherit; } .kol-checkbox .kol-input:before { content: ""; } .kol-checkbox--variant-default { position: relative; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); justify-content: center; } .kol-checkbox--variant-default .kol-icon { display: none; position: absolute; inset: auto; z-index: 1; pointer-events: none; } .kol-checkbox--variant-default .kol-input { width: calc(22 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(22 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-checkbox--variant-default.kol-checkbox--checked .kol-icon, .kol-checkbox--variant-default.kol-checkbox--indeterminate .kol-icon { display: block; } .kol-checkbox--variant-switch { position: relative; } .kol-checkbox--variant-switch .kol-input { display: inline-block; position: relative; width: 3.2em; min-width: 3.2em; height: 1.7em; } .kol-checkbox--variant-switch .kol-input::before { background-color: black; position: absolute; top: calc(0.25em - 2 * 1rem / var(--kolibri-root-font-size, 16)); left: calc(0.25em - 2 * 1rem / var(--kolibri-root-font-size, 16)); width: 1.2em; height: 1.2em; transition: 0.5s; } .kol-checkbox--variant-switch .kol-input:checked::before { transform: translateX(1.5em); } .kol-checkbox--variant-switch .kol-input:indeterminate::before { transform: translateX(0.75em); } .kol-checkbox--variant-switch .kol-icon { transform: translate(0, -50%); color: black; display: flex; position: absolute; top: 50%; left: calc(4 * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; width: 1.2em; height: 1.2em; align-items: center; justify-content: center; transition: 0.5s; } .kol-checkbox--variant-switch.kol-checkbox--checked .kol-icon { transform: translate(1.5em, -50%); } .kol-checkbox--variant-switch.kol-checkbox--indeterminate .kol-icon { transform: translate(0.75em, -50%); } .kol-checkbox--variant-button { min-width: var(--a11y-min-size); } .kol-checkbox--variant-button .kol-icon { display: flex; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; justify-content: center; } }`;
|
|
27584
|
+
const defaultStyleCss$x = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-field-control { display: grid; min-height: var(--a11y-min-size); align-items: center; justify-content: left; grid-template-areas: "input label"; grid-template-columns: auto 1fr; grid-template-rows: auto; } .kol-field-control:has(.kol-field-control__hint) { grid-template-areas: "input label" "hint hint"; grid-template-columns: auto 1fr; grid-template-rows: auto auto; } .kol-field-control--label-align-left:not(.kol-field-control--hide-label) { grid-template-areas: "label input"; grid-template-columns: 1fr auto; grid-template-rows: auto; } .kol-field-control--label-align-left:not(.kol-field-control--hide-label):has(.kol-field-control__hint) { grid-template-areas: "label input" "hint hint"; grid-template-columns: 1fr auto; grid-template-rows: auto auto; } .kol-field-control__input { display: flex; min-height: var(--a11y-min-size); align-items: center; grid-area: input; } .kol-field-control__label { display: flex; min-height: var(--a11y-min-size); flex-grow: 1; align-items: center; cursor: pointer; grid-area: label; } .kol-field-control__label--visually-hidden { display: none; height: 0; margin: 0; padding: 0; visibility: hidden; } .kol-field-control__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-field-control__hint { grid-area: hint; } .kol-field-control--disabled .kol-field-control__label { cursor: not-allowed; } .kol-field-control--required .kol-field-control__label-text:has(.kol-span__slot[hidden])::after, .kol-field-control--required .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-form-field { display: grid; } .kol-form-field__label-text { display: ruby; } .kol-checkbox { display: flex; position: relative; align-items: center; cursor: pointer; } .kol-checkbox--disabled { cursor: not-allowed; } .kol-checkbox .kol-input { background-color: white; border-style: solid; margin: 0; border-width: 2px; appearance: none; cursor: inherit; } .kol-checkbox .kol-input:before { content: ""; } .kol-checkbox--variant-default { position: relative; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); justify-content: center; } .kol-checkbox--variant-default .kol-icon { display: none; position: absolute; inset: auto; z-index: 1; pointer-events: none; } .kol-checkbox--variant-default .kol-input { width: calc(22 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(22 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-checkbox--variant-default.kol-checkbox--checked .kol-icon, .kol-checkbox--variant-default.kol-checkbox--indeterminate .kol-icon { display: block; } .kol-checkbox--variant-switch { position: relative; } .kol-checkbox--variant-switch .kol-input { display: inline-block; position: relative; width: 3.2em; min-width: 3.2em; height: 1.7em; } .kol-checkbox--variant-switch .kol-input::before { background-color: black; position: absolute; top: calc(0.25em - 2 * 1rem / var(--kolibri-root-font-size, 16)); left: calc(0.25em - 2 * 1rem / var(--kolibri-root-font-size, 16)); width: 1.2em; height: 1.2em; transition: 0.5s; } .kol-checkbox--variant-switch .kol-input:checked::before { transform: translateX(1.5em); } .kol-checkbox--variant-switch .kol-input:indeterminate::before { transform: translateX(0.75em); } .kol-checkbox--variant-switch .kol-icon { transform: translate(0, -50%); color: black; display: flex; position: absolute; top: 50%; left: calc(4 * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; width: 1.2em; height: 1.2em; align-items: center; justify-content: center; transition: 0.5s; } .kol-checkbox--variant-switch.kol-checkbox--checked .kol-icon { transform: translate(1.5em, -50%); } .kol-checkbox--variant-switch.kol-checkbox--indeterminate .kol-icon { transform: translate(0.75em, -50%); } .kol-checkbox--variant-button { min-width: var(--a11y-min-size); } .kol-checkbox--variant-button .kol-icon { display: flex; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; justify-content: center; } }`;
|
|
27632
27585
|
|
|
27633
27586
|
class KolInputCheckbox extends BaseFormFieldWebComponent {
|
|
27634
27587
|
constructor(hostRef) {
|
|
27635
27588
|
super();
|
|
27636
|
-
|
|
27589
|
+
if (new.target === KolInputCheckbox)
|
|
27590
|
+
registerInstance(this, hostRef);
|
|
27637
27591
|
this.id = createUniqueId('input-checkbox');
|
|
27638
27592
|
this.infoPopoverOpen = false;
|
|
27639
27593
|
this.inputHasFocus = false;
|
|
@@ -27833,7 +27787,7 @@ class KolInputCheckbox extends BaseFormFieldWebComponent {
|
|
|
27833
27787
|
const accessKey = this.getRenderProp('accessKey') || undefined;
|
|
27834
27788
|
const shortKey = this.getRenderProp('shortKey') || undefined;
|
|
27835
27789
|
const required = this.getRenderProp('required');
|
|
27836
|
-
return (hAsync(Host, { key: '
|
|
27790
|
+
return (hAsync(Host, { key: 'bafeed8887803973d2cc2db16f49ab91051068d3' }, hAsync(FormFieldFC, Object.assign({ key: 'd0aefcc8b5397cfad069f8949623f0784e0e375c' }, this.getFormFieldProps({
|
|
27837
27791
|
class: clsx('kol-input-checkbox', {
|
|
27838
27792
|
'kol-input-checkbox--checked': checked,
|
|
27839
27793
|
'kol-input-checkbox--indeterminate': indeterminate,
|
|
@@ -27845,11 +27799,11 @@ class KolInputCheckbox extends BaseFormFieldWebComponent {
|
|
|
27845
27799
|
required,
|
|
27846
27800
|
renderNoLabel: true,
|
|
27847
27801
|
renderNoTooltip: true,
|
|
27848
|
-
})), hAsync(FieldControlFC, Object.assign({ key: '
|
|
27802
|
+
})), hAsync(FieldControlFC, Object.assign({ key: 'c6c073fd12fa8993d637c6841a11a0be38bb78f1', class: clsx('kol-input-checkbox__field-control', {
|
|
27849
27803
|
'kol-input-checkbox__field-control--checked': checked,
|
|
27850
27804
|
'kol-input-checkbox__field-control--indeterminate': indeterminate,
|
|
27851
27805
|
[`kol-input-checkbox__field-control--variant-${variant}`]: true,
|
|
27852
|
-
}), id: this.id, label: this.getRenderProp('label'), hint: this.getRenderProp('hint'), hideLabel: this.getRenderProp('hideLabel'), labelAlign: this.getRenderProp('labelAlign'), infoPopover: this.getInfoPopover(), accessKey: accessKey, shortKey: shortKey, tooltipAlign: this.getRenderProp('tooltipAlign'), disabled: this.getRenderProp('disabled'), msg: this.getRenderProp('msg'), touched: this.getRenderProp('touched'), required: required, renderNoHint: true, labelProps: { onMouseDown: this.handleLabelMouseDown } }, this.getLabelTooltipRefs()), hAsync(CheckboxFC, { key: '
|
|
27806
|
+
}), id: this.id, label: this.getRenderProp('label'), hint: this.getRenderProp('hint'), hideLabel: this.getRenderProp('hideLabel'), labelAlign: this.getRenderProp('labelAlign'), infoPopover: this.getInfoPopover(), accessKey: accessKey, shortKey: shortKey, tooltipAlign: this.getRenderProp('tooltipAlign'), disabled: this.getRenderProp('disabled'), msg: this.getRenderProp('msg'), touched: this.getRenderProp('touched'), required: required, renderNoHint: true, labelProps: { onMouseDown: this.handleLabelMouseDown } }, this.getLabelTooltipRefs()), hAsync(CheckboxFC, { key: 'bca27ce0967e5672923bd1fbbd4ae31333858fd5', variant: variant, icon: this.getIcon(), onMouseDown: this.handleCheckboxMouseDown, inputProps: this.getInputProps() })))));
|
|
27853
27807
|
}
|
|
27854
27808
|
get host() { return getElement(this); }
|
|
27855
27809
|
static get watchers() { return {
|
|
@@ -27991,12 +27945,13 @@ const inputColorPropsConfig = {
|
|
|
27991
27945
|
],
|
|
27992
27946
|
};
|
|
27993
27947
|
|
|
27994
|
-
const defaultStyleCss$w = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } .kol-input { cursor: pointer; } .kol-input:disabled { cursor: not-allowed; } }`;
|
|
27948
|
+
const defaultStyleCss$w = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } .kol-input { cursor: pointer; } .kol-input:disabled { cursor: not-allowed; } }`;
|
|
27995
27949
|
|
|
27996
27950
|
class KolInputColor extends BaseFormFieldWebComponent {
|
|
27997
27951
|
constructor(hostRef) {
|
|
27998
27952
|
super();
|
|
27999
|
-
|
|
27953
|
+
if (new.target === KolInputColor)
|
|
27954
|
+
registerInstance(this, hostRef);
|
|
28000
27955
|
this.id = createUniqueId('input-color');
|
|
28001
27956
|
this.infoPopoverOpen = false;
|
|
28002
27957
|
this.inputHasFocus = false;
|
|
@@ -28159,12 +28114,12 @@ class KolInputColor extends BaseFormFieldWebComponent {
|
|
|
28159
28114
|
icons: this.getRenderProp('icons'),
|
|
28160
28115
|
smartButton: this.getSmartButtonFcProps(this.getRenderProp('smartButton'), disabled),
|
|
28161
28116
|
});
|
|
28162
|
-
return (hAsync(Host, { key: '
|
|
28117
|
+
return (hAsync(Host, { key: '28705e83028430f22d59e707a250016a7a8a63e3' }, hAsync(FormFieldFC, Object.assign({ key: '12baf7a8e1544bc7105fa36c20aead6ed11ce4b3' }, this.getFormFieldProps({
|
|
28163
28118
|
class: 'kol-input-color',
|
|
28164
28119
|
accessKey: this.getRenderProp('accessKey') || undefined,
|
|
28165
28120
|
shortKey: this.getRenderProp('shortKey') || undefined,
|
|
28166
28121
|
variant: this.getRenderProp('variant'),
|
|
28167
|
-
})), hAsync(InputContainerFC, { key: '
|
|
28122
|
+
})), hAsync(InputContainerFC, { key: 'c0a2302c21ddbc21d538ac3e4f2ca73a034e4604', disabled: disabled, msg: this.getRenderProp('msg'), touched: this.getRenderProp('touched'), startAdornment: startAdornment, endAdornment: endAdornment }, hAsync(InputFC, Object.assign({ key: '5290f0735219b04f6efbf76212b4c62b1be3428c' }, this.getInputProps()))))));
|
|
28168
28123
|
}
|
|
28169
28124
|
get host() { return getElement(this); }
|
|
28170
28125
|
static get watchers() { return {
|
|
@@ -28327,12 +28282,13 @@ const inputDatePropsConfig = {
|
|
|
28327
28282
|
],
|
|
28328
28283
|
};
|
|
28329
28284
|
|
|
28330
|
-
const defaultStyleCss$v = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } .kol-input { cursor: text; } .kol-input::-webkit-calendar-picker-indicator { cursor: pointer; } }`;
|
|
28285
|
+
const defaultStyleCss$v = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } .kol-input { cursor: text; } .kol-input::-webkit-calendar-picker-indicator { cursor: pointer; } }`;
|
|
28331
28286
|
|
|
28332
28287
|
class KolInputDate extends BaseFormFieldWebComponent {
|
|
28333
28288
|
constructor(hostRef) {
|
|
28334
28289
|
super();
|
|
28335
|
-
|
|
28290
|
+
if (new.target === KolInputDate)
|
|
28291
|
+
registerInstance(this, hostRef);
|
|
28336
28292
|
this.id = createUniqueId('input-date');
|
|
28337
28293
|
this.infoPopoverOpen = false;
|
|
28338
28294
|
this.inputHasFocus = false;
|
|
@@ -28568,7 +28524,7 @@ class KolInputDate extends BaseFormFieldWebComponent {
|
|
|
28568
28524
|
icons: this.getRenderProp('icons'),
|
|
28569
28525
|
smartButton: this.getSmartButtonFcProps(this.getRenderProp('smartButton'), disabled),
|
|
28570
28526
|
});
|
|
28571
|
-
return (hAsync(Host, { key: '
|
|
28527
|
+
return (hAsync(Host, { key: '205a63142271ddb4cab5d2374f238e77104f5a7c' }, hAsync(FormFieldFC, Object.assign({ key: '887189f5d662ee48def8d2343ce114bef9e0d0d7' }, this.getFormFieldProps({
|
|
28572
28528
|
class: clsx('kol-input-date', this.getRenderProp('type'), {
|
|
28573
28529
|
'has-value': this.hasValue,
|
|
28574
28530
|
}),
|
|
@@ -28577,7 +28533,7 @@ class KolInputDate extends BaseFormFieldWebComponent {
|
|
|
28577
28533
|
variant: this.getRenderProp('variant'),
|
|
28578
28534
|
required: this.getRenderProp('required'),
|
|
28579
28535
|
readOnly: this.getRenderProp('readOnly'),
|
|
28580
|
-
})), hAsync(InputContainerFC, { key: '
|
|
28536
|
+
})), hAsync(InputContainerFC, { key: 'e5d8bc6c622d7b44e74df5bc0197f5ab0638de56', disabled: disabled, msg: this.getRenderProp('msg'), touched: this.getRenderProp('touched'), startAdornment: startAdornment, endAdornment: endAdornment }, hAsync(InputFC, Object.assign({ key: 'd73d8348068f1890182b3c26ead621bb806f64db' }, this.getInputProps()))))));
|
|
28581
28537
|
}
|
|
28582
28538
|
get host() { return getElement(this); }
|
|
28583
28539
|
static get watchers() { return {
|
|
@@ -29031,12 +28987,13 @@ class BaseTextInputWebComponent extends BaseFormFieldWebComponent {
|
|
|
29031
28987
|
}
|
|
29032
28988
|
}
|
|
29033
28989
|
|
|
29034
|
-
const defaultStyleCss$u = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } }`;
|
|
28990
|
+
const defaultStyleCss$u = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } }`;
|
|
29035
28991
|
|
|
29036
28992
|
class KolInputEmail extends BaseTextInputWebComponent {
|
|
29037
28993
|
constructor(hostRef) {
|
|
29038
28994
|
super();
|
|
29039
|
-
|
|
28995
|
+
if (new.target === KolInputEmail)
|
|
28996
|
+
registerInstance(this, hostRef);
|
|
29040
28997
|
this.id = createUniqueId('input-email');
|
|
29041
28998
|
this.infoPopoverOpen = false;
|
|
29042
28999
|
this.inputHasFocus = false;
|
|
@@ -29216,7 +29173,7 @@ class KolInputEmail extends BaseTextInputWebComponent {
|
|
|
29216
29173
|
}
|
|
29217
29174
|
render() {
|
|
29218
29175
|
const { startAdornment, endAdornment } = this.getTextInputAdornments();
|
|
29219
|
-
return (hAsync(Host, { key: '
|
|
29176
|
+
return (hAsync(Host, { key: '2157f9be8cf3316767455de058c51fc3ebc9a754' }, hAsync(FormFieldFC, Object.assign({ key: 'fcbceceedb6aeac3e0eaee00bf9b9dc3b19a1e74' }, this.getTextFormFieldProps('kol-input-email email')), hAsync(InputContainerFC, { key: '294d96f944a343a674c57600b56f39eb8e3a4901', disabled: this.getRenderProp('disabled'), msg: this.getRenderProp('msg'), touched: this.getRenderProp('touched'), startAdornment: startAdornment, endAdornment: endAdornment }, hAsync(InputFC, Object.assign({ key: 'd0a7c626261c6b160e055ef201410f98fe9a0aa5' }, this.getTextInputProps({ multiple: this.getRenderProp('multiple'), suggestions: this.getRenderProp('suggestions') }, { type: 'email' })))))));
|
|
29220
29177
|
}
|
|
29221
29178
|
get host() { return getElement(this); }
|
|
29222
29179
|
static get watchers() { return {
|
|
@@ -29391,12 +29348,13 @@ const inputContainerBem = bem.forBlock('kol-input-container');
|
|
|
29391
29348
|
const BEM_CLASS_INPUT_CONTAINER__BUTTON = inputContainerBem('button');
|
|
29392
29349
|
const InputFileNameFC = ({ filename, hasFile }) => (hAsync("span", { class: inputContainerBem('filename', { 'has-file': hasFile }) }, filename));
|
|
29393
29350
|
|
|
29394
|
-
const defaultStyleCss$t = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-button__interactive-element::before { content: ""; } .kol-button__text { flex: 1 0 100%; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-input { opacity: 0; position: absolute; inset: 0; width: 100%; height: 100%; cursor: pointer; } .kol-input::-webkit-file-upload-button, .kol-input::file-selector-button { cursor: pointer; } .kol-input:disabled, .kol-input:disabled::-webkit-file-upload-button, .kol-input:disabled::file-selector-button { cursor: not-allowed; pointer-events: none; } .kol-input-container__container { display: flex; overflow: hidden; align-items: center; } .kol-input-container__button { height: auto; } .kol-input-container__filename { overflow: hidden; flex-grow: 1; white-space: nowrap; text-overflow: ellipsis; } .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) { grid-template-columns: auto 1fr; } }`;
|
|
29351
|
+
const defaultStyleCss$t = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-button__interactive-element::before { content: ""; } .kol-button__text { flex: 1 0 100%; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-input { opacity: 0; position: absolute; inset: 0; width: 100%; height: 100%; cursor: pointer; } .kol-input::-webkit-file-upload-button, .kol-input::file-selector-button { cursor: pointer; } .kol-input:disabled, .kol-input:disabled::-webkit-file-upload-button, .kol-input:disabled::file-selector-button { cursor: not-allowed; pointer-events: none; } .kol-input-container__container { display: flex; overflow: hidden; align-items: center; } .kol-input-container__button { height: auto; } .kol-input-container__filename { overflow: hidden; flex-grow: 1; white-space: nowrap; text-overflow: ellipsis; } .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) { grid-template-columns: auto 1fr; } }`;
|
|
29395
29352
|
|
|
29396
29353
|
class KolInputFile extends BaseFormFieldWebComponent {
|
|
29397
29354
|
constructor(hostRef) {
|
|
29398
29355
|
super();
|
|
29399
|
-
|
|
29356
|
+
if (new.target === KolInputFile)
|
|
29357
|
+
registerInstance(this, hostRef);
|
|
29400
29358
|
this.id = createUniqueId('input-file');
|
|
29401
29359
|
this.infoPopoverOpen = false;
|
|
29402
29360
|
this.inputHasFocus = false;
|
|
@@ -29609,13 +29567,13 @@ class KolInputFile extends BaseFormFieldWebComponent {
|
|
|
29609
29567
|
icons: this.getRenderProp('icons'),
|
|
29610
29568
|
smartButton: this.getSmartButtonFcProps(this.getRenderProp('smartButton'), disabled),
|
|
29611
29569
|
});
|
|
29612
|
-
return (hAsync(Host, { key: '
|
|
29570
|
+
return (hAsync(Host, { key: '25a212036a6a5c270c5546b3c9b8d18f3760ba02' }, hAsync(FormFieldFC, Object.assign({ key: 'c1f046691cb2b689c1e18ff9067519b55e4d86c0' }, this.getFormFieldProps({
|
|
29613
29571
|
class: 'kol-input-file file',
|
|
29614
29572
|
accessKey: this.getRenderProp('accessKey') || undefined,
|
|
29615
29573
|
shortKey: this.getRenderProp('shortKey') || undefined,
|
|
29616
29574
|
variant: this.getRenderProp('variant'),
|
|
29617
29575
|
required: this.getRenderProp('required'),
|
|
29618
|
-
})), hAsync(InputContainerFC, { key: '
|
|
29576
|
+
})), hAsync(InputContainerFC, { key: '1cab09cc2d86b18763c2640b775dd623f16fbfe7', class: { 'kol-input-container--is-dragover': this.isDragover }, disabled: disabled, msg: this.getRenderProp('msg'), touched: this.getRenderProp('touched'), startAdornment: startAdornment, endAdornment: endAdornment, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, hAsync(InputFileNameFC, { key: '7a4243b1e9f798c9d7134f14120560d3d42ef169', filename: this.filename, hasFile: this.hasFileSelected }), hAsync(InputFC, Object.assign({ key: '829abae762f1dda9e12ea775c795dad6a209a25b' }, this.getInputProps())), hAsync(ButtonFC, Object.assign({ key: '86f4a5d315863b54858573d4c7e769933874e39b' }, this.browseButton.getFcProps({ _label: this.translateDataBrowseText, _variant: 'primary', _disabled: disabled }, { class: BEM_CLASS_INPUT_CONTAINER__BUTTON })))))));
|
|
29619
29577
|
}
|
|
29620
29578
|
get host() { return getElement(this); }
|
|
29621
29579
|
static get watchers() { return {
|
|
@@ -29787,14 +29745,15 @@ const inputNumberPropsConfig = {
|
|
|
29787
29745
|
],
|
|
29788
29746
|
};
|
|
29789
29747
|
|
|
29790
|
-
const defaultStyleCss$s = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-input-number input { appearance: textfield; text-align: right; } .kol-input-number input::-webkit-inner-spin-button { display: none; } }`;
|
|
29748
|
+
const defaultStyleCss$s = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-input-number input { appearance: textfield; text-align: right; } .kol-input-number input::-webkit-inner-spin-button { display: none; } }`;
|
|
29791
29749
|
|
|
29792
29750
|
const STEP_BUTTON_CLASS = 'kol-input-number__step-button';
|
|
29793
29751
|
const isStepButton = (target) => { var _a; return ((_a = target === null || target === void 0 ? void 0 : target.classList) === null || _a === void 0 ? void 0 : _a.contains(STEP_BUTTON_CLASS)) === true; };
|
|
29794
29752
|
class KolInputNumber extends BaseFormFieldWebComponent {
|
|
29795
29753
|
constructor(hostRef) {
|
|
29796
29754
|
super();
|
|
29797
|
-
|
|
29755
|
+
if (new.target === KolInputNumber)
|
|
29756
|
+
registerInstance(this, hostRef);
|
|
29798
29757
|
this.id = createUniqueId('input-number');
|
|
29799
29758
|
this.infoPopoverOpen = false;
|
|
29800
29759
|
this.inputHasFocus = false;
|
|
@@ -30044,7 +30003,7 @@ class KolInputNumber extends BaseFormFieldWebComponent {
|
|
|
30044
30003
|
startAdornment: this.renderStepButton('down'),
|
|
30045
30004
|
endAdornment: this.renderStepButton('up'),
|
|
30046
30005
|
});
|
|
30047
|
-
return (hAsync(Host, { key: '
|
|
30006
|
+
return (hAsync(Host, { key: '72ac3294746fee359a1bc104ff67d98b12863910' }, hAsync(FormFieldFC, Object.assign({ key: '56e069564f2166347361d4d5519bfd768201ea5d' }, this.getFormFieldProps({
|
|
30048
30007
|
class: clsx('kol-input-number', 'number', {
|
|
30049
30008
|
'has-value': this.hasValue,
|
|
30050
30009
|
}),
|
|
@@ -30053,7 +30012,7 @@ class KolInputNumber extends BaseFormFieldWebComponent {
|
|
|
30053
30012
|
variant: this.getRenderProp('variant'),
|
|
30054
30013
|
required: this.getRenderProp('required'),
|
|
30055
30014
|
readOnly: this.getRenderProp('readOnly'),
|
|
30056
|
-
})), hAsync(InputContainerFC, { key: '
|
|
30015
|
+
})), hAsync(InputContainerFC, { key: 'a81cbe93dccd157800796e2c4dd3c9555058759c', disabled: disabled, msg: this.getRenderProp('msg'), touched: this.getRenderProp('touched'), startAdornment: startAdornment, endAdornment: endAdornment }, hAsync(InputFC, Object.assign({ key: 'bdcdc00739d790d7f4f0d40fd1d0d66561afbcd4' }, this.getInputProps()))))));
|
|
30057
30016
|
}
|
|
30058
30017
|
get host() { return getElement(this); }
|
|
30059
30018
|
static get watchers() { return {
|
|
@@ -30197,12 +30156,13 @@ const inputPasswordPropsConfig = {
|
|
|
30197
30156
|
optional: [...textInputBasePropsConfig.optional, visibilityToggleProp],
|
|
30198
30157
|
};
|
|
30199
30158
|
|
|
30200
|
-
const defaultStyleCss$r = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-input-password { --kol-tooltip-width: calc(160 * 1rem / var(--kolibri-root-font-size, 16)); } }`;
|
|
30159
|
+
const defaultStyleCss$r = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-input-password { --kol-tooltip-width: calc(160 * 1rem / var(--kolibri-root-font-size, 16)); } }`;
|
|
30201
30160
|
|
|
30202
30161
|
class KolInputPassword extends BaseTextInputWebComponent {
|
|
30203
30162
|
constructor(hostRef) {
|
|
30204
30163
|
super();
|
|
30205
|
-
|
|
30164
|
+
if (new.target === KolInputPassword)
|
|
30165
|
+
registerInstance(this, hostRef);
|
|
30206
30166
|
this.id = createUniqueId('input-password');
|
|
30207
30167
|
this.infoPopoverOpen = false;
|
|
30208
30168
|
this.inputHasFocus = false;
|
|
@@ -30409,7 +30369,7 @@ class KolInputPassword extends BaseTextInputWebComponent {
|
|
|
30409
30369
|
}
|
|
30410
30370
|
render() {
|
|
30411
30371
|
const { startAdornment, endAdornment } = this.getTextInputAdornments(this.getVisibilityToggle());
|
|
30412
|
-
return (hAsync(Host, { key: '
|
|
30372
|
+
return (hAsync(Host, { key: 'ce55fc277ab96baa7e52816fa04a65490a99fabb' }, hAsync(FormFieldFC, Object.assign({ key: 'b25084fb51790c3e0a8d166abd0b1e834520e4c8' }, this.getTextFormFieldProps('kol-input-password password')), hAsync(InputContainerFC, { key: '25310c042ba68177496ee3089c798a9b0997948c', disabled: this.getRenderProp('disabled'), msg: this.getRenderProp('msg'), touched: this.getRenderProp('touched'), startAdornment: startAdornment, endAdornment: endAdornment }, hAsync(InputFC, Object.assign({ key: '0e6e6baf69d70ac82f06fc957139f83cf0afb9fa' }, this.getTextInputProps({}, { type: this.getRenderProp('visibilityToggle') && this.passwordVisible ? 'text' : 'password' })))))));
|
|
30413
30373
|
}
|
|
30414
30374
|
get host() { return getElement(this); }
|
|
30415
30375
|
static get watchers() { return {
|
|
@@ -30586,12 +30546,13 @@ const inputRadioPropsConfig = {
|
|
|
30586
30546
|
optional: [...formFieldBasePropsConfig.optional, radioOptionsProp, radioOrientationProp, radioValueProp, requiredProp, variantProp],
|
|
30587
30547
|
};
|
|
30588
30548
|
|
|
30589
|
-
const defaultStyleCss$q = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-field-control { display: grid; min-height: var(--a11y-min-size); align-items: center; justify-content: left; grid-template-areas: "input label"; grid-template-columns: auto 1fr; grid-template-rows: auto; } .kol-field-control:has(.kol-field-control__hint) { grid-template-areas: "input label" "hint hint"; grid-template-columns: auto 1fr; grid-template-rows: auto auto; } .kol-field-control--label-align-left:not(.kol-field-control--hide-label) { grid-template-areas: "label input"; grid-template-columns: 1fr auto; grid-template-rows: auto; } .kol-field-control--label-align-left:not(.kol-field-control--hide-label):has(.kol-field-control__hint) { grid-template-areas: "label input" "hint hint"; grid-template-columns: 1fr auto; grid-template-rows: auto auto; } .kol-field-control__input { display: flex; min-height: var(--a11y-min-size); align-items: center; grid-area: input; } .kol-field-control__label { display: flex; min-height: var(--a11y-min-size); flex-grow: 1; align-items: center; cursor: pointer; grid-area: label; } .kol-field-control__label--visually-hidden { display: none; height: 0; margin: 0; padding: 0; visibility: hidden; } .kol-field-control__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-field-control__hint { grid-area: hint; } .kol-field-control--disabled .kol-field-control__label { cursor: not-allowed; } .kol-field-control--required .kol-field-control__label-text:has(.kol-span__slot[hidden])::after, .kol-field-control--required .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-form-field { --border-width: 2px; --input-size: 1.5em; } .kol-form-field__label { display: contents; } .kol-form-field__label-text { display: ruby; } .kol-form-field__input { display: flex; flex-direction: column; } .kol-form-field__input--orientation-horizontal { flex-direction: row; flex-wrap: wrap; align-items: flex-start; } .kol-form-field--disabled { opacity: unset; } .kol-input-radio { display: flex; position: relative; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; justify-content: center; cursor: pointer; } .kol-input-radio__input { border-style: solid; border-radius: 100%; display: flex; width: var(--input-size); min-width: var(--input-size); height: var(--input-size); min-height: var(--input-size); margin: 0; padding: 0; border-width: var(--border-width); appearance: none; cursor: pointer; } .kol-input-radio__input:before { border-radius: 100%; width: calc(var(--input-size) / 2); height: calc(var(--input-size) / 2); margin: auto; content: ""; } .kol-input-radio__input:checked:before { background-color: black; } @media (forced-colors: active) { .kol-input-radio__input:checked:before { background-color: selectedItem !important; } } .kol-input-radio__input:disabled { cursor: not-allowed; } .kol-input-radio--disabled { cursor: not-allowed; } }`;
|
|
30549
|
+
const defaultStyleCss$q = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-field-control { display: grid; min-height: var(--a11y-min-size); align-items: center; justify-content: left; grid-template-areas: "input label"; grid-template-columns: auto 1fr; grid-template-rows: auto; } .kol-field-control:has(.kol-field-control__hint) { grid-template-areas: "input label" "hint hint"; grid-template-columns: auto 1fr; grid-template-rows: auto auto; } .kol-field-control--label-align-left:not(.kol-field-control--hide-label) { grid-template-areas: "label input"; grid-template-columns: 1fr auto; grid-template-rows: auto; } .kol-field-control--label-align-left:not(.kol-field-control--hide-label):has(.kol-field-control__hint) { grid-template-areas: "label input" "hint hint"; grid-template-columns: 1fr auto; grid-template-rows: auto auto; } .kol-field-control__input { display: flex; min-height: var(--a11y-min-size); align-items: center; grid-area: input; } .kol-field-control__label { display: flex; min-height: var(--a11y-min-size); flex-grow: 1; align-items: center; cursor: pointer; grid-area: label; } .kol-field-control__label--visually-hidden { display: none; height: 0; margin: 0; padding: 0; visibility: hidden; } .kol-field-control__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-field-control__hint { grid-area: hint; } .kol-field-control--disabled .kol-field-control__label { cursor: not-allowed; } .kol-field-control--required .kol-field-control__label-text:has(.kol-span__slot[hidden])::after, .kol-field-control--required .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-form-field { --border-width: 2px; --input-size: 1.5em; } .kol-form-field__label { display: contents; } .kol-form-field__label-text { display: ruby; } .kol-form-field__input { display: flex; flex-direction: column; } .kol-form-field__input--orientation-horizontal { flex-direction: row; flex-wrap: wrap; align-items: flex-start; } .kol-form-field--disabled { opacity: unset; } .kol-input-radio { display: flex; position: relative; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; justify-content: center; cursor: pointer; } .kol-input-radio__input { border-style: solid; border-radius: 100%; display: flex; width: var(--input-size); min-width: var(--input-size); height: var(--input-size); min-height: var(--input-size); margin: 0; padding: 0; border-width: var(--border-width); appearance: none; cursor: pointer; } .kol-input-radio__input:before { border-radius: 100%; width: calc(var(--input-size) / 2); height: calc(var(--input-size) / 2); margin: auto; content: ""; } .kol-input-radio__input:checked:before { background-color: black; } @media (forced-colors: active) { .kol-input-radio__input:checked:before { background-color: selectedItem !important; } } .kol-input-radio__input:disabled { cursor: not-allowed; } .kol-input-radio--disabled { cursor: not-allowed; } }`;
|
|
30590
30550
|
|
|
30591
30551
|
class KolInputRadio extends BaseFormFieldWebComponent {
|
|
30592
30552
|
constructor(hostRef) {
|
|
30593
30553
|
super();
|
|
30594
|
-
|
|
30554
|
+
if (new.target === KolInputRadio)
|
|
30555
|
+
registerInstance(this, hostRef);
|
|
30595
30556
|
this.id = createUniqueId('input-radio');
|
|
30596
30557
|
this.infoPopoverOpen = false;
|
|
30597
30558
|
this.inputHasFocus = false;
|
|
@@ -30846,7 +30807,7 @@ class KolInputRadio extends BaseFormFieldWebComponent {
|
|
|
30846
30807
|
}
|
|
30847
30808
|
render() {
|
|
30848
30809
|
const { ariaDescribedBy } = this.getAria();
|
|
30849
|
-
return (hAsync(Host, { key: '
|
|
30810
|
+
return (hAsync(Host, { key: 'e42fbdf89edfc2f6a343096f5725dec6980d5b9f' }, hAsync(FormFieldFC, Object.assign({ key: '22f7a6684edce31a1d8d2a28f1909ad111ea177d' }, this.getFormFieldProps({
|
|
30850
30811
|
class: 'kol-form-field--radio',
|
|
30851
30812
|
required: this.getRenderProp('required'),
|
|
30852
30813
|
variant: this.getRenderProp('variant'),
|
|
@@ -30971,12 +30932,13 @@ const BEM_CLASS_INPUT_RANGE__INPUT_RANGE = inputRangeBem('input', { range: true
|
|
|
30971
30932
|
const BEM_CLASS_INPUT_RANGE__INPUTS_WRAPPER = inputRangeBem('inputs-wrapper');
|
|
30972
30933
|
const InputRangeInputsFC = ({ max, min }, children) => (hAsync("div", { class: BEM_CLASS_INPUT_RANGE__INPUTS_WRAPPER, style: { '--kolibri-input-range--input-number--width': `calc(${Math.max(String(max !== null && max !== void 0 ? max : 100).length, String(min !== null && min !== void 0 ? min : 0).length, 4)}ch + 2em)` } }, children));
|
|
30973
30934
|
|
|
30974
|
-
const defaultStyleCss$p = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } .kol-input-range__inputs-wrapper { display: flex; flex-grow: 1; flex-direction: row; flex-wrap: wrap; align-items: center; } .kol-input-range__input--number { width: var(--kolibri-input-range--input-number--width); text-align: right; } .kol-input-range__input--range { background-color: white; display: inline-block; width: 0; min-width: calc(128 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); margin: 0; padding: 0; flex-grow: 1; line-height: 1.5; appearance: none; border: 1px solid black; } .kol-input-range__input:not(:disabled).kol-input-range__input--range::-webkit-slider-thumb { cursor: pointer; } .kol-input-range__input--range::-webkit-slider-thumb { background-color: black; border-radius: 20px; width: calc(20 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(20 * 1rem / var(--kolibri-root-font-size, 16)); -webkit-appearance: none; } @media (prefers-contrast: more) or (forced-colors: active) { .kol-input-range__input--range::-webkit-slider-thumb { outline: 1px solid currentColor; } } .kol-input-range__input:not(:disabled).kol-input-range__input--range::-moz-range-thumb { cursor: pointer; } .kol-input-range__input--range::-moz-range-thumb { background-color: black; border-radius: 20px; width: calc(20 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(20 * 1rem / var(--kolibri-root-font-size, 16)); -moz-appearance: none; } }`;
|
|
30935
|
+
const defaultStyleCss$p = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } .kol-input-range__inputs-wrapper { display: flex; flex-grow: 1; flex-direction: row; flex-wrap: wrap; align-items: center; } .kol-input-range__input--number { width: var(--kolibri-input-range--input-number--width); text-align: right; } .kol-input-range__input--range { background-color: white; display: inline-block; width: 0; min-width: calc(128 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); margin: 0; padding: 0; flex-grow: 1; line-height: 1.5; appearance: none; border: 1px solid black; } .kol-input-range__input:not(:disabled).kol-input-range__input--range::-webkit-slider-thumb { cursor: pointer; } .kol-input-range__input--range::-webkit-slider-thumb { background-color: black; border-radius: 20px; width: calc(20 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(20 * 1rem / var(--kolibri-root-font-size, 16)); -webkit-appearance: none; } @media (prefers-contrast: more) or (forced-colors: active) { .kol-input-range__input--range::-webkit-slider-thumb { outline: 1px solid currentColor; } } .kol-input-range__input:not(:disabled).kol-input-range__input--range::-moz-range-thumb { cursor: pointer; } .kol-input-range__input--range::-moz-range-thumb { background-color: black; border-radius: 20px; width: calc(20 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(20 * 1rem / var(--kolibri-root-font-size, 16)); -moz-appearance: none; } }`;
|
|
30975
30936
|
|
|
30976
30937
|
class KolInputRange extends BaseFormFieldWebComponent {
|
|
30977
30938
|
constructor(hostRef) {
|
|
30978
30939
|
super();
|
|
30979
|
-
|
|
30940
|
+
if (new.target === KolInputRange)
|
|
30941
|
+
registerInstance(this, hostRef);
|
|
30980
30942
|
this.id = createUniqueId('input-range');
|
|
30981
30943
|
this.infoPopoverOpen = false;
|
|
30982
30944
|
this.inputHasFocus = false;
|
|
@@ -31183,12 +31145,12 @@ class KolInputRange extends BaseFormFieldWebComponent {
|
|
|
31183
31145
|
const { ariaDescribedBy, hasError } = this.getAria();
|
|
31184
31146
|
const ariaInvalid = hasError ? 'true' : undefined;
|
|
31185
31147
|
const { startAdornment, endAdornment } = getInputAdornments({ icons: this.getRenderProp('icons') });
|
|
31186
|
-
return (hAsync(Host, { key: '
|
|
31148
|
+
return (hAsync(Host, { key: '33ca7883c15dd0f3f586e86ffd7dc37a935a5f55' }, hAsync(FormFieldFC, Object.assign({ key: '54f2bf977693fcab734c72869173cae429634352' }, this.getFormFieldProps({
|
|
31187
31149
|
class: 'kol-input-range range',
|
|
31188
31150
|
accessKey: this.getRenderProp('accessKey') || undefined,
|
|
31189
31151
|
shortKey: this.getRenderProp('shortKey') || undefined,
|
|
31190
31152
|
variant: this.getRenderProp('variant'),
|
|
31191
|
-
})), hAsync(InputContainerFC, { key: '
|
|
31153
|
+
})), hAsync(InputContainerFC, { key: '8d6325bb3aae8b11bf039659e79fd3408251550b', disabled: disabled, msg: this.getRenderProp('msg'), touched: this.getRenderProp('touched'), startAdornment: startAdornment, endAdornment: endAdornment }, hAsync(InputRangeInputsFC, { key: '79f44d08ab2bf23009a193fa45bed001cbe02d40', max: max, min: min }, hAsync(InputFC, Object.assign({ key: '322eb34d3d5235fcc95aad49f3e9bcd3ae1155d3' }, shared, { class: BEM_CLASS_INPUT_RANGE__INPUT_RANGE, name: name ? `${name}-range` : undefined, list: list, type: "range", tabIndex: -1, id: undefined, accessKey: undefined, "aria-hidden": "true", ref: this.setRangeRef, ariaDescribedBy: ariaDescribedBy, "aria-invalid": ariaInvalid })), hAsync(InputFC, Object.assign({ key: 'c2aef5eb5883a1e71f4663e36a074e76464d3d35' }, shared, { class: BEM_CLASS_INPUT_RANGE__INPUT_NUMBER, name: name ? `${name}-number` : undefined, list: list, type: "number", ref: this.ctaRef, onKeyDown: this.handleNumberKeyDown, ariaDescribedBy: ariaDescribedBy, "aria-invalid": ariaInvalid }))), hasSuggestions && hAsync(SuggestionsFC, { key: '0c8cd329f52708c644cf72b1db36dc2848b50e49', id: this.id, suggestions: suggestions })))));
|
|
31192
31154
|
}
|
|
31193
31155
|
get host() { return getElement(this); }
|
|
31194
31156
|
static get watchers() { return {
|
|
@@ -31316,12 +31278,13 @@ const inputTextPropsConfig = {
|
|
|
31316
31278
|
optional: [...textInputBasePropsConfig.optional, inputTextTypeProp, spellCheckProp, suggestionsProp],
|
|
31317
31279
|
};
|
|
31318
31280
|
|
|
31319
|
-
const defaultStyleCss$o = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } input[type=search]::-webkit-search-cancel-button { display: none; } .kol-input-text__clear-button--hidden { display: none; } }`;
|
|
31281
|
+
const defaultStyleCss$o = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } input[type=search]::-webkit-search-cancel-button { display: none; } .kol-input-text__clear-button--hidden { display: none; } }`;
|
|
31320
31282
|
|
|
31321
31283
|
class KolInputText extends BaseTextInputWebComponent {
|
|
31322
31284
|
constructor(hostRef) {
|
|
31323
31285
|
super();
|
|
31324
|
-
|
|
31286
|
+
if (new.target === KolInputText)
|
|
31287
|
+
registerInstance(this, hostRef);
|
|
31325
31288
|
this.id = createUniqueId('input-text');
|
|
31326
31289
|
this.infoPopoverOpen = false;
|
|
31327
31290
|
this.inputHasFocus = false;
|
|
@@ -31575,7 +31538,7 @@ class KolInputText extends BaseTextInputWebComponent {
|
|
|
31575
31538
|
render() {
|
|
31576
31539
|
const type = this.getRenderProp('type');
|
|
31577
31540
|
const { startAdornment, endAdornment } = this.getTextInputAdornments(this.getClearButton());
|
|
31578
|
-
return (hAsync(Host, { key: '
|
|
31541
|
+
return (hAsync(Host, { key: '76f96b09c7b2d0ac972ac24818153a2f2993d823' }, hAsync(FormFieldFC, Object.assign({ key: 'c6dff480cf4632106c3b9e3a2983a0fa066a9582' }, this.getTextFormFieldProps(`kol-input-text ${type}`)), hAsync(InputContainerFC, { key: '1b5055625621beb6c9eba5955e6ecec99e288816', disabled: this.getRenderProp('disabled'), msg: this.getRenderProp('msg'), touched: this.getRenderProp('touched'), startAdornment: startAdornment, endAdornment: endAdornment }, hAsync(InputFC, Object.assign({ key: 'bf1f06f237a6dfd56e086554c6d9b845ac8efce7' }, this.getTextInputProps({ type, spellcheck: this.getRenderProp('spellCheck'), suggestions: this.getRenderProp('suggestions') })))))));
|
|
31579
31542
|
}
|
|
31580
31543
|
get host() { return getElement(this); }
|
|
31581
31544
|
static get watchers() { return {
|
|
@@ -31746,8 +31709,9 @@ const defaultStyleCss$n = () => `@charset "UTF-8"; @layer kol-a11y, kol-glob
|
|
|
31746
31709
|
|
|
31747
31710
|
class KolKolibri extends BaseWebComponent {
|
|
31748
31711
|
constructor(hostRef) {
|
|
31749
|
-
super();
|
|
31750
|
-
|
|
31712
|
+
super(...arguments);
|
|
31713
|
+
if (new.target === KolKolibri)
|
|
31714
|
+
registerInstance(this, hostRef);
|
|
31751
31715
|
this.translateKolibriLogo = translate('kol-kolibri-logo');
|
|
31752
31716
|
this.propsConfig = kolibriPropsConfig;
|
|
31753
31717
|
this._color = '#003c78';
|
|
@@ -31764,7 +31728,7 @@ class KolKolibri extends BaseWebComponent {
|
|
|
31764
31728
|
this.watchLabeled(this._labeled);
|
|
31765
31729
|
}
|
|
31766
31730
|
render() {
|
|
31767
|
-
return (hAsync(Host, { key: '
|
|
31731
|
+
return (hAsync(Host, { key: '90a9d1ec2055ff99326264fb058c6e7ed9929874' }, hAsync(KolibriFC, { key: 'd7611cdd213502eee0d425944d8b97ed0f1ad61d', ariaLabel: this.translateKolibriLogo, color: this.getRenderProp('color'), labeled: this.getRenderProp('labeled') })));
|
|
31768
31732
|
}
|
|
31769
31733
|
static get watchers() { return {
|
|
31770
31734
|
"_color": [{
|
|
@@ -31927,12 +31891,13 @@ class BaseLinkWebComponent extends BaseWebComponent {
|
|
|
31927
31891
|
}
|
|
31928
31892
|
}
|
|
31929
31893
|
|
|
31930
|
-
const defaultStyleCss$m = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=
|
|
31894
|
+
const defaultStyleCss$m = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-link { display: inline-flex; max-width: fit-content; } .kol-link--standalone { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: stretch; } .kol-link--standalone .kol-link__interactive-element { align-items: stretch; } .kol-link--standalone .kol-link__text { display: inline-flex; flex: 1 1 100%; place-items: center; } .kol-link__interactive-element { display: inline-flex; flex: 1; align-items: baseline; place-items: center; text-align: left; text-decoration-line: none; } .kol-link__interactive-element:focus:not([aria-disabled], [disabled]) .kol-span__label, .kol-link__interactive-element:hover:not([aria-disabled], [disabled]) .kol-span__label { text-decoration-thickness: 0.2em; } .kol-link .kol-span__label { text-decoration-line: underline; } .kol-link__icon { display: inline-flex; } }`;
|
|
31931
31895
|
|
|
31932
31896
|
class KolLink extends BaseLinkWebComponent {
|
|
31933
31897
|
constructor(hostRef) {
|
|
31934
|
-
super();
|
|
31935
|
-
|
|
31898
|
+
super(...arguments);
|
|
31899
|
+
if (new.target === KolLink)
|
|
31900
|
+
registerInstance(this, hostRef);
|
|
31936
31901
|
this.ariaCurrent = '';
|
|
31937
31902
|
this.ariaDescriptionId = nonce();
|
|
31938
31903
|
this.expertSlot = false;
|
|
@@ -32036,7 +32001,7 @@ class KolLink extends BaseLinkWebComponent {
|
|
|
32036
32001
|
this.destroyLinkBehaviors();
|
|
32037
32002
|
}
|
|
32038
32003
|
render() {
|
|
32039
|
-
return hAsync(Host, { key: '
|
|
32004
|
+
return hAsync(Host, { key: '91a1c3ee010fbdc62cb08be0d29e33734a8aa4ad' }, this.renderLinkFC());
|
|
32040
32005
|
}
|
|
32041
32006
|
get host() { return getElement(this); }
|
|
32042
32007
|
static get watchers() { return {
|
|
@@ -32130,12 +32095,13 @@ __decorate([
|
|
|
32130
32095
|
delegateFocus('ctaRef')
|
|
32131
32096
|
], KolLink.prototype, "focus", null);
|
|
32132
32097
|
|
|
32133
|
-
const defaultStyleCss$l = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=
|
|
32098
|
+
const defaultStyleCss$l = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-link { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-link__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-link__interactive-element::before { content: ""; } .kol-link__text { flex: 1 0 100%; } .kol-link { } .kol-link__tooltip { height: 0; } .kol-link--external-link > .kolicon-link-external::before { content: none; } .kol-link--external-link .kol-link__interactive-element > .kolicon-link-external::before { content: none; } }`;
|
|
32134
32099
|
|
|
32135
32100
|
class KolLinkButton extends BaseLinkWebComponent {
|
|
32136
32101
|
constructor(hostRef) {
|
|
32137
|
-
super();
|
|
32138
|
-
|
|
32102
|
+
super(...arguments);
|
|
32103
|
+
if (new.target === KolLinkButton)
|
|
32104
|
+
registerInstance(this, hostRef);
|
|
32139
32105
|
var _a;
|
|
32140
32106
|
this.ariaCurrent = '';
|
|
32141
32107
|
this.ariaDescriptionId = nonce();
|
|
@@ -32246,7 +32212,7 @@ class KolLinkButton extends BaseLinkWebComponent {
|
|
|
32246
32212
|
this.destroyLinkBehaviors();
|
|
32247
32213
|
}
|
|
32248
32214
|
render() {
|
|
32249
|
-
return hAsync(Host, { key: '
|
|
32215
|
+
return hAsync(Host, { key: 'c9c119dd63c2951e70f5fb7ee2670471f1ad5b10' }, this.renderLinkFC());
|
|
32250
32216
|
}
|
|
32251
32217
|
get host() { return getElement(this); }
|
|
32252
32218
|
static get watchers() { return {
|
|
@@ -32357,15 +32323,12 @@ const meterBem = bem.forBlock('kol-meter');
|
|
|
32357
32323
|
function getMeterState(value, min, max, low, high, optimum) {
|
|
32358
32324
|
const effectiveLow = low !== null && low !== void 0 ? low : min;
|
|
32359
32325
|
const effectiveHigh = high !== null && high !== void 0 ? high : max;
|
|
32360
|
-
|
|
32361
|
-
const inMidRegion = value >= effectiveLow && value <= effectiveHigh;
|
|
32362
|
-
return inMidRegion ? 'optimum' : 'suboptimal';
|
|
32363
|
-
}
|
|
32326
|
+
const effectiveOptimum = optimum !== null && optimum !== void 0 ? optimum : (min + max) / 2;
|
|
32364
32327
|
const inLowRegion = value < effectiveLow;
|
|
32365
32328
|
const inHighRegion = value > effectiveHigh;
|
|
32366
32329
|
const inMidRegion = !inLowRegion && !inHighRegion;
|
|
32367
|
-
const optimumInLow =
|
|
32368
|
-
const optimumInHigh =
|
|
32330
|
+
const optimumInLow = effectiveOptimum < effectiveLow;
|
|
32331
|
+
const optimumInHigh = effectiveOptimum > effectiveHigh;
|
|
32369
32332
|
if (optimumInLow) {
|
|
32370
32333
|
if (inLowRegion)
|
|
32371
32334
|
return 'optimum';
|
|
@@ -32420,8 +32383,9 @@ const defaultStyleCss$k = () => `@charset "UTF-8"; @layer kol-a11y, kol-glob
|
|
|
32420
32383
|
|
|
32421
32384
|
class KolMeter extends BaseWebComponent {
|
|
32422
32385
|
constructor(hostRef) {
|
|
32423
|
-
super();
|
|
32424
|
-
|
|
32386
|
+
super(...arguments);
|
|
32387
|
+
if (new.target === KolMeter)
|
|
32388
|
+
registerInstance(this, hostRef);
|
|
32425
32389
|
this.propsConfig = meterPropsConfig;
|
|
32426
32390
|
this._high = undefined;
|
|
32427
32391
|
this._low = undefined;
|
|
@@ -32500,7 +32464,7 @@ class KolMeter extends BaseWebComponent {
|
|
|
32500
32464
|
this.watchValue(this._value);
|
|
32501
32465
|
}
|
|
32502
32466
|
render() {
|
|
32503
|
-
return (hAsync(Host, { key: '
|
|
32467
|
+
return (hAsync(Host, { key: 'af6db6e2a3fc3bb34ceb903276c17768ab7b615d' }, hAsync(MeterFC, { key: '219ba24361c2a573de1bf039c92193fb8813e9a4', high: this.getRenderProp('high'), label: this.getRenderProp('label'), low: this.getRenderProp('low'), max: this.getRenderProp('max'), min: this.getRenderProp('min'), optimum: this.getRenderProp('optimum'), orientation: this.getRenderProp('orientation'), unit: this.getRenderProp('unit'), value: this.getRenderProp('value') })));
|
|
32504
32468
|
}
|
|
32505
32469
|
static get watchers() { return {
|
|
32506
32470
|
"_high": [{
|
|
@@ -32554,12 +32518,13 @@ class KolMeter extends BaseWebComponent {
|
|
|
32554
32518
|
}; }
|
|
32555
32519
|
}
|
|
32556
32520
|
|
|
32557
|
-
const defaultStyleCss$j = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card :host { display: inline-block; } .kol-card .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-card .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-card .kol-button__interactive-element::before { content: ""; } .kol-card .kol-button__text { flex: 1 0 100%; } .kol-card .kol-button { } .kol-card .kol-button__tooltip { height: 0; } .kol-card .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-card .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-card { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); display: grid; height: 100%; overflow: visible; grid-template-areas: "header close" "content content"; grid-template-columns: 1fr min-content; grid-template-rows: min-content 1fr; } .kol-card__header { align-self: start; grid-area: header; } .kol-card__content { align-self: stretch; grid-area: content; } .kol-card__close-button { grid-area: close; } .kol-card:has(.kol-card__link) { position: relative; } .kol-card__link::after { position: absolute; inset: 0; content: ""; cursor: pointer; } .kol-dialog, .kol-modal { min-height: var(--a11y-min-size); padding: 0; border: 0; overscroll-behavior: contain; } .kol-dialog__close-button, .kol-modal__close-button { position: absolute; top: calc(1 * 1rem / var(--kolibri-root-font-size, 16)); right: calc(1 * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; } }`;
|
|
32521
|
+
const defaultStyleCss$j = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card :host { display: inline-block; } .kol-card .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-card .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-card .kol-button__interactive-element::before { content: ""; } .kol-card .kol-button__text { flex: 1 0 100%; } .kol-card .kol-button { } .kol-card .kol-button__tooltip { height: 0; } .kol-card .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-card .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-card { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); display: grid; height: 100%; overflow: visible; grid-template-areas: "header close" "content content"; grid-template-columns: 1fr min-content; grid-template-rows: min-content 1fr; } .kol-card__header { align-self: start; grid-area: header; } .kol-card__content { align-self: stretch; grid-area: content; } .kol-card__close-button { grid-area: close; } .kol-card:has(.kol-card__link) { position: relative; } .kol-card__link::after { position: absolute; inset: 0; content: ""; cursor: pointer; } .kol-dialog, .kol-modal { min-height: var(--a11y-min-size); padding: 0; border: 0; overscroll-behavior: contain; } .kol-dialog__close-button, .kol-modal__close-button { position: absolute; top: calc(1 * 1rem / var(--kolibri-root-font-size, 16)); right: calc(1 * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; } }`;
|
|
32558
32522
|
|
|
32559
32523
|
class KolModal extends BaseDialogWebComponent {
|
|
32560
32524
|
constructor(hostRef) {
|
|
32561
|
-
super();
|
|
32562
|
-
|
|
32525
|
+
super(...arguments);
|
|
32526
|
+
if (new.target === KolModal)
|
|
32527
|
+
registerInstance(this, hostRef);
|
|
32563
32528
|
this.ariaDescriptionId = nonce();
|
|
32564
32529
|
this.headingId = createUniqueId('dialog-heading');
|
|
32565
32530
|
this.modal = true;
|
|
@@ -32613,7 +32578,7 @@ class KolModal extends BaseDialogWebComponent {
|
|
|
32613
32578
|
return hAsync("slot", null);
|
|
32614
32579
|
}
|
|
32615
32580
|
render() {
|
|
32616
|
-
return hAsync(Host, { key: '
|
|
32581
|
+
return hAsync(Host, { key: '6d608d4ae09933551fc6641cfd419f39bc6e09ea' }, this.renderDialogFC());
|
|
32617
32582
|
}
|
|
32618
32583
|
get host() { return getElement(this); }
|
|
32619
32584
|
static get watchers() { return {
|
|
@@ -32906,12 +32871,13 @@ const NavFC = (props) => {
|
|
|
32906
32871
|
}))))))));
|
|
32907
32872
|
};
|
|
32908
32873
|
|
|
32909
|
-
const defaultStyleCss$i = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=
|
|
32874
|
+
const defaultStyleCss$i = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-nav { display: grid; place-items: center; } .kol-nav:not(.kol-nav--is-compact) .kol-nav__navigation { width: 100%; } .kol-nav__navigation .kol-span { width: 100%; justify-content: flex-start; } .kol-nav__navigation .kol-span__container { width: 100%; } .kol-nav__navigation .kol-span__container .kol-span__label { flex: 1; } .kol-nav__list { display: flex; margin: 0; padding: 0; flex-direction: column; list-style: none; } .kol-nav__entry-wrapper { display: flex; } .kol-nav__entry { flex-grow: 1; } .kol-button { text-align: left; } }`;
|
|
32910
32875
|
|
|
32911
32876
|
class KolNav extends BaseWebComponent {
|
|
32912
32877
|
constructor(hostRef) {
|
|
32913
|
-
super();
|
|
32914
|
-
|
|
32878
|
+
super(...arguments);
|
|
32879
|
+
if (new.target === KolNav)
|
|
32880
|
+
registerInstance(this, hostRef);
|
|
32915
32881
|
this.compact = false;
|
|
32916
32882
|
this.expandedChildren = [];
|
|
32917
32883
|
this.navId = createUniqueId('kol-nav');
|
|
@@ -32984,7 +32950,7 @@ class KolNav extends BaseWebComponent {
|
|
|
32984
32950
|
render() {
|
|
32985
32951
|
this.buttonItems.beginRender();
|
|
32986
32952
|
this.linkItems.beginRender();
|
|
32987
|
-
return (hAsync(Host, { key: '
|
|
32953
|
+
return (hAsync(Host, { key: 'b6060fa9735e6b48fdf405b78f88b7228d5b3025' }, hAsync(NavFC, { key: 'a6e3be60d059c75e5e868e009a83530e34e01b1d', collapsible: this.getRenderProp('collapsible'), compact: this.compact, expandedChildren: this.expandedChildren, getButtonFcProps: this.getButtonFcProps, getLinkFcProps: this.getLinkFcProps, handleToggleCompact: this.handleToggleCompact, handleToggleExpansion: this.handleToggleExpansion, hasCompactButton: this.getRenderProp('hasCompactButton'), hasIconsWhenExpanded: this.getRenderProp('hasIconsWhenExpanded'), label: this.getRenderProp('label'), links: this.getRenderProp('links'), listId: this.listId, navId: this.navId })));
|
|
32988
32954
|
}
|
|
32989
32955
|
get host() { return getElement(this); }
|
|
32990
32956
|
static get watchers() { return {
|
|
@@ -33030,8 +32996,8 @@ class KolNav extends BaseWebComponent {
|
|
|
33030
32996
|
}
|
|
33031
32997
|
|
|
33032
32998
|
const paginationPropsConfig = {
|
|
33033
|
-
required: [pageProp, paginationCallbacksProp, paginationMaxProp],
|
|
33034
|
-
optional: [boundaryCountProp, customClassProp,
|
|
32999
|
+
required: [labelProp, pageProp, paginationCallbacksProp, paginationMaxProp],
|
|
33000
|
+
optional: [boundaryCountProp, customClassProp, pageSizeOptionsProp, pageSizeProp, paginationHasButtonsProp, siblingCountProp, tooltipAlignProp],
|
|
33035
33001
|
};
|
|
33036
33002
|
|
|
33037
33003
|
const getPageCount = (max, pageSize = 1) => Math.ceil(max / pageSize);
|
|
@@ -33109,7 +33075,7 @@ const PaginationContentFC = (props) => {
|
|
|
33109
33075
|
const pageButton = (item, selected) => {
|
|
33110
33076
|
const pageText = NUMBER_FORMATTER.format(item);
|
|
33111
33077
|
const ariaDescription = `${translate('kol-page')} ${pageText}`;
|
|
33112
|
-
return (hAsync("li", { key:
|
|
33078
|
+
return (hAsync("li", { key: `page-${item}` }, selected ? (hAsync(ButtonFC, Object.assign({}, getButtonFcProps(`page-${item}`, { _ariaDescription: ariaDescription, _customClass: customClass, _label: pageText }, { 'aria-current': 'page', class: `${paginationBem('button', { selected: true })} selected` })))) : (hAsync(ButtonFC, Object.assign({}, getButtonFcProps(`page-${item}`, {
|
|
33113
33079
|
_ariaDescription: ariaDescription,
|
|
33114
33080
|
_customClass: customClass,
|
|
33115
33081
|
_label: pageText,
|
|
@@ -33124,7 +33090,7 @@ const PaginationContentFC = (props) => {
|
|
|
33124
33090
|
total: NUMBER_FORMATTER.format(max),
|
|
33125
33091
|
},
|
|
33126
33092
|
})),
|
|
33127
|
-
hAsync("nav", { class: paginationBem('navigation'), "aria-label": trimLabel(label) }, hAsync("ul", { class: paginationBem('navigation-list') }, hasButtons.first && navigationButton('first', leftDoubleArrowIcon, translate('kol-page-first'), page <= 1), hasButtons.previous && navigationButton('previous', leftSingleArrowIcon, translate('kol-page-back'), page <= 1), getPageItems(page, count, boundaryCount, siblingCount).map((item) => item === null ? null : item === 'separator' ? (hAsync("li", { key:
|
|
33093
|
+
hAsync("nav", { class: paginationBem('navigation'), "aria-label": trimLabel(label) }, hAsync("ul", { class: paginationBem('navigation-list') }, hasButtons.first && navigationButton('first', leftDoubleArrowIcon, translate('kol-page-first'), page <= 1), hasButtons.previous && navigationButton('previous', leftSingleArrowIcon, translate('kol-page-back'), page <= 1), getPageItems(page, count, boundaryCount, siblingCount).map((item, index) => item === null ? null : item === 'separator' ? (hAsync("li", { key: index + 1 < page ? 'separator-left' : 'separator-right' }, hAsync("span", { class: paginationBem('separator'), "aria-hidden": "true" }))) : (pageButton(item.page, item.selected))), hasButtons.next && navigationButton('next', rightSingleArrowIcon, translate('kol-page-next'), count <= page), hasButtons.last && navigationButton('last', rightDoubleArrowIcon, translate('kol-page-last'), count <= page))),
|
|
33128
33094
|
(pageSizeOptions === null || pageSizeOptions === void 0 ? void 0 : pageSizeOptions.length) > 0 && (hAsync("div", { class: "page-size" }, hAsync("div", { class: paginationBem('page-size-select') }, renderPageSizeSelect({ label: translate('kol-entries-per-site'), options: pageSizeOptions, value: pageSize })))),
|
|
33129
33095
|
];
|
|
33130
33096
|
};
|
|
@@ -33460,6 +33426,7 @@ const createPaginationItem = (options) => {
|
|
|
33460
33426
|
const pageSizeSelects = createItemPool(() => new PageSizeSelect(options.getEventTarget, options.requestRender), (select) => select.sync(), (select) => select.destroy());
|
|
33461
33427
|
let pageSizeValue = 1;
|
|
33462
33428
|
let applied = {};
|
|
33429
|
+
let pendingFocusPage;
|
|
33463
33430
|
store.set('label', translatePagination);
|
|
33464
33431
|
const reportPageChange = (event, page) => {
|
|
33465
33432
|
setTimeout(() => {
|
|
@@ -33488,15 +33455,28 @@ const createPaginationItem = (options) => {
|
|
|
33488
33455
|
syncPage(store.get('page'), resolved, store.get('max'));
|
|
33489
33456
|
});
|
|
33490
33457
|
};
|
|
33491
|
-
const applyLabel = (value, initial) => {
|
|
33458
|
+
const applyLabel = (value, initial, required) => {
|
|
33492
33459
|
if (!initial) {
|
|
33493
33460
|
removeNavLabel(store.get('label'));
|
|
33494
33461
|
}
|
|
33495
|
-
labelProp.apply(value !== null &&
|
|
33462
|
+
labelProp.apply(value, (v) => store.set('label', v !== null && v !== void 0 ? v : translatePagination), required);
|
|
33496
33463
|
addNavLabel(store.get('label'));
|
|
33497
33464
|
};
|
|
33465
|
+
const restorePageFocus = () => {
|
|
33466
|
+
if (pendingFocusPage === undefined || pendingFocusPage !== store.get('page')) {
|
|
33467
|
+
return;
|
|
33468
|
+
}
|
|
33469
|
+
pendingFocusPage = undefined;
|
|
33470
|
+
const button = buttons.get(`page-${store.get('page')}`).getElement();
|
|
33471
|
+
const root = button === null || button === void 0 ? void 0 : button.getRootNode();
|
|
33472
|
+
const focusLost = !(root === null || root === void 0 ? void 0 : root.activeElement) && (document.activeElement === null || document.activeElement === document.body);
|
|
33473
|
+
if ((button === null || button === void 0 ? void 0 : button.isConnected) && focusLost) {
|
|
33474
|
+
button.focus();
|
|
33475
|
+
}
|
|
33476
|
+
};
|
|
33498
33477
|
const handlePageClick = (event, page) => {
|
|
33499
33478
|
var _a, _b;
|
|
33479
|
+
pendingFocusPage = page;
|
|
33500
33480
|
(_b = (_a = store.get('on')).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, event, page);
|
|
33501
33481
|
const target = options.getEventTarget();
|
|
33502
33482
|
if (target) {
|
|
@@ -33533,7 +33513,7 @@ const createPaginationItem = (options) => {
|
|
|
33533
33513
|
applyBoundaryCount: (value) => boundaryCountProp.apply(value, (v) => store.set('boundaryCount', v)),
|
|
33534
33514
|
applyCustomClass: (value) => customClassProp.apply(value, (v) => store.set('customClass', v)),
|
|
33535
33515
|
applyHasButtons: (value) => paginationHasButtonsProp.apply(value, (v) => store.set('hasButtons', Object.assign(Object.assign({}, store.get('hasButtons')), v))),
|
|
33536
|
-
applyLabel: (value) => applyLabel(value, false),
|
|
33516
|
+
applyLabel: (value, required) => applyLabel(value, false, required),
|
|
33537
33517
|
applyMax: (value) => {
|
|
33538
33518
|
if (value === undefined || value === null) {
|
|
33539
33519
|
return;
|
|
@@ -33618,6 +33598,7 @@ const createPaginationItem = (options) => {
|
|
|
33618
33598
|
sync: () => {
|
|
33619
33599
|
buttons.endRender();
|
|
33620
33600
|
pageSizeSelects.endRender();
|
|
33601
|
+
restorePageFocus();
|
|
33621
33602
|
},
|
|
33622
33603
|
destroy: () => {
|
|
33623
33604
|
removeNavLabel(store.get('label'));
|
|
@@ -33641,17 +33622,17 @@ const createPaginationItem = (options) => {
|
|
|
33641
33622
|
return item;
|
|
33642
33623
|
};
|
|
33643
33624
|
|
|
33644
|
-
const defaultStyleCss$h = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { :host { display: block; } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-select { background-color: transparent; width: 100%; padding: 0; } .kol-select:not(:disabled) { cursor: pointer; } .kol-select:not([multiple], [size]) { height: 2.75em; } .kol-select[multiple][size="1"] { height: 2.75em; } .kol-select__option:checked::before { content: "✓ "; } .kol-select[multiple] option { display: flex; min-height: var(--a11y-min-size); align-items: center; } .kol-select[multiple][size="1"] option::checkmark { height: 100%; } .kol-select[multiple][size="1"] option:checked::before { display: none; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; container: paging/inline-size; } .kol-pagination__navigation-list { display: inline-flex; margin: 0; padding: 0; flex-wrap: wrap; align-items: center; list-style: none; } .kol-pagination__separator:before { content: "•••"; } .kol-pagination__page-size-select .kol-form-field-select { align-items: center; grid-template-columns: 1fr max-content; } @container paging (width < 600px) { .kol-pagination:has(.kol-pagination__button--first) li:has(.kol-pagination__button--numbers), .kol-pagination:has(.kol-pagination__button--first) li:has(.kol-pagination__separator) { display: none; } } }`;
|
|
33625
|
+
const defaultStyleCss$h = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { :host { display: block; } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-select { background-color: transparent; width: 100%; padding: 0; } .kol-select:not(:disabled) { cursor: pointer; } .kol-select:not([multiple], [size]) { height: 2.75em; } .kol-select[multiple][size="1"] { height: 2.75em; } .kol-select__option:checked::before { content: "✓ "; } .kol-select[multiple] option { display: flex; min-height: var(--a11y-min-size); align-items: center; } .kol-select[multiple][size="1"] option::checkmark { height: 100%; } .kol-select[multiple][size="1"] option:checked::before { display: none; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; container: paging/inline-size; } .kol-pagination__navigation-list { display: inline-flex; margin: 0; padding: 0; flex-wrap: wrap; align-items: center; list-style: none; } .kol-pagination__separator:before { content: "•••"; } .kol-pagination__page-size-select .kol-form-field-select { align-items: center; grid-template-columns: 1fr max-content; } @container paging (width < 600px) { .kol-pagination:has(.kol-pagination__button--first) li:has(.kol-pagination__button--numbers), .kol-pagination:has(.kol-pagination__button--first) li:has(.kol-pagination__separator) { display: none; } } }`;
|
|
33645
33626
|
|
|
33646
33627
|
class KolPagination extends BaseWebComponent {
|
|
33647
33628
|
constructor(hostRef) {
|
|
33648
|
-
super();
|
|
33649
|
-
|
|
33629
|
+
super(...arguments);
|
|
33630
|
+
if (new.target === KolPagination)
|
|
33631
|
+
registerInstance(this, hostRef);
|
|
33650
33632
|
this.renderCount = 0;
|
|
33651
33633
|
this.propsConfig = paginationPropsConfig;
|
|
33652
33634
|
this._boundaryCount = 1;
|
|
33653
33635
|
this._customClass = undefined;
|
|
33654
|
-
this._label = undefined;
|
|
33655
33636
|
this._hasButtons = true;
|
|
33656
33637
|
this._pageSize = 1;
|
|
33657
33638
|
this._pageSizeOptions = [];
|
|
@@ -33665,7 +33646,7 @@ class KolPagination extends BaseWebComponent {
|
|
|
33665
33646
|
this.item.applyCustomClass(value);
|
|
33666
33647
|
}
|
|
33667
33648
|
watchLabel(value) {
|
|
33668
|
-
this.item.applyLabel(value);
|
|
33649
|
+
this.item.applyLabel(value, this.isRequired('label'));
|
|
33669
33650
|
}
|
|
33670
33651
|
watchHasButtons(value) {
|
|
33671
33652
|
this.item.applyHasButtons(value);
|
|
@@ -33707,7 +33688,6 @@ class KolPagination extends BaseWebComponent {
|
|
|
33707
33688
|
boundaryCount: this._boundaryCount,
|
|
33708
33689
|
customClass: this._customClass,
|
|
33709
33690
|
hasButtons: this._hasButtons,
|
|
33710
|
-
label: this._label,
|
|
33711
33691
|
max: this._max,
|
|
33712
33692
|
on: this._on,
|
|
33713
33693
|
page: this._page,
|
|
@@ -33716,6 +33696,7 @@ class KolPagination extends BaseWebComponent {
|
|
|
33716
33696
|
siblingCount: this._siblingCount,
|
|
33717
33697
|
tooltipAlign: this._tooltipAlign,
|
|
33718
33698
|
});
|
|
33699
|
+
this.item.applyLabel(this._label, this.isRequired('label'));
|
|
33719
33700
|
}
|
|
33720
33701
|
componentDidRender() {
|
|
33721
33702
|
this.item.sync();
|
|
@@ -33724,7 +33705,7 @@ class KolPagination extends BaseWebComponent {
|
|
|
33724
33705
|
this.item.destroy();
|
|
33725
33706
|
}
|
|
33726
33707
|
render() {
|
|
33727
|
-
return (hAsync(Host, { key: '
|
|
33708
|
+
return (hAsync(Host, { key: '5ab5479e8a646e9dc7a6d3092d8d71c151d18d33' }, hAsync(PaginationFC, Object.assign({ key: 'b4deee4d58a35e027f0445f539afa46e92bea5de' }, this.item.getFcProps()))));
|
|
33728
33709
|
}
|
|
33729
33710
|
get host() { return getElement(this); }
|
|
33730
33711
|
static get watchers() { return {
|
|
@@ -33848,12 +33829,13 @@ class BasePopoverButtonWebComponent extends BaseButtonWebComponent {
|
|
|
33848
33829
|
}
|
|
33849
33830
|
}
|
|
33850
33831
|
|
|
33851
|
-
const defaultStyleCss$g = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=
|
|
33832
|
+
const defaultStyleCss$g = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-button__interactive-element::before { content: ""; } .kol-button__text { flex: 1 0 100%; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-popover-button { display: inline; } .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-popover-button--inline { display: inline-block; } .kol-popover-button--inline .kol-button, .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } }`;
|
|
33852
33833
|
|
|
33853
33834
|
class KolPopoverButton extends BasePopoverButtonWebComponent {
|
|
33854
33835
|
constructor(hostRef) {
|
|
33855
33836
|
super();
|
|
33856
|
-
|
|
33837
|
+
if (new.target === KolPopoverButton)
|
|
33838
|
+
registerInstance(this, hostRef);
|
|
33857
33839
|
this.ariaDescriptionId = nonce();
|
|
33858
33840
|
this.popoverOpen = false;
|
|
33859
33841
|
this._accessKey = undefined;
|
|
@@ -33969,7 +33951,7 @@ class KolPopoverButton extends BasePopoverButtonWebComponent {
|
|
|
33969
33951
|
this.destroyPopover();
|
|
33970
33952
|
}
|
|
33971
33953
|
render() {
|
|
33972
|
-
return hAsync(Host, { key: '
|
|
33954
|
+
return hAsync(Host, { key: '291c2254c1443a9d058b89019a13dc3a7cf0deb0' }, this.renderPopoverButtonFC());
|
|
33973
33955
|
}
|
|
33974
33956
|
get host() { return getElement(this); }
|
|
33975
33957
|
static get watchers() { return {
|
|
@@ -34099,15 +34081,16 @@ const ProgressFC = (props) => {
|
|
|
34099
34081
|
const liveValueText = isPercentage
|
|
34100
34082
|
? translate('kol-live-value', { placeholders: { value: String(liveProgressValue), unit } })
|
|
34101
34083
|
: translate('kol-live-value-bounded', { placeholders: { value: String(liveProgressValue), max: String(max), unit } });
|
|
34102
|
-
return (hAsync("div", { class: progressBem() }, hAsync("div", { "aria-hidden": "true", class: progressBem(variant === 'cycle' ? 'cycle' : 'bar') }, variant === 'bar' && label && hAsync("div", { class: progressBem('bar-label') }, renderLabelWithLang(label)), createProgressSVG(variant, max, value), variant === 'cycle' && (hAsync("div", { class: progressBem('cycle-text') }, label && hAsync("div", { class: progressBem('cycle-label') }, renderLabelWithLang(label)), hAsync("div", { class: progressBem('cycle-value') }, `${displayValue} ${unit}`))), variant === 'bar' && (hAsync("div", { class: progressBem('bar-value'), style: { width: valueColumnWidth } }, displayValue)), variant === 'bar' && hAsync("div", { class: progressBem('bar-unit') }, unit)), hAsync("progress", { "aria-busy": value < max ? 'true' : 'false', "aria-label": trimLabel(label), class: "visually-hidden", max: max, value: value }), hAsync("span", { "aria-live": "polite", "aria-relevant": "removals text", class: "visually-hidden" }, liveValueText)));
|
|
34084
|
+
return (hAsync("div", { class: progressBem() }, hAsync("div", { "aria-hidden": "true", class: progressBem(variant === 'cycle' ? 'cycle' : 'bar') }, variant === 'bar' && label && hAsync("div", { class: progressBem('bar-label') }, renderLabelWithLang(label)), createProgressSVG(variant, max, value), variant === 'cycle' && (hAsync("div", { class: progressBem('cycle-text') }, label && hAsync("div", { class: progressBem('cycle-label') }, renderLabelWithLang(label)), hAsync("div", { class: progressBem('cycle-value') }, `${displayValue} ${unit}`))), variant === 'bar' && (hAsync("div", { class: progressBem('bar-value'), style: { width: valueColumnWidth } }, displayValue)), variant === 'bar' && hAsync("div", { class: progressBem('bar-unit') }, unit)), hAsync("progress", { "aria-busy": value < max ? 'true' : 'false', "aria-label": trimLabel(label) || translate('kol-progress'), class: "visually-hidden", max: max, value: value }), hAsync("span", { "aria-live": "polite", "aria-relevant": "removals text", class: "visually-hidden" }, liveValueText)));
|
|
34103
34085
|
};
|
|
34104
34086
|
|
|
34105
34087
|
const defaultStyleCss$f = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { .kol-progress { --color-bar: var(--kol-progress-color-bar, #0075ff); } .kol-progress__bar { display: grid; align-items: center; grid-template-areas: "LABEL LABEL LABEL" "BAR VALUE UNIT"; grid-template-columns: 1fr auto; } .kol-progress__bar-label { grid-column-end: 2; grid-area: LABEL; } .kol-progress__bar svg { grid-area: BAR; } .kol-progress__bar-value { grid-area: VALUE; text-align: right; } .kol-progress__bar-unit { grid-area: UNIT; } .kol-progress__bar-border { fill: transparent; stroke: black; } .kol-progress__bar-background { fill: white; stroke: white; } .kol-progress__bar-progress { fill: var(--color-bar); stroke: transparent; } @media (prefers-reduced-motion: no-preference) { .kol-progress__bar-progress { transition: 250ms ease-in-out 50ms; } } .kol-progress__cycle { display: grid; align-content: center; justify-items: center; grid-template-areas: "ALL"; grid-template-columns: auto; } .kol-progress__cycle > * { grid-area: ALL; } .kol-progress__cycle-text { display: flex; flex-direction: column; justify-content: center; font-size: x-small; text-align: center; } .kol-progress__cycle-text * { background-color: white; } .kol-progress__cycle-background { fill: transparent; stroke: white; } .kol-progress__cycle-border { fill: transparent; stroke: black; } .kol-progress__cycle-whitespace { fill: transparent; stroke: white; } .kol-progress__cycle-progress { transform: rotate(-90deg); transform-origin: 50% 50%; fill: transparent; stroke: var(--color-bar); } @media (prefers-reduced-motion: no-preference) { .kol-progress__cycle-progress { transition: 250ms ease-in-out 50ms; } } }`;
|
|
34106
34088
|
|
|
34107
34089
|
class KolProgress extends BaseWebComponent {
|
|
34108
34090
|
constructor(hostRef) {
|
|
34109
|
-
super();
|
|
34110
|
-
|
|
34091
|
+
super(...arguments);
|
|
34092
|
+
if (new.target === KolProgress)
|
|
34093
|
+
registerInstance(this, hostRef);
|
|
34111
34094
|
this.liveValue = 0;
|
|
34112
34095
|
this.propsConfig = progressPropsConfig;
|
|
34113
34096
|
this._label = undefined;
|
|
@@ -34135,6 +34118,9 @@ class KolProgress extends BaseWebComponent {
|
|
|
34135
34118
|
watchVariant(value) {
|
|
34136
34119
|
variantProgressProp.apply(value, (v) => this.setRenderProp('variant', v));
|
|
34137
34120
|
}
|
|
34121
|
+
connectedCallback() {
|
|
34122
|
+
this.startLiveValueInterval();
|
|
34123
|
+
}
|
|
34138
34124
|
componentWillLoad() {
|
|
34139
34125
|
labelLangSegmentsProp.apply(this._label, (v) => this.setRenderProp('label', v), this.isRequired('label'));
|
|
34140
34126
|
maxProp.apply(this._max, (v) => {
|
|
@@ -34145,7 +34131,6 @@ class KolProgress extends BaseWebComponent {
|
|
|
34145
34131
|
this.watchValue(this._value);
|
|
34146
34132
|
variantProgressProp.apply(this._variant, (v) => this.setRenderProp('variant', v));
|
|
34147
34133
|
this.setState('liveValue', this.getRenderProp('value'));
|
|
34148
|
-
this.startLiveValueInterval();
|
|
34149
34134
|
}
|
|
34150
34135
|
disconnectedCallback() {
|
|
34151
34136
|
if (this.interval) {
|
|
@@ -34154,13 +34139,14 @@ class KolProgress extends BaseWebComponent {
|
|
|
34154
34139
|
}
|
|
34155
34140
|
}
|
|
34156
34141
|
startLiveValueInterval() {
|
|
34142
|
+
clearInterval(this.interval);
|
|
34157
34143
|
this.interval = setInterval(() => {
|
|
34158
34144
|
const value = this.getRenderProp('value');
|
|
34159
34145
|
this.setState('liveValue', value);
|
|
34160
34146
|
}, 5000);
|
|
34161
34147
|
}
|
|
34162
34148
|
render() {
|
|
34163
|
-
return (hAsync(Host, { key: '
|
|
34149
|
+
return (hAsync(Host, { key: '28feb371878c4752f632384d8ae056924bcee1a6' }, hAsync(ProgressFC, { key: '3371391ceac0c5940d67445c8cf5ce2a057a7fee', label: this.getRenderProp('label'), max: this.getRenderProp('max'), unit: this.getRenderProp('unit'), value: this.getRenderProp('value'), variant: this.getRenderProp('variant'), liveValue: this.liveValue })));
|
|
34164
34150
|
}
|
|
34165
34151
|
static get watchers() { return {
|
|
34166
34152
|
"_label": [{
|
|
@@ -34220,8 +34206,9 @@ const defaultStyleCss$e = () => `@charset "UTF-8"; @layer kol-a11y, kol-glob
|
|
|
34220
34206
|
|
|
34221
34207
|
class KolQuote extends BaseWebComponent {
|
|
34222
34208
|
constructor(hostRef) {
|
|
34223
|
-
super();
|
|
34224
|
-
|
|
34209
|
+
super(...arguments);
|
|
34210
|
+
if (new.target === KolQuote)
|
|
34211
|
+
registerInstance(this, hostRef);
|
|
34225
34212
|
this.propsConfig = quotePropsConfig;
|
|
34226
34213
|
this._label = undefined;
|
|
34227
34214
|
this._variant = 'inline';
|
|
@@ -34245,7 +34232,7 @@ class KolQuote extends BaseWebComponent {
|
|
|
34245
34232
|
variantQuoteProp.apply(this._variant, (v) => this.setRenderProp('variant', v));
|
|
34246
34233
|
}
|
|
34247
34234
|
render() {
|
|
34248
|
-
return (hAsync(Host, { key: '
|
|
34235
|
+
return (hAsync(Host, { key: '52c8ca2c634034fa8ad7347a66d04e731f2c661c' }, hAsync(QuoteFC, { key: 'f1068378b769a5b4645ca5e97d0e641442d7f6b4', href: this.getRenderProp('href'), label: this.getRenderProp('label'), quote: this.getRenderProp('quote'), variant: this.getRenderProp('variant') })));
|
|
34249
34236
|
}
|
|
34250
34237
|
static get watchers() { return {
|
|
34251
34238
|
"_href": [{
|
|
@@ -34279,12 +34266,13 @@ class KolQuote extends BaseWebComponent {
|
|
|
34279
34266
|
}; }
|
|
34280
34267
|
}
|
|
34281
34268
|
|
|
34282
|
-
const defaultStyleCss$d = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-select { background-color: transparent; width: 100%; padding: 0; } .kol-select:not(:disabled) { cursor: pointer; } .kol-select:not([multiple], [size]) { height: 2.75em; } .kol-select[multiple][size="1"] { height: 2.75em; } .kol-select__option:checked::before { content: "✓ "; } .kol-select[multiple] option { display: flex; min-height: var(--a11y-min-size); align-items: center; } .kol-select[multiple][size="1"] option::checkmark { height: 100%; } .kol-select[multiple][size="1"] option:checked::before { display: none; } }`;
|
|
34269
|
+
const defaultStyleCss$d = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-select { background-color: transparent; width: 100%; padding: 0; } .kol-select:not(:disabled) { cursor: pointer; } .kol-select:not([multiple], [size]) { height: 2.75em; } .kol-select[multiple][size="1"] { height: 2.75em; } .kol-select__option:checked::before { content: "✓ "; } .kol-select[multiple] option { display: flex; min-height: var(--a11y-min-size); align-items: center; } .kol-select[multiple][size="1"] option::checkmark { height: 100%; } .kol-select[multiple][size="1"] option:checked::before { display: none; } }`;
|
|
34283
34270
|
|
|
34284
34271
|
class KolSelect extends BaseSelectWebComponent {
|
|
34285
34272
|
constructor(hostRef) {
|
|
34286
34273
|
super();
|
|
34287
|
-
|
|
34274
|
+
if (new.target === KolSelect)
|
|
34275
|
+
registerInstance(this, hostRef);
|
|
34288
34276
|
this.id = createUniqueId('select');
|
|
34289
34277
|
this.infoPopoverOpen = false;
|
|
34290
34278
|
this.inputHasFocus = false;
|
|
@@ -34427,7 +34415,7 @@ class KolSelect extends BaseSelectWebComponent {
|
|
|
34427
34415
|
return this._shortKey;
|
|
34428
34416
|
}
|
|
34429
34417
|
render() {
|
|
34430
|
-
return hAsync(Host, { key: '
|
|
34418
|
+
return hAsync(Host, { key: '9c197a18d87d1514983d873fd2912ffc2fc48385', class: "kol-select" }, this.renderSelectField());
|
|
34431
34419
|
}
|
|
34432
34420
|
get host() { return getElement(this); }
|
|
34433
34421
|
static get watchers() { return {
|
|
@@ -34566,14 +34554,16 @@ const customSuggestionsToggleBem = bem.forBlock('kol-custom-suggestions-toggle')
|
|
|
34566
34554
|
const BEM_CLASS_SINGLE_SELECT__DELETE = singleSelectBem('delete');
|
|
34567
34555
|
const BEM_CLASS_SINGLE_SELECT__NO_RESULTS_MESSAGE = singleSelectBem('no-results-message');
|
|
34568
34556
|
const SingleSelectToggleFC = ({ disabled, handleClick }) => (hAsync(IconFC, { icons: "kolicon-chevron-down", label: "", class: customSuggestionsToggleBem({ disabled }), onClick: handleClick }));
|
|
34569
|
-
const SingleSelectNoResultsFC = ({ message }) =>
|
|
34557
|
+
const SingleSelectNoResultsFC = ({ message }) => hAsync("div", { class: BEM_CLASS_SINGLE_SELECT__NO_RESULTS_MESSAGE }, message, " ");
|
|
34558
|
+
const SingleSelectNoResultsStatusFC = ({ message }) => (hAsync("span", { class: "visually-hidden", role: "status" }, message));
|
|
34570
34559
|
|
|
34571
|
-
const defaultStyleCss$c = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-custom-suggestions-option { line-height: 1.5; white-space: normal; overflow-wrap: break-word; } .kol-custom-suggestions-option:not(.kol-custom-suggestions-option--disabled) { cursor: pointer; } .kol-custom-suggestions-options-group--cursor-hidden .kol-custom-suggestions-option { cursor: none !important; } .kol-custom-suggestions-option--disabled, .kol-custom-suggestions-option--disabled * { cursor: not-allowed; } .kol-custom-suggestions-options-group { background-color: white; display: block; position: absolute; z-index: 2; max-height: calc(250 * 1rem / var(--kolibri-root-font-size, 16)); margin: 0; padding: 0; overflow-x: hidden; overflow-y: auto; list-style-type: none; } .kol-input-container:has(.kol-custom-suggestions-options-group--open) { z-index: 10; } .kol-custom-suggestions-toggle { display: flex; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; justify-content: center; cursor: default; } .kol-custom-suggestions-toggle.kol-custom-suggestions-toggle--disabled { cursor: not-allowed; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-single-select { } .kol-single-select__group .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-single-select__group :host { display: inline-block; } .kol-single-select__group .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-single-select__group .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-single-select__group .kol-button__interactive-element::before { content: ""; } .kol-single-select__group .kol-button__text { flex: 1 0 100%; } .kol-single-select__group .kol-button { } .kol-single-select__group .kol-button__tooltip { height: 0; } .kol-single-select__group .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-single-select__group .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-single-select__no-results-message { display: flex; min-height: calc(50 * 1rem / var(--kolibri-root-font-size, 16)); align-items: center; justify-content: center; cursor: default; } .kol-single-select .kol-custom-suggestions-options-group { max-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16) * var(--visible-options, 5) + 2 * 1rem / var(--kolibri-root-font-size, 16)) !important; } .kol-single-select--open .kol-custom-suggestions-toggle { transform: rotate(180deg); } .kol-custom-suggestions-toggle:not(.kol-custom-suggestions-toggle--disabled) { cursor: pointer; } }`;
|
|
34560
|
+
const defaultStyleCss$c = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-custom-suggestions-option { line-height: 1.5; white-space: normal; overflow-wrap: break-word; } .kol-custom-suggestions-option:not(.kol-custom-suggestions-option--disabled) { cursor: pointer; } .kol-custom-suggestions-options-group--cursor-hidden .kol-custom-suggestions-option { cursor: none !important; } .kol-custom-suggestions-option--disabled, .kol-custom-suggestions-option--disabled * { cursor: not-allowed; } .kol-custom-suggestions-options-group { background-color: white; display: block; position: absolute; z-index: 2; max-height: calc(250 * 1rem / var(--kolibri-root-font-size, 16)); margin: 0; padding: 0; overflow-x: hidden; overflow-y: auto; list-style-type: none; } .kol-input-container:has(.kol-custom-suggestions-options-group--open) { z-index: 10; } .kol-custom-suggestions-toggle { display: flex; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; justify-content: center; cursor: default; } .kol-custom-suggestions-toggle.kol-custom-suggestions-toggle--disabled { cursor: not-allowed; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-input { background-color: transparent; width: 100%; min-width: var(--a11y-min-size); } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-single-select { } .kol-single-select__group .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-single-select__group :host { display: inline-block; } .kol-single-select__group .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-single-select__group .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-single-select__group .kol-button__interactive-element::before { content: ""; } .kol-single-select__group .kol-button__text { flex: 1 0 100%; } .kol-single-select__group .kol-button { } .kol-single-select__group .kol-button__tooltip { height: 0; } .kol-single-select__group .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-single-select__group .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-single-select__no-results-message { display: flex; min-height: calc(50 * 1rem / var(--kolibri-root-font-size, 16)); align-items: center; justify-content: center; cursor: default; } .kol-single-select .kol-custom-suggestions-options-group { max-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16) * var(--visible-options, 5) + 2 * 1rem / var(--kolibri-root-font-size, 16)) !important; } .kol-single-select--open .kol-custom-suggestions-toggle { transform: rotate(180deg); } .kol-custom-suggestions-toggle:not(.kol-custom-suggestions-toggle--disabled) { cursor: pointer; } }`;
|
|
34572
34561
|
|
|
34573
34562
|
class KolSingleSelect extends BaseListboxWebComponent {
|
|
34574
34563
|
constructor(hostRef) {
|
|
34575
34564
|
super();
|
|
34576
|
-
|
|
34565
|
+
if (new.target === KolSingleSelect)
|
|
34566
|
+
registerInstance(this, hostRef);
|
|
34577
34567
|
this.id = createUniqueId('single-select');
|
|
34578
34568
|
this.infoPopoverOpen = false;
|
|
34579
34569
|
this.inputHasFocus = false;
|
|
@@ -34924,9 +34914,12 @@ class KolSingleSelect extends BaseListboxWebComponent {
|
|
|
34924
34914
|
label,
|
|
34925
34915
|
disabled, name: this.getRenderProp('name') || undefined }, (accessKey ? { accessKey } : {})), { value: this.inputValue, required: this.getRenderProp('required') }), (placeholder ? { placeholder } : {})), { touched: this.getRenderProp('touched'), msg: this.getRenderProp('msg') }), (shortKey ? { 'aria-keyshortcuts': shortKey } : {})), { 'aria-activedescendant': this.getActiveDescendant(), 'aria-autocomplete': 'both', 'aria-controls': createRelatedUniqueId(id, 'listbox'), 'aria-describedby': ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined, 'aria-expanded': this.isOpen ? 'true' : 'false', 'aria-label': hideLabel && typeof label === 'string' ? label : undefined, 'aria-labelledby': createRelatedUniqueId(id, 'label'), autocapitalize: 'off', autocorrect: 'off', autocomplete: 'off', class: 'kol-single-select__input', ref: this.ctaRef, role: 'combobox', type: 'text', onBlur: this.handleInputBlur, onChange: this.handleSingleSelectChange, onClick: this.handleSingleSelectClick, onFocus: this.handleFocus, onInput: this.handleSingleSelectInput, onKeyDown: this.handleKeyDown, ariaDescribedBy, 'aria-invalid': hasError ? 'true' : undefined });
|
|
34926
34916
|
}
|
|
34917
|
+
hasNoResults() {
|
|
34918
|
+
return !Array.isArray(this.filteredOptions) || this.filteredOptions.length === 0;
|
|
34919
|
+
}
|
|
34927
34920
|
renderOptions() {
|
|
34928
|
-
if (
|
|
34929
|
-
return
|
|
34921
|
+
if (this.hasNoResults()) {
|
|
34922
|
+
return [];
|
|
34930
34923
|
}
|
|
34931
34924
|
return this.filteredOptions.map((option, index) => (hAsync(CustomSuggestionsOptionFC, { id: this.getOptionId(index), index: index, option: option.label, searchTerm: this.inputValue, ref: (el) => {
|
|
34932
34925
|
if (el)
|
|
@@ -34956,14 +34949,15 @@ class KolSingleSelect extends BaseListboxWebComponent {
|
|
|
34956
34949
|
render() {
|
|
34957
34950
|
var _a;
|
|
34958
34951
|
const isDisabled = this.getRenderProp('disabled') === true;
|
|
34952
|
+
const showNoResults = this.isOpen && !isDisabled && this.hasNoResults();
|
|
34959
34953
|
const { startAdornment, endAdornment } = getInputAdornments({ icons: this.getRenderProp('icons') });
|
|
34960
|
-
return (hAsync(Host, { key: '
|
|
34954
|
+
return (hAsync(Host, { key: 'e97d74740ca2641fc9e91808f9823a434f329ebe' }, hAsync(FormFieldFC, Object.assign({ key: '427af456c8f187427acac404fec841b03e32fea4' }, this.getFormFieldProps({
|
|
34961
34955
|
class: clsx('kol-single-select', { 'kol-single-select--open': this.isOpen }),
|
|
34962
34956
|
accessKey: this.getRenderProp('accessKey') || undefined,
|
|
34963
34957
|
shortKey: this.getRenderProp('shortKey') || undefined,
|
|
34964
34958
|
required: this.getRenderProp('required'),
|
|
34965
34959
|
variant: this.getRenderProp('variant'),
|
|
34966
|
-
})), hAsync(InputContainerFC, { key: '
|
|
34960
|
+
})), hAsync(InputContainerFC, { key: '0f292e23326941a0aab511890178b149dc9c4d44', disabled: isDisabled, msg: this.getRenderProp('msg'), touched: this.getRenderProp('touched'), startAdornment: startAdornment, endAdornment: endAdornment }, hAsync(ListboxGroupFC, { key: '86094880cdb9246187fca259826e3a8d7772c7e9', block: "kol-single-select" }, hAsync(InputFC, Object.assign({ key: '66de3c681eccffe2a7bad31fcf62b9af5a3be5ee' }, this.getInputProps())), this.inputValue && this.getRenderProp('hasClearButton') && (hAsync(ButtonFC, Object.assign({ key: '8c45914b4492116e1c3065b552a2bc03a5ae905f' }, this.clearButton.getFcProps({
|
|
34967
34961
|
_icons: 'kolicon-cross',
|
|
34968
34962
|
_label: this.translateDeleteSelection,
|
|
34969
34963
|
_hideLabel: true,
|
|
@@ -34974,7 +34968,7 @@ class KolSingleSelect extends BaseListboxWebComponent {
|
|
|
34974
34968
|
onFocus: this.handleClearButtonFocus,
|
|
34975
34969
|
onBlur: this.handleClearButtonBlur,
|
|
34976
34970
|
},
|
|
34977
|
-
}, { class: BEM_CLASS_SINGLE_SELECT__DELETE, hidden: isDisabled })))), hAsync(SingleSelectToggleFC, { key: '
|
|
34971
|
+
}, { class: BEM_CLASS_SINGLE_SELECT__DELETE, hidden: isDisabled })))), hAsync(SingleSelectToggleFC, { key: '149196f27fb6d7b239ec867c90665ac4d9f811e3', disabled: isDisabled, handleClick: this.toggleListbox })), hAsync(CustomSuggestionsOptionsGroupFC, { key: '927d007b04a6e25651dd25abb2d2baba3b1b4375', blockSuggestionMouseOver: this.blockSuggestionMouseOver, onKeyDown: this.handleDropdownKeyDown, style: { '--visible-options': `${(_a = this.getRenderProp('rows')) !== null && _a !== void 0 ? _a : 5}` }, hidden: !this.isOpen || isDisabled, id: createRelatedUniqueId(this.id, 'listbox'), "aria-labelledby": createRelatedUniqueId(this.id, 'label') }, this.renderOptions()), showNoResults && hAsync(SingleSelectNoResultsFC, { key: '98763dadb3abece49ebfcf4a0c07b73302cddd2f', message: this.translateNoResultsMessage }), hAsync(SingleSelectNoResultsStatusFC, { key: 'b8783feb1b6693c0ddab9add1e1123624f30a578', message: showNoResults ? this.translateNoResultsMessage : '' })))));
|
|
34978
34972
|
}
|
|
34979
34973
|
get host() { return getElement(this); }
|
|
34980
34974
|
static get watchers() { return {
|
|
@@ -35097,111 +35091,6 @@ __decorate([
|
|
|
35097
35091
|
delegateFocus('ctaRef')
|
|
35098
35092
|
], KolSingleSelect.prototype, "focus", null);
|
|
35099
35093
|
|
|
35100
|
-
const skeletonPropsConfig = {
|
|
35101
|
-
required: [nameProp],
|
|
35102
|
-
};
|
|
35103
|
-
|
|
35104
|
-
const skeletonBem = bem.forBlock('kol-skeleton');
|
|
35105
|
-
const BEM_CLASS_SKELETON__ACTIONS = skeletonBem('actions');
|
|
35106
|
-
const BEM_CLASS_SKELETON__CONTAINER = skeletonBem('container');
|
|
35107
|
-
const BEM_CLASS_SKELETON__COUNTER = skeletonBem('counter');
|
|
35108
|
-
const BEM_CLASS_SKELETON__NAME = skeletonBem('name');
|
|
35109
|
-
const SkeletonFC = (props) => {
|
|
35110
|
-
const { count, label, name, show, handleClick, refButton } = props;
|
|
35111
|
-
const hasName = !!(show && (name === null || name === void 0 ? void 0 : name.trim()));
|
|
35112
|
-
const BEM_CLASS_ROOT = skeletonBem({
|
|
35113
|
-
'has-name': hasName,
|
|
35114
|
-
'is-hidden': !show,
|
|
35115
|
-
});
|
|
35116
|
-
return (hAsync("div", { class: BEM_CLASS_ROOT }, hAsync("div", { class: BEM_CLASS_SKELETON__CONTAINER }, hasName && hAsync("span", { class: BEM_CLASS_SKELETON__NAME }, name), hAsync("div", { class: BEM_CLASS_SKELETON__COUNTER }, "Count: ", count)), hAsync("div", { class: BEM_CLASS_SKELETON__ACTIONS }, hAsync(ClickButtonFC, { label: label, handleClick: handleClick, refButton: refButton }))));
|
|
35117
|
-
};
|
|
35118
|
-
|
|
35119
|
-
class KolSkeleton extends BaseWebComponent {
|
|
35120
|
-
constructor(hostRef) {
|
|
35121
|
-
super();
|
|
35122
|
-
registerInstance(this, hostRef);
|
|
35123
|
-
this.loaded = createEvent(this, "loaded");
|
|
35124
|
-
this.rendered = createEvent(this, "rendered");
|
|
35125
|
-
this.count = 0;
|
|
35126
|
-
this.label = 'Label';
|
|
35127
|
-
this.show = true;
|
|
35128
|
-
this.buttonRef = createCtaRef();
|
|
35129
|
-
this.propsConfig = skeletonPropsConfig;
|
|
35130
|
-
this.handleClick = () => {
|
|
35131
|
-
var _a;
|
|
35132
|
-
Log.debug('Button clicked, count should be increased');
|
|
35133
|
-
this.setState('count', ((_a = this.getState('count')) !== null && _a !== void 0 ? _a : 0) + 1);
|
|
35134
|
-
};
|
|
35135
|
-
}
|
|
35136
|
-
watchName(value) {
|
|
35137
|
-
nameProp.apply(value, (v) => this.setRenderProp('name', v));
|
|
35138
|
-
}
|
|
35139
|
-
focus(options) {
|
|
35140
|
-
return Promise.resolve();
|
|
35141
|
-
}
|
|
35142
|
-
async toggle() {
|
|
35143
|
-
var _a;
|
|
35144
|
-
this.setState('show', !((_a = this.getState('show')) !== null && _a !== void 0 ? _a : false));
|
|
35145
|
-
return Promise.resolve();
|
|
35146
|
-
}
|
|
35147
|
-
componentWillLoad() {
|
|
35148
|
-
nameProp.apply(this._name, (v) => this.setRenderProp('name', v));
|
|
35149
|
-
this.intervalId = setInterval(() => {
|
|
35150
|
-
var _a;
|
|
35151
|
-
this.loaded.emit((_a = this.getState('count')) !== null && _a !== void 0 ? _a : 0);
|
|
35152
|
-
}, 2000);
|
|
35153
|
-
}
|
|
35154
|
-
componentDidLoad() {
|
|
35155
|
-
requestAnimationFrame(() => {
|
|
35156
|
-
this.rendered.emit();
|
|
35157
|
-
});
|
|
35158
|
-
}
|
|
35159
|
-
disconnectedCallback() {
|
|
35160
|
-
if (this.intervalId) {
|
|
35161
|
-
clearInterval(this.intervalId);
|
|
35162
|
-
this.intervalId = undefined;
|
|
35163
|
-
}
|
|
35164
|
-
}
|
|
35165
|
-
handleKeyDown(event) {
|
|
35166
|
-
if (event.key === 'Enter' || event.key === ' ') {
|
|
35167
|
-
Log.debug('button pressed');
|
|
35168
|
-
this.handleClick();
|
|
35169
|
-
}
|
|
35170
|
-
}
|
|
35171
|
-
onKeydown(event) {
|
|
35172
|
-
if (event.key === 'Escape') {
|
|
35173
|
-
Log.debug('Show should be toggled');
|
|
35174
|
-
void this.toggle();
|
|
35175
|
-
}
|
|
35176
|
-
}
|
|
35177
|
-
render() {
|
|
35178
|
-
return (hAsync(Host, { key: '2271ed7e088c9b6a22a993bdc0b1404cd732b7e8' }, hAsync(SkeletonFC, { key: '011fa40defd6913b8156dd4eca6a65cf551d233a', count: this.count, label: this.label, name: this.getRenderProp('name'), handleClick: this.handleClick, onLoaded: this.loaded, onRendered: this.rendered, show: this.show, refButton: this.buttonRef })));
|
|
35179
|
-
}
|
|
35180
|
-
static get watchers() { return {
|
|
35181
|
-
"_name": [{
|
|
35182
|
-
"watchName": 0
|
|
35183
|
-
}]
|
|
35184
|
-
}; }
|
|
35185
|
-
static get cmpMeta() { return {
|
|
35186
|
-
"$flags$": 521,
|
|
35187
|
-
"$tagName$": "kol-skeleton",
|
|
35188
|
-
"$members$": {
|
|
35189
|
-
"_name": [1],
|
|
35190
|
-
"count": [32],
|
|
35191
|
-
"label": [32],
|
|
35192
|
-
"show": [32],
|
|
35193
|
-
"focus": [64],
|
|
35194
|
-
"toggle": [64]
|
|
35195
|
-
},
|
|
35196
|
-
"$listeners$": [[0, "keydown", "handleKeyDown"], [8, "keydown", "onKeydown"]],
|
|
35197
|
-
"$lazyBundleId$": "-",
|
|
35198
|
-
"$attrsToReflect$": []
|
|
35199
|
-
}; }
|
|
35200
|
-
}
|
|
35201
|
-
__decorate([
|
|
35202
|
-
delegateFocus('buttonRef')
|
|
35203
|
-
], KolSkeleton.prototype, "focus", null);
|
|
35204
|
-
|
|
35205
35094
|
const skipNavPropsConfig = {
|
|
35206
35095
|
required: [skipNavLinksProp, labelProp],
|
|
35207
35096
|
};
|
|
@@ -35294,12 +35183,13 @@ const createSkipNavLinkItem = (link, getHost) => {
|
|
|
35294
35183
|
};
|
|
35295
35184
|
};
|
|
35296
35185
|
|
|
35297
|
-
const defaultStyleCss$b = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=
|
|
35186
|
+
const defaultStyleCss$b = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-link { display: inline-flex; max-width: fit-content; } .kol-link--standalone { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: stretch; } .kol-link--standalone .kol-link__interactive-element { align-items: stretch; } .kol-link--standalone .kol-link__text { display: inline-flex; flex: 1 1 100%; place-items: center; } .kol-link__interactive-element { display: inline-flex; flex: 1; align-items: baseline; place-items: center; text-align: left; text-decoration-line: none; } .kol-link__interactive-element:focus:not([aria-disabled], [disabled]) .kol-span__label, .kol-link__interactive-element:hover:not([aria-disabled], [disabled]) .kol-span__label { text-decoration-thickness: 0.2em; } .kol-link .kol-span__label { text-decoration-line: underline; } .kol-link__icon { display: inline-flex; } .kol-skip-nav__list { display: grid; place-items: center; list-style: none; } .kol-skip-nav__list-item { height: 0; } .kol-skip-nav .kol-link { position: absolute; left: calc(-99999 * 1rem / var(--kolibri-root-font-size, 16)); z-index: 9999999; line-height: 1; } .kol-skip-nav .kol-link:focus-within { position: unset; left: unset; } .kol-skip-nav .kol-link__interactive-element:focus { background-color: white; } }`;
|
|
35298
35187
|
|
|
35299
35188
|
class KolSkipNav extends BaseWebComponent {
|
|
35300
35189
|
constructor(hostRef) {
|
|
35301
|
-
super();
|
|
35302
|
-
|
|
35190
|
+
super(...arguments);
|
|
35191
|
+
if (new.target === KolSkipNav)
|
|
35192
|
+
registerInstance(this, hostRef);
|
|
35303
35193
|
this.linkItems = [];
|
|
35304
35194
|
this.ctaRef = createCtaRef();
|
|
35305
35195
|
this.propsConfig = skipNavPropsConfig;
|
|
@@ -35342,7 +35232,7 @@ class KolSkipNav extends BaseWebComponent {
|
|
|
35342
35232
|
});
|
|
35343
35233
|
}
|
|
35344
35234
|
render() {
|
|
35345
|
-
return (hAsync(Host, { key: '
|
|
35235
|
+
return (hAsync(Host, { key: '8aa2d416755d0d5b85469b5b5c194ff21a1b8098' }, hAsync(SkipNavFC, { key: '55846a133762dcd8855fc6684801ad4afefbde7e', label: this.getRenderProp('label'), links: this.getRenderProp('links'), linkItems: this.linkItems })));
|
|
35346
35236
|
}
|
|
35347
35237
|
get host() { return getElement(this); }
|
|
35348
35238
|
static get watchers() { return {
|
|
@@ -35400,8 +35290,9 @@ const defaultStyleCss$a = () => `@charset "UTF-8"; @layer kol-a11y, kol-glob
|
|
|
35400
35290
|
|
|
35401
35291
|
class KolSpin extends BaseWebComponent {
|
|
35402
35292
|
constructor(hostRef) {
|
|
35403
|
-
super();
|
|
35404
|
-
|
|
35293
|
+
super(...arguments);
|
|
35294
|
+
if (new.target === KolSpin)
|
|
35295
|
+
registerInstance(this, hostRef);
|
|
35405
35296
|
this.propsConfig = spinPropsConfig;
|
|
35406
35297
|
this._show = undefined;
|
|
35407
35298
|
this._label = undefined;
|
|
@@ -35422,7 +35313,7 @@ class KolSpin extends BaseWebComponent {
|
|
|
35422
35313
|
variantSpinProp.apply(this._variant, (v) => this.setRenderProp('variant', v));
|
|
35423
35314
|
}
|
|
35424
35315
|
render() {
|
|
35425
|
-
return (hAsync(Host, { key: '
|
|
35316
|
+
return (hAsync(Host, { key: 'd301a0a20e36b30c8ad1cc52835514071cf7363b' }, hAsync(SpinFC, { key: '5d77cbe0d1f9de8148e1a848799cdf2a7bf42d95', show: this.getRenderProp('show'), label: this.getRenderProp('label'), variant: this.getRenderProp('variant') })));
|
|
35426
35317
|
}
|
|
35427
35318
|
static get watchers() { return {
|
|
35428
35319
|
"_show": [{
|
|
@@ -35462,12 +35353,13 @@ const SplitButtonFC = (props) => {
|
|
|
35462
35353
|
return (hAsync(BemRootNodeFC, { block: "kol-split-button", class: hostClass }, hAsync("div", { class: BEM_CLASS_SPLIT_BUTTON__ROOT }, hAsync("div", { class: clsx(BEM_CLASS_SPLIT_BUTTON__BUTTON, buttonWrapperClass) }, hAsync(ButtonFC, Object.assign({}, buttonProps))), hAsync("div", { class: BEM_CLASS_SPLIT_BUTTON__HORIZONTAL_LINE }), hAsync("div", { class: BEM_CLASS_SPLIT_BUTTON__SECONDARY_BUTTON, ref: refDropdown }, hAsync(PopoverButtonFC, Object.assign({}, dropdownProps))))));
|
|
35463
35354
|
};
|
|
35464
35355
|
|
|
35465
|
-
const defaultStyleCss$9 = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=
|
|
35356
|
+
const defaultStyleCss$9 = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-popover-button { display: inline; } .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-popover-button--inline { display: inline-block; } .kol-popover-button--inline .kol-button, .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-split-button { display: flex; position: relative; width: 100%; } .kol-split-button__root { display: flex; position: relative; width: 100%; align-items: stretch; } .kol-split-button__button { min-width: 0; flex: 1 1 auto; text-align: left; } }`;
|
|
35466
35357
|
|
|
35467
35358
|
class KolSplitButton extends BaseButtonWebComponent {
|
|
35468
35359
|
constructor(hostRef) {
|
|
35469
35360
|
super();
|
|
35470
|
-
|
|
35361
|
+
if (new.target === KolSplitButton)
|
|
35362
|
+
registerInstance(this, hostRef);
|
|
35471
35363
|
this.ariaDescriptionId = nonce();
|
|
35472
35364
|
this.dropdownOpen = false;
|
|
35473
35365
|
this._accessKey = undefined;
|
|
@@ -35615,7 +35507,7 @@ class KolSplitButton extends BaseButtonWebComponent {
|
|
|
35615
35507
|
});
|
|
35616
35508
|
}
|
|
35617
35509
|
render() {
|
|
35618
|
-
return (hAsync(SplitButtonFC, { key: '
|
|
35510
|
+
return (hAsync(SplitButtonFC, { key: '21bc7a574f5c58d2959a4f653514c9156211b4b4', buttonProps: this.getButtonFCProps(), buttonWrapperClass: this.getButtonWrapperClass(), dropdownProps: this.dropdownItem.getFcProps(), refDropdown: this.setDropdownRef }));
|
|
35619
35511
|
}
|
|
35620
35512
|
get host() { return getElement(this); }
|
|
35621
35513
|
static get watchers() { return {
|
|
@@ -36724,6 +36616,7 @@ class BaseTableStatelessWebComponent extends BaseWebComponent {
|
|
|
36724
36616
|
}
|
|
36725
36617
|
clearTimeout(this.cellRenderTimeouts.get(element));
|
|
36726
36618
|
this.cellRenderTimeouts.set(element, setTimeout(() => {
|
|
36619
|
+
this.cellRenderTimeouts.delete(element);
|
|
36727
36620
|
if (typeof cell.render === 'function') {
|
|
36728
36621
|
const renderContent = cell.render(element, cell, cell.data, this.getRenderProp('data'));
|
|
36729
36622
|
if (typeof renderContent === 'string') {
|
|
@@ -36754,6 +36647,8 @@ class BaseTableStatelessWebComponent extends BaseWebComponent {
|
|
|
36754
36647
|
var _a;
|
|
36755
36648
|
(_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
|
|
36756
36649
|
clearTimeout(this.resizeDebounceTimeout);
|
|
36650
|
+
this.cellRenderTimeouts.forEach((timeout) => clearTimeout(timeout));
|
|
36651
|
+
this.cellRenderTimeouts.clear();
|
|
36757
36652
|
this.buttonItems.destroy();
|
|
36758
36653
|
this.linkItems.destroy();
|
|
36759
36654
|
this.settings.destroy();
|
|
@@ -36897,13 +36792,14 @@ class BaseTableStatelessWebComponent extends BaseWebComponent {
|
|
|
36897
36792
|
}
|
|
36898
36793
|
}
|
|
36899
36794
|
|
|
36900
|
-
const defaultStyleCss$8 = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { @keyframes rotate { to { transform: rotate(1turn); } } @keyframes growingCircle { 0% { opacity: 0.5; border-color: white; clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0); } 25% { opacity: 0.75; border-color: var(--kol-spin-color, var(--kol-theme-spin-color, #000)); clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0); } 50% { opacity: 1; border-color: var(--kol-spin-color, var(--kol-theme-spin-color, black)); clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%); } 75% { opacity: 1; border-color: var(--kol-spin-color, var(--kol-theme-spin-color, black)); clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%); } 100% { opacity: 0.1; border-color: var(--kol-spin-color, var(--kol-theme-spin-color, black)); clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0); } } .kol-spin__spinner--cycle { width: calc(var(--kol-spin-size, 48) * 1rem / var(--kolibri-root-font-size, 16)); height: calc(var(--kol-spin-size, 48) * 1rem / var(--kolibri-root-font-size, 16)); } .kol-spin__spinner--cycle .kol-spin__loader { border-radius: 50%; display: block; position: relative; width: 100%; height: 100%; animation: 2s linear infinite rotate; } @media (prefers-reduced-motion) { .kol-spin__spinner--cycle .kol-spin__loader { animation-duration: 4s !important; } } .kol-spin__spinner--cycle .kol-spin__loader::before { border-radius: 50%; position: absolute; inset: 0; content: ""; animation: 3s linear infinite growingCircle; border: 5px solid var(--kol-spin-color, var(--kol-theme-spin-color, #333)); } @media (prefers-reduced-motion) { .kol-spin__spinner--cycle .kol-spin__loader::before { animation-duration: 6s !important; } } } @layer kol-component { @keyframes spin1 { 0% { transform: scale(0); } 100% { transform: scale(1); } } @keyframes spin2 { 0% { transform: translate(0, 0); } 100% { transform: translate(calc(var(--kol-spin-size, 13) * 1rem / var(--kolibri-root-font-size, 16)), 0); } } @keyframes spin3 { 0% { transform: scale(1); } 100% { transform: scale(0); } } @media (prefers-reduced-motion) { .kol-spin__spinner-element { animation-duration: 2s !important; } } .kol-spin__spinner--dot { --kol-spin-border-width: calc(var(--kol-spin-size, 13) / 10); width: calc(calc(var(--kol-spin-size, 13) * 3 + 2) * 1rem / var(--kolibri-root-font-size, 16)); height: calc(calc(var(--kol-spin-size, 13) + var(--kol-spin-border-width) * 2) * 1rem / var(--kolibri-root-font-size, 16)); } .kol-spin__spinner--dot .kol-spin__spinner-element { background-color: var(--kol-spin-color, var(--kol-theme-spin-color, #000)); border-radius: 50%; position: absolute; top: 1px; width: calc(var(--kol-spin-size, 13) * 1rem / var(--kolibri-root-font-size, 16)); height: calc(var(--kol-spin-size, 13) * 1rem / var(--kolibri-root-font-size, 16)); animation-timing-function: cubic-bezier(0, 1, 1, 0); border: calc(var(--kol-spin-border-width) * 1rem / var(--kolibri-root-font-size, 16)) solid white; } .kol-spin__spinner--dot .kol-spin__spinner-element--1 { left: calc(var(--kol-spin-border-width) * 1rem / var(--kolibri-root-font-size, 16)); z-index: 0; animation: 1s infinite spin1; } .kol-spin__spinner--dot .kol-spin__spinner-element--2 { left: calc(var(--kol-spin-border-width) * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; animation: 1s infinite spin2; } .kol-spin__spinner--dot .kol-spin__spinner-element--3 { left: calc(calc(var(--kol-spin-size, 13) + var(--kol-spin-border-width)) * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; animation: 1s infinite spin2; } .kol-spin__spinner--dot .kol-spin__spinner-element--neutral { opacity: 0.6; left: calc(calc(var(--kol-spin-size, 13) * 2 + var(--kol-spin-border-width)) * 1rem / var(--kolibri-root-font-size, 16)); z-index: 0; animation: 1s infinite spin3; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card :host { display: inline-block; } .kol-card .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-card .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-card .kol-button__interactive-element::before { content: ""; } .kol-card .kol-button__text { flex: 1 0 100%; } .kol-card .kol-button { } .kol-card .kol-button__tooltip { height: 0; } .kol-card .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-card .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-card { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); display: grid; height: 100%; overflow: visible; grid-template-areas: "header close" "content content"; grid-template-columns: 1fr min-content; grid-template-rows: min-content 1fr; } .kol-card__header { align-self: start; grid-area: header; } .kol-card__content { align-self: stretch; grid-area: content; } .kol-card__close-button { grid-area: close; } .kol-card:has(.kol-card__link) { position: relative; } .kol-card__link::after { position: absolute; inset: 0; content: ""; cursor: pointer; } .kol-dialog, .kol-modal { min-height: var(--a11y-min-size); padding: 0; border: 0; overscroll-behavior: contain; } .kol-dialog__close-button, .kol-modal__close-button { position: absolute; top: calc(1 * 1rem / var(--kolibri-root-font-size, 16)); right: calc(1 * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-button__interactive-element::before { content: ""; } .kol-button__text { flex: 1 0 100%; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-popover-button { display: inline; } .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-popover-button--inline { display: inline-block; } .kol-popover-button--inline .kol-button, .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-table-settings { position: absolute; top: 0; right: 0; z-index: 1; } .kol-table-settings .kol-popover-button__popover { background: white; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); border-radius: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); border: 1px solid black; } .kol-table-settings__columns { display: grid; max-height: calc(200 * 1rem / var(--kolibri-root-font-size, 16)); overflow: auto; grid-auto-rows: min-content; grid-template-columns: min-content minmax(max-content, 1fr) calc(140 * 1rem / var(--kolibri-root-font-size, 16)) auto auto; } .kol-table-settings__column { display: grid; align-items: center; grid-template-columns: subgrid; grid-column: 1/6; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-table { --kol-table-selection-col-width: var(--a11y-min-size); display: block; position: relative; max-width: 100%; } .kol-table:has(.kol-table__focus-element:focus) .kol-table__scroll-container { outline: 5px auto Highlight; outline: 5px auto -webkit-focus-ring-color; outline-offset: 2px; } .kol-table__scroll-container { overflow-x: auto; overflow-y: hidden; } .kol-table__table { table-layout: fixed; } .kol-table__caption { min-height: var(--a11y-min-size); text-align: start; } .kol-table__settings:not(:has(~ .kol-table__scroll-container .kol-table__caption)) { min-height: var(--a11y-min-size); } .kol-table__sort-button.kol-button { color: inherit; } .kol-table__sort { display: inline-flex; align-items: center; } .kol-table__sort-order { display: inline-flex; align-items: center; justify-content: center; } .kol-table__body { text-align: left; } .kol-table__body .kol-button__text { justify-items: start; } .kol-table__body:has(.kol-table__loader--shown) { position: relative; min-height: calc(var(--a11y-min-size) * 3); } .kol-table__cell--align-left { text-align: left; } .kol-table__cell--align-left .kol-table__sort-button .kol-button__text { align-items: start; text-align: start; } .kol-table__cell--align-left .kol-table__cell-actions { justify-content: flex-start; } .kol-table__cell--align-center { text-align: center; } .kol-table__cell--align-center .kol-table__sort-button .kol-button__text { align-items: center; } .kol-table__cell--align-right { text-align: right; } .kol-table__cell--align-right .kol-table__sort-button .kol-button__text { align-items: end; text-align: end; } .kol-table__cell--align-right .kol-table__cell-actions { justify-content: flex-end; } .kol-table__cell--selection { background-color: white; position: sticky !important; left: 0; z-index: 2; width: var(--kol-table-selection-col-width, auto); min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); white-space: nowrap; } .kol-table__cell--actions { white-space: nowrap; } .kol-table__cell--actions .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-table__cell--actions :host { display: inline-block; } .kol-table__cell--actions .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-table__cell--actions .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-table__cell--actions .kol-button__interactive-element::before { content: ""; } .kol-table__cell--actions .kol-button__text { flex: 1 0 100%; } .kol-table__cell--actions .kol-button { } .kol-table__cell--actions .kol-button__tooltip { height: 0; } .kol-table__cell--actions .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-table__cell--actions .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-table__cell--actions .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-table__cell--actions :host { display: inline-block; } .kol-table__cell--actions .kol-link { display: inline-flex; max-width: fit-content; } .kol-table__cell--actions .kol-link--standalone { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: stretch; } .kol-table__cell--actions .kol-link--standalone .kol-link__interactive-element { align-items: stretch; } .kol-table__cell--actions .kol-link--standalone .kol-link__text { display: inline-flex; flex: 1 1 100%; place-items: center; } .kol-table__cell--actions .kol-link__interactive-element { display: inline-flex; flex: 1; align-items: baseline; place-items: center; text-align: left; text-decoration-line: none; } .kol-table__cell--actions .kol-link__interactive-element:focus:not([aria-disabled], [disabled]) .kol-span__label, .kol-table__cell--actions .kol-link__interactive-element:hover:not([aria-disabled], [disabled]) .kol-span__label { text-decoration-thickness: 0.2em; } .kol-table__cell--actions .kol-link .kol-span__label { text-decoration-line: underline; } .kol-table__cell--actions .kol-link__icon { display: inline-flex; } .kol-table__cell--sticky-left, .kol-table__cell--sticky-right { background-color: white; position: sticky !important; z-index: 1; } .kol-table__cell--sticky-left:nth-last-child(1 of .kol-table__cell--sticky-left) { border-right: 2px solid black; } .kol-table__cell--sticky-right:nth-child(1 of .kol-table__cell--sticky-left) { border-left: 2px solid black; } .kol-table__cell-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; } .kol-table__cell-states { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; } .kol-table__spacer { display: none; } .kol-table__selection { position: relative; } .kol-table__selection-label { display: flex; position: relative; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; justify-content: center; } .kol-table__selection-label:not(.kol-table__selection-label--disabled) { cursor: pointer; } .kol-table__selection-label--disabled { cursor: not-allowed; } .kol-table__selection-icon { display: block; position: absolute; inset: auto; z-index: 1; } .kol-table__selection-input { border-style: solid; margin: 0; appearance: none; cursor: pointer; } .kol-table__selection-input:disabled { cursor: not-allowed; } .kol-table__selection-input:before { content: ""; } .kol-table__selection-input--checkbox { background-color: white; display: flex; position: relative; min-width: calc(var(--a11y-min-size) / 2); min-height: calc(var(--a11y-min-size) / 2); border-width: 2px; align-items: center; justify-content: center; line-height: 1.5; } .kol-table__selection-input--radio { border-radius: 100%; display: flex; width: 1.5em; min-width: 1.5em; height: 1.5em; min-height: 1.5em; padding: 0; border-width: 2px; } .kol-table__selection-input--radio:before { border-radius: 100%; width: 0.75em; height: 0.75em; margin: auto; } .kol-table__selection-input--radio:checked:before { background-color: black; } @media (forced-colors: active) { .kol-table__selection-input--radio:checked:before { background-color: selectedItem !important; } } .kol-table__loader--shown { background: white; display: flex; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; align-items: center; justify-content: center; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-select { background-color: transparent; width: 100%; padding: 0; } .kol-select:not(:disabled) { cursor: pointer; } .kol-select:not([multiple], [size]) { height: 2.75em; } .kol-select[multiple][size="1"] { height: 2.75em; } .kol-select__option:checked::before { content: "✓ "; } .kol-select[multiple] option { display: flex; min-height: var(--a11y-min-size); align-items: center; } .kol-select[multiple][size="1"] option::checkmark { height: 100%; } .kol-select[multiple][size="1"] option:checked::before { display: none; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; container: paging/inline-size; } .kol-pagination__navigation-list { display: inline-flex; margin: 0; padding: 0; flex-wrap: wrap; align-items: center; list-style: none; } .kol-pagination__separator:before { content: "•••"; } .kol-pagination__page-size-select .kol-form-field-select { align-items: center; grid-template-columns: 1fr max-content; } @container paging (width < 600px) { .kol-pagination:has(.kol-pagination__button--first) li:has(.kol-pagination__button--numbers), .kol-pagination:has(.kol-pagination__button--first) li:has(.kol-pagination__separator) { display: none; } } .kol-spin { display: contents; } .kol-spin__spinner { display: block; position: relative; } }`;
|
|
36795
|
+
const defaultStyleCss$8 = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { @keyframes rotate { to { transform: rotate(1turn); } } @keyframes growingCircle { 0% { opacity: 0.5; border-color: white; clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0); } 25% { opacity: 0.75; border-color: var(--kol-spin-color, var(--kol-theme-spin-color, #000)); clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0); } 50% { opacity: 1; border-color: var(--kol-spin-color, var(--kol-theme-spin-color, black)); clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%); } 75% { opacity: 1; border-color: var(--kol-spin-color, var(--kol-theme-spin-color, black)); clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%); } 100% { opacity: 0.1; border-color: var(--kol-spin-color, var(--kol-theme-spin-color, black)); clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0); } } .kol-spin__spinner--cycle { width: calc(var(--kol-spin-size, 48) * 1rem / var(--kolibri-root-font-size, 16)); height: calc(var(--kol-spin-size, 48) * 1rem / var(--kolibri-root-font-size, 16)); } .kol-spin__spinner--cycle .kol-spin__loader { border-radius: 50%; display: block; position: relative; width: 100%; height: 100%; animation: 2s linear infinite rotate; } @media (prefers-reduced-motion) { .kol-spin__spinner--cycle .kol-spin__loader { animation-duration: 4s !important; } } .kol-spin__spinner--cycle .kol-spin__loader::before { border-radius: 50%; position: absolute; inset: 0; content: ""; animation: 3s linear infinite growingCircle; border: 5px solid var(--kol-spin-color, var(--kol-theme-spin-color, #333)); } @media (prefers-reduced-motion) { .kol-spin__spinner--cycle .kol-spin__loader::before { animation-duration: 6s !important; } } } @layer kol-component { @keyframes spin1 { 0% { transform: scale(0); } 100% { transform: scale(1); } } @keyframes spin2 { 0% { transform: translate(0, 0); } 100% { transform: translate(calc(var(--kol-spin-size, 13) * 1rem / var(--kolibri-root-font-size, 16)), 0); } } @keyframes spin3 { 0% { transform: scale(1); } 100% { transform: scale(0); } } @media (prefers-reduced-motion) { .kol-spin__spinner-element { animation-duration: 2s !important; } } .kol-spin__spinner--dot { --kol-spin-border-width: calc(var(--kol-spin-size, 13) / 10); width: calc(calc(var(--kol-spin-size, 13) * 3 + 2) * 1rem / var(--kolibri-root-font-size, 16)); height: calc(calc(var(--kol-spin-size, 13) + var(--kol-spin-border-width) * 2) * 1rem / var(--kolibri-root-font-size, 16)); } .kol-spin__spinner--dot .kol-spin__spinner-element { background-color: var(--kol-spin-color, var(--kol-theme-spin-color, #000)); border-radius: 50%; position: absolute; top: 1px; width: calc(var(--kol-spin-size, 13) * 1rem / var(--kolibri-root-font-size, 16)); height: calc(var(--kol-spin-size, 13) * 1rem / var(--kolibri-root-font-size, 16)); animation-timing-function: cubic-bezier(0, 1, 1, 0); border: calc(var(--kol-spin-border-width) * 1rem / var(--kolibri-root-font-size, 16)) solid white; } .kol-spin__spinner--dot .kol-spin__spinner-element--1 { left: calc(var(--kol-spin-border-width) * 1rem / var(--kolibri-root-font-size, 16)); z-index: 0; animation: 1s infinite spin1; } .kol-spin__spinner--dot .kol-spin__spinner-element--2 { left: calc(var(--kol-spin-border-width) * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; animation: 1s infinite spin2; } .kol-spin__spinner--dot .kol-spin__spinner-element--3 { left: calc(calc(var(--kol-spin-size, 13) + var(--kol-spin-border-width)) * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; animation: 1s infinite spin2; } .kol-spin__spinner--dot .kol-spin__spinner-element--neutral { opacity: 0.6; left: calc(calc(var(--kol-spin-size, 13) * 2 + var(--kol-spin-border-width)) * 1rem / var(--kolibri-root-font-size, 16)); z-index: 0; animation: 1s infinite spin3; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card :host { display: inline-block; } .kol-card .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-card .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-card .kol-button__interactive-element::before { content: ""; } .kol-card .kol-button__text { flex: 1 0 100%; } .kol-card .kol-button { } .kol-card .kol-button__tooltip { height: 0; } .kol-card .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-card .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-card { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); display: grid; height: 100%; overflow: visible; grid-template-areas: "header close" "content content"; grid-template-columns: 1fr min-content; grid-template-rows: min-content 1fr; } .kol-card__header { align-self: start; grid-area: header; } .kol-card__content { align-self: stretch; grid-area: content; } .kol-card__close-button { grid-area: close; } .kol-card:has(.kol-card__link) { position: relative; } .kol-card__link::after { position: absolute; inset: 0; content: ""; cursor: pointer; } .kol-dialog, .kol-modal { min-height: var(--a11y-min-size); padding: 0; border: 0; overscroll-behavior: contain; } .kol-dialog__close-button, .kol-modal__close-button { position: absolute; top: calc(1 * 1rem / var(--kolibri-root-font-size, 16)); right: calc(1 * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-button__interactive-element::before { content: ""; } .kol-button__text { flex: 1 0 100%; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-popover-button { display: inline; } .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-popover-button--inline { display: inline-block; } .kol-popover-button--inline .kol-button, .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-table-settings { position: absolute; top: 0; right: 0; z-index: 1; } .kol-table-settings .kol-popover-button__popover { background: white; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); border-radius: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); border: 1px solid black; } .kol-table-settings__columns { display: grid; max-height: calc(200 * 1rem / var(--kolibri-root-font-size, 16)); overflow: auto; grid-auto-rows: min-content; grid-template-columns: min-content minmax(max-content, 1fr) calc(140 * 1rem / var(--kolibri-root-font-size, 16)) auto auto; } .kol-table-settings__column { display: grid; align-items: center; grid-template-columns: subgrid; grid-column: 1/6; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-table { --kol-table-selection-col-width: var(--a11y-min-size); display: block; position: relative; max-width: 100%; } .kol-table:has(.kol-table__focus-element:focus) .kol-table__scroll-container { outline: 5px auto Highlight; outline: 5px auto -webkit-focus-ring-color; outline-offset: 2px; } .kol-table__scroll-container { overflow-x: auto; overflow-y: hidden; } .kol-table__table { table-layout: fixed; } .kol-table__caption { min-height: var(--a11y-min-size); text-align: start; } .kol-table__settings:not(:has(~ .kol-table__scroll-container .kol-table__caption)) { min-height: var(--a11y-min-size); } .kol-table__sort-button.kol-button { color: inherit; } .kol-table__sort { display: inline-flex; align-items: center; } .kol-table__sort-order { display: inline-flex; align-items: center; justify-content: center; } .kol-table__body { text-align: left; } .kol-table__body .kol-button__text { justify-items: start; } .kol-table__body:has(.kol-table__loader--shown) { position: relative; min-height: calc(var(--a11y-min-size) * 3); } .kol-table__cell--align-left { text-align: left; } .kol-table__cell--align-left .kol-table__sort-button .kol-button__text { align-items: start; text-align: start; } .kol-table__cell--align-left .kol-table__cell-actions { justify-content: flex-start; } .kol-table__cell--align-center { text-align: center; } .kol-table__cell--align-center .kol-table__sort-button .kol-button__text { align-items: center; } .kol-table__cell--align-right { text-align: right; } .kol-table__cell--align-right .kol-table__sort-button .kol-button__text { align-items: end; text-align: end; } .kol-table__cell--align-right .kol-table__cell-actions { justify-content: flex-end; } .kol-table__cell--selection { background-color: white; position: sticky !important; left: 0; z-index: 2; width: var(--kol-table-selection-col-width, auto); min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); white-space: nowrap; } .kol-table__cell--actions { white-space: nowrap; } .kol-table__cell--actions .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-table__cell--actions :host { display: inline-block; } .kol-table__cell--actions .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-table__cell--actions .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-table__cell--actions .kol-button__interactive-element::before { content: ""; } .kol-table__cell--actions .kol-button__text { flex: 1 0 100%; } .kol-table__cell--actions .kol-button { } .kol-table__cell--actions .kol-button__tooltip { height: 0; } .kol-table__cell--actions .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-table__cell--actions .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-table__cell--actions .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-table__cell--actions :host { display: inline-block; } .kol-table__cell--actions .kol-link { display: inline-flex; max-width: fit-content; } .kol-table__cell--actions .kol-link--standalone { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: stretch; } .kol-table__cell--actions .kol-link--standalone .kol-link__interactive-element { align-items: stretch; } .kol-table__cell--actions .kol-link--standalone .kol-link__text { display: inline-flex; flex: 1 1 100%; place-items: center; } .kol-table__cell--actions .kol-link__interactive-element { display: inline-flex; flex: 1; align-items: baseline; place-items: center; text-align: left; text-decoration-line: none; } .kol-table__cell--actions .kol-link__interactive-element:focus:not([aria-disabled], [disabled]) .kol-span__label, .kol-table__cell--actions .kol-link__interactive-element:hover:not([aria-disabled], [disabled]) .kol-span__label { text-decoration-thickness: 0.2em; } .kol-table__cell--actions .kol-link .kol-span__label { text-decoration-line: underline; } .kol-table__cell--actions .kol-link__icon { display: inline-flex; } .kol-table__cell--sticky-left, .kol-table__cell--sticky-right { background-color: white; position: sticky !important; z-index: 1; } .kol-table__cell--sticky-left:nth-last-child(1 of .kol-table__cell--sticky-left) { border-right: 2px solid black; } .kol-table__cell--sticky-right:nth-child(1 of .kol-table__cell--sticky-left) { border-left: 2px solid black; } .kol-table__cell-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; } .kol-table__cell-states { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; } .kol-table__spacer { display: none; } .kol-table__selection { position: relative; } .kol-table__selection-label { display: flex; position: relative; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; justify-content: center; } .kol-table__selection-label:not(.kol-table__selection-label--disabled) { cursor: pointer; } .kol-table__selection-label--disabled { cursor: not-allowed; } .kol-table__selection-icon { display: block; position: absolute; inset: auto; z-index: 1; } .kol-table__selection-input { border-style: solid; margin: 0; appearance: none; cursor: pointer; } .kol-table__selection-input:disabled { cursor: not-allowed; } .kol-table__selection-input:before { content: ""; } .kol-table__selection-input--checkbox { background-color: white; display: flex; position: relative; min-width: calc(var(--a11y-min-size) / 2); min-height: calc(var(--a11y-min-size) / 2); border-width: 2px; align-items: center; justify-content: center; line-height: 1.5; } .kol-table__selection-input--radio { border-radius: 100%; display: flex; width: 1.5em; min-width: 1.5em; height: 1.5em; min-height: 1.5em; padding: 0; border-width: 2px; } .kol-table__selection-input--radio:before { border-radius: 100%; width: 0.75em; height: 0.75em; margin: auto; } .kol-table__selection-input--radio:checked:before { background-color: black; } @media (forced-colors: active) { .kol-table__selection-input--radio:checked:before { background-color: selectedItem !important; } } .kol-table__loader--shown { background: white; display: flex; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; align-items: center; justify-content: center; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-select { background-color: transparent; width: 100%; padding: 0; } .kol-select:not(:disabled) { cursor: pointer; } .kol-select:not([multiple], [size]) { height: 2.75em; } .kol-select[multiple][size="1"] { height: 2.75em; } .kol-select__option:checked::before { content: "✓ "; } .kol-select[multiple] option { display: flex; min-height: var(--a11y-min-size); align-items: center; } .kol-select[multiple][size="1"] option::checkmark { height: 100%; } .kol-select[multiple][size="1"] option:checked::before { display: none; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; container: paging/inline-size; } .kol-pagination__navigation-list { display: inline-flex; margin: 0; padding: 0; flex-wrap: wrap; align-items: center; list-style: none; } .kol-pagination__separator:before { content: "•••"; } .kol-pagination__page-size-select .kol-form-field-select { align-items: center; grid-template-columns: 1fr max-content; } @container paging (width < 600px) { .kol-pagination:has(.kol-pagination__button--first) li:has(.kol-pagination__button--numbers), .kol-pagination:has(.kol-pagination__button--first) li:has(.kol-pagination__separator) { display: none; } } .kol-spin { display: contents; } .kol-spin__spinner { display: block; position: relative; } }`;
|
|
36901
36796
|
|
|
36902
36797
|
const PAGINATION_OPTIONS = [10, 20, 50, 100];
|
|
36903
36798
|
class KolTableStateful extends BaseTableStatelessWebComponent {
|
|
36904
36799
|
constructor(hostRef) {
|
|
36905
|
-
super();
|
|
36906
|
-
|
|
36800
|
+
super(...arguments);
|
|
36801
|
+
if (new.target === KolTableStateful)
|
|
36802
|
+
registerInstance(this, hostRef);
|
|
36907
36803
|
this.pagination = { _page: 1, _pageSize: 10, _max: 0 };
|
|
36908
36804
|
this.renderCount = 0;
|
|
36909
36805
|
this.externalLabelElements = [];
|
|
@@ -37188,7 +37084,7 @@ class KolTableStateful extends BaseTableStatelessWebComponent {
|
|
|
37188
37084
|
return (item && (hAsync("div", { class: `kol-table-stateful__pagination kol-table-stateful__pagination--${this.paginationPosition}` }, hAsync("div", { class: "kol-table-stateful__pagination-wrapper" }, hAsync(PaginationFC, Object.assign({}, item.getFcProps()))))));
|
|
37189
37085
|
}
|
|
37190
37086
|
render() {
|
|
37191
|
-
return (hAsync(Host, { key: '
|
|
37087
|
+
return (hAsync(Host, { key: 'ef4f178d1bbabc8352c9909f21eb9fc8338eb918', class: "kol-table-stateful" }, this.renderPagination('top'), this.renderTableStatelessFC(), this.renderPagination('bottom')));
|
|
37192
37088
|
}
|
|
37193
37089
|
get host() { return getElement(this); }
|
|
37194
37090
|
static get watchers() { return {
|
|
@@ -37273,12 +37169,13 @@ class KolTableStateful extends BaseTableStatelessWebComponent {
|
|
|
37273
37169
|
}; }
|
|
37274
37170
|
}
|
|
37275
37171
|
|
|
37276
|
-
const defaultStyleCss$7 = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { @keyframes rotate { to { transform: rotate(1turn); } } @keyframes growingCircle { 0% { opacity: 0.5; border-color: white; clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0); } 25% { opacity: 0.75; border-color: var(--kol-spin-color, var(--kol-theme-spin-color, #000)); clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0); } 50% { opacity: 1; border-color: var(--kol-spin-color, var(--kol-theme-spin-color, black)); clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%); } 75% { opacity: 1; border-color: var(--kol-spin-color, var(--kol-theme-spin-color, black)); clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%); } 100% { opacity: 0.1; border-color: var(--kol-spin-color, var(--kol-theme-spin-color, black)); clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0); } } .kol-spin__spinner--cycle { width: calc(var(--kol-spin-size, 48) * 1rem / var(--kolibri-root-font-size, 16)); height: calc(var(--kol-spin-size, 48) * 1rem / var(--kolibri-root-font-size, 16)); } .kol-spin__spinner--cycle .kol-spin__loader { border-radius: 50%; display: block; position: relative; width: 100%; height: 100%; animation: 2s linear infinite rotate; } @media (prefers-reduced-motion) { .kol-spin__spinner--cycle .kol-spin__loader { animation-duration: 4s !important; } } .kol-spin__spinner--cycle .kol-spin__loader::before { border-radius: 50%; position: absolute; inset: 0; content: ""; animation: 3s linear infinite growingCircle; border: 5px solid var(--kol-spin-color, var(--kol-theme-spin-color, #333)); } @media (prefers-reduced-motion) { .kol-spin__spinner--cycle .kol-spin__loader::before { animation-duration: 6s !important; } } } @layer kol-component { @keyframes spin1 { 0% { transform: scale(0); } 100% { transform: scale(1); } } @keyframes spin2 { 0% { transform: translate(0, 0); } 100% { transform: translate(calc(var(--kol-spin-size, 13) * 1rem / var(--kolibri-root-font-size, 16)), 0); } } @keyframes spin3 { 0% { transform: scale(1); } 100% { transform: scale(0); } } @media (prefers-reduced-motion) { .kol-spin__spinner-element { animation-duration: 2s !important; } } .kol-spin__spinner--dot { --kol-spin-border-width: calc(var(--kol-spin-size, 13) / 10); width: calc(calc(var(--kol-spin-size, 13) * 3 + 2) * 1rem / var(--kolibri-root-font-size, 16)); height: calc(calc(var(--kol-spin-size, 13) + var(--kol-spin-border-width) * 2) * 1rem / var(--kolibri-root-font-size, 16)); } .kol-spin__spinner--dot .kol-spin__spinner-element { background-color: var(--kol-spin-color, var(--kol-theme-spin-color, #000)); border-radius: 50%; position: absolute; top: 1px; width: calc(var(--kol-spin-size, 13) * 1rem / var(--kolibri-root-font-size, 16)); height: calc(var(--kol-spin-size, 13) * 1rem / var(--kolibri-root-font-size, 16)); animation-timing-function: cubic-bezier(0, 1, 1, 0); border: calc(var(--kol-spin-border-width) * 1rem / var(--kolibri-root-font-size, 16)) solid white; } .kol-spin__spinner--dot .kol-spin__spinner-element--1 { left: calc(var(--kol-spin-border-width) * 1rem / var(--kolibri-root-font-size, 16)); z-index: 0; animation: 1s infinite spin1; } .kol-spin__spinner--dot .kol-spin__spinner-element--2 { left: calc(var(--kol-spin-border-width) * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; animation: 1s infinite spin2; } .kol-spin__spinner--dot .kol-spin__spinner-element--3 { left: calc(calc(var(--kol-spin-size, 13) + var(--kol-spin-border-width)) * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; animation: 1s infinite spin2; } .kol-spin__spinner--dot .kol-spin__spinner-element--neutral { opacity: 0.6; left: calc(calc(var(--kol-spin-size, 13) * 2 + var(--kol-spin-border-width)) * 1rem / var(--kolibri-root-font-size, 16)); z-index: 0; animation: 1s infinite spin3; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card :host { display: inline-block; } .kol-card .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-card .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-card .kol-button__interactive-element::before { content: ""; } .kol-card .kol-button__text { flex: 1 0 100%; } .kol-card .kol-button { } .kol-card .kol-button__tooltip { height: 0; } .kol-card .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-card .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-card { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); display: grid; height: 100%; overflow: visible; grid-template-areas: "header close" "content content"; grid-template-columns: 1fr min-content; grid-template-rows: min-content 1fr; } .kol-card__header { align-self: start; grid-area: header; } .kol-card__content { align-self: stretch; grid-area: content; } .kol-card__close-button { grid-area: close; } .kol-card:has(.kol-card__link) { position: relative; } .kol-card__link::after { position: absolute; inset: 0; content: ""; cursor: pointer; } .kol-dialog, .kol-modal { min-height: var(--a11y-min-size); padding: 0; border: 0; overscroll-behavior: contain; } .kol-dialog__close-button, .kol-modal__close-button { position: absolute; top: calc(1 * 1rem / var(--kolibri-root-font-size, 16)); right: calc(1 * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-button__interactive-element::before { content: ""; } .kol-button__text { flex: 1 0 100%; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-popover-button { display: inline; } .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-popover-button--inline { display: inline-block; } .kol-popover-button--inline .kol-button, .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-table-settings { position: absolute; top: 0; right: 0; z-index: 1; } .kol-table-settings .kol-popover-button__popover { background: white; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); border-radius: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); border: 1px solid black; } .kol-table-settings__columns { display: grid; max-height: calc(200 * 1rem / var(--kolibri-root-font-size, 16)); overflow: auto; grid-auto-rows: min-content; grid-template-columns: min-content minmax(max-content, 1fr) calc(140 * 1rem / var(--kolibri-root-font-size, 16)) auto auto; } .kol-table-settings__column { display: grid; align-items: center; grid-template-columns: subgrid; grid-column: 1/6; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-table { --kol-table-selection-col-width: var(--a11y-min-size); display: block; position: relative; max-width: 100%; } .kol-table:has(.kol-table__focus-element:focus) .kol-table__scroll-container { outline: 5px auto Highlight; outline: 5px auto -webkit-focus-ring-color; outline-offset: 2px; } .kol-table__scroll-container { overflow-x: auto; overflow-y: hidden; } .kol-table__table { table-layout: fixed; } .kol-table__caption { min-height: var(--a11y-min-size); text-align: start; } .kol-table__settings:not(:has(~ .kol-table__scroll-container .kol-table__caption)) { min-height: var(--a11y-min-size); } .kol-table__sort-button.kol-button { color: inherit; } .kol-table__sort { display: inline-flex; align-items: center; } .kol-table__sort-order { display: inline-flex; align-items: center; justify-content: center; } .kol-table__body { text-align: left; } .kol-table__body .kol-button__text { justify-items: start; } .kol-table__body:has(.kol-table__loader--shown) { position: relative; min-height: calc(var(--a11y-min-size) * 3); } .kol-table__cell--align-left { text-align: left; } .kol-table__cell--align-left .kol-table__sort-button .kol-button__text { align-items: start; text-align: start; } .kol-table__cell--align-left .kol-table__cell-actions { justify-content: flex-start; } .kol-table__cell--align-center { text-align: center; } .kol-table__cell--align-center .kol-table__sort-button .kol-button__text { align-items: center; } .kol-table__cell--align-right { text-align: right; } .kol-table__cell--align-right .kol-table__sort-button .kol-button__text { align-items: end; text-align: end; } .kol-table__cell--align-right .kol-table__cell-actions { justify-content: flex-end; } .kol-table__cell--selection { background-color: white; position: sticky !important; left: 0; z-index: 2; width: var(--kol-table-selection-col-width, auto); min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); white-space: nowrap; } .kol-table__cell--actions { white-space: nowrap; } .kol-table__cell--actions .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-table__cell--actions :host { display: inline-block; } .kol-table__cell--actions .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-table__cell--actions .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-table__cell--actions .kol-button__interactive-element::before { content: ""; } .kol-table__cell--actions .kol-button__text { flex: 1 0 100%; } .kol-table__cell--actions .kol-button { } .kol-table__cell--actions .kol-button__tooltip { height: 0; } .kol-table__cell--actions .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-table__cell--actions .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-table__cell--actions .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-table__cell--actions :host { display: inline-block; } .kol-table__cell--actions .kol-link { display: inline-flex; max-width: fit-content; } .kol-table__cell--actions .kol-link--standalone { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: stretch; } .kol-table__cell--actions .kol-link--standalone .kol-link__interactive-element { align-items: stretch; } .kol-table__cell--actions .kol-link--standalone .kol-link__text { display: inline-flex; flex: 1 1 100%; place-items: center; } .kol-table__cell--actions .kol-link__interactive-element { display: inline-flex; flex: 1; align-items: baseline; place-items: center; text-align: left; text-decoration-line: none; } .kol-table__cell--actions .kol-link__interactive-element:focus:not([aria-disabled], [disabled]) .kol-span__label, .kol-table__cell--actions .kol-link__interactive-element:hover:not([aria-disabled], [disabled]) .kol-span__label { text-decoration-thickness: 0.2em; } .kol-table__cell--actions .kol-link .kol-span__label { text-decoration-line: underline; } .kol-table__cell--actions .kol-link__icon { display: inline-flex; } .kol-table__cell--sticky-left, .kol-table__cell--sticky-right { background-color: white; position: sticky !important; z-index: 1; } .kol-table__cell--sticky-left:nth-last-child(1 of .kol-table__cell--sticky-left) { border-right: 2px solid black; } .kol-table__cell--sticky-right:nth-child(1 of .kol-table__cell--sticky-left) { border-left: 2px solid black; } .kol-table__cell-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; } .kol-table__cell-states { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; } .kol-table__spacer { display: none; } .kol-table__selection { position: relative; } .kol-table__selection-label { display: flex; position: relative; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; justify-content: center; } .kol-table__selection-label:not(.kol-table__selection-label--disabled) { cursor: pointer; } .kol-table__selection-label--disabled { cursor: not-allowed; } .kol-table__selection-icon { display: block; position: absolute; inset: auto; z-index: 1; } .kol-table__selection-input { border-style: solid; margin: 0; appearance: none; cursor: pointer; } .kol-table__selection-input:disabled { cursor: not-allowed; } .kol-table__selection-input:before { content: ""; } .kol-table__selection-input--checkbox { background-color: white; display: flex; position: relative; min-width: calc(var(--a11y-min-size) / 2); min-height: calc(var(--a11y-min-size) / 2); border-width: 2px; align-items: center; justify-content: center; line-height: 1.5; } .kol-table__selection-input--radio { border-radius: 100%; display: flex; width: 1.5em; min-width: 1.5em; height: 1.5em; min-height: 1.5em; padding: 0; border-width: 2px; } .kol-table__selection-input--radio:before { border-radius: 100%; width: 0.75em; height: 0.75em; margin: auto; } .kol-table__selection-input--radio:checked:before { background-color: black; } @media (forced-colors: active) { .kol-table__selection-input--radio:checked:before { background-color: selectedItem !important; } } .kol-table__loader--shown { background: white; display: flex; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; align-items: center; justify-content: center; } .kol-spin { display: contents; } .kol-spin__spinner { display: block; position: relative; } }`;
|
|
37172
|
+
const defaultStyleCss$7 = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { @keyframes rotate { to { transform: rotate(1turn); } } @keyframes growingCircle { 0% { opacity: 0.5; border-color: white; clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0); } 25% { opacity: 0.75; border-color: var(--kol-spin-color, var(--kol-theme-spin-color, #000)); clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0); } 50% { opacity: 1; border-color: var(--kol-spin-color, var(--kol-theme-spin-color, black)); clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%); } 75% { opacity: 1; border-color: var(--kol-spin-color, var(--kol-theme-spin-color, black)); clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%); } 100% { opacity: 0.1; border-color: var(--kol-spin-color, var(--kol-theme-spin-color, black)); clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0); } } .kol-spin__spinner--cycle { width: calc(var(--kol-spin-size, 48) * 1rem / var(--kolibri-root-font-size, 16)); height: calc(var(--kol-spin-size, 48) * 1rem / var(--kolibri-root-font-size, 16)); } .kol-spin__spinner--cycle .kol-spin__loader { border-radius: 50%; display: block; position: relative; width: 100%; height: 100%; animation: 2s linear infinite rotate; } @media (prefers-reduced-motion) { .kol-spin__spinner--cycle .kol-spin__loader { animation-duration: 4s !important; } } .kol-spin__spinner--cycle .kol-spin__loader::before { border-radius: 50%; position: absolute; inset: 0; content: ""; animation: 3s linear infinite growingCircle; border: 5px solid var(--kol-spin-color, var(--kol-theme-spin-color, #333)); } @media (prefers-reduced-motion) { .kol-spin__spinner--cycle .kol-spin__loader::before { animation-duration: 6s !important; } } } @layer kol-component { @keyframes spin1 { 0% { transform: scale(0); } 100% { transform: scale(1); } } @keyframes spin2 { 0% { transform: translate(0, 0); } 100% { transform: translate(calc(var(--kol-spin-size, 13) * 1rem / var(--kolibri-root-font-size, 16)), 0); } } @keyframes spin3 { 0% { transform: scale(1); } 100% { transform: scale(0); } } @media (prefers-reduced-motion) { .kol-spin__spinner-element { animation-duration: 2s !important; } } .kol-spin__spinner--dot { --kol-spin-border-width: calc(var(--kol-spin-size, 13) / 10); width: calc(calc(var(--kol-spin-size, 13) * 3 + 2) * 1rem / var(--kolibri-root-font-size, 16)); height: calc(calc(var(--kol-spin-size, 13) + var(--kol-spin-border-width) * 2) * 1rem / var(--kolibri-root-font-size, 16)); } .kol-spin__spinner--dot .kol-spin__spinner-element { background-color: var(--kol-spin-color, var(--kol-theme-spin-color, #000)); border-radius: 50%; position: absolute; top: 1px; width: calc(var(--kol-spin-size, 13) * 1rem / var(--kolibri-root-font-size, 16)); height: calc(var(--kol-spin-size, 13) * 1rem / var(--kolibri-root-font-size, 16)); animation-timing-function: cubic-bezier(0, 1, 1, 0); border: calc(var(--kol-spin-border-width) * 1rem / var(--kolibri-root-font-size, 16)) solid white; } .kol-spin__spinner--dot .kol-spin__spinner-element--1 { left: calc(var(--kol-spin-border-width) * 1rem / var(--kolibri-root-font-size, 16)); z-index: 0; animation: 1s infinite spin1; } .kol-spin__spinner--dot .kol-spin__spinner-element--2 { left: calc(var(--kol-spin-border-width) * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; animation: 1s infinite spin2; } .kol-spin__spinner--dot .kol-spin__spinner-element--3 { left: calc(calc(var(--kol-spin-size, 13) + var(--kol-spin-border-width)) * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; animation: 1s infinite spin2; } .kol-spin__spinner--dot .kol-spin__spinner-element--neutral { opacity: 0.6; left: calc(calc(var(--kol-spin-size, 13) * 2 + var(--kol-spin-border-width)) * 1rem / var(--kolibri-root-font-size, 16)); z-index: 0; animation: 1s infinite spin3; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-card :host { display: inline-block; } .kol-card .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-card .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-card .kol-button__interactive-element::before { content: ""; } .kol-card .kol-button__text { flex: 1 0 100%; } .kol-card .kol-button { } .kol-card .kol-button__tooltip { height: 0; } .kol-card .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-card .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-card { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); display: grid; height: 100%; overflow: visible; grid-template-areas: "header close" "content content"; grid-template-columns: 1fr min-content; grid-template-rows: min-content 1fr; } .kol-card__header { align-self: start; grid-area: header; } .kol-card__content { align-self: stretch; grid-area: content; } .kol-card__close-button { grid-area: close; } .kol-card:has(.kol-card__link) { position: relative; } .kol-card__link::after { position: absolute; inset: 0; content: ""; cursor: pointer; } .kol-dialog, .kol-modal { min-height: var(--a11y-min-size); padding: 0; border: 0; overscroll-behavior: contain; } .kol-dialog__close-button, .kol-modal__close-button { position: absolute; top: calc(1 * 1rem / var(--kolibri-root-font-size, 16)); right: calc(1 * 1rem / var(--kolibri-root-font-size, 16)); z-index: 1; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-button__interactive-element::before { content: ""; } .kol-button__text { flex: 1 0 100%; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-popover-button { display: inline; } .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-popover-button--inline { display: inline-block; } .kol-popover-button--inline .kol-button, .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-table-settings { position: absolute; top: 0; right: 0; z-index: 1; } .kol-table-settings .kol-popover-button__popover { background: white; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); border-radius: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); border: 1px solid black; } .kol-table-settings__columns { display: grid; max-height: calc(200 * 1rem / var(--kolibri-root-font-size, 16)); overflow: auto; grid-auto-rows: min-content; grid-template-columns: min-content minmax(max-content, 1fr) calc(140 * 1rem / var(--kolibri-root-font-size, 16)) auto auto; } .kol-table-settings__column { display: grid; align-items: center; grid-template-columns: subgrid; grid-column: 1/6; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-table { --kol-table-selection-col-width: var(--a11y-min-size); display: block; position: relative; max-width: 100%; } .kol-table:has(.kol-table__focus-element:focus) .kol-table__scroll-container { outline: 5px auto Highlight; outline: 5px auto -webkit-focus-ring-color; outline-offset: 2px; } .kol-table__scroll-container { overflow-x: auto; overflow-y: hidden; } .kol-table__table { table-layout: fixed; } .kol-table__caption { min-height: var(--a11y-min-size); text-align: start; } .kol-table__settings:not(:has(~ .kol-table__scroll-container .kol-table__caption)) { min-height: var(--a11y-min-size); } .kol-table__sort-button.kol-button { color: inherit; } .kol-table__sort { display: inline-flex; align-items: center; } .kol-table__sort-order { display: inline-flex; align-items: center; justify-content: center; } .kol-table__body { text-align: left; } .kol-table__body .kol-button__text { justify-items: start; } .kol-table__body:has(.kol-table__loader--shown) { position: relative; min-height: calc(var(--a11y-min-size) * 3); } .kol-table__cell--align-left { text-align: left; } .kol-table__cell--align-left .kol-table__sort-button .kol-button__text { align-items: start; text-align: start; } .kol-table__cell--align-left .kol-table__cell-actions { justify-content: flex-start; } .kol-table__cell--align-center { text-align: center; } .kol-table__cell--align-center .kol-table__sort-button .kol-button__text { align-items: center; } .kol-table__cell--align-right { text-align: right; } .kol-table__cell--align-right .kol-table__sort-button .kol-button__text { align-items: end; text-align: end; } .kol-table__cell--align-right .kol-table__cell-actions { justify-content: flex-end; } .kol-table__cell--selection { background-color: white; position: sticky !important; left: 0; z-index: 2; width: var(--kol-table-selection-col-width, auto); min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); white-space: nowrap; } .kol-table__cell--actions { white-space: nowrap; } .kol-table__cell--actions .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-table__cell--actions :host { display: inline-block; } .kol-table__cell--actions .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-table__cell--actions .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-table__cell--actions .kol-button__interactive-element::before { content: ""; } .kol-table__cell--actions .kol-button__text { flex: 1 0 100%; } .kol-table__cell--actions .kol-button { } .kol-table__cell--actions .kol-button__tooltip { height: 0; } .kol-table__cell--actions .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-table__cell--actions .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-table__cell--actions .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-table__cell--actions :host { display: inline-block; } .kol-table__cell--actions .kol-link { display: inline-flex; max-width: fit-content; } .kol-table__cell--actions .kol-link--standalone { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: stretch; } .kol-table__cell--actions .kol-link--standalone .kol-link__interactive-element { align-items: stretch; } .kol-table__cell--actions .kol-link--standalone .kol-link__text { display: inline-flex; flex: 1 1 100%; place-items: center; } .kol-table__cell--actions .kol-link__interactive-element { display: inline-flex; flex: 1; align-items: baseline; place-items: center; text-align: left; text-decoration-line: none; } .kol-table__cell--actions .kol-link__interactive-element:focus:not([aria-disabled], [disabled]) .kol-span__label, .kol-table__cell--actions .kol-link__interactive-element:hover:not([aria-disabled], [disabled]) .kol-span__label { text-decoration-thickness: 0.2em; } .kol-table__cell--actions .kol-link .kol-span__label { text-decoration-line: underline; } .kol-table__cell--actions .kol-link__icon { display: inline-flex; } .kol-table__cell--sticky-left, .kol-table__cell--sticky-right { background-color: white; position: sticky !important; z-index: 1; } .kol-table__cell--sticky-left:nth-last-child(1 of .kol-table__cell--sticky-left) { border-right: 2px solid black; } .kol-table__cell--sticky-right:nth-child(1 of .kol-table__cell--sticky-left) { border-left: 2px solid black; } .kol-table__cell-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; } .kol-table__cell-states { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; } .kol-table__spacer { display: none; } .kol-table__selection { position: relative; } .kol-table__selection-label { display: flex; position: relative; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; justify-content: center; } .kol-table__selection-label:not(.kol-table__selection-label--disabled) { cursor: pointer; } .kol-table__selection-label--disabled { cursor: not-allowed; } .kol-table__selection-icon { display: block; position: absolute; inset: auto; z-index: 1; } .kol-table__selection-input { border-style: solid; margin: 0; appearance: none; cursor: pointer; } .kol-table__selection-input:disabled { cursor: not-allowed; } .kol-table__selection-input:before { content: ""; } .kol-table__selection-input--checkbox { background-color: white; display: flex; position: relative; min-width: calc(var(--a11y-min-size) / 2); min-height: calc(var(--a11y-min-size) / 2); border-width: 2px; align-items: center; justify-content: center; line-height: 1.5; } .kol-table__selection-input--radio { border-radius: 100%; display: flex; width: 1.5em; min-width: 1.5em; height: 1.5em; min-height: 1.5em; padding: 0; border-width: 2px; } .kol-table__selection-input--radio:before { border-radius: 100%; width: 0.75em; height: 0.75em; margin: auto; } .kol-table__selection-input--radio:checked:before { background-color: black; } @media (forced-colors: active) { .kol-table__selection-input--radio:checked:before { background-color: selectedItem !important; } } .kol-table__loader--shown { background: white; display: flex; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; align-items: center; justify-content: center; } .kol-spin { display: contents; } .kol-spin__spinner { display: block; position: relative; } }`;
|
|
37277
37173
|
|
|
37278
37174
|
class KolTableStateless extends BaseTableStatelessWebComponent {
|
|
37279
37175
|
constructor(hostRef) {
|
|
37280
|
-
super();
|
|
37281
|
-
|
|
37176
|
+
super(...arguments);
|
|
37177
|
+
if (new.target === KolTableStateless)
|
|
37178
|
+
registerInstance(this, hostRef);
|
|
37282
37179
|
this.externalLabelElements = [];
|
|
37283
37180
|
this.hasScrollbar = false;
|
|
37284
37181
|
this.rowKeys = new Map();
|
|
@@ -37369,7 +37266,7 @@ class KolTableStateless extends BaseTableStatelessWebComponent {
|
|
|
37369
37266
|
this.syncTableLabel(this.externalLabelElements);
|
|
37370
37267
|
}
|
|
37371
37268
|
render() {
|
|
37372
|
-
return hAsync(Host, { key: '
|
|
37269
|
+
return hAsync(Host, { key: 'ae15aed17db36dedc317573d91f2e9c6f49c6c54' }, this.renderTableStatelessFC());
|
|
37373
37270
|
}
|
|
37374
37271
|
get host() { return getElement(this); }
|
|
37375
37272
|
static get watchers() { return {
|
|
@@ -37527,15 +37424,22 @@ const BEM_CLASS_TABS__TAB = tabsBem('tab');
|
|
|
37527
37424
|
const BEM_CLASS_TABS__TABLIST = tabsBem('tablist');
|
|
37528
37425
|
const TabsFC = (props) => {
|
|
37529
37426
|
const { align, class: hostClass, createButton, handleBlur, handleKeyDown, hasCreateButton, label, refContent, refRoot, tabButtons } = props;
|
|
37530
|
-
|
|
37427
|
+
const handleFocusOut = (event) => {
|
|
37428
|
+
const tablist = event.currentTarget;
|
|
37429
|
+
if (!(event.relatedTarget instanceof Node && tablist.contains(event.relatedTarget))) {
|
|
37430
|
+
handleBlur();
|
|
37431
|
+
}
|
|
37432
|
+
};
|
|
37433
|
+
return (hAsync(BemRootNodeFC, { block: "kol-tabs", modifiers: { [`align-${align}`]: true }, class: hostClass, ref: refRoot }, hAsync("div", { class: BEM_CLASS_TABS__BUTTON_GROUP }, hAsync("div", { "aria-label": label, class: BEM_CLASS_TABS__TABLIST, role: "tablist", tabIndex: -1, onKeyDown: handleKeyDown, onFocusout: handleFocusOut }, tabButtons.map(({ buttonProps, refBox }) => (hAsync("div", { class: BEM_CLASS_TABS__TAB, ref: refBox }, hAsync(ButtonFC, Object.assign({}, buttonProps)))))), hasCreateButton && (hAsync("div", { class: BEM_CLASS_TABS__BUTTON_CREATE, ref: createButton.refBox }, hAsync(ButtonFC, Object.assign({}, createButton.buttonProps))))), hAsync("div", { class: BEM_CLASS_TABS__CONTENT, ref: refContent })));
|
|
37531
37434
|
};
|
|
37532
37435
|
|
|
37533
|
-
const defaultStyleCss$6 = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-tabs { display: var(--display); grid-template-columns: var(--grid-template-columns); grid-template-rows: var(--grid-template-rows); } .kol-tabs--align-right { --display: grid; --grid-template-columns: 1fr auto; --button-group-flex-direction: column; --button-group-order: 2; } .kol-tabs--align-left { --display: grid; --grid-template-columns: auto 1fr; --button-group-flex-direction: column; --button-group-order: 0; } .kol-tabs--align-bottom { --display: grid; --grid-template-rows: 1fr auto; --button-group-order: 2; } .kol-tabs__tabs-align-top { --display: grid; --grid-template-rows: auto 1fr; --button-group-order: 0; } .kol-tabs__button-group { display: flex; order: var(--button-group-order); flex-direction: var(--button-group-flex-direction); flex-wrap: wrap; } .kol-tabs__button-group .kol-button { display: block; } .kol-tabs__button-group .kol-button .kol-button__interactive-element { border-bottom-color: transparent; border-bottom-style: solid; } @media (forced-colors: active) { .kol-tabs__button-group .kol-button.selected { outline: 3px solid Highlight; outline-offset: -3px; } .kol-tabs__button-group .kol-button.selected:has(.kol-button__interactive-element:focus-visible) { outline-style: dashed; } } .kol-tabs__tablist { display: flex; flex-direction: var(--button-group-flex-direction); flex-wrap: wrap; } .kol-tabs__panel { height: 100%; } }`;
|
|
37436
|
+
const defaultStyleCss$6 = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-tabs { display: var(--display); grid-template-columns: var(--grid-template-columns); grid-template-rows: var(--grid-template-rows); } .kol-tabs--align-right { --display: grid; --grid-template-columns: 1fr auto; --button-group-flex-direction: column; --button-group-order: 2; } .kol-tabs--align-left { --display: grid; --grid-template-columns: auto 1fr; --button-group-flex-direction: column; --button-group-order: 0; } .kol-tabs--align-bottom { --display: grid; --grid-template-rows: 1fr auto; --button-group-order: 2; } .kol-tabs__tabs-align-top { --display: grid; --grid-template-rows: auto 1fr; --button-group-order: 0; } .kol-tabs__button-group { display: flex; order: var(--button-group-order); flex-direction: var(--button-group-flex-direction); flex-wrap: wrap; } .kol-tabs__button-group .kol-button { display: block; } .kol-tabs__button-group .kol-button .kol-button__interactive-element { border-bottom-color: transparent; border-bottom-style: solid; } @media (forced-colors: active) { .kol-tabs__button-group .kol-button.selected { outline: 3px solid Highlight; outline-offset: -3px; } .kol-tabs__button-group .kol-button.selected:has(.kol-button__interactive-element:focus-visible) { outline-style: dashed; } } .kol-tabs__tablist { display: flex; flex-direction: var(--button-group-flex-direction); flex-wrap: wrap; } .kol-tabs__panel { height: 100%; } }`;
|
|
37534
37437
|
|
|
37535
37438
|
class KolTabs extends BaseWebComponent {
|
|
37536
37439
|
constructor(hostRef) {
|
|
37537
|
-
super();
|
|
37538
|
-
|
|
37440
|
+
super(...arguments);
|
|
37441
|
+
if (new.target === KolTabs)
|
|
37442
|
+
registerInstance(this, hostRef);
|
|
37539
37443
|
this.onCreateLabel = `${translate('kol-new')} …`;
|
|
37540
37444
|
this.ctaRef = createCtaRef();
|
|
37541
37445
|
this.id = createUniqueId('tabs');
|
|
@@ -37604,10 +37508,6 @@ class KolTabs extends BaseWebComponent {
|
|
|
37604
37508
|
case KeyboardKey.ArrowLeft:
|
|
37605
37509
|
this.goToPreviousTab(event);
|
|
37606
37510
|
break;
|
|
37607
|
-
case KeyboardKey.Space:
|
|
37608
|
-
case KeyboardKey.Enter:
|
|
37609
|
-
this.activateFocusedTab(event);
|
|
37610
|
-
break;
|
|
37611
37511
|
}
|
|
37612
37512
|
};
|
|
37613
37513
|
this.handleBlur = () => {
|
|
@@ -37704,11 +37604,6 @@ class KolTabs extends BaseWebComponent {
|
|
|
37704
37604
|
const nextFocusIndex = this.prevPossibleTabIndex(this.getRenderProp('tabs'), this.getCurrentFocusIndex());
|
|
37705
37605
|
this.selectNextTabEvent(event, nextFocusIndex, this.getKeyboardTabChangeMode());
|
|
37706
37606
|
}
|
|
37707
|
-
activateFocusedTab(event) {
|
|
37708
|
-
if (typeof this.currentFocusIndex === 'number') {
|
|
37709
|
-
this.onSelect(event, this.currentFocusIndex);
|
|
37710
|
-
}
|
|
37711
|
-
}
|
|
37712
37607
|
selectNextTabEvent(event, nextTabIndex, changeMode = 'activateCompletely') {
|
|
37713
37608
|
var _a, _b;
|
|
37714
37609
|
this.currentFocusIndex = nextTabIndex;
|
|
@@ -37815,7 +37710,7 @@ class KolTabs extends BaseWebComponent {
|
|
|
37815
37710
|
});
|
|
37816
37711
|
}
|
|
37817
37712
|
render() {
|
|
37818
|
-
return (hAsync(Host, { key: '
|
|
37713
|
+
return (hAsync(Host, { key: 'f42c56ba7918ef6a33a6a354e2f9c4de5ca8fcb4' }, hAsync(TabsFC, { key: '9691fd92c0782719c4c343e663cde270c907449c', align: this.getRenderProp('align'), behavior: this.getRenderProp('behavior'), createButton: this.createButton, handleBlur: this.handleBlur, handleKeyDown: this.handleKeyDown, hasCreateButton: this.getRenderProp('hasCreateButton'), label: this.getRenderProp('label'), on: this.getRenderProp('on'), refContent: this.setContentRef, refRoot: this.setRootRef, selected: this.getRenderProp('selected'), tabButtons: this.tabButtons, tabs: this.getRenderProp('tabs') })));
|
|
37819
37714
|
}
|
|
37820
37715
|
get host() { return getElement(this); }
|
|
37821
37716
|
static get watchers() { return {
|
|
@@ -37895,12 +37790,13 @@ const textareaPropsConfig = {
|
|
|
37895
37790
|
],
|
|
37896
37791
|
};
|
|
37897
37792
|
|
|
37898
|
-
const defaultStyleCss$5 = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-textarea { width: 100%; } }`;
|
|
37793
|
+
const defaultStyleCss$5 = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-button { background-color: transparent; display: inline-block; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); margin: 0; padding: 0; text-align: center; } .kol-button__interactive-element { border-style: none; display: block; border-width: medium; font-weight: inherit; font-style: inherit; text-align: inherit; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } .kol-form-field .kol-popover-button { display: inline; } .kol-form-field .kol-popover-button__popover { margin: 0; padding: 0; border: 0; } .kol-form-field .kol-popover-button--open .kol-button__tooltip { display: none; } .kol-form-field .kol-popover-button--inline { display: inline-block; } .kol-form-field .kol-popover-button--inline .kol-button, .kol-form-field .kol-popover-button--inline .kol-button .kol-button__interactive-element { min-width: 0; min-height: 1em; } .kol-form-field .kol-popover { opacity: 0; transition: 0.2s ease-out opacity; } .kol-form-field .kol-popover-button--open .kol-popover-button__popover { opacity: 1; } .kol-form-field { display: grid; } .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label { cursor: pointer; } .kol-form-field__label { display: flex; } .kol-form-field__label-text { flex-flow: row; align-items: flex-start; justify-content: flex-start; } .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after, .kol-form-field--required:not(:has(.kol-form-field__label--legend)) .kol-form-field__input .kol-tooltip__content .kol-span__label::after { content: "*"/""; } .kol-input-container { background-color: transparent; display: grid; position: relative; width: 100%; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; grid-template-columns: 1fr; } .kol-input-container:has(> .kol-input-container__adornment--start) { grid-template-columns: auto 1fr auto; } .kol-input-container__container { position: relative; z-index: 1; } .kol-input-container__adornment { display: flex; align-items: center; } .kol-input-container__adornment .kol-icon { display: grid; place-items: center; } .kol-textarea { width: 100%; } }`;
|
|
37899
37794
|
|
|
37900
37795
|
class KolTextarea extends BaseFormFieldWebComponent {
|
|
37901
37796
|
constructor(hostRef) {
|
|
37902
37797
|
super();
|
|
37903
|
-
|
|
37798
|
+
if (new.target === KolTextarea)
|
|
37799
|
+
registerInstance(this, hostRef);
|
|
37904
37800
|
this.id = createUniqueId('textarea');
|
|
37905
37801
|
this.infoPopoverOpen = false;
|
|
37906
37802
|
this.inputHasFocus = false;
|
|
@@ -38136,6 +38032,7 @@ class KolTextarea extends BaseFormFieldWebComponent {
|
|
|
38136
38032
|
this.isWritingRows = false;
|
|
38137
38033
|
}
|
|
38138
38034
|
measureTextareaRows(el) {
|
|
38035
|
+
const { overflow, padding } = el.style;
|
|
38139
38036
|
el.style.overflow = 'hidden';
|
|
38140
38037
|
el.style.padding = '0';
|
|
38141
38038
|
const currentRows = el.rows;
|
|
@@ -38143,7 +38040,8 @@ class KolTextarea extends BaseFormFieldWebComponent {
|
|
|
38143
38040
|
el.rows = 1;
|
|
38144
38041
|
const nextRows = Math.round(el.scrollHeight / rowHeight);
|
|
38145
38042
|
el.rows = currentRows;
|
|
38146
|
-
el.style.
|
|
38043
|
+
el.style.overflow = overflow;
|
|
38044
|
+
el.style.padding = padding;
|
|
38147
38045
|
const minRows = this.minRows;
|
|
38148
38046
|
return minRows && minRows > nextRows ? minRows : nextRows;
|
|
38149
38047
|
}
|
|
@@ -38165,7 +38063,7 @@ class KolTextarea extends BaseFormFieldWebComponent {
|
|
|
38165
38063
|
render() {
|
|
38166
38064
|
const disabled = this.getRenderProp('disabled');
|
|
38167
38065
|
const { startAdornment, endAdornment } = getInputAdornments({ icons: this.getRenderProp('icons') });
|
|
38168
|
-
return (hAsync(Host, { key: '
|
|
38066
|
+
return (hAsync(Host, { key: 'f213a17cb37e5957ab505f30bb9a16f4d540277a' }, hAsync(FormFieldFC, Object.assign({ key: 'f30d7ffa05b8f88949b05967af1270a26de84dff' }, this.getFormFieldProps({
|
|
38169
38067
|
class: clsx('kol-form-field-textarea', {
|
|
38170
38068
|
'kol-form-field--has-value': this.hasValue,
|
|
38171
38069
|
'kol-form-field--has-counter': this.counter.hasSoftLimit() || this.counter.hasCounter(),
|
|
@@ -38177,7 +38075,7 @@ class KolTextarea extends BaseFormFieldWebComponent {
|
|
|
38177
38075
|
readOnly: this.getRenderProp('readOnly'),
|
|
38178
38076
|
maxLength: this.counter.getRenderProp('maxLength'),
|
|
38179
38077
|
counter: this.counter.getCounterProps(),
|
|
38180
|
-
})), hAsync(InputContainerFC, { key: '
|
|
38078
|
+
})), hAsync(InputContainerFC, { key: '0d9be56a253943f934a0e0c00f4c879ce50459e5', disabled: disabled, msg: this.getRenderProp('msg'), touched: this.getRenderProp('touched'), startAdornment: startAdornment, endAdornment: endAdornment }, hAsync(TextAreaFC, Object.assign({ key: '2151d1aa605a6fd3c3899b106270fc16c432d0dc' }, this.getTextareaProps()))))));
|
|
38181
38079
|
}
|
|
38182
38080
|
get host() { return getElement(this); }
|
|
38183
38081
|
static get watchers() { return {
|
|
@@ -38326,12 +38224,13 @@ const ToastItemFc = (_a) => {
|
|
|
38326
38224
|
return (hAsync("div", { class: clsx('kol-toast-item', `kol-toast-item--${status}`) }, hAsync(AlertFC, { alert: true, class: "kol-toast-item__alert", closerAriaDescriptionId: nonce(), handleCloserClick: onClose, hasCloser: true, headingId: createUniqueId('alert-heading'), label: label, level: 0, refCloserButton: () => undefined, refCloserTooltip: () => undefined, type: type, variant: variant || 'card' }, hAsync("div", Object.assign({}, other), description))));
|
|
38327
38225
|
};
|
|
38328
38226
|
|
|
38329
|
-
const defaultStyleCss$4 = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=
|
|
38227
|
+
const defaultStyleCss$4 = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @layer kol-component { :host { display: block; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-alert .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-alert :host { display: inline-block; } .kol-alert .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-alert .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-alert .kol-button__interactive-element::before { content: ""; } .kol-alert .kol-button__text { flex: 1 0 100%; } .kol-alert .kol-button { } .kol-alert .kol-button__tooltip { height: 0; } .kol-alert .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-alert .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-alert { display: grid; grid-template-areas: "icon heading close" "icon content close"; grid-template-columns: min-content 1fr min-content; grid-template-rows: min-content min-content; } .kol-alert__icon { grid-area: icon; } .kol-alert__heading { grid-area: heading; } .kol-alert__closer { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); grid-area: close; } .kol-alert__content { grid-area: content; } :host { display: flex; position: fixed; z-index: 200; max-width: 90vw; flex-direction: column; } .kol-toast-container__close-all { align-self: flex-end; } }`;
|
|
38330
38228
|
|
|
38331
38229
|
const TRANSITION_TIMEOUT = 300;
|
|
38332
38230
|
class KolToastContainer {
|
|
38333
38231
|
constructor(hostRef) {
|
|
38334
|
-
|
|
38232
|
+
if (new.target === KolToastContainer)
|
|
38233
|
+
registerInstance(this, hostRef);
|
|
38335
38234
|
this.state = {
|
|
38336
38235
|
_toastStates: [],
|
|
38337
38236
|
};
|
|
@@ -38399,7 +38298,7 @@ class KolToastContainer {
|
|
|
38399
38298
|
}
|
|
38400
38299
|
}
|
|
38401
38300
|
render() {
|
|
38402
|
-
return (hAsync(Host, { key: '
|
|
38301
|
+
return (hAsync(Host, { key: '7c3623651b8bb10e3b8b7670a53605890d04b9be', class: "kol-toast-container" }, this.state._toastStates.length > 1 && (hAsync(KolButtonTag, { key: '3bfb7ef93ead485aa7a2588ab92b4a49371fe80b', _label: this.translateToastCloseAll, class: "kol-toast-container__button-close-all", _on: {
|
|
38403
38302
|
onClick: () => {
|
|
38404
38303
|
void this.closeAll();
|
|
38405
38304
|
},
|
|
@@ -38557,13 +38456,14 @@ const createHRItem = () => {
|
|
|
38557
38456
|
};
|
|
38558
38457
|
};
|
|
38559
38458
|
|
|
38560
|
-
const defaultStyleCss$3 = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794028903670"); src: url("kolicons.eot?t=1794028903670#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794028903670") format("woff2"), url("kolicons.woff?t=1794028903670") format("woff"), url("kolicons.ttf?t=1794028903670") format("truetype"), url("kolicons.svg?t=1794028903670#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-link { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-link__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-link__interactive-element::before { content: ""; } .kol-link__text { flex: 1 0 100%; } .kol-link { } .kol-link__tooltip { height: 0; } .kol-link--external-link > .kolicon-link-external::before { content: none; } .kol-link--external-link .kol-link__interactive-element > .kolicon-link-external::before { content: none; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-button__interactive-element::before { content: ""; } .kol-button__text { flex: 1 0 100%; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-toolbar { display: flex; flex-wrap: wrap; align-items: stretch; } .kol-toolbar--orientation-horizontal .kol-toolbar__item hr { height: 100%; } .kol-toolbar--orientation-vertical { flex-direction: column; align-items: stretch; } .kol-toolbar--orientation-vertical .kol-span { align-items: flex-start; } .kol-toolbar__item hr { margin: 0; } .kol-toolbar:focus-within { outline: 1px solid; outline-offset: 2px; } }`;
|
|
38459
|
+
const defaultStyleCss$3 = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tooltip { display: contents; } .kol-tooltip__floating { opacity: 0; display: none; position: fixed; top: 0; left: 0; width: var(--kol-tooltip-width, max-content); min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16)); max-width: 90vw; max-height: 90vh; animation-direction: normal; animation-duration: var(--kolibri-tooltip-animation-duration, 250ms); animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .kol-tooltip__floating.hide { animation-name: hideTooltip; } .kol-tooltip__floating.show { animation-name: showTooltip; } .kol-tooltip__arrow { transform: rotate(45deg); color: black; background-color: white; position: absolute; z-index: 999; width: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); height: calc(10 * 1rem / var(--kolibri-root-font-size, 16)); } .kol-tooltip__content { color: black; background-color: white; position: relative; z-index: 1000; } @keyframes hideTooltip { 0% { opacity: 1; } 100% { opacity: 0; display: none; } } @keyframes showTooltip { 0% { opacity: 0; } 100% { opacity: 1; } } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-link { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-link__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-link__interactive-element::before { content: ""; } .kol-link__text { flex: 1 0 100%; } .kol-link { } .kol-link__tooltip { height: 0; } .kol-link--external-link > .kolicon-link-external::before { content: none; } .kol-link--external-link .kol-link__interactive-element > .kolicon-link-external::before { content: none; } .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } :host { display: inline-block; } .kol-button { display: flex; height: 100%; min-height: var(--a11y-min-size); text-decoration-line: none; } .kol-button__interactive-element { display: flex; flex: 1; text-align: left; text-decoration-line: none; } .kol-button__interactive-element::before { content: ""; } .kol-button__text { flex: 1 0 100%; } .kol-button { } .kol-button__tooltip { height: 0; } .kol-button--external-link > .kolicon-link-external::before { content: none; } .kol-button--external-link .kol-button__interactive-element > .kolicon-link-external::before { content: none; } .kol-toolbar { display: flex; flex-wrap: wrap; align-items: stretch; } .kol-toolbar--orientation-horizontal .kol-toolbar__item hr { height: 100%; } .kol-toolbar--orientation-vertical { flex-direction: column; align-items: stretch; } .kol-toolbar--orientation-vertical .kol-span { align-items: flex-start; } .kol-toolbar__item hr { margin: 0; } .kol-toolbar:focus-within { outline: 1px solid; outline-offset: 2px; } }`;
|
|
38561
38460
|
|
|
38562
38461
|
const ARROW_KEYS = [KeyboardKey.ArrowUp, KeyboardKey.ArrowDown, KeyboardKey.ArrowRight, KeyboardKey.ArrowLeft];
|
|
38563
38462
|
class KolToolbar extends BaseWebComponent {
|
|
38564
38463
|
constructor(hostRef) {
|
|
38565
|
-
super();
|
|
38566
|
-
|
|
38464
|
+
super(...arguments);
|
|
38465
|
+
if (new.target === KolToolbar)
|
|
38466
|
+
registerInstance(this, hostRef);
|
|
38567
38467
|
this.currentIndex = 0;
|
|
38568
38468
|
this.itemRecords = [];
|
|
38569
38469
|
this.location = '';
|
|
@@ -38650,7 +38550,7 @@ class KolToolbar extends BaseWebComponent {
|
|
|
38650
38550
|
return undefined;
|
|
38651
38551
|
}
|
|
38652
38552
|
render() {
|
|
38653
|
-
return (hAsync(Host, { key: '
|
|
38553
|
+
return (hAsync(Host, { key: '10c807156e0a9f91b26ffb26ac01768029106dab' }, hAsync(ToolbarFC, { key: '7ebbb8a2e88664afddf0c66e046003b21ba0e3d5', currentIndex: this.currentIndex, itemRecords: this.itemRecords, label: this.getRenderProp('label'), location: this.location, orientation: this.getRenderProp('orientation') })));
|
|
38654
38554
|
}
|
|
38655
38555
|
get host() { return getElement(this); }
|
|
38656
38556
|
static get watchers() { return {
|
|
@@ -38688,7 +38588,8 @@ class KolToolbar extends BaseWebComponent {
|
|
|
38688
38588
|
|
|
38689
38589
|
class KolTooltipWc {
|
|
38690
38590
|
constructor(hostRef) {
|
|
38691
|
-
|
|
38591
|
+
if (new.target === KolTooltipWc)
|
|
38592
|
+
registerInstance(this, hostRef);
|
|
38692
38593
|
this.tooltipBehavior = new TooltipBehavior(BaseWebComponent.stateLess);
|
|
38693
38594
|
this._badgeText = undefined;
|
|
38694
38595
|
this._align = 'top';
|
|
@@ -38733,7 +38634,7 @@ class KolTooltipWc {
|
|
|
38733
38634
|
(_a = this.tooltipBehavior) === null || _a === void 0 ? void 0 : _a.destroy();
|
|
38734
38635
|
}
|
|
38735
38636
|
render() {
|
|
38736
|
-
return (hAsync(Host, { key: '
|
|
38637
|
+
return (hAsync(Host, { key: 'a0f2a8ea9f13c720320d69166664f24875b6a92e', class: "kol-tooltip" }, hAsync(TooltipFC, { key: 'b0459c0faf4862e66e4704503a47bd9499e5181e', label: this.tooltipBehavior.getRenderProp('label'), badgeText: this._badgeText, id: this.tooltipBehavior.getRenderProp('id'), refFloating: (el) => { var _a; return (_a = this.tooltipBehavior) === null || _a === void 0 ? void 0 : _a.setTooltipElementRef(el); } })));
|
|
38737
38638
|
}
|
|
38738
38639
|
get host() { return getElement(this); }
|
|
38739
38640
|
static get watchers() { return {
|
|
@@ -38791,8 +38692,9 @@ const defaultStyleCss$2 = () => `@charset "UTF-8"; @layer kol-a11y, kol-glob
|
|
|
38791
38692
|
const isTreeItem = (element) => (element === null || element === void 0 ? void 0 : element.tagName) === KolTreeItemTag.toUpperCase();
|
|
38792
38693
|
class KolTree extends BaseWebComponent {
|
|
38793
38694
|
constructor(hostRef) {
|
|
38794
|
-
super();
|
|
38795
|
-
|
|
38695
|
+
super(...arguments);
|
|
38696
|
+
if (new.target === KolTree)
|
|
38697
|
+
registerInstance(this, hostRef);
|
|
38796
38698
|
this.cacheValid = false;
|
|
38797
38699
|
this.propsConfig = treePropsConfig;
|
|
38798
38700
|
this.invalidateOpenItemsCache = () => {
|
|
@@ -39013,7 +38915,7 @@ class KolTree extends BaseWebComponent {
|
|
|
39013
38915
|
}
|
|
39014
38916
|
}
|
|
39015
38917
|
render() {
|
|
39016
|
-
return (hAsync(Host, { key: '
|
|
38918
|
+
return (hAsync(Host, { key: '46407a67efb548149a62e371713e0da8ec352863', tabindex: "0" }, hAsync(TreeFC, { key: '2725ae9400123f266b59b8c45b82eac3b83cf5f3', handleSlotchange: this.handleSlotchange, label: this.getRenderProp('label') })));
|
|
39017
38919
|
}
|
|
39018
38920
|
get host() { return getElement(this); }
|
|
39019
38921
|
static get watchers() { return {
|
|
@@ -39054,12 +38956,13 @@ const LINK_DEFAULTS = Object.freeze(buildDefaultPropsFromConfig(linkPropsConfig)
|
|
|
39054
38956
|
const noop = () => undefined;
|
|
39055
38957
|
const TreeItemFC = ({ active, ariaCurrent, groupId, handleAnchorClick, handleSlotchange, handleToggleClick, hasChildren, href, label, level, open, refAnchor, }) => (hAsync("li", { class: BEM_CLASS_TREE_ITEM, role: "none", style: { '--level': `${level}` } }, hAsync("span", { class: treeItemBem('link', { active, 'first-level': level === 0 }) }, hAsync(LinkFC, Object.assign({}, LINK_DEFAULTS, { ariaCurrent: ariaCurrent, ariaDescriptionId: "", ariaExpanded: hasChildren ? (open ? 'true' : 'false') : '', ariaOwns: hasChildren ? groupId : '', expertSlot: true, handleAnchorClick: handleAnchorClick, href: href, label: "", refAnchor: refAnchor, refTooltip: noop, role: "treeitem", tabIndex: active ? 0 : -1 }), hAsync("span", { class: BEM_CLASS_TREE_ITEM__LINK_INNER }, hasChildren ? (hAsync("span", { class: BEM_CLASS_TREE_ITEM__TOGGLE_BUTTON, onClick: handleToggleClick }, hAsync(IconFC, { class: BEM_CLASS_TREE_ITEM__TOGGLE_BUTTON_ICON, icons: `kolicon kolicon-${open ? 'chevron-down' : 'chevron-right'}`, label: '' }))) : (hAsync("span", { class: BEM_CLASS_TREE_ITEM__TOGGLE_BUTTON_PLACEHOLDER })), hAsync("span", { class: BEM_CLASS_TREE_ITEM__TEXT }, renderLabelWithLang(label))))), hAsync("ul", { class: BEM_CLASS_TREE_ITEM__CHILDREN, hidden: !hasChildren || !open, role: "group", id: groupId }, hAsync("slot", { onSlotchange: handleSlotchange }))));
|
|
39056
38958
|
|
|
39057
|
-
const defaultStyleCss$1 = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=
|
|
38959
|
+
const defaultStyleCss$1 = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-tree-item__link .kol-link { display: inline-flex; width: 100%; min-height: var(--a11y-min-size); align-items: center; text-decoration: none; } .kol-tree-item__link .kol-link__interactive-element { flex: 1 1 auto; text-decoration: none; } .kol-tree-item__link-inner { display: flex; align-items: center; } .kol-tree-item__children { margin: 0; padding: 0; list-style: none; } .kol-tree-item .kol-span { place-items: unset; } .kol-tree-item__toggle-button, .kol-tree-item__toggle-button-placeholder { display: inline-flex; min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); align-items: center; justify-content: center; } .kol-tree-item__text { text-decoration: underline; } }`;
|
|
39058
38960
|
|
|
39059
38961
|
class KolTreeItem extends BaseWebComponent {
|
|
39060
38962
|
constructor(hostRef) {
|
|
39061
|
-
super();
|
|
39062
|
-
|
|
38963
|
+
super(...arguments);
|
|
38964
|
+
if (new.target === KolTreeItem)
|
|
38965
|
+
registerInstance(this, hostRef);
|
|
39063
38966
|
this.ariaCurrent = '';
|
|
39064
38967
|
this.groupId = createUniqueId('tree-group');
|
|
39065
38968
|
this.hasChildren = false;
|
|
@@ -39161,7 +39064,7 @@ class KolTreeItem extends BaseWebComponent {
|
|
|
39161
39064
|
}
|
|
39162
39065
|
}
|
|
39163
39066
|
render() {
|
|
39164
|
-
return (hAsync(Host, { key: '
|
|
39067
|
+
return (hAsync(Host, { key: '52b3ee0d7b7d593abeaf27e782a5e3ed384d710f' }, hAsync(TreeItemFC, { key: '8acfdb55c45f3245ca7df0839c734188dcaea5bd', active: this.getRenderProp('active'), ariaCurrent: this.ariaCurrent, groupId: this.groupId, handleAnchorClick: this.handleAnchorClick, handleSlotchange: this.handleSlotchange, handleToggleClick: this.handleToggleClick, hasChildren: this.hasChildren, href: this.getRenderProp('href'), label: this.getRenderProp('label'), level: this.level, open: this.open, refAnchor: this.anchorRef })));
|
|
39165
39068
|
}
|
|
39166
39069
|
get host() { return getElement(this); }
|
|
39167
39070
|
static get watchers() { return {
|
|
@@ -39216,15 +39119,16 @@ const VersionFC = ({ class: hostClass, color, icons, label }) => {
|
|
|
39216
39119
|
return (hAsync(BemRootNodeFC, { block: "kol-version", class: hostClass }, hAsync(BadgeFC, { color: color, icons: icons, label: label })));
|
|
39217
39120
|
};
|
|
39218
39121
|
|
|
39219
|
-
const defaultStyleCss = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=
|
|
39122
|
+
const defaultStyleCss = () => `@charset "UTF-8"; @layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors; @layer kol-a11y { :host { --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px); --kol-a11y-font-color: black; --kol-a11y-background-color: white; color: var(--kol-a11y-font-color); background-color: var(--kol-a11y-background-color); --kol-a11y-font-family: Verdana; font-family: var(--kol-a11y-font-family); letter-spacing: inherit; word-spacing: inherit; text-align: left; } * { hyphens: auto; word-break: break-word; } button, .kol-input .input { min-width: var(--a11y-min-size); min-height: var(--a11y-min-size); } a, button, h1, h2, h3, h4, h5, h6, input, option, select, textarea { color: inherit; font-family: inherit; font-size: inherit; letter-spacing: inherit; word-spacing: inherit; } .visually-hidden { position: fixed !important; top: 0; left: 0; width: 1px; height: 1px; margin: 0 !important; padding: 0 !important; overflow: hidden; white-space: nowrap; border: 0; clip-path: inset(50%); } } @layer kol-forced-colors { @media (forced-colors: active) { .kol-button__text { color: ButtonText; background-color: ButtonFace; border: 2px solid ButtonBorder; } .kol-button--disabled .kol-button__text { color: GrayText; border-color: GrayText; } .kol-link__interactive-element[aria-disabled=true], .kol-accordion__heading[aria-disabled=true], .kol-details__heading[aria-disabled=true] { color: GrayText; } .kol-link__interactive-element[aria-disabled=true] .kol-icon, .kol-link__interactive-element[aria-disabled=true] .kol-span__label, .kol-accordion__heading[aria-disabled=true] .kol-icon, .kol-accordion__heading[aria-disabled=true] .kol-span__label, .kol-details__heading[aria-disabled=true] .kol-icon, .kol-details__heading[aria-disabled=true] .kol-span__label { color: GrayText; } input:disabled, select:disabled, textarea:disabled { color: GrayText; border-color: GrayText; } .kol-card, .kol-dialog, .kol-modal { color: CanvasText; background-color: Canvas; border: 1px solid ButtonBorder; } .kol-pagination__button--selected .kol-button { opacity: 1; } .kol-pagination__button--selected .kol-button__text { color: SelectedItemText; background-color: SelectedItem; } .kol-button__interactive-element:focus-visible, .kol-link__interactive-element:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } } } @layer kol-global { :is(a, button) { background-color: transparent; width: 100%; margin: 0; padding: 0; border: none; } [hidden] { display: none !important; } .badge-text-hint { color: black; background-color: white; } } @layer kol-global { :host { max-width: 100%; font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16)); } * { box-sizing: border-box; } .kol-span { display: flex; flex-flow: column; align-items: center; justify-content: center; } .kol-span__container { display: flex; align-items: center; } a, button { cursor: pointer; } button:disabled { color: unset; } .disabled label, .disabled:focus-within label, [aria-disabled=true], [aria-disabled=true]:focus, [disabled]:where(:not(fieldset)), [disabled]:where(:not(fieldset)):focus { outline: none; cursor: not-allowed; } [aria-disabled=true]:focus .kol-span, [disabled]:focus .kol-span { outline: none !important; } .hastooltip { z-index: 900 !important; } } @font-face { font-family: "kolicons"; src: url("kolicons.eot?t=1794582088003"); src: url("kolicons.eot?t=1794582088003#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794582088003") format("woff2"), url("kolicons.woff?t=1794582088003") format("woff"), url("kolicons.ttf?t=1794582088003") format("truetype"), url("kolicons.svg?t=1794582088003#kolicons") format("svg"); } @layer kol-component { [class^=kolicon-], [class*=" kolicon-"] { font-family: "kolicons"; font-style: normal; font-weight: 400; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .kolicon-alert-error::before { content: "\\ea01"; } .kolicon-alert-info::before { content: "\\ea02"; } .kolicon-alert-success::before { content: "\\ea03"; } .kolicon-alert-warning::before { content: "\\ea04"; } .kolicon-check::before { content: "\\ea05"; } .kolicon-chevron-double-left::before { content: "\\ea06"; } .kolicon-chevron-double-right::before { content: "\\ea07"; } .kolicon-chevron-down::before { content: "\\ea08"; } .kolicon-chevron-left::before { content: "\\ea09"; } .kolicon-chevron-right::before { content: "\\ea0a"; } .kolicon-chevron-up::before { content: "\\ea0b"; } .kolicon-cogwheel::before { content: "\\ea0c"; } .kolicon-cross::before { content: "\\ea0d"; } .kolicon-eye-closed::before { content: "\\ea0e"; } .kolicon-eye::before { content: "\\ea0f"; } .kolicon-house::before { content: "\\ea10"; } .kolicon-kolibri::before { content: "\\ea11"; } .kolicon-link-external::before { content: "\\ea12"; } .kolicon-link::before { content: "\\ea13"; } .kolicon-minus::before { content: "\\ea14"; } .kolicon-pin-pinned::before { content: "\\ea15"; } .kolicon-pin-unpinned::before { content: "\\ea16"; } .kolicon-plus::before { content: "\\ea17"; } .kolicon-settings::before { content: "\\ea18"; } .kolicon-sort-asc::before { content: "\\ea19"; } .kolicon-sort-desc::before { content: "\\ea1a"; } .kolicon-sort-neutral::before { content: "\\ea1b"; } .kolicon-up::before { content: "\\ea1c"; } .kolicon-version::before { content: "\\ea1d"; } } @layer kol-component { .kol-icon { color: inherit; display: inline-block; font-size: inherit; font-weight: inherit; line-height: inherit; } .kol-badge { outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16)); display: flex; align-items: center; justify-content: space-between; } .kol-badge > br { user-select: none; } }`;
|
|
39220
39123
|
|
|
39221
39124
|
const VERSION_COLORS = createContrastColorPair('#bec5c9');
|
|
39222
39125
|
const VERSION_COLOR = { backgroundColor: VERSION_COLORS.background, foregroundColor: VERSION_COLORS.foreground };
|
|
39223
39126
|
const VERSION_ICON = { left: { icon: 'kolicon-version', label: translate('kol-version') } };
|
|
39224
39127
|
class KolVersion extends BaseWebComponent {
|
|
39225
39128
|
constructor(hostRef) {
|
|
39226
|
-
super();
|
|
39227
|
-
|
|
39129
|
+
super(...arguments);
|
|
39130
|
+
if (new.target === KolVersion)
|
|
39131
|
+
registerInstance(this, hostRef);
|
|
39228
39132
|
this.propsConfig = versionPropsConfig;
|
|
39229
39133
|
}
|
|
39230
39134
|
watchLabel(value) {
|
|
@@ -39234,7 +39138,7 @@ class KolVersion extends BaseWebComponent {
|
|
|
39234
39138
|
labelProp.apply(this._label, (v) => this.setRenderProp('label', v), this.isRequired('label'));
|
|
39235
39139
|
}
|
|
39236
39140
|
render() {
|
|
39237
|
-
return (hAsync(Host, { key: '
|
|
39141
|
+
return (hAsync(Host, { key: '41f3fe21b34ed55fe622cc212cec754c5110292e' }, hAsync(VersionFC, { key: '3239e582b5e207e28c4a2cf92d730278f21afd0b', color: VERSION_COLOR, icons: VERSION_ICON, label: this.getRenderProp('label') })));
|
|
39238
39142
|
}
|
|
39239
39143
|
static get watchers() { return {
|
|
39240
39144
|
"_label": [{
|
|
@@ -39258,7 +39162,8 @@ class KolVersion extends BaseWebComponent {
|
|
|
39258
39162
|
|
|
39259
39163
|
class TestComponent {
|
|
39260
39164
|
constructor(hostRef) {
|
|
39261
|
-
|
|
39165
|
+
if (new.target === TestComponent)
|
|
39166
|
+
registerInstance(this, hostRef);
|
|
39262
39167
|
}
|
|
39263
39168
|
static get cmpMeta() { return {
|
|
39264
39169
|
"$flags$": 0,
|
|
@@ -39280,7 +39185,6 @@ registerComponents([
|
|
|
39280
39185
|
KolButton,
|
|
39281
39186
|
KolButtonLink,
|
|
39282
39187
|
KolCard,
|
|
39283
|
-
KolClickButton,
|
|
39284
39188
|
KolCombobox,
|
|
39285
39189
|
KolDetails,
|
|
39286
39190
|
KolDialog,
|
|
@@ -39311,7 +39215,6 @@ registerComponents([
|
|
|
39311
39215
|
KolQuote,
|
|
39312
39216
|
KolSelect,
|
|
39313
39217
|
KolSingleSelect,
|
|
39314
|
-
KolSkeleton,
|
|
39315
39218
|
KolSkipNav,
|
|
39316
39219
|
KolSpin,
|
|
39317
39220
|
KolSplitButton,
|
|
@@ -39522,7 +39425,7 @@ var NAMESPACE = (
|
|
|
39522
39425
|
);
|
|
39523
39426
|
|
|
39524
39427
|
/*
|
|
39525
|
-
Stencil Hydrate Runner v4.45.
|
|
39428
|
+
Stencil Hydrate Runner v4.45.3 | MIT Licensed | https://stenciljs.com
|
|
39526
39429
|
*/
|
|
39527
39430
|
var __create = Object.create;
|
|
39528
39431
|
var __defProp = Object.defineProperty;
|
|
@@ -50811,22 +50714,26 @@ var MockNodeList = class {
|
|
|
50811
50714
|
this.length = length;
|
|
50812
50715
|
}
|
|
50813
50716
|
};
|
|
50717
|
+
var MockElementInternals = class {
|
|
50718
|
+
states = /* @__PURE__ */ new Set();
|
|
50719
|
+
setFormValue() {
|
|
50720
|
+
}
|
|
50721
|
+
setValidity() {
|
|
50722
|
+
}
|
|
50723
|
+
checkValidity() {
|
|
50724
|
+
return true;
|
|
50725
|
+
}
|
|
50726
|
+
reportValidity() {
|
|
50727
|
+
return true;
|
|
50728
|
+
}
|
|
50729
|
+
};
|
|
50814
50730
|
var MockElement = class extends MockNode2 {
|
|
50815
50731
|
__namespaceURI;
|
|
50816
50732
|
__attributeMap;
|
|
50817
50733
|
__shadowRoot;
|
|
50818
50734
|
__style;
|
|
50819
50735
|
attachInternals() {
|
|
50820
|
-
return new
|
|
50821
|
-
get: function(_target, prop, _receiver) {
|
|
50822
|
-
if ("process" in globalThis && globalThis.process.env.__STENCIL_SPEC_TESTS__) {
|
|
50823
|
-
console.error(
|
|
50824
|
-
`NOTE: Property ${String(prop)} was accessed on ElementInternals, but this property is not implemented.
|
|
50825
|
-
Testing components with ElementInternals is fully supported in e2e tests.`
|
|
50826
|
-
);
|
|
50827
|
-
}
|
|
50828
|
-
}
|
|
50829
|
-
});
|
|
50736
|
+
return new MockElementInternals();
|
|
50830
50737
|
}
|
|
50831
50738
|
constructor(ownerDocument, nodeName, namespaceURI = null) {
|
|
50832
50739
|
super(ownerDocument, 1 /* ELEMENT_NODE */, typeof nodeName === "string" ? nodeName : null, null);
|
|
@@ -51100,7 +51007,9 @@ var MockElement = class extends MockNode2 {
|
|
|
51100
51007
|
return this.hasAttributeNS(null, "hidden");
|
|
51101
51008
|
}
|
|
51102
51009
|
set hidden(isHidden) {
|
|
51103
|
-
if (isHidden ===
|
|
51010
|
+
if (isHidden === "until-found") {
|
|
51011
|
+
this.setAttributeNS(null, "hidden", "until-found");
|
|
51012
|
+
} else if (isHidden === true) {
|
|
51104
51013
|
this.setAttributeNS(null, "hidden", "");
|
|
51105
51014
|
} else {
|
|
51106
51015
|
this.removeAttributeNS(null, "hidden");
|