@public-ui/hydrate 4.6.0-rc.1 → 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 +357 -267
- package/dist/index.mjs +357 -267
- 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({
|
|
@@ -10092,6 +10094,7 @@ const SAFE_CLASS_NAME_RE = /^[a-zA-Z][a-zA-Z0-9_-]{0,60}$/;
|
|
|
10092
10094
|
const isSafeClassName = (value) => typeof value === 'string' && SAFE_CLASS_NAME_RE.test(value);
|
|
10093
10095
|
const isValidLabel = isValidLabelString;
|
|
10094
10096
|
const isValidLabelWithExpertSlot = (value) => value === '' || isValidLabelSegments(value);
|
|
10097
|
+
const isValidLabelDecorative = (value) => value === '' || isValidLabel(value);
|
|
10095
10098
|
|
|
10096
10099
|
function validateCustomClass(value) {
|
|
10097
10100
|
return value === '' || isSafeClassName(value);
|
|
@@ -10390,6 +10393,10 @@ const labelAlignProp = createPropDefinition('labelAlign', 'right', (value) => {
|
|
|
10390
10393
|
throw new Error(`Invalid label alignment: ${str}`);
|
|
10391
10394
|
});
|
|
10392
10395
|
|
|
10396
|
+
const labelDecorativeProp = createPropDefinition('label', undefined, normalizeString, isValidLabelDecorative, {
|
|
10397
|
+
hints: labelHints,
|
|
10398
|
+
});
|
|
10399
|
+
|
|
10393
10400
|
const labelLangSegmentsProp = createPropDefinition('label', undefined, normalizeLabelSegments, isValidLabelSegments, {
|
|
10394
10401
|
hints: labelHints,
|
|
10395
10402
|
});
|
|
@@ -11113,8 +11120,9 @@ const defaultStyleCss$O = () => `@charset "UTF-8"; @layer kol-a11y, kol-global,
|
|
|
11113
11120
|
|
|
11114
11121
|
class KolAbbr extends BaseWebComponent {
|
|
11115
11122
|
constructor(hostRef) {
|
|
11116
|
-
super();
|
|
11117
|
-
|
|
11123
|
+
super(...arguments);
|
|
11124
|
+
if (new.target === KolAbbr)
|
|
11125
|
+
registerInstance(this, hostRef);
|
|
11118
11126
|
this.propsConfig = abbrPropsConfig;
|
|
11119
11127
|
this._label = undefined;
|
|
11120
11128
|
}
|
|
@@ -11125,7 +11133,7 @@ class KolAbbr extends BaseWebComponent {
|
|
|
11125
11133
|
this.watchLabel(this._label);
|
|
11126
11134
|
}
|
|
11127
11135
|
render() {
|
|
11128
|
-
return (hAsync(Host, { key: '
|
|
11136
|
+
return (hAsync(Host, { key: '2ee63ca84e842ca638b9e40340aac3a13f1e1fd2' }, hAsync(AbbrFC, { key: '15e6509c32336b2f3b6215e6f4524cea65ee26c4', label: this.getRenderProp('label') })));
|
|
11129
11137
|
}
|
|
11130
11138
|
static get watchers() { return {
|
|
11131
11139
|
"_label": [{
|
|
@@ -20846,12 +20854,13 @@ const createRelatedUniqueId = (baseId, suffix) => {
|
|
|
20846
20854
|
return isNonce ? `${baseId.slice(0, separatorIndex)}-${suffix}-${lastSegment}` : `${baseId}-${suffix}`;
|
|
20847
20855
|
};
|
|
20848
20856
|
|
|
20849
|
-
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; } }`;
|
|
20850
20858
|
|
|
20851
20859
|
class KolAccordion extends BaseWebComponent {
|
|
20852
20860
|
constructor(hostRef) {
|
|
20853
|
-
super();
|
|
20854
|
-
|
|
20861
|
+
super(...arguments);
|
|
20862
|
+
if (new.target === KolAccordion)
|
|
20863
|
+
registerInstance(this, hostRef);
|
|
20855
20864
|
this.accordionId = createUniqueId('accordion');
|
|
20856
20865
|
this.controlId = createRelatedUniqueId(this.accordionId, 'control');
|
|
20857
20866
|
this.detailsOpen = false;
|
|
@@ -20918,7 +20927,7 @@ class KolAccordion extends BaseWebComponent {
|
|
|
20918
20927
|
this.openAnimation.dispose();
|
|
20919
20928
|
}
|
|
20920
20929
|
render() {
|
|
20921
|
-
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' }))));
|
|
20922
20931
|
}
|
|
20923
20932
|
get host() { return getElement(this); }
|
|
20924
20933
|
static get watchers() { return {
|
|
@@ -21015,6 +21024,7 @@ var locale_de = {
|
|
|
21015
21024
|
pagination: 'Paginierung',
|
|
21016
21025
|
'pagination-position-bottom': 'unten',
|
|
21017
21026
|
'pagination-position-top': 'oben',
|
|
21027
|
+
progress: 'Fortschritt',
|
|
21018
21028
|
readonly: 'schreibgeschützt',
|
|
21019
21029
|
'show-password': 'Passwort einblenden',
|
|
21020
21030
|
'show-suggestions': 'Vorschläge anzeigen',
|
|
@@ -21090,6 +21100,7 @@ var locale_en = {
|
|
|
21090
21100
|
pagination: 'Pagination',
|
|
21091
21101
|
'pagination-position-bottom': 'bottom',
|
|
21092
21102
|
'pagination-position-top': 'top',
|
|
21103
|
+
progress: 'Progress',
|
|
21093
21104
|
readonly: 'read-only',
|
|
21094
21105
|
'show-password': 'Show password',
|
|
21095
21106
|
'show-suggestions': 'Show suggestions',
|
|
@@ -23199,12 +23210,13 @@ class TooltipBehavior extends BaseBehavior {
|
|
|
23199
23210
|
}
|
|
23200
23211
|
}
|
|
23201
23212
|
|
|
23202
|
-
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; } }`;
|
|
23203
23214
|
|
|
23204
23215
|
class KolAlert extends BaseWebComponent {
|
|
23205
23216
|
constructor(hostRef) {
|
|
23206
|
-
super();
|
|
23207
|
-
|
|
23217
|
+
super(...arguments);
|
|
23218
|
+
if (new.target === KolAlert)
|
|
23219
|
+
registerInstance(this, hostRef);
|
|
23208
23220
|
this.headingId = createUniqueId('alert-heading');
|
|
23209
23221
|
this.closerAriaDescriptionId = nonce();
|
|
23210
23222
|
this.translateCloseAlert = translate('kol-close-alert');
|
|
@@ -23293,7 +23305,7 @@ class KolAlert extends BaseWebComponent {
|
|
|
23293
23305
|
this.alertTimeout = setTimeout(() => this.handleAlertTimeout(), 10000);
|
|
23294
23306
|
}
|
|
23295
23307
|
render() {
|
|
23296
|
-
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' }))));
|
|
23297
23309
|
}
|
|
23298
23310
|
get host() { return getElement(this); }
|
|
23299
23311
|
static get watchers() { return {
|
|
@@ -23379,8 +23391,9 @@ const normalizeInitials = (value) => {
|
|
|
23379
23391
|
};
|
|
23380
23392
|
class KolAvatar extends BaseWebComponent {
|
|
23381
23393
|
constructor(hostRef) {
|
|
23382
|
-
super();
|
|
23383
|
-
|
|
23394
|
+
super(...arguments);
|
|
23395
|
+
if (new.target === KolAvatar)
|
|
23396
|
+
registerInstance(this, hostRef);
|
|
23384
23397
|
this.initials = '';
|
|
23385
23398
|
this.propsConfig = avatarPropsConfig;
|
|
23386
23399
|
this._color = undefined;
|
|
@@ -23407,7 +23420,7 @@ class KolAvatar extends BaseWebComponent {
|
|
|
23407
23420
|
srcProp.apply(this._src, (v) => this.setRenderProp('src', v));
|
|
23408
23421
|
}
|
|
23409
23422
|
render() {
|
|
23410
|
-
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 })));
|
|
23411
23424
|
}
|
|
23412
23425
|
static get watchers() { return {
|
|
23413
23426
|
"_color": [{
|
|
@@ -23496,13 +23509,14 @@ function resolveButtonProps(props, host) {
|
|
|
23496
23509
|
return resolved;
|
|
23497
23510
|
}
|
|
23498
23511
|
|
|
23499
|
-
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; } }`;
|
|
23500
23513
|
|
|
23501
23514
|
featureHint(`[KolBadge] Optimierung des _color-Properties (rgba, rgb, hex usw.).`);
|
|
23502
23515
|
class KolBadge extends BaseWebComponent {
|
|
23503
23516
|
constructor(hostRef) {
|
|
23504
|
-
super();
|
|
23505
|
-
|
|
23517
|
+
super(...arguments);
|
|
23518
|
+
if (new.target === KolBadge)
|
|
23519
|
+
registerInstance(this, hostRef);
|
|
23506
23520
|
this.labelId = createUniqueId('badge-label');
|
|
23507
23521
|
this.ariaDescriptionId = nonce();
|
|
23508
23522
|
this.ctaRef = createCtaRef();
|
|
@@ -23595,7 +23609,7 @@ class KolBadge extends BaseWebComponent {
|
|
|
23595
23609
|
render() {
|
|
23596
23610
|
const smartButton = this.getRenderProp('smartButton');
|
|
23597
23611
|
const resolvedButton = this.smartButtonProps;
|
|
23598
|
-
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
|
|
23599
23613
|
? {
|
|
23600
23614
|
ariaDescriptionId: this.ariaDescriptionId,
|
|
23601
23615
|
handleBlur: this.handleBlur,
|
|
@@ -23703,7 +23717,7 @@ const LinkFC = (props, children) => {
|
|
|
23703
23717
|
'hide-label': hideLabel === true,
|
|
23704
23718
|
inline: inline === true,
|
|
23705
23719
|
standalone: inline === false,
|
|
23706
|
-
} }, 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 })));
|
|
23707
23721
|
};
|
|
23708
23722
|
|
|
23709
23723
|
const breadcrumbBem = bem.forBlock('kol-breadcrumb');
|
|
@@ -23834,12 +23848,13 @@ const onLocationChange = (callback, eager = true) => {
|
|
|
23834
23848
|
};
|
|
23835
23849
|
};
|
|
23836
23850
|
|
|
23837
|
-
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); } }`;
|
|
23838
23852
|
|
|
23839
23853
|
class KolBreadcrumb extends BaseWebComponent {
|
|
23840
23854
|
constructor(hostRef) {
|
|
23841
|
-
super();
|
|
23842
|
-
|
|
23855
|
+
super(...arguments);
|
|
23856
|
+
if (new.target === KolBreadcrumb)
|
|
23857
|
+
registerInstance(this, hostRef);
|
|
23843
23858
|
this.linkItems = [];
|
|
23844
23859
|
this.showCurrentPage = true;
|
|
23845
23860
|
this.propsConfig = breadcrumbPropsConfig;
|
|
@@ -23883,7 +23898,7 @@ class KolBreadcrumb extends BaseWebComponent {
|
|
|
23883
23898
|
}
|
|
23884
23899
|
render() {
|
|
23885
23900
|
this.showCurrentPage = X('breadcrumbCurrentPage', this.host) !== 'hide';
|
|
23886
|
-
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 })));
|
|
23887
23902
|
}
|
|
23888
23903
|
get host() { return getElement(this); }
|
|
23889
23904
|
static get watchers() { return {
|
|
@@ -24426,12 +24441,13 @@ class BaseButtonWebComponent extends BaseWebComponent {
|
|
|
24426
24441
|
}
|
|
24427
24442
|
}
|
|
24428
24443
|
|
|
24429
|
-
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; } }`;
|
|
24430
24445
|
|
|
24431
24446
|
class KolButton extends BaseButtonWebComponent {
|
|
24432
24447
|
constructor(hostRef) {
|
|
24433
24448
|
super();
|
|
24434
|
-
|
|
24449
|
+
if (new.target === KolButton)
|
|
24450
|
+
registerInstance(this, hostRef);
|
|
24435
24451
|
this.ariaDescriptionId = nonce();
|
|
24436
24452
|
this._accessKey = undefined;
|
|
24437
24453
|
this._ariaControls = undefined;
|
|
@@ -24554,7 +24570,7 @@ class KolButton extends BaseButtonWebComponent {
|
|
|
24554
24570
|
this.destroyTooltipBehavior();
|
|
24555
24571
|
}
|
|
24556
24572
|
render() {
|
|
24557
|
-
return hAsync(Host, { key: '
|
|
24573
|
+
return hAsync(Host, { key: '9ed43938721a6b3e26e7024c1b0498f585f10158' }, this.renderButtonFC());
|
|
24558
24574
|
}
|
|
24559
24575
|
get host() { return getElement(this); }
|
|
24560
24576
|
static get watchers() { return {
|
|
@@ -24663,12 +24679,13 @@ __decorate([
|
|
|
24663
24679
|
delegateClick('ctaRef')
|
|
24664
24680
|
], KolButton.prototype, "click", null);
|
|
24665
24681
|
|
|
24666
|
-
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; } }`;
|
|
24667
24683
|
|
|
24668
24684
|
class KolButtonLink extends BaseButtonWebComponent {
|
|
24669
24685
|
constructor(hostRef) {
|
|
24670
24686
|
super();
|
|
24671
|
-
|
|
24687
|
+
if (new.target === KolButtonLink)
|
|
24688
|
+
registerInstance(this, hostRef);
|
|
24672
24689
|
this.ariaDescriptionId = nonce();
|
|
24673
24690
|
this._accessKey = undefined;
|
|
24674
24691
|
this._ariaControls = undefined;
|
|
@@ -24784,7 +24801,7 @@ class KolButtonLink extends BaseButtonWebComponent {
|
|
|
24784
24801
|
this.destroyTooltipBehavior();
|
|
24785
24802
|
}
|
|
24786
24803
|
render() {
|
|
24787
|
-
return hAsync(Host, { key: '
|
|
24804
|
+
return hAsync(Host, { key: '30df0e7cb4eaf8c950f1ea6cd87719b954e8a311' }, this.renderButtonFC());
|
|
24788
24805
|
}
|
|
24789
24806
|
get host() { return getElement(this); }
|
|
24790
24807
|
static get watchers() { return {
|
|
@@ -24983,12 +25000,13 @@ class BaseCardWebComponent extends BaseWebComponent {
|
|
|
24983
25000
|
}
|
|
24984
25001
|
}
|
|
24985
25002
|
|
|
24986
|
-
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; } }`;
|
|
24987
25004
|
|
|
24988
25005
|
class KolCard extends BaseCardWebComponent {
|
|
24989
25006
|
constructor(hostRef) {
|
|
24990
|
-
super();
|
|
24991
|
-
|
|
25007
|
+
super(...arguments);
|
|
25008
|
+
if (new.target === KolCard)
|
|
25009
|
+
registerInstance(this, hostRef);
|
|
24992
25010
|
this.ariaDescriptionId = nonce();
|
|
24993
25011
|
this.headingId = createUniqueId('card-heading');
|
|
24994
25012
|
this._hasCloser = false;
|
|
@@ -25040,7 +25058,7 @@ class KolCard extends BaseCardWebComponent {
|
|
|
25040
25058
|
return hAsync("slot", null);
|
|
25041
25059
|
}
|
|
25042
25060
|
render() {
|
|
25043
|
-
return hAsync(Host, { key: '
|
|
25061
|
+
return hAsync(Host, { key: '916261d714a813041360e0b82ffa1d3fc26d56e8' }, this.renderCardFC());
|
|
25044
25062
|
}
|
|
25045
25063
|
get host() { return getElement(this); }
|
|
25046
25064
|
static get watchers() { return {
|
|
@@ -25276,7 +25294,7 @@ const FormFieldFC = (props, children) => {
|
|
|
25276
25294
|
|
|
25277
25295
|
const optionsGroupBem = getBlockBem('kol-custom-suggestions-options-group');
|
|
25278
25296
|
const optionBem = getBlockBem('kol-custom-suggestions-option');
|
|
25279
|
-
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));
|
|
25280
25298
|
const highlightSearchTerm = (text, searchTerm) => {
|
|
25281
25299
|
if (!(searchTerm === null || searchTerm === void 0 ? void 0 : searchTerm.trim()))
|
|
25282
25300
|
return text;
|
|
@@ -25966,12 +25984,13 @@ const GROUP_CLASSES = {
|
|
|
25966
25984
|
};
|
|
25967
25985
|
const ListboxGroupFC = ({ block }, children) => hAsync("div", { class: GROUP_CLASSES[block] }, children);
|
|
25968
25986
|
|
|
25969
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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); } }`;
|
|
25970
25988
|
|
|
25971
25989
|
class KolCombobox extends BaseListboxWebComponent {
|
|
25972
25990
|
constructor(hostRef) {
|
|
25973
25991
|
super();
|
|
25974
|
-
|
|
25992
|
+
if (new.target === KolCombobox)
|
|
25993
|
+
registerInstance(this, hostRef);
|
|
25975
25994
|
this.id = createUniqueId('combobox');
|
|
25976
25995
|
this.infoPopoverOpen = false;
|
|
25977
25996
|
this.inputHasFocus = false;
|
|
@@ -26307,7 +26326,7 @@ class KolCombobox extends BaseListboxWebComponent {
|
|
|
26307
26326
|
return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ id,
|
|
26308
26327
|
hideLabel,
|
|
26309
26328
|
label,
|
|
26310
|
-
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 });
|
|
26311
26330
|
}
|
|
26312
26331
|
renderOptions() {
|
|
26313
26332
|
const value = this.getRenderProp('value');
|
|
@@ -26339,13 +26358,13 @@ class KolCombobox extends BaseListboxWebComponent {
|
|
|
26339
26358
|
render() {
|
|
26340
26359
|
const isDisabled = this.getRenderProp('disabled') === true;
|
|
26341
26360
|
const { startAdornment, endAdornment } = getInputAdornments({ icons: this.getRenderProp('icons') });
|
|
26342
|
-
return (hAsync(Host, { key: '
|
|
26361
|
+
return (hAsync(Host, { key: '0c05822b15984bdc3532b9a79fb5c059de9bff57' }, hAsync(FormFieldFC, Object.assign({ key: '145a6885cf2091df4928d7b814a7a323913ab8a2' }, this.getFormFieldProps({
|
|
26343
26362
|
class: clsx('kol-combobox', { 'has-value': this.hasValue, 'kol-combobox--open': this.isOpen }),
|
|
26344
26363
|
accessKey: this.getRenderProp('accessKey') || undefined,
|
|
26345
26364
|
shortKey: this.getRenderProp('shortKey') || undefined,
|
|
26346
26365
|
required: this.getRenderProp('required'),
|
|
26347
26366
|
variant: this.getRenderProp('variant'),
|
|
26348
|
-
})), 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({
|
|
26349
26368
|
_icons: 'kolicon-cross',
|
|
26350
26369
|
_label: this.translateDeleteSelection,
|
|
26351
26370
|
_hideLabel: true,
|
|
@@ -26361,7 +26380,7 @@ class KolCombobox extends BaseListboxWebComponent {
|
|
|
26361
26380
|
hidden: isDisabled,
|
|
26362
26381
|
onBlur: this.stopClearButtonFocusEvent,
|
|
26363
26382
|
onFocus: this.stopClearButtonFocusEvent,
|
|
26364
|
-
})))), 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())))));
|
|
26365
26384
|
}
|
|
26366
26385
|
get host() { return getElement(this); }
|
|
26367
26386
|
static get watchers() { return {
|
|
@@ -26483,12 +26502,13 @@ __decorate([
|
|
|
26483
26502
|
delegateClick('ctaRef')
|
|
26484
26503
|
], KolCombobox.prototype, "click", null);
|
|
26485
26504
|
|
|
26486
|
-
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); } }`;
|
|
26487
26506
|
|
|
26488
26507
|
class KolDetails extends BaseWebComponent {
|
|
26489
26508
|
constructor(hostRef) {
|
|
26490
|
-
super();
|
|
26491
|
-
|
|
26509
|
+
super(...arguments);
|
|
26510
|
+
if (new.target === KolDetails)
|
|
26511
|
+
registerInstance(this, hostRef);
|
|
26492
26512
|
this.detailsId = createUniqueId('details');
|
|
26493
26513
|
this.controlId = createRelatedUniqueId(this.detailsId, 'control');
|
|
26494
26514
|
this.detailsOpen = false;
|
|
@@ -26555,7 +26575,7 @@ class KolDetails extends BaseWebComponent {
|
|
|
26555
26575
|
this.openAnimation.dispose();
|
|
26556
26576
|
}
|
|
26557
26577
|
render() {
|
|
26558
|
-
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' }))));
|
|
26559
26579
|
}
|
|
26560
26580
|
get host() { return getElement(this); }
|
|
26561
26581
|
static get watchers() { return {
|
|
@@ -26786,12 +26806,13 @@ class BaseDialogWebComponent extends BaseWebComponent {
|
|
|
26786
26806
|
}
|
|
26787
26807
|
}
|
|
26788
26808
|
|
|
26789
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } }`;
|
|
26790
26810
|
|
|
26791
26811
|
class KolDialog extends BaseDialogWebComponent {
|
|
26792
26812
|
constructor(hostRef) {
|
|
26793
|
-
super();
|
|
26794
|
-
|
|
26813
|
+
super(...arguments);
|
|
26814
|
+
if (new.target === KolDialog)
|
|
26815
|
+
registerInstance(this, hostRef);
|
|
26795
26816
|
this.ariaDescriptionId = nonce();
|
|
26796
26817
|
this.headingId = createUniqueId('dialog-heading');
|
|
26797
26818
|
this.modal = true;
|
|
@@ -26851,7 +26872,7 @@ class KolDialog extends BaseDialogWebComponent {
|
|
|
26851
26872
|
return hAsync("slot", null);
|
|
26852
26873
|
}
|
|
26853
26874
|
render() {
|
|
26854
|
-
return hAsync(Host, { key: '
|
|
26875
|
+
return hAsync(Host, { key: '77a90db335d0d9d277fc8acd3fde91e3ac0a7309' }, this.renderDialogFC());
|
|
26855
26876
|
}
|
|
26856
26877
|
get host() { return getElement(this); }
|
|
26857
26878
|
static get watchers() { return {
|
|
@@ -26911,12 +26932,13 @@ const DrawerFC = (props, children) => {
|
|
|
26911
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))))));
|
|
26912
26933
|
};
|
|
26913
26934
|
|
|
26914
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } }`;
|
|
26915
26936
|
|
|
26916
26937
|
class KolDrawer extends BaseWebComponent {
|
|
26917
26938
|
constructor(hostRef) {
|
|
26918
|
-
super();
|
|
26919
|
-
|
|
26939
|
+
super(...arguments);
|
|
26940
|
+
if (new.target === KolDrawer)
|
|
26941
|
+
registerInstance(this, hostRef);
|
|
26920
26942
|
this.ariaDescriptionId = nonce();
|
|
26921
26943
|
this.expanded = false;
|
|
26922
26944
|
this.headingId = createUniqueId('drawer-heading');
|
|
@@ -27086,7 +27108,7 @@ class KolDrawer extends BaseWebComponent {
|
|
|
27086
27108
|
};
|
|
27087
27109
|
}
|
|
27088
27110
|
render() {
|
|
27089
|
-
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' }))));
|
|
27090
27112
|
}
|
|
27091
27113
|
get host() { return getElement(this); }
|
|
27092
27114
|
static get watchers() { return {
|
|
@@ -27184,7 +27206,7 @@ const createFormErrorLinkItem = (error, handleSelector) => {
|
|
|
27184
27206
|
};
|
|
27185
27207
|
};
|
|
27186
27208
|
|
|
27187
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } }`;
|
|
27188
27210
|
|
|
27189
27211
|
const SCROLL_OPTIONS_FALLBACK = {
|
|
27190
27212
|
behavior: 'smooth',
|
|
@@ -27193,8 +27215,9 @@ const SCROLL_OPTIONS_FALLBACK = {
|
|
|
27193
27215
|
const FOCUS_ERROR_LIST_DELAY = 250;
|
|
27194
27216
|
class KolForm extends BaseWebComponent {
|
|
27195
27217
|
constructor(hostRef) {
|
|
27196
|
-
super();
|
|
27197
|
-
|
|
27218
|
+
super(...arguments);
|
|
27219
|
+
if (new.target === KolForm)
|
|
27220
|
+
registerInstance(this, hostRef);
|
|
27198
27221
|
this.errorLinkItems = [];
|
|
27199
27222
|
this.alertHeadingId = createUniqueId('alert-heading');
|
|
27200
27223
|
this.closerAriaDescriptionId = nonce();
|
|
@@ -27254,7 +27277,7 @@ class KolForm extends BaseWebComponent {
|
|
|
27254
27277
|
this.watchRequiredText(this._requiredText);
|
|
27255
27278
|
}
|
|
27256
27279
|
render() {
|
|
27257
|
-
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') })));
|
|
27258
27281
|
}
|
|
27259
27282
|
get host() { return getElement(this); }
|
|
27260
27283
|
static get watchers() { return {
|
|
@@ -27310,8 +27333,9 @@ const defaultStyleCss$A = () => `@charset "UTF-8"; @layer kol-a11y, kol-global,
|
|
|
27310
27333
|
|
|
27311
27334
|
class KolHeading extends BaseWebComponent {
|
|
27312
27335
|
constructor(hostRef) {
|
|
27313
|
-
super();
|
|
27314
|
-
|
|
27336
|
+
super(...arguments);
|
|
27337
|
+
if (new.target === KolHeading)
|
|
27338
|
+
registerInstance(this, hostRef);
|
|
27315
27339
|
this.propsConfig = headingPropsConfig;
|
|
27316
27340
|
this._level = 0;
|
|
27317
27341
|
this._secondaryHeadline = undefined;
|
|
@@ -27331,7 +27355,7 @@ class KolHeading extends BaseWebComponent {
|
|
|
27331
27355
|
secondaryHeadlineProp.apply(this._secondaryHeadline, (v) => this.setRenderProp('secondaryHeadline', v));
|
|
27332
27356
|
}
|
|
27333
27357
|
render() {
|
|
27334
|
-
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') })));
|
|
27335
27359
|
}
|
|
27336
27360
|
static get watchers() { return {
|
|
27337
27361
|
"_label": [{
|
|
@@ -27362,29 +27386,30 @@ class KolHeading extends BaseWebComponent {
|
|
|
27362
27386
|
}
|
|
27363
27387
|
|
|
27364
27388
|
const iconPropsConfig = {
|
|
27365
|
-
required: [iconsProp,
|
|
27389
|
+
required: [iconsProp, labelDecorativeProp],
|
|
27366
27390
|
};
|
|
27367
27391
|
|
|
27368
|
-
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}}`;
|
|
27369
27393
|
|
|
27370
27394
|
class KolIcon extends BaseWebComponent {
|
|
27371
27395
|
constructor(hostRef) {
|
|
27372
|
-
super();
|
|
27373
|
-
|
|
27396
|
+
super(...arguments);
|
|
27397
|
+
if (new.target === KolIcon)
|
|
27398
|
+
registerInstance(this, hostRef);
|
|
27374
27399
|
this.propsConfig = iconPropsConfig;
|
|
27375
27400
|
}
|
|
27376
27401
|
watchIcons(value) {
|
|
27377
27402
|
iconsProp.apply(value, (v) => this.setRenderProp('icons', v));
|
|
27378
27403
|
}
|
|
27379
27404
|
watchLabel(value) {
|
|
27380
|
-
|
|
27405
|
+
labelDecorativeProp.apply(value, (v) => this.setRenderProp('label', v), this.isRequired('label'));
|
|
27381
27406
|
}
|
|
27382
27407
|
componentWillLoad() {
|
|
27383
27408
|
iconsProp.apply(this._icons, (v) => this.setRenderProp('icons', v));
|
|
27384
|
-
|
|
27409
|
+
labelDecorativeProp.apply(this._label, (v) => this.setRenderProp('label', v), this.isRequired('label'));
|
|
27385
27410
|
}
|
|
27386
27411
|
render() {
|
|
27387
|
-
return (hAsync(Host, { key: '
|
|
27412
|
+
return (hAsync(Host, { key: 'a53255b542b20f7d10c3fc81c430f8e49885991b' }, hAsync(IconFC, { key: 'c5863392f1de5f8c37f8a90458e641141a525528', icons: this.getRenderProp('icons'), label: this.getRenderProp('label') })));
|
|
27388
27413
|
}
|
|
27389
27414
|
static get watchers() { return {
|
|
27390
27415
|
"_icons": [{
|
|
@@ -27426,8 +27451,9 @@ const defaultStyleCss$y = () => `@charset "UTF-8"; @layer kol-a11y, kol-global,
|
|
|
27426
27451
|
|
|
27427
27452
|
class KolImage extends BaseWebComponent {
|
|
27428
27453
|
constructor(hostRef) {
|
|
27429
|
-
super();
|
|
27430
|
-
|
|
27454
|
+
super(...arguments);
|
|
27455
|
+
if (new.target === KolImage)
|
|
27456
|
+
registerInstance(this, hostRef);
|
|
27431
27457
|
this.propsConfig = imagePropsConfig;
|
|
27432
27458
|
this._loading = undefined;
|
|
27433
27459
|
this._sizes = undefined;
|
|
@@ -27475,7 +27501,7 @@ class KolImage extends BaseWebComponent {
|
|
|
27475
27501
|
srcsetProp.apply(this._srcset, (v) => this.setRenderProp('srcset', v));
|
|
27476
27502
|
}
|
|
27477
27503
|
render() {
|
|
27478
|
-
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 })));
|
|
27479
27505
|
}
|
|
27480
27506
|
get host() { return getElement(this); }
|
|
27481
27507
|
static get watchers() { return {
|
|
@@ -27555,12 +27581,13 @@ const inputCheckboxPropsConfig = {
|
|
|
27555
27581
|
],
|
|
27556
27582
|
};
|
|
27557
27583
|
|
|
27558
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } }`;
|
|
27559
27585
|
|
|
27560
27586
|
class KolInputCheckbox extends BaseFormFieldWebComponent {
|
|
27561
27587
|
constructor(hostRef) {
|
|
27562
27588
|
super();
|
|
27563
|
-
|
|
27589
|
+
if (new.target === KolInputCheckbox)
|
|
27590
|
+
registerInstance(this, hostRef);
|
|
27564
27591
|
this.id = createUniqueId('input-checkbox');
|
|
27565
27592
|
this.infoPopoverOpen = false;
|
|
27566
27593
|
this.inputHasFocus = false;
|
|
@@ -27760,7 +27787,7 @@ class KolInputCheckbox extends BaseFormFieldWebComponent {
|
|
|
27760
27787
|
const accessKey = this.getRenderProp('accessKey') || undefined;
|
|
27761
27788
|
const shortKey = this.getRenderProp('shortKey') || undefined;
|
|
27762
27789
|
const required = this.getRenderProp('required');
|
|
27763
|
-
return (hAsync(Host, { key: '
|
|
27790
|
+
return (hAsync(Host, { key: 'bafeed8887803973d2cc2db16f49ab91051068d3' }, hAsync(FormFieldFC, Object.assign({ key: 'd0aefcc8b5397cfad069f8949623f0784e0e375c' }, this.getFormFieldProps({
|
|
27764
27791
|
class: clsx('kol-input-checkbox', {
|
|
27765
27792
|
'kol-input-checkbox--checked': checked,
|
|
27766
27793
|
'kol-input-checkbox--indeterminate': indeterminate,
|
|
@@ -27772,11 +27799,11 @@ class KolInputCheckbox extends BaseFormFieldWebComponent {
|
|
|
27772
27799
|
required,
|
|
27773
27800
|
renderNoLabel: true,
|
|
27774
27801
|
renderNoTooltip: true,
|
|
27775
|
-
})), hAsync(FieldControlFC, Object.assign({ key: '
|
|
27802
|
+
})), hAsync(FieldControlFC, Object.assign({ key: 'c6c073fd12fa8993d637c6841a11a0be38bb78f1', class: clsx('kol-input-checkbox__field-control', {
|
|
27776
27803
|
'kol-input-checkbox__field-control--checked': checked,
|
|
27777
27804
|
'kol-input-checkbox__field-control--indeterminate': indeterminate,
|
|
27778
27805
|
[`kol-input-checkbox__field-control--variant-${variant}`]: true,
|
|
27779
|
-
}), 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() })))));
|
|
27780
27807
|
}
|
|
27781
27808
|
get host() { return getElement(this); }
|
|
27782
27809
|
static get watchers() { return {
|
|
@@ -27918,12 +27945,13 @@ const inputColorPropsConfig = {
|
|
|
27918
27945
|
],
|
|
27919
27946
|
};
|
|
27920
27947
|
|
|
27921
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } }`;
|
|
27922
27949
|
|
|
27923
27950
|
class KolInputColor extends BaseFormFieldWebComponent {
|
|
27924
27951
|
constructor(hostRef) {
|
|
27925
27952
|
super();
|
|
27926
|
-
|
|
27953
|
+
if (new.target === KolInputColor)
|
|
27954
|
+
registerInstance(this, hostRef);
|
|
27927
27955
|
this.id = createUniqueId('input-color');
|
|
27928
27956
|
this.infoPopoverOpen = false;
|
|
27929
27957
|
this.inputHasFocus = false;
|
|
@@ -28086,12 +28114,12 @@ class KolInputColor extends BaseFormFieldWebComponent {
|
|
|
28086
28114
|
icons: this.getRenderProp('icons'),
|
|
28087
28115
|
smartButton: this.getSmartButtonFcProps(this.getRenderProp('smartButton'), disabled),
|
|
28088
28116
|
});
|
|
28089
|
-
return (hAsync(Host, { key: '
|
|
28117
|
+
return (hAsync(Host, { key: '28705e83028430f22d59e707a250016a7a8a63e3' }, hAsync(FormFieldFC, Object.assign({ key: '12baf7a8e1544bc7105fa36c20aead6ed11ce4b3' }, this.getFormFieldProps({
|
|
28090
28118
|
class: 'kol-input-color',
|
|
28091
28119
|
accessKey: this.getRenderProp('accessKey') || undefined,
|
|
28092
28120
|
shortKey: this.getRenderProp('shortKey') || undefined,
|
|
28093
28121
|
variant: this.getRenderProp('variant'),
|
|
28094
|
-
})), 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()))))));
|
|
28095
28123
|
}
|
|
28096
28124
|
get host() { return getElement(this); }
|
|
28097
28125
|
static get watchers() { return {
|
|
@@ -28254,12 +28282,13 @@ const inputDatePropsConfig = {
|
|
|
28254
28282
|
],
|
|
28255
28283
|
};
|
|
28256
28284
|
|
|
28257
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } }`;
|
|
28258
28286
|
|
|
28259
28287
|
class KolInputDate extends BaseFormFieldWebComponent {
|
|
28260
28288
|
constructor(hostRef) {
|
|
28261
28289
|
super();
|
|
28262
|
-
|
|
28290
|
+
if (new.target === KolInputDate)
|
|
28291
|
+
registerInstance(this, hostRef);
|
|
28263
28292
|
this.id = createUniqueId('input-date');
|
|
28264
28293
|
this.infoPopoverOpen = false;
|
|
28265
28294
|
this.inputHasFocus = false;
|
|
@@ -28495,7 +28524,7 @@ class KolInputDate extends BaseFormFieldWebComponent {
|
|
|
28495
28524
|
icons: this.getRenderProp('icons'),
|
|
28496
28525
|
smartButton: this.getSmartButtonFcProps(this.getRenderProp('smartButton'), disabled),
|
|
28497
28526
|
});
|
|
28498
|
-
return (hAsync(Host, { key: '
|
|
28527
|
+
return (hAsync(Host, { key: '205a63142271ddb4cab5d2374f238e77104f5a7c' }, hAsync(FormFieldFC, Object.assign({ key: '887189f5d662ee48def8d2343ce114bef9e0d0d7' }, this.getFormFieldProps({
|
|
28499
28528
|
class: clsx('kol-input-date', this.getRenderProp('type'), {
|
|
28500
28529
|
'has-value': this.hasValue,
|
|
28501
28530
|
}),
|
|
@@ -28504,7 +28533,7 @@ class KolInputDate extends BaseFormFieldWebComponent {
|
|
|
28504
28533
|
variant: this.getRenderProp('variant'),
|
|
28505
28534
|
required: this.getRenderProp('required'),
|
|
28506
28535
|
readOnly: this.getRenderProp('readOnly'),
|
|
28507
|
-
})), 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()))))));
|
|
28508
28537
|
}
|
|
28509
28538
|
get host() { return getElement(this); }
|
|
28510
28539
|
static get watchers() { return {
|
|
@@ -28958,12 +28987,13 @@ class BaseTextInputWebComponent extends BaseFormFieldWebComponent {
|
|
|
28958
28987
|
}
|
|
28959
28988
|
}
|
|
28960
28989
|
|
|
28961
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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); } }`;
|
|
28962
28991
|
|
|
28963
28992
|
class KolInputEmail extends BaseTextInputWebComponent {
|
|
28964
28993
|
constructor(hostRef) {
|
|
28965
28994
|
super();
|
|
28966
|
-
|
|
28995
|
+
if (new.target === KolInputEmail)
|
|
28996
|
+
registerInstance(this, hostRef);
|
|
28967
28997
|
this.id = createUniqueId('input-email');
|
|
28968
28998
|
this.infoPopoverOpen = false;
|
|
28969
28999
|
this.inputHasFocus = false;
|
|
@@ -29143,7 +29173,7 @@ class KolInputEmail extends BaseTextInputWebComponent {
|
|
|
29143
29173
|
}
|
|
29144
29174
|
render() {
|
|
29145
29175
|
const { startAdornment, endAdornment } = this.getTextInputAdornments();
|
|
29146
|
-
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' })))))));
|
|
29147
29177
|
}
|
|
29148
29178
|
get host() { return getElement(this); }
|
|
29149
29179
|
static get watchers() { return {
|
|
@@ -29318,12 +29348,13 @@ const inputContainerBem = bem.forBlock('kol-input-container');
|
|
|
29318
29348
|
const BEM_CLASS_INPUT_CONTAINER__BUTTON = inputContainerBem('button');
|
|
29319
29349
|
const InputFileNameFC = ({ filename, hasFile }) => (hAsync("span", { class: inputContainerBem('filename', { 'has-file': hasFile }) }, filename));
|
|
29320
29350
|
|
|
29321
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } }`;
|
|
29322
29352
|
|
|
29323
29353
|
class KolInputFile extends BaseFormFieldWebComponent {
|
|
29324
29354
|
constructor(hostRef) {
|
|
29325
29355
|
super();
|
|
29326
|
-
|
|
29356
|
+
if (new.target === KolInputFile)
|
|
29357
|
+
registerInstance(this, hostRef);
|
|
29327
29358
|
this.id = createUniqueId('input-file');
|
|
29328
29359
|
this.infoPopoverOpen = false;
|
|
29329
29360
|
this.inputHasFocus = false;
|
|
@@ -29536,13 +29567,13 @@ class KolInputFile extends BaseFormFieldWebComponent {
|
|
|
29536
29567
|
icons: this.getRenderProp('icons'),
|
|
29537
29568
|
smartButton: this.getSmartButtonFcProps(this.getRenderProp('smartButton'), disabled),
|
|
29538
29569
|
});
|
|
29539
|
-
return (hAsync(Host, { key: '
|
|
29570
|
+
return (hAsync(Host, { key: '25a212036a6a5c270c5546b3c9b8d18f3760ba02' }, hAsync(FormFieldFC, Object.assign({ key: 'c1f046691cb2b689c1e18ff9067519b55e4d86c0' }, this.getFormFieldProps({
|
|
29540
29571
|
class: 'kol-input-file file',
|
|
29541
29572
|
accessKey: this.getRenderProp('accessKey') || undefined,
|
|
29542
29573
|
shortKey: this.getRenderProp('shortKey') || undefined,
|
|
29543
29574
|
variant: this.getRenderProp('variant'),
|
|
29544
29575
|
required: this.getRenderProp('required'),
|
|
29545
|
-
})), 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 })))))));
|
|
29546
29577
|
}
|
|
29547
29578
|
get host() { return getElement(this); }
|
|
29548
29579
|
static get watchers() { return {
|
|
@@ -29714,14 +29745,15 @@ const inputNumberPropsConfig = {
|
|
|
29714
29745
|
],
|
|
29715
29746
|
};
|
|
29716
29747
|
|
|
29717
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } }`;
|
|
29718
29749
|
|
|
29719
29750
|
const STEP_BUTTON_CLASS = 'kol-input-number__step-button';
|
|
29720
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; };
|
|
29721
29752
|
class KolInputNumber extends BaseFormFieldWebComponent {
|
|
29722
29753
|
constructor(hostRef) {
|
|
29723
29754
|
super();
|
|
29724
|
-
|
|
29755
|
+
if (new.target === KolInputNumber)
|
|
29756
|
+
registerInstance(this, hostRef);
|
|
29725
29757
|
this.id = createUniqueId('input-number');
|
|
29726
29758
|
this.infoPopoverOpen = false;
|
|
29727
29759
|
this.inputHasFocus = false;
|
|
@@ -29971,7 +30003,7 @@ class KolInputNumber extends BaseFormFieldWebComponent {
|
|
|
29971
30003
|
startAdornment: this.renderStepButton('down'),
|
|
29972
30004
|
endAdornment: this.renderStepButton('up'),
|
|
29973
30005
|
});
|
|
29974
|
-
return (hAsync(Host, { key: '
|
|
30006
|
+
return (hAsync(Host, { key: '72ac3294746fee359a1bc104ff67d98b12863910' }, hAsync(FormFieldFC, Object.assign({ key: '56e069564f2166347361d4d5519bfd768201ea5d' }, this.getFormFieldProps({
|
|
29975
30007
|
class: clsx('kol-input-number', 'number', {
|
|
29976
30008
|
'has-value': this.hasValue,
|
|
29977
30009
|
}),
|
|
@@ -29980,7 +30012,7 @@ class KolInputNumber extends BaseFormFieldWebComponent {
|
|
|
29980
30012
|
variant: this.getRenderProp('variant'),
|
|
29981
30013
|
required: this.getRenderProp('required'),
|
|
29982
30014
|
readOnly: this.getRenderProp('readOnly'),
|
|
29983
|
-
})), 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()))))));
|
|
29984
30016
|
}
|
|
29985
30017
|
get host() { return getElement(this); }
|
|
29986
30018
|
static get watchers() { return {
|
|
@@ -30124,12 +30156,13 @@ const inputPasswordPropsConfig = {
|
|
|
30124
30156
|
optional: [...textInputBasePropsConfig.optional, visibilityToggleProp],
|
|
30125
30157
|
};
|
|
30126
30158
|
|
|
30127
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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)); } }`;
|
|
30128
30160
|
|
|
30129
30161
|
class KolInputPassword extends BaseTextInputWebComponent {
|
|
30130
30162
|
constructor(hostRef) {
|
|
30131
30163
|
super();
|
|
30132
|
-
|
|
30164
|
+
if (new.target === KolInputPassword)
|
|
30165
|
+
registerInstance(this, hostRef);
|
|
30133
30166
|
this.id = createUniqueId('input-password');
|
|
30134
30167
|
this.infoPopoverOpen = false;
|
|
30135
30168
|
this.inputHasFocus = false;
|
|
@@ -30336,7 +30369,7 @@ class KolInputPassword extends BaseTextInputWebComponent {
|
|
|
30336
30369
|
}
|
|
30337
30370
|
render() {
|
|
30338
30371
|
const { startAdornment, endAdornment } = this.getTextInputAdornments(this.getVisibilityToggle());
|
|
30339
|
-
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' })))))));
|
|
30340
30373
|
}
|
|
30341
30374
|
get host() { return getElement(this); }
|
|
30342
30375
|
static get watchers() { return {
|
|
@@ -30513,12 +30546,13 @@ const inputRadioPropsConfig = {
|
|
|
30513
30546
|
optional: [...formFieldBasePropsConfig.optional, radioOptionsProp, radioOrientationProp, radioValueProp, requiredProp, variantProp],
|
|
30514
30547
|
};
|
|
30515
30548
|
|
|
30516
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } }`;
|
|
30517
30550
|
|
|
30518
30551
|
class KolInputRadio extends BaseFormFieldWebComponent {
|
|
30519
30552
|
constructor(hostRef) {
|
|
30520
30553
|
super();
|
|
30521
|
-
|
|
30554
|
+
if (new.target === KolInputRadio)
|
|
30555
|
+
registerInstance(this, hostRef);
|
|
30522
30556
|
this.id = createUniqueId('input-radio');
|
|
30523
30557
|
this.infoPopoverOpen = false;
|
|
30524
30558
|
this.inputHasFocus = false;
|
|
@@ -30773,7 +30807,7 @@ class KolInputRadio extends BaseFormFieldWebComponent {
|
|
|
30773
30807
|
}
|
|
30774
30808
|
render() {
|
|
30775
30809
|
const { ariaDescribedBy } = this.getAria();
|
|
30776
|
-
return (hAsync(Host, { key: '
|
|
30810
|
+
return (hAsync(Host, { key: 'e42fbdf89edfc2f6a343096f5725dec6980d5b9f' }, hAsync(FormFieldFC, Object.assign({ key: '22f7a6684edce31a1d8d2a28f1909ad111ea177d' }, this.getFormFieldProps({
|
|
30777
30811
|
class: 'kol-form-field--radio',
|
|
30778
30812
|
required: this.getRenderProp('required'),
|
|
30779
30813
|
variant: this.getRenderProp('variant'),
|
|
@@ -30898,12 +30932,13 @@ const BEM_CLASS_INPUT_RANGE__INPUT_RANGE = inputRangeBem('input', { range: true
|
|
|
30898
30932
|
const BEM_CLASS_INPUT_RANGE__INPUTS_WRAPPER = inputRangeBem('inputs-wrapper');
|
|
30899
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));
|
|
30900
30934
|
|
|
30901
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } }`;
|
|
30902
30936
|
|
|
30903
30937
|
class KolInputRange extends BaseFormFieldWebComponent {
|
|
30904
30938
|
constructor(hostRef) {
|
|
30905
30939
|
super();
|
|
30906
|
-
|
|
30940
|
+
if (new.target === KolInputRange)
|
|
30941
|
+
registerInstance(this, hostRef);
|
|
30907
30942
|
this.id = createUniqueId('input-range');
|
|
30908
30943
|
this.infoPopoverOpen = false;
|
|
30909
30944
|
this.inputHasFocus = false;
|
|
@@ -31110,12 +31145,12 @@ class KolInputRange extends BaseFormFieldWebComponent {
|
|
|
31110
31145
|
const { ariaDescribedBy, hasError } = this.getAria();
|
|
31111
31146
|
const ariaInvalid = hasError ? 'true' : undefined;
|
|
31112
31147
|
const { startAdornment, endAdornment } = getInputAdornments({ icons: this.getRenderProp('icons') });
|
|
31113
|
-
return (hAsync(Host, { key: '
|
|
31148
|
+
return (hAsync(Host, { key: '33ca7883c15dd0f3f586e86ffd7dc37a935a5f55' }, hAsync(FormFieldFC, Object.assign({ key: '54f2bf977693fcab734c72869173cae429634352' }, this.getFormFieldProps({
|
|
31114
31149
|
class: 'kol-input-range range',
|
|
31115
31150
|
accessKey: this.getRenderProp('accessKey') || undefined,
|
|
31116
31151
|
shortKey: this.getRenderProp('shortKey') || undefined,
|
|
31117
31152
|
variant: this.getRenderProp('variant'),
|
|
31118
|
-
})), 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 })))));
|
|
31119
31154
|
}
|
|
31120
31155
|
get host() { return getElement(this); }
|
|
31121
31156
|
static get watchers() { return {
|
|
@@ -31243,12 +31278,13 @@ const inputTextPropsConfig = {
|
|
|
31243
31278
|
optional: [...textInputBasePropsConfig.optional, inputTextTypeProp, spellCheckProp, suggestionsProp],
|
|
31244
31279
|
};
|
|
31245
31280
|
|
|
31246
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } }`;
|
|
31247
31282
|
|
|
31248
31283
|
class KolInputText extends BaseTextInputWebComponent {
|
|
31249
31284
|
constructor(hostRef) {
|
|
31250
31285
|
super();
|
|
31251
|
-
|
|
31286
|
+
if (new.target === KolInputText)
|
|
31287
|
+
registerInstance(this, hostRef);
|
|
31252
31288
|
this.id = createUniqueId('input-text');
|
|
31253
31289
|
this.infoPopoverOpen = false;
|
|
31254
31290
|
this.inputHasFocus = false;
|
|
@@ -31502,7 +31538,7 @@ class KolInputText extends BaseTextInputWebComponent {
|
|
|
31502
31538
|
render() {
|
|
31503
31539
|
const type = this.getRenderProp('type');
|
|
31504
31540
|
const { startAdornment, endAdornment } = this.getTextInputAdornments(this.getClearButton());
|
|
31505
|
-
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') })))))));
|
|
31506
31542
|
}
|
|
31507
31543
|
get host() { return getElement(this); }
|
|
31508
31544
|
static get watchers() { return {
|
|
@@ -31673,8 +31709,9 @@ const defaultStyleCss$n = () => `@charset "UTF-8"; @layer kol-a11y, kol-glob
|
|
|
31673
31709
|
|
|
31674
31710
|
class KolKolibri extends BaseWebComponent {
|
|
31675
31711
|
constructor(hostRef) {
|
|
31676
|
-
super();
|
|
31677
|
-
|
|
31712
|
+
super(...arguments);
|
|
31713
|
+
if (new.target === KolKolibri)
|
|
31714
|
+
registerInstance(this, hostRef);
|
|
31678
31715
|
this.translateKolibriLogo = translate('kol-kolibri-logo');
|
|
31679
31716
|
this.propsConfig = kolibriPropsConfig;
|
|
31680
31717
|
this._color = '#003c78';
|
|
@@ -31691,7 +31728,7 @@ class KolKolibri extends BaseWebComponent {
|
|
|
31691
31728
|
this.watchLabeled(this._labeled);
|
|
31692
31729
|
}
|
|
31693
31730
|
render() {
|
|
31694
|
-
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') })));
|
|
31695
31732
|
}
|
|
31696
31733
|
static get watchers() { return {
|
|
31697
31734
|
"_color": [{
|
|
@@ -31854,12 +31891,13 @@ class BaseLinkWebComponent extends BaseWebComponent {
|
|
|
31854
31891
|
}
|
|
31855
31892
|
}
|
|
31856
31893
|
|
|
31857
|
-
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; } }`;
|
|
31858
31895
|
|
|
31859
31896
|
class KolLink extends BaseLinkWebComponent {
|
|
31860
31897
|
constructor(hostRef) {
|
|
31861
|
-
super();
|
|
31862
|
-
|
|
31898
|
+
super(...arguments);
|
|
31899
|
+
if (new.target === KolLink)
|
|
31900
|
+
registerInstance(this, hostRef);
|
|
31863
31901
|
this.ariaCurrent = '';
|
|
31864
31902
|
this.ariaDescriptionId = nonce();
|
|
31865
31903
|
this.expertSlot = false;
|
|
@@ -31963,7 +32001,7 @@ class KolLink extends BaseLinkWebComponent {
|
|
|
31963
32001
|
this.destroyLinkBehaviors();
|
|
31964
32002
|
}
|
|
31965
32003
|
render() {
|
|
31966
|
-
return hAsync(Host, { key: '
|
|
32004
|
+
return hAsync(Host, { key: '91a1c3ee010fbdc62cb08be0d29e33734a8aa4ad' }, this.renderLinkFC());
|
|
31967
32005
|
}
|
|
31968
32006
|
get host() { return getElement(this); }
|
|
31969
32007
|
static get watchers() { return {
|
|
@@ -32057,12 +32095,13 @@ __decorate([
|
|
|
32057
32095
|
delegateFocus('ctaRef')
|
|
32058
32096
|
], KolLink.prototype, "focus", null);
|
|
32059
32097
|
|
|
32060
|
-
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; } }`;
|
|
32061
32099
|
|
|
32062
32100
|
class KolLinkButton extends BaseLinkWebComponent {
|
|
32063
32101
|
constructor(hostRef) {
|
|
32064
|
-
super();
|
|
32065
|
-
|
|
32102
|
+
super(...arguments);
|
|
32103
|
+
if (new.target === KolLinkButton)
|
|
32104
|
+
registerInstance(this, hostRef);
|
|
32066
32105
|
var _a;
|
|
32067
32106
|
this.ariaCurrent = '';
|
|
32068
32107
|
this.ariaDescriptionId = nonce();
|
|
@@ -32173,7 +32212,7 @@ class KolLinkButton extends BaseLinkWebComponent {
|
|
|
32173
32212
|
this.destroyLinkBehaviors();
|
|
32174
32213
|
}
|
|
32175
32214
|
render() {
|
|
32176
|
-
return hAsync(Host, { key: '
|
|
32215
|
+
return hAsync(Host, { key: 'c9c119dd63c2951e70f5fb7ee2670471f1ad5b10' }, this.renderLinkFC());
|
|
32177
32216
|
}
|
|
32178
32217
|
get host() { return getElement(this); }
|
|
32179
32218
|
static get watchers() { return {
|
|
@@ -32284,15 +32323,12 @@ const meterBem = bem.forBlock('kol-meter');
|
|
|
32284
32323
|
function getMeterState(value, min, max, low, high, optimum) {
|
|
32285
32324
|
const effectiveLow = low !== null && low !== void 0 ? low : min;
|
|
32286
32325
|
const effectiveHigh = high !== null && high !== void 0 ? high : max;
|
|
32287
|
-
|
|
32288
|
-
const inMidRegion = value >= effectiveLow && value <= effectiveHigh;
|
|
32289
|
-
return inMidRegion ? 'optimum' : 'suboptimal';
|
|
32290
|
-
}
|
|
32326
|
+
const effectiveOptimum = optimum !== null && optimum !== void 0 ? optimum : (min + max) / 2;
|
|
32291
32327
|
const inLowRegion = value < effectiveLow;
|
|
32292
32328
|
const inHighRegion = value > effectiveHigh;
|
|
32293
32329
|
const inMidRegion = !inLowRegion && !inHighRegion;
|
|
32294
|
-
const optimumInLow =
|
|
32295
|
-
const optimumInHigh =
|
|
32330
|
+
const optimumInLow = effectiveOptimum < effectiveLow;
|
|
32331
|
+
const optimumInHigh = effectiveOptimum > effectiveHigh;
|
|
32296
32332
|
if (optimumInLow) {
|
|
32297
32333
|
if (inLowRegion)
|
|
32298
32334
|
return 'optimum';
|
|
@@ -32347,8 +32383,9 @@ const defaultStyleCss$k = () => `@charset "UTF-8"; @layer kol-a11y, kol-glob
|
|
|
32347
32383
|
|
|
32348
32384
|
class KolMeter extends BaseWebComponent {
|
|
32349
32385
|
constructor(hostRef) {
|
|
32350
|
-
super();
|
|
32351
|
-
|
|
32386
|
+
super(...arguments);
|
|
32387
|
+
if (new.target === KolMeter)
|
|
32388
|
+
registerInstance(this, hostRef);
|
|
32352
32389
|
this.propsConfig = meterPropsConfig;
|
|
32353
32390
|
this._high = undefined;
|
|
32354
32391
|
this._low = undefined;
|
|
@@ -32427,7 +32464,7 @@ class KolMeter extends BaseWebComponent {
|
|
|
32427
32464
|
this.watchValue(this._value);
|
|
32428
32465
|
}
|
|
32429
32466
|
render() {
|
|
32430
|
-
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') })));
|
|
32431
32468
|
}
|
|
32432
32469
|
static get watchers() { return {
|
|
32433
32470
|
"_high": [{
|
|
@@ -32481,12 +32518,13 @@ class KolMeter extends BaseWebComponent {
|
|
|
32481
32518
|
}; }
|
|
32482
32519
|
}
|
|
32483
32520
|
|
|
32484
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } }`;
|
|
32485
32522
|
|
|
32486
32523
|
class KolModal extends BaseDialogWebComponent {
|
|
32487
32524
|
constructor(hostRef) {
|
|
32488
|
-
super();
|
|
32489
|
-
|
|
32525
|
+
super(...arguments);
|
|
32526
|
+
if (new.target === KolModal)
|
|
32527
|
+
registerInstance(this, hostRef);
|
|
32490
32528
|
this.ariaDescriptionId = nonce();
|
|
32491
32529
|
this.headingId = createUniqueId('dialog-heading');
|
|
32492
32530
|
this.modal = true;
|
|
@@ -32540,7 +32578,7 @@ class KolModal extends BaseDialogWebComponent {
|
|
|
32540
32578
|
return hAsync("slot", null);
|
|
32541
32579
|
}
|
|
32542
32580
|
render() {
|
|
32543
|
-
return hAsync(Host, { key: '
|
|
32581
|
+
return hAsync(Host, { key: '6d608d4ae09933551fc6641cfd419f39bc6e09ea' }, this.renderDialogFC());
|
|
32544
32582
|
}
|
|
32545
32583
|
get host() { return getElement(this); }
|
|
32546
32584
|
static get watchers() { return {
|
|
@@ -32833,12 +32871,13 @@ const NavFC = (props) => {
|
|
|
32833
32871
|
}))))))));
|
|
32834
32872
|
};
|
|
32835
32873
|
|
|
32836
|
-
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; } }`;
|
|
32837
32875
|
|
|
32838
32876
|
class KolNav extends BaseWebComponent {
|
|
32839
32877
|
constructor(hostRef) {
|
|
32840
|
-
super();
|
|
32841
|
-
|
|
32878
|
+
super(...arguments);
|
|
32879
|
+
if (new.target === KolNav)
|
|
32880
|
+
registerInstance(this, hostRef);
|
|
32842
32881
|
this.compact = false;
|
|
32843
32882
|
this.expandedChildren = [];
|
|
32844
32883
|
this.navId = createUniqueId('kol-nav');
|
|
@@ -32911,7 +32950,7 @@ class KolNav extends BaseWebComponent {
|
|
|
32911
32950
|
render() {
|
|
32912
32951
|
this.buttonItems.beginRender();
|
|
32913
32952
|
this.linkItems.beginRender();
|
|
32914
|
-
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 })));
|
|
32915
32954
|
}
|
|
32916
32955
|
get host() { return getElement(this); }
|
|
32917
32956
|
static get watchers() { return {
|
|
@@ -33036,7 +33075,7 @@ const PaginationContentFC = (props) => {
|
|
|
33036
33075
|
const pageButton = (item, selected) => {
|
|
33037
33076
|
const pageText = NUMBER_FORMATTER.format(item);
|
|
33038
33077
|
const ariaDescription = `${translate('kol-page')} ${pageText}`;
|
|
33039
|
-
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}`, {
|
|
33040
33079
|
_ariaDescription: ariaDescription,
|
|
33041
33080
|
_customClass: customClass,
|
|
33042
33081
|
_label: pageText,
|
|
@@ -33051,7 +33090,7 @@ const PaginationContentFC = (props) => {
|
|
|
33051
33090
|
total: NUMBER_FORMATTER.format(max),
|
|
33052
33091
|
},
|
|
33053
33092
|
})),
|
|
33054
|
-
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))),
|
|
33055
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 })))),
|
|
33056
33095
|
];
|
|
33057
33096
|
};
|
|
@@ -33387,6 +33426,7 @@ const createPaginationItem = (options) => {
|
|
|
33387
33426
|
const pageSizeSelects = createItemPool(() => new PageSizeSelect(options.getEventTarget, options.requestRender), (select) => select.sync(), (select) => select.destroy());
|
|
33388
33427
|
let pageSizeValue = 1;
|
|
33389
33428
|
let applied = {};
|
|
33429
|
+
let pendingFocusPage;
|
|
33390
33430
|
store.set('label', translatePagination);
|
|
33391
33431
|
const reportPageChange = (event, page) => {
|
|
33392
33432
|
setTimeout(() => {
|
|
@@ -33422,8 +33462,21 @@ const createPaginationItem = (options) => {
|
|
|
33422
33462
|
labelProp.apply(value, (v) => store.set('label', v !== null && v !== void 0 ? v : translatePagination), required);
|
|
33423
33463
|
addNavLabel(store.get('label'));
|
|
33424
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
|
+
};
|
|
33425
33477
|
const handlePageClick = (event, page) => {
|
|
33426
33478
|
var _a, _b;
|
|
33479
|
+
pendingFocusPage = page;
|
|
33427
33480
|
(_b = (_a = store.get('on')).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, event, page);
|
|
33428
33481
|
const target = options.getEventTarget();
|
|
33429
33482
|
if (target) {
|
|
@@ -33545,6 +33598,7 @@ const createPaginationItem = (options) => {
|
|
|
33545
33598
|
sync: () => {
|
|
33546
33599
|
buttons.endRender();
|
|
33547
33600
|
pageSizeSelects.endRender();
|
|
33601
|
+
restorePageFocus();
|
|
33548
33602
|
},
|
|
33549
33603
|
destroy: () => {
|
|
33550
33604
|
removeNavLabel(store.get('label'));
|
|
@@ -33568,12 +33622,13 @@ const createPaginationItem = (options) => {
|
|
|
33568
33622
|
return item;
|
|
33569
33623
|
};
|
|
33570
33624
|
|
|
33571
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } } }`;
|
|
33572
33626
|
|
|
33573
33627
|
class KolPagination extends BaseWebComponent {
|
|
33574
33628
|
constructor(hostRef) {
|
|
33575
|
-
super();
|
|
33576
|
-
|
|
33629
|
+
super(...arguments);
|
|
33630
|
+
if (new.target === KolPagination)
|
|
33631
|
+
registerInstance(this, hostRef);
|
|
33577
33632
|
this.renderCount = 0;
|
|
33578
33633
|
this.propsConfig = paginationPropsConfig;
|
|
33579
33634
|
this._boundaryCount = 1;
|
|
@@ -33650,7 +33705,7 @@ class KolPagination extends BaseWebComponent {
|
|
|
33650
33705
|
this.item.destroy();
|
|
33651
33706
|
}
|
|
33652
33707
|
render() {
|
|
33653
|
-
return (hAsync(Host, { key: '
|
|
33708
|
+
return (hAsync(Host, { key: '5ab5479e8a646e9dc7a6d3092d8d71c151d18d33' }, hAsync(PaginationFC, Object.assign({ key: 'b4deee4d58a35e027f0445f539afa46e92bea5de' }, this.item.getFcProps()))));
|
|
33654
33709
|
}
|
|
33655
33710
|
get host() { return getElement(this); }
|
|
33656
33711
|
static get watchers() { return {
|
|
@@ -33774,12 +33829,13 @@ class BasePopoverButtonWebComponent extends BaseButtonWebComponent {
|
|
|
33774
33829
|
}
|
|
33775
33830
|
}
|
|
33776
33831
|
|
|
33777
|
-
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; } }`;
|
|
33778
33833
|
|
|
33779
33834
|
class KolPopoverButton extends BasePopoverButtonWebComponent {
|
|
33780
33835
|
constructor(hostRef) {
|
|
33781
33836
|
super();
|
|
33782
|
-
|
|
33837
|
+
if (new.target === KolPopoverButton)
|
|
33838
|
+
registerInstance(this, hostRef);
|
|
33783
33839
|
this.ariaDescriptionId = nonce();
|
|
33784
33840
|
this.popoverOpen = false;
|
|
33785
33841
|
this._accessKey = undefined;
|
|
@@ -33895,7 +33951,7 @@ class KolPopoverButton extends BasePopoverButtonWebComponent {
|
|
|
33895
33951
|
this.destroyPopover();
|
|
33896
33952
|
}
|
|
33897
33953
|
render() {
|
|
33898
|
-
return hAsync(Host, { key: '
|
|
33954
|
+
return hAsync(Host, { key: '291c2254c1443a9d058b89019a13dc3a7cf0deb0' }, this.renderPopoverButtonFC());
|
|
33899
33955
|
}
|
|
33900
33956
|
get host() { return getElement(this); }
|
|
33901
33957
|
static get watchers() { return {
|
|
@@ -34025,15 +34081,16 @@ const ProgressFC = (props) => {
|
|
|
34025
34081
|
const liveValueText = isPercentage
|
|
34026
34082
|
? translate('kol-live-value', { placeholders: { value: String(liveProgressValue), unit } })
|
|
34027
34083
|
: translate('kol-live-value-bounded', { placeholders: { value: String(liveProgressValue), max: String(max), unit } });
|
|
34028
|
-
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)));
|
|
34029
34085
|
};
|
|
34030
34086
|
|
|
34031
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; } } }`;
|
|
34032
34088
|
|
|
34033
34089
|
class KolProgress extends BaseWebComponent {
|
|
34034
34090
|
constructor(hostRef) {
|
|
34035
|
-
super();
|
|
34036
|
-
|
|
34091
|
+
super(...arguments);
|
|
34092
|
+
if (new.target === KolProgress)
|
|
34093
|
+
registerInstance(this, hostRef);
|
|
34037
34094
|
this.liveValue = 0;
|
|
34038
34095
|
this.propsConfig = progressPropsConfig;
|
|
34039
34096
|
this._label = undefined;
|
|
@@ -34061,6 +34118,9 @@ class KolProgress extends BaseWebComponent {
|
|
|
34061
34118
|
watchVariant(value) {
|
|
34062
34119
|
variantProgressProp.apply(value, (v) => this.setRenderProp('variant', v));
|
|
34063
34120
|
}
|
|
34121
|
+
connectedCallback() {
|
|
34122
|
+
this.startLiveValueInterval();
|
|
34123
|
+
}
|
|
34064
34124
|
componentWillLoad() {
|
|
34065
34125
|
labelLangSegmentsProp.apply(this._label, (v) => this.setRenderProp('label', v), this.isRequired('label'));
|
|
34066
34126
|
maxProp.apply(this._max, (v) => {
|
|
@@ -34071,7 +34131,6 @@ class KolProgress extends BaseWebComponent {
|
|
|
34071
34131
|
this.watchValue(this._value);
|
|
34072
34132
|
variantProgressProp.apply(this._variant, (v) => this.setRenderProp('variant', v));
|
|
34073
34133
|
this.setState('liveValue', this.getRenderProp('value'));
|
|
34074
|
-
this.startLiveValueInterval();
|
|
34075
34134
|
}
|
|
34076
34135
|
disconnectedCallback() {
|
|
34077
34136
|
if (this.interval) {
|
|
@@ -34080,13 +34139,14 @@ class KolProgress extends BaseWebComponent {
|
|
|
34080
34139
|
}
|
|
34081
34140
|
}
|
|
34082
34141
|
startLiveValueInterval() {
|
|
34142
|
+
clearInterval(this.interval);
|
|
34083
34143
|
this.interval = setInterval(() => {
|
|
34084
34144
|
const value = this.getRenderProp('value');
|
|
34085
34145
|
this.setState('liveValue', value);
|
|
34086
34146
|
}, 5000);
|
|
34087
34147
|
}
|
|
34088
34148
|
render() {
|
|
34089
|
-
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 })));
|
|
34090
34150
|
}
|
|
34091
34151
|
static get watchers() { return {
|
|
34092
34152
|
"_label": [{
|
|
@@ -34146,8 +34206,9 @@ const defaultStyleCss$e = () => `@charset "UTF-8"; @layer kol-a11y, kol-glob
|
|
|
34146
34206
|
|
|
34147
34207
|
class KolQuote extends BaseWebComponent {
|
|
34148
34208
|
constructor(hostRef) {
|
|
34149
|
-
super();
|
|
34150
|
-
|
|
34209
|
+
super(...arguments);
|
|
34210
|
+
if (new.target === KolQuote)
|
|
34211
|
+
registerInstance(this, hostRef);
|
|
34151
34212
|
this.propsConfig = quotePropsConfig;
|
|
34152
34213
|
this._label = undefined;
|
|
34153
34214
|
this._variant = 'inline';
|
|
@@ -34171,7 +34232,7 @@ class KolQuote extends BaseWebComponent {
|
|
|
34171
34232
|
variantQuoteProp.apply(this._variant, (v) => this.setRenderProp('variant', v));
|
|
34172
34233
|
}
|
|
34173
34234
|
render() {
|
|
34174
|
-
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') })));
|
|
34175
34236
|
}
|
|
34176
34237
|
static get watchers() { return {
|
|
34177
34238
|
"_href": [{
|
|
@@ -34205,12 +34266,13 @@ class KolQuote extends BaseWebComponent {
|
|
|
34205
34266
|
}; }
|
|
34206
34267
|
}
|
|
34207
34268
|
|
|
34208
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } }`;
|
|
34209
34270
|
|
|
34210
34271
|
class KolSelect extends BaseSelectWebComponent {
|
|
34211
34272
|
constructor(hostRef) {
|
|
34212
34273
|
super();
|
|
34213
|
-
|
|
34274
|
+
if (new.target === KolSelect)
|
|
34275
|
+
registerInstance(this, hostRef);
|
|
34214
34276
|
this.id = createUniqueId('select');
|
|
34215
34277
|
this.infoPopoverOpen = false;
|
|
34216
34278
|
this.inputHasFocus = false;
|
|
@@ -34353,7 +34415,7 @@ class KolSelect extends BaseSelectWebComponent {
|
|
|
34353
34415
|
return this._shortKey;
|
|
34354
34416
|
}
|
|
34355
34417
|
render() {
|
|
34356
|
-
return hAsync(Host, { key: '
|
|
34418
|
+
return hAsync(Host, { key: '9c197a18d87d1514983d873fd2912ffc2fc48385', class: "kol-select" }, this.renderSelectField());
|
|
34357
34419
|
}
|
|
34358
34420
|
get host() { return getElement(this); }
|
|
34359
34421
|
static get watchers() { return {
|
|
@@ -34492,14 +34554,16 @@ const customSuggestionsToggleBem = bem.forBlock('kol-custom-suggestions-toggle')
|
|
|
34492
34554
|
const BEM_CLASS_SINGLE_SELECT__DELETE = singleSelectBem('delete');
|
|
34493
34555
|
const BEM_CLASS_SINGLE_SELECT__NO_RESULTS_MESSAGE = singleSelectBem('no-results-message');
|
|
34494
34556
|
const SingleSelectToggleFC = ({ disabled, handleClick }) => (hAsync(IconFC, { icons: "kolicon-chevron-down", label: "", class: customSuggestionsToggleBem({ disabled }), onClick: handleClick }));
|
|
34495
|
-
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));
|
|
34496
34559
|
|
|
34497
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } }`;
|
|
34498
34561
|
|
|
34499
34562
|
class KolSingleSelect extends BaseListboxWebComponent {
|
|
34500
34563
|
constructor(hostRef) {
|
|
34501
34564
|
super();
|
|
34502
|
-
|
|
34565
|
+
if (new.target === KolSingleSelect)
|
|
34566
|
+
registerInstance(this, hostRef);
|
|
34503
34567
|
this.id = createUniqueId('single-select');
|
|
34504
34568
|
this.infoPopoverOpen = false;
|
|
34505
34569
|
this.inputHasFocus = false;
|
|
@@ -34850,9 +34914,12 @@ class KolSingleSelect extends BaseListboxWebComponent {
|
|
|
34850
34914
|
label,
|
|
34851
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 });
|
|
34852
34916
|
}
|
|
34917
|
+
hasNoResults() {
|
|
34918
|
+
return !Array.isArray(this.filteredOptions) || this.filteredOptions.length === 0;
|
|
34919
|
+
}
|
|
34853
34920
|
renderOptions() {
|
|
34854
|
-
if (
|
|
34855
|
-
return
|
|
34921
|
+
if (this.hasNoResults()) {
|
|
34922
|
+
return [];
|
|
34856
34923
|
}
|
|
34857
34924
|
return this.filteredOptions.map((option, index) => (hAsync(CustomSuggestionsOptionFC, { id: this.getOptionId(index), index: index, option: option.label, searchTerm: this.inputValue, ref: (el) => {
|
|
34858
34925
|
if (el)
|
|
@@ -34882,14 +34949,15 @@ class KolSingleSelect extends BaseListboxWebComponent {
|
|
|
34882
34949
|
render() {
|
|
34883
34950
|
var _a;
|
|
34884
34951
|
const isDisabled = this.getRenderProp('disabled') === true;
|
|
34952
|
+
const showNoResults = this.isOpen && !isDisabled && this.hasNoResults();
|
|
34885
34953
|
const { startAdornment, endAdornment } = getInputAdornments({ icons: this.getRenderProp('icons') });
|
|
34886
|
-
return (hAsync(Host, { key: '
|
|
34954
|
+
return (hAsync(Host, { key: 'e97d74740ca2641fc9e91808f9823a434f329ebe' }, hAsync(FormFieldFC, Object.assign({ key: '427af456c8f187427acac404fec841b03e32fea4' }, this.getFormFieldProps({
|
|
34887
34955
|
class: clsx('kol-single-select', { 'kol-single-select--open': this.isOpen }),
|
|
34888
34956
|
accessKey: this.getRenderProp('accessKey') || undefined,
|
|
34889
34957
|
shortKey: this.getRenderProp('shortKey') || undefined,
|
|
34890
34958
|
required: this.getRenderProp('required'),
|
|
34891
34959
|
variant: this.getRenderProp('variant'),
|
|
34892
|
-
})), 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({
|
|
34893
34961
|
_icons: 'kolicon-cross',
|
|
34894
34962
|
_label: this.translateDeleteSelection,
|
|
34895
34963
|
_hideLabel: true,
|
|
@@ -34900,7 +34968,7 @@ class KolSingleSelect extends BaseListboxWebComponent {
|
|
|
34900
34968
|
onFocus: this.handleClearButtonFocus,
|
|
34901
34969
|
onBlur: this.handleClearButtonBlur,
|
|
34902
34970
|
},
|
|
34903
|
-
}, { 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 : '' })))));
|
|
34904
34972
|
}
|
|
34905
34973
|
get host() { return getElement(this); }
|
|
34906
34974
|
static get watchers() { return {
|
|
@@ -35115,12 +35183,13 @@ const createSkipNavLinkItem = (link, getHost) => {
|
|
|
35115
35183
|
};
|
|
35116
35184
|
};
|
|
35117
35185
|
|
|
35118
|
-
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; } }`;
|
|
35119
35187
|
|
|
35120
35188
|
class KolSkipNav extends BaseWebComponent {
|
|
35121
35189
|
constructor(hostRef) {
|
|
35122
|
-
super();
|
|
35123
|
-
|
|
35190
|
+
super(...arguments);
|
|
35191
|
+
if (new.target === KolSkipNav)
|
|
35192
|
+
registerInstance(this, hostRef);
|
|
35124
35193
|
this.linkItems = [];
|
|
35125
35194
|
this.ctaRef = createCtaRef();
|
|
35126
35195
|
this.propsConfig = skipNavPropsConfig;
|
|
@@ -35163,7 +35232,7 @@ class KolSkipNav extends BaseWebComponent {
|
|
|
35163
35232
|
});
|
|
35164
35233
|
}
|
|
35165
35234
|
render() {
|
|
35166
|
-
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 })));
|
|
35167
35236
|
}
|
|
35168
35237
|
get host() { return getElement(this); }
|
|
35169
35238
|
static get watchers() { return {
|
|
@@ -35221,8 +35290,9 @@ const defaultStyleCss$a = () => `@charset "UTF-8"; @layer kol-a11y, kol-glob
|
|
|
35221
35290
|
|
|
35222
35291
|
class KolSpin extends BaseWebComponent {
|
|
35223
35292
|
constructor(hostRef) {
|
|
35224
|
-
super();
|
|
35225
|
-
|
|
35293
|
+
super(...arguments);
|
|
35294
|
+
if (new.target === KolSpin)
|
|
35295
|
+
registerInstance(this, hostRef);
|
|
35226
35296
|
this.propsConfig = spinPropsConfig;
|
|
35227
35297
|
this._show = undefined;
|
|
35228
35298
|
this._label = undefined;
|
|
@@ -35243,7 +35313,7 @@ class KolSpin extends BaseWebComponent {
|
|
|
35243
35313
|
variantSpinProp.apply(this._variant, (v) => this.setRenderProp('variant', v));
|
|
35244
35314
|
}
|
|
35245
35315
|
render() {
|
|
35246
|
-
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') })));
|
|
35247
35317
|
}
|
|
35248
35318
|
static get watchers() { return {
|
|
35249
35319
|
"_show": [{
|
|
@@ -35283,12 +35353,13 @@ const SplitButtonFC = (props) => {
|
|
|
35283
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))))));
|
|
35284
35354
|
};
|
|
35285
35355
|
|
|
35286
|
-
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; } }`;
|
|
35287
35357
|
|
|
35288
35358
|
class KolSplitButton extends BaseButtonWebComponent {
|
|
35289
35359
|
constructor(hostRef) {
|
|
35290
35360
|
super();
|
|
35291
|
-
|
|
35361
|
+
if (new.target === KolSplitButton)
|
|
35362
|
+
registerInstance(this, hostRef);
|
|
35292
35363
|
this.ariaDescriptionId = nonce();
|
|
35293
35364
|
this.dropdownOpen = false;
|
|
35294
35365
|
this._accessKey = undefined;
|
|
@@ -35436,7 +35507,7 @@ class KolSplitButton extends BaseButtonWebComponent {
|
|
|
35436
35507
|
});
|
|
35437
35508
|
}
|
|
35438
35509
|
render() {
|
|
35439
|
-
return (hAsync(SplitButtonFC, { key: '
|
|
35510
|
+
return (hAsync(SplitButtonFC, { key: '21bc7a574f5c58d2959a4f653514c9156211b4b4', buttonProps: this.getButtonFCProps(), buttonWrapperClass: this.getButtonWrapperClass(), dropdownProps: this.dropdownItem.getFcProps(), refDropdown: this.setDropdownRef }));
|
|
35440
35511
|
}
|
|
35441
35512
|
get host() { return getElement(this); }
|
|
35442
35513
|
static get watchers() { return {
|
|
@@ -36545,6 +36616,7 @@ class BaseTableStatelessWebComponent extends BaseWebComponent {
|
|
|
36545
36616
|
}
|
|
36546
36617
|
clearTimeout(this.cellRenderTimeouts.get(element));
|
|
36547
36618
|
this.cellRenderTimeouts.set(element, setTimeout(() => {
|
|
36619
|
+
this.cellRenderTimeouts.delete(element);
|
|
36548
36620
|
if (typeof cell.render === 'function') {
|
|
36549
36621
|
const renderContent = cell.render(element, cell, cell.data, this.getRenderProp('data'));
|
|
36550
36622
|
if (typeof renderContent === 'string') {
|
|
@@ -36575,6 +36647,8 @@ class BaseTableStatelessWebComponent extends BaseWebComponent {
|
|
|
36575
36647
|
var _a;
|
|
36576
36648
|
(_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
|
|
36577
36649
|
clearTimeout(this.resizeDebounceTimeout);
|
|
36650
|
+
this.cellRenderTimeouts.forEach((timeout) => clearTimeout(timeout));
|
|
36651
|
+
this.cellRenderTimeouts.clear();
|
|
36578
36652
|
this.buttonItems.destroy();
|
|
36579
36653
|
this.linkItems.destroy();
|
|
36580
36654
|
this.settings.destroy();
|
|
@@ -36718,13 +36792,14 @@ class BaseTableStatelessWebComponent extends BaseWebComponent {
|
|
|
36718
36792
|
}
|
|
36719
36793
|
}
|
|
36720
36794
|
|
|
36721
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } }`;
|
|
36722
36796
|
|
|
36723
36797
|
const PAGINATION_OPTIONS = [10, 20, 50, 100];
|
|
36724
36798
|
class KolTableStateful extends BaseTableStatelessWebComponent {
|
|
36725
36799
|
constructor(hostRef) {
|
|
36726
|
-
super();
|
|
36727
|
-
|
|
36800
|
+
super(...arguments);
|
|
36801
|
+
if (new.target === KolTableStateful)
|
|
36802
|
+
registerInstance(this, hostRef);
|
|
36728
36803
|
this.pagination = { _page: 1, _pageSize: 10, _max: 0 };
|
|
36729
36804
|
this.renderCount = 0;
|
|
36730
36805
|
this.externalLabelElements = [];
|
|
@@ -37009,7 +37084,7 @@ class KolTableStateful extends BaseTableStatelessWebComponent {
|
|
|
37009
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()))))));
|
|
37010
37085
|
}
|
|
37011
37086
|
render() {
|
|
37012
|
-
return (hAsync(Host, { key: '
|
|
37087
|
+
return (hAsync(Host, { key: 'ef4f178d1bbabc8352c9909f21eb9fc8338eb918', class: "kol-table-stateful" }, this.renderPagination('top'), this.renderTableStatelessFC(), this.renderPagination('bottom')));
|
|
37013
37088
|
}
|
|
37014
37089
|
get host() { return getElement(this); }
|
|
37015
37090
|
static get watchers() { return {
|
|
@@ -37094,12 +37169,13 @@ class KolTableStateful extends BaseTableStatelessWebComponent {
|
|
|
37094
37169
|
}; }
|
|
37095
37170
|
}
|
|
37096
37171
|
|
|
37097
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } }`;
|
|
37098
37173
|
|
|
37099
37174
|
class KolTableStateless extends BaseTableStatelessWebComponent {
|
|
37100
37175
|
constructor(hostRef) {
|
|
37101
|
-
super();
|
|
37102
|
-
|
|
37176
|
+
super(...arguments);
|
|
37177
|
+
if (new.target === KolTableStateless)
|
|
37178
|
+
registerInstance(this, hostRef);
|
|
37103
37179
|
this.externalLabelElements = [];
|
|
37104
37180
|
this.hasScrollbar = false;
|
|
37105
37181
|
this.rowKeys = new Map();
|
|
@@ -37190,7 +37266,7 @@ class KolTableStateless extends BaseTableStatelessWebComponent {
|
|
|
37190
37266
|
this.syncTableLabel(this.externalLabelElements);
|
|
37191
37267
|
}
|
|
37192
37268
|
render() {
|
|
37193
|
-
return hAsync(Host, { key: '
|
|
37269
|
+
return hAsync(Host, { key: 'ae15aed17db36dedc317573d91f2e9c6f49c6c54' }, this.renderTableStatelessFC());
|
|
37194
37270
|
}
|
|
37195
37271
|
get host() { return getElement(this); }
|
|
37196
37272
|
static get watchers() { return {
|
|
@@ -37348,15 +37424,22 @@ const BEM_CLASS_TABS__TAB = tabsBem('tab');
|
|
|
37348
37424
|
const BEM_CLASS_TABS__TABLIST = tabsBem('tablist');
|
|
37349
37425
|
const TabsFC = (props) => {
|
|
37350
37426
|
const { align, class: hostClass, createButton, handleBlur, handleKeyDown, hasCreateButton, label, refContent, refRoot, tabButtons } = props;
|
|
37351
|
-
|
|
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 })));
|
|
37352
37434
|
};
|
|
37353
37435
|
|
|
37354
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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%; } }`;
|
|
37355
37437
|
|
|
37356
37438
|
class KolTabs extends BaseWebComponent {
|
|
37357
37439
|
constructor(hostRef) {
|
|
37358
|
-
super();
|
|
37359
|
-
|
|
37440
|
+
super(...arguments);
|
|
37441
|
+
if (new.target === KolTabs)
|
|
37442
|
+
registerInstance(this, hostRef);
|
|
37360
37443
|
this.onCreateLabel = `${translate('kol-new')} …`;
|
|
37361
37444
|
this.ctaRef = createCtaRef();
|
|
37362
37445
|
this.id = createUniqueId('tabs');
|
|
@@ -37425,10 +37508,6 @@ class KolTabs extends BaseWebComponent {
|
|
|
37425
37508
|
case KeyboardKey.ArrowLeft:
|
|
37426
37509
|
this.goToPreviousTab(event);
|
|
37427
37510
|
break;
|
|
37428
|
-
case KeyboardKey.Space:
|
|
37429
|
-
case KeyboardKey.Enter:
|
|
37430
|
-
this.activateFocusedTab(event);
|
|
37431
|
-
break;
|
|
37432
37511
|
}
|
|
37433
37512
|
};
|
|
37434
37513
|
this.handleBlur = () => {
|
|
@@ -37525,11 +37604,6 @@ class KolTabs extends BaseWebComponent {
|
|
|
37525
37604
|
const nextFocusIndex = this.prevPossibleTabIndex(this.getRenderProp('tabs'), this.getCurrentFocusIndex());
|
|
37526
37605
|
this.selectNextTabEvent(event, nextFocusIndex, this.getKeyboardTabChangeMode());
|
|
37527
37606
|
}
|
|
37528
|
-
activateFocusedTab(event) {
|
|
37529
|
-
if (typeof this.currentFocusIndex === 'number') {
|
|
37530
|
-
this.onSelect(event, this.currentFocusIndex);
|
|
37531
|
-
}
|
|
37532
|
-
}
|
|
37533
37607
|
selectNextTabEvent(event, nextTabIndex, changeMode = 'activateCompletely') {
|
|
37534
37608
|
var _a, _b;
|
|
37535
37609
|
this.currentFocusIndex = nextTabIndex;
|
|
@@ -37636,7 +37710,7 @@ class KolTabs extends BaseWebComponent {
|
|
|
37636
37710
|
});
|
|
37637
37711
|
}
|
|
37638
37712
|
render() {
|
|
37639
|
-
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') })));
|
|
37640
37714
|
}
|
|
37641
37715
|
get host() { return getElement(this); }
|
|
37642
37716
|
static get watchers() { return {
|
|
@@ -37716,12 +37790,13 @@ const textareaPropsConfig = {
|
|
|
37716
37790
|
],
|
|
37717
37791
|
};
|
|
37718
37792
|
|
|
37719
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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%; } }`;
|
|
37720
37794
|
|
|
37721
37795
|
class KolTextarea extends BaseFormFieldWebComponent {
|
|
37722
37796
|
constructor(hostRef) {
|
|
37723
37797
|
super();
|
|
37724
|
-
|
|
37798
|
+
if (new.target === KolTextarea)
|
|
37799
|
+
registerInstance(this, hostRef);
|
|
37725
37800
|
this.id = createUniqueId('textarea');
|
|
37726
37801
|
this.infoPopoverOpen = false;
|
|
37727
37802
|
this.inputHasFocus = false;
|
|
@@ -37957,6 +38032,7 @@ class KolTextarea extends BaseFormFieldWebComponent {
|
|
|
37957
38032
|
this.isWritingRows = false;
|
|
37958
38033
|
}
|
|
37959
38034
|
measureTextareaRows(el) {
|
|
38035
|
+
const { overflow, padding } = el.style;
|
|
37960
38036
|
el.style.overflow = 'hidden';
|
|
37961
38037
|
el.style.padding = '0';
|
|
37962
38038
|
const currentRows = el.rows;
|
|
@@ -37964,7 +38040,8 @@ class KolTextarea extends BaseFormFieldWebComponent {
|
|
|
37964
38040
|
el.rows = 1;
|
|
37965
38041
|
const nextRows = Math.round(el.scrollHeight / rowHeight);
|
|
37966
38042
|
el.rows = currentRows;
|
|
37967
|
-
el.style.
|
|
38043
|
+
el.style.overflow = overflow;
|
|
38044
|
+
el.style.padding = padding;
|
|
37968
38045
|
const minRows = this.minRows;
|
|
37969
38046
|
return minRows && minRows > nextRows ? minRows : nextRows;
|
|
37970
38047
|
}
|
|
@@ -37986,7 +38063,7 @@ class KolTextarea extends BaseFormFieldWebComponent {
|
|
|
37986
38063
|
render() {
|
|
37987
38064
|
const disabled = this.getRenderProp('disabled');
|
|
37988
38065
|
const { startAdornment, endAdornment } = getInputAdornments({ icons: this.getRenderProp('icons') });
|
|
37989
|
-
return (hAsync(Host, { key: '
|
|
38066
|
+
return (hAsync(Host, { key: 'f213a17cb37e5957ab505f30bb9a16f4d540277a' }, hAsync(FormFieldFC, Object.assign({ key: 'f30d7ffa05b8f88949b05967af1270a26de84dff' }, this.getFormFieldProps({
|
|
37990
38067
|
class: clsx('kol-form-field-textarea', {
|
|
37991
38068
|
'kol-form-field--has-value': this.hasValue,
|
|
37992
38069
|
'kol-form-field--has-counter': this.counter.hasSoftLimit() || this.counter.hasCounter(),
|
|
@@ -37998,7 +38075,7 @@ class KolTextarea extends BaseFormFieldWebComponent {
|
|
|
37998
38075
|
readOnly: this.getRenderProp('readOnly'),
|
|
37999
38076
|
maxLength: this.counter.getRenderProp('maxLength'),
|
|
38000
38077
|
counter: this.counter.getCounterProps(),
|
|
38001
|
-
})), 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()))))));
|
|
38002
38079
|
}
|
|
38003
38080
|
get host() { return getElement(this); }
|
|
38004
38081
|
static get watchers() { return {
|
|
@@ -38147,12 +38224,13 @@ const ToastItemFc = (_a) => {
|
|
|
38147
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))));
|
|
38148
38225
|
};
|
|
38149
38226
|
|
|
38150
|
-
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; } }`;
|
|
38151
38228
|
|
|
38152
38229
|
const TRANSITION_TIMEOUT = 300;
|
|
38153
38230
|
class KolToastContainer {
|
|
38154
38231
|
constructor(hostRef) {
|
|
38155
|
-
|
|
38232
|
+
if (new.target === KolToastContainer)
|
|
38233
|
+
registerInstance(this, hostRef);
|
|
38156
38234
|
this.state = {
|
|
38157
38235
|
_toastStates: [],
|
|
38158
38236
|
};
|
|
@@ -38220,7 +38298,7 @@ class KolToastContainer {
|
|
|
38220
38298
|
}
|
|
38221
38299
|
}
|
|
38222
38300
|
render() {
|
|
38223
|
-
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: {
|
|
38224
38302
|
onClick: () => {
|
|
38225
38303
|
void this.closeAll();
|
|
38226
38304
|
},
|
|
@@ -38378,13 +38456,14 @@ const createHRItem = () => {
|
|
|
38378
38456
|
};
|
|
38379
38457
|
};
|
|
38380
38458
|
|
|
38381
|
-
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=1794493099910"); src: url("kolicons.eot?t=1794493099910#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1794493099910") format("woff2"), url("kolicons.woff?t=1794493099910") format("woff"), url("kolicons.ttf?t=1794493099910") format("truetype"), url("kolicons.svg?t=1794493099910#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; } }`;
|
|
38382
38460
|
|
|
38383
38461
|
const ARROW_KEYS = [KeyboardKey.ArrowUp, KeyboardKey.ArrowDown, KeyboardKey.ArrowRight, KeyboardKey.ArrowLeft];
|
|
38384
38462
|
class KolToolbar extends BaseWebComponent {
|
|
38385
38463
|
constructor(hostRef) {
|
|
38386
|
-
super();
|
|
38387
|
-
|
|
38464
|
+
super(...arguments);
|
|
38465
|
+
if (new.target === KolToolbar)
|
|
38466
|
+
registerInstance(this, hostRef);
|
|
38388
38467
|
this.currentIndex = 0;
|
|
38389
38468
|
this.itemRecords = [];
|
|
38390
38469
|
this.location = '';
|
|
@@ -38471,7 +38550,7 @@ class KolToolbar extends BaseWebComponent {
|
|
|
38471
38550
|
return undefined;
|
|
38472
38551
|
}
|
|
38473
38552
|
render() {
|
|
38474
|
-
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') })));
|
|
38475
38554
|
}
|
|
38476
38555
|
get host() { return getElement(this); }
|
|
38477
38556
|
static get watchers() { return {
|
|
@@ -38509,7 +38588,8 @@ class KolToolbar extends BaseWebComponent {
|
|
|
38509
38588
|
|
|
38510
38589
|
class KolTooltipWc {
|
|
38511
38590
|
constructor(hostRef) {
|
|
38512
|
-
|
|
38591
|
+
if (new.target === KolTooltipWc)
|
|
38592
|
+
registerInstance(this, hostRef);
|
|
38513
38593
|
this.tooltipBehavior = new TooltipBehavior(BaseWebComponent.stateLess);
|
|
38514
38594
|
this._badgeText = undefined;
|
|
38515
38595
|
this._align = 'top';
|
|
@@ -38554,7 +38634,7 @@ class KolTooltipWc {
|
|
|
38554
38634
|
(_a = this.tooltipBehavior) === null || _a === void 0 ? void 0 : _a.destroy();
|
|
38555
38635
|
}
|
|
38556
38636
|
render() {
|
|
38557
|
-
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); } })));
|
|
38558
38638
|
}
|
|
38559
38639
|
get host() { return getElement(this); }
|
|
38560
38640
|
static get watchers() { return {
|
|
@@ -38612,8 +38692,9 @@ const defaultStyleCss$2 = () => `@charset "UTF-8"; @layer kol-a11y, kol-glob
|
|
|
38612
38692
|
const isTreeItem = (element) => (element === null || element === void 0 ? void 0 : element.tagName) === KolTreeItemTag.toUpperCase();
|
|
38613
38693
|
class KolTree extends BaseWebComponent {
|
|
38614
38694
|
constructor(hostRef) {
|
|
38615
|
-
super();
|
|
38616
|
-
|
|
38695
|
+
super(...arguments);
|
|
38696
|
+
if (new.target === KolTree)
|
|
38697
|
+
registerInstance(this, hostRef);
|
|
38617
38698
|
this.cacheValid = false;
|
|
38618
38699
|
this.propsConfig = treePropsConfig;
|
|
38619
38700
|
this.invalidateOpenItemsCache = () => {
|
|
@@ -38834,7 +38915,7 @@ class KolTree extends BaseWebComponent {
|
|
|
38834
38915
|
}
|
|
38835
38916
|
}
|
|
38836
38917
|
render() {
|
|
38837
|
-
return (hAsync(Host, { key: '
|
|
38918
|
+
return (hAsync(Host, { key: '46407a67efb548149a62e371713e0da8ec352863', tabindex: "0" }, hAsync(TreeFC, { key: '2725ae9400123f266b59b8c45b82eac3b83cf5f3', handleSlotchange: this.handleSlotchange, label: this.getRenderProp('label') })));
|
|
38838
38919
|
}
|
|
38839
38920
|
get host() { return getElement(this); }
|
|
38840
38921
|
static get watchers() { return {
|
|
@@ -38875,12 +38956,13 @@ const LINK_DEFAULTS = Object.freeze(buildDefaultPropsFromConfig(linkPropsConfig)
|
|
|
38875
38956
|
const noop = () => undefined;
|
|
38876
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 }))));
|
|
38877
38958
|
|
|
38878
|
-
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; } }`;
|
|
38879
38960
|
|
|
38880
38961
|
class KolTreeItem extends BaseWebComponent {
|
|
38881
38962
|
constructor(hostRef) {
|
|
38882
|
-
super();
|
|
38883
|
-
|
|
38963
|
+
super(...arguments);
|
|
38964
|
+
if (new.target === KolTreeItem)
|
|
38965
|
+
registerInstance(this, hostRef);
|
|
38884
38966
|
this.ariaCurrent = '';
|
|
38885
38967
|
this.groupId = createUniqueId('tree-group');
|
|
38886
38968
|
this.hasChildren = false;
|
|
@@ -38982,7 +39064,7 @@ class KolTreeItem extends BaseWebComponent {
|
|
|
38982
39064
|
}
|
|
38983
39065
|
}
|
|
38984
39066
|
render() {
|
|
38985
|
-
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 })));
|
|
38986
39068
|
}
|
|
38987
39069
|
get host() { return getElement(this); }
|
|
38988
39070
|
static get watchers() { return {
|
|
@@ -39037,15 +39119,16 @@ const VersionFC = ({ class: hostClass, color, icons, label }) => {
|
|
|
39037
39119
|
return (hAsync(BemRootNodeFC, { block: "kol-version", class: hostClass }, hAsync(BadgeFC, { color: color, icons: icons, label: label })));
|
|
39038
39120
|
};
|
|
39039
39121
|
|
|
39040
|
-
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; } }`;
|
|
39041
39123
|
|
|
39042
39124
|
const VERSION_COLORS = createContrastColorPair('#bec5c9');
|
|
39043
39125
|
const VERSION_COLOR = { backgroundColor: VERSION_COLORS.background, foregroundColor: VERSION_COLORS.foreground };
|
|
39044
39126
|
const VERSION_ICON = { left: { icon: 'kolicon-version', label: translate('kol-version') } };
|
|
39045
39127
|
class KolVersion extends BaseWebComponent {
|
|
39046
39128
|
constructor(hostRef) {
|
|
39047
|
-
super();
|
|
39048
|
-
|
|
39129
|
+
super(...arguments);
|
|
39130
|
+
if (new.target === KolVersion)
|
|
39131
|
+
registerInstance(this, hostRef);
|
|
39049
39132
|
this.propsConfig = versionPropsConfig;
|
|
39050
39133
|
}
|
|
39051
39134
|
watchLabel(value) {
|
|
@@ -39055,7 +39138,7 @@ class KolVersion extends BaseWebComponent {
|
|
|
39055
39138
|
labelProp.apply(this._label, (v) => this.setRenderProp('label', v), this.isRequired('label'));
|
|
39056
39139
|
}
|
|
39057
39140
|
render() {
|
|
39058
|
-
return (hAsync(Host, { key: '
|
|
39141
|
+
return (hAsync(Host, { key: '41f3fe21b34ed55fe622cc212cec754c5110292e' }, hAsync(VersionFC, { key: '3239e582b5e207e28c4a2cf92d730278f21afd0b', color: VERSION_COLOR, icons: VERSION_ICON, label: this.getRenderProp('label') })));
|
|
39059
39142
|
}
|
|
39060
39143
|
static get watchers() { return {
|
|
39061
39144
|
"_label": [{
|
|
@@ -39079,7 +39162,8 @@ class KolVersion extends BaseWebComponent {
|
|
|
39079
39162
|
|
|
39080
39163
|
class TestComponent {
|
|
39081
39164
|
constructor(hostRef) {
|
|
39082
|
-
|
|
39165
|
+
if (new.target === TestComponent)
|
|
39166
|
+
registerInstance(this, hostRef);
|
|
39083
39167
|
}
|
|
39084
39168
|
static get cmpMeta() { return {
|
|
39085
39169
|
"$flags$": 0,
|
|
@@ -39341,7 +39425,7 @@ var NAMESPACE = (
|
|
|
39341
39425
|
);
|
|
39342
39426
|
|
|
39343
39427
|
/*
|
|
39344
|
-
Stencil Hydrate Runner v4.45.
|
|
39428
|
+
Stencil Hydrate Runner v4.45.3 | MIT Licensed | https://stenciljs.com
|
|
39345
39429
|
*/
|
|
39346
39430
|
var __create = Object.create;
|
|
39347
39431
|
var __defProp = Object.defineProperty;
|
|
@@ -50630,22 +50714,26 @@ var MockNodeList = class {
|
|
|
50630
50714
|
this.length = length;
|
|
50631
50715
|
}
|
|
50632
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
|
+
};
|
|
50633
50730
|
var MockElement = class extends MockNode2 {
|
|
50634
50731
|
__namespaceURI;
|
|
50635
50732
|
__attributeMap;
|
|
50636
50733
|
__shadowRoot;
|
|
50637
50734
|
__style;
|
|
50638
50735
|
attachInternals() {
|
|
50639
|
-
return new
|
|
50640
|
-
get: function(_target, prop, _receiver) {
|
|
50641
|
-
if ("process" in globalThis && globalThis.process.env.__STENCIL_SPEC_TESTS__) {
|
|
50642
|
-
console.error(
|
|
50643
|
-
`NOTE: Property ${String(prop)} was accessed on ElementInternals, but this property is not implemented.
|
|
50644
|
-
Testing components with ElementInternals is fully supported in e2e tests.`
|
|
50645
|
-
);
|
|
50646
|
-
}
|
|
50647
|
-
}
|
|
50648
|
-
});
|
|
50736
|
+
return new MockElementInternals();
|
|
50649
50737
|
}
|
|
50650
50738
|
constructor(ownerDocument, nodeName, namespaceURI = null) {
|
|
50651
50739
|
super(ownerDocument, 1 /* ELEMENT_NODE */, typeof nodeName === "string" ? nodeName : null, null);
|
|
@@ -50919,7 +51007,9 @@ var MockElement = class extends MockNode2 {
|
|
|
50919
51007
|
return this.hasAttributeNS(null, "hidden");
|
|
50920
51008
|
}
|
|
50921
51009
|
set hidden(isHidden) {
|
|
50922
|
-
if (isHidden ===
|
|
51010
|
+
if (isHidden === "until-found") {
|
|
51011
|
+
this.setAttributeNS(null, "hidden", "until-found");
|
|
51012
|
+
} else if (isHidden === true) {
|
|
50923
51013
|
this.setAttributeNS(null, "hidden", "");
|
|
50924
51014
|
} else {
|
|
50925
51015
|
this.removeAttributeNS(null, "hidden");
|