@public-ui/theme-default 4.0.0-alpha.5 → 4.0.0-alpha.6
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.cjs +15 -14
- package/dist/index.cjs.map +1 -1
- package/dist/index.mjs +15 -14
- package/dist/index.mjs.map +1 -1
- package/package.json +12 -12
package/dist/index.cjs
CHANGED
|
@@ -798,9 +798,9 @@ var hasRequiredCjs$1;
|
|
|
798
798
|
function requireCjs$1 () {
|
|
799
799
|
if (hasRequiredCjs$1) return cjs$1;
|
|
800
800
|
hasRequiredCjs$1 = 1;
|
|
801
|
-
(function (exports) {
|
|
802
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
803
|
-
exports.querySelectorAll = void 0;
|
|
801
|
+
(function (exports$1) {
|
|
802
|
+
Object.defineProperty(exports$1, "__esModule", { value: true });
|
|
803
|
+
exports$1.querySelectorAll = void 0;
|
|
804
804
|
const pushNodes = (set, domNodes) => {
|
|
805
805
|
domNodes.forEach((domNode) => {
|
|
806
806
|
if (set.has(domNode) === false) {
|
|
@@ -818,10 +818,10 @@ function requireCjs$1 () {
|
|
|
818
818
|
for (let i = 0; i < nodeList.length; i++) {
|
|
819
819
|
const shadowRoot = nodeList[i].shadowRoot;
|
|
820
820
|
if (typeof shadowRoot === "object" && shadowRoot !== null) {
|
|
821
|
-
pushNodes(domNodes, (0, exports.querySelectorAll)(selector, shadowRoot));
|
|
821
|
+
pushNodes(domNodes, (0, exports$1.querySelectorAll)(selector, shadowRoot));
|
|
822
822
|
}
|
|
823
823
|
else {
|
|
824
|
-
pushNodes(domNodes, (0, exports.querySelectorAll)(selector, nodeList[i]));
|
|
824
|
+
pushNodes(domNodes, (0, exports$1.querySelectorAll)(selector, nodeList[i]));
|
|
825
825
|
}
|
|
826
826
|
}
|
|
827
827
|
return Array.from(domNodes);
|
|
@@ -830,7 +830,7 @@ function requireCjs$1 () {
|
|
|
830
830
|
throw new Error(`The parameter document for the method querySelectorAll is not type of Document, HTMLElement or ShadowRoot.`);
|
|
831
831
|
}
|
|
832
832
|
};
|
|
833
|
-
exports.querySelectorAll = querySelectorAll;
|
|
833
|
+
exports$1.querySelectorAll = querySelectorAll;
|
|
834
834
|
|
|
835
835
|
} (cjs$1));
|
|
836
836
|
return cjs$1;
|
|
@@ -845,9 +845,9 @@ var hasRequiredCjs;
|
|
|
845
845
|
function requireCjs () {
|
|
846
846
|
if (hasRequiredCjs) return cjs;
|
|
847
847
|
hasRequiredCjs = 1;
|
|
848
|
-
(function (exports) {
|
|
849
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
850
|
-
exports.querySelector = void 0;
|
|
848
|
+
(function (exports$1) {
|
|
849
|
+
Object.defineProperty(exports$1, "__esModule", { value: true });
|
|
850
|
+
exports$1.querySelector = void 0;
|
|
851
851
|
const querySelector = (selector, node = document) => {
|
|
852
852
|
if (node instanceof Document ||
|
|
853
853
|
node instanceof HTMLElement ||
|
|
@@ -858,10 +858,10 @@ function requireCjs () {
|
|
|
858
858
|
for (let i = 0; i < nodeList.length; i++) {
|
|
859
859
|
const shadowRoot = nodeList[i].shadowRoot;
|
|
860
860
|
if (typeof shadowRoot === "object" && shadowRoot !== null) {
|
|
861
|
-
domNode = (0, exports.querySelector)(selector, shadowRoot);
|
|
861
|
+
domNode = (0, exports$1.querySelector)(selector, shadowRoot);
|
|
862
862
|
}
|
|
863
863
|
else {
|
|
864
|
-
domNode = (0, exports.querySelector)(selector, nodeList[i]);
|
|
864
|
+
domNode = (0, exports$1.querySelector)(selector, nodeList[i]);
|
|
865
865
|
}
|
|
866
866
|
if (domNode !== null) {
|
|
867
867
|
break;
|
|
@@ -874,7 +874,7 @@ function requireCjs () {
|
|
|
874
874
|
throw new Error(`The parameter document for the method querySelector is not type of Document, HTMLElement or ShadowRoot.`);
|
|
875
875
|
}
|
|
876
876
|
};
|
|
877
|
-
exports.querySelector = querySelector;
|
|
877
|
+
exports$1.querySelector = querySelector;
|
|
878
878
|
|
|
879
879
|
} (cjs));
|
|
880
880
|
return cjs;
|
|
@@ -986,6 +986,7 @@ var KolEvent;
|
|
|
986
986
|
KolEvent["create"] = "kolCreate";
|
|
987
987
|
KolEvent["focus"] = "kolFocus";
|
|
988
988
|
KolEvent["input"] = "kolInput";
|
|
989
|
+
KolEvent["keydown"] = "kolKeydown";
|
|
989
990
|
KolEvent["mousedown"] = "kolMousedown";
|
|
990
991
|
KolEvent["reset"] = "kolReset";
|
|
991
992
|
KolEvent["select"] = "kolSelect";
|
|
@@ -1177,7 +1178,7 @@ var css_248z$F = "/* forward the rem function */\n@layer kol-theme-component {\n
|
|
|
1177
1178
|
|
|
1178
1179
|
var css_248z$E = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-badge {\n border-radius: var(--border-radius);\n display: inline-flex;\n font-style: normal;\n }\n .kol-badge--has-smart-button {\n align-items: center;\n }\n .kol-badge__smart-button .kol-button {\n color: inherit;\n padding: calc(3.2 * 1rem / var(--kolibri-root-font-size, 16));\n border-bottom-right-radius: var(--border-radius);\n border-top-right-radius: var(--border-radius);\n }\n .kol-badge__smart-button .kol-button:hover {\n color: var(--color-light);\n background-color: var(--color-primary-variant);\n }\n .kol-badge__smart-button .kol-button__text {\n padding: calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n font-style: normal;\n }\n .kol-badge__label {\n padding: calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n font-style: normal;\n }\n .kol-badge__label .kol-span__container {\n display: flex;\n gap: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n}";
|
|
1179
1180
|
|
|
1180
|
-
var css_248z$D = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n color: var(--color-primary);\n font-weight: 400;\n font-style: normal;\n }\n .kol-link:focus {\n outline: none;\n }\n .kol-link:visited {\n color: var(--visited);\n }\n .kol-link:focus .kol-link__text {\n outline: var(--border-width) solid;\n border-radius: var(--border-radius);\n position: relative;\n }\n .kol-link:is(:focus, :hover):not([aria-disabled], [disabled]) .kol-link__text .kol-span__label {\n text-decoration-thickness: 0.25em;\n }\n .kol-breadcrumb__list-element-span {\n color: var(--color-subtle);\n }\n .kol-breadcrumb__link::part(icon) {\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-
|
|
1181
|
+
var css_248z$D = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n color: var(--color-primary);\n font-weight: 400;\n font-style: normal;\n }\n .kol-link:focus {\n outline: none;\n }\n .kol-link:visited {\n color: var(--visited);\n }\n .kol-link:focus .kol-link__text {\n outline: var(--border-width) solid;\n border-radius: var(--border-radius);\n position: relative;\n }\n .kol-link:is(:focus, :hover):not([aria-disabled], [disabled]) .kol-link__text .kol-span__label {\n text-decoration-thickness: 0.25em;\n }\n .kol-breadcrumb__list-element-span {\n color: var(--color-subtle);\n }\n .kol-breadcrumb__link::part(icon) {\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-breadcrumb__separator {\n color: var(--color-subtle);\n font-size: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n font-weight: 900;\n }\n .kol-link {\n line-height: 1;\n }\n}";
|
|
1181
1182
|
|
|
1182
1183
|
var css_248z$C = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n color: var(--color-primary);\n font-weight: 400;\n font-style: normal;\n }\n .kol-button:focus {\n outline: none;\n }\n .kol-button:visited {\n color: var(--visited);\n }\n .kol-button:focus .kol-button__text {\n outline: var(--border-width) solid;\n border-radius: var(--border-radius);\n position: relative;\n }\n .kol-button:is(:focus, :hover):not([aria-disabled], [disabled]) .kol-button__text .kol-span__label {\n text-decoration-thickness: 0.25em;\n }\n .kol-button {\n color: var(--color-primary);\n font-weight: 400;\n font-style: normal;\n }\n .kol-button:focus {\n outline: none;\n --text-border-radius: var(--border-radius);\n --text-outline: calc(var(--border-width) * 2) solid;\n }\n .kol-button:visited {\n color: var(--visited);\n }\n .kol-button:focus .kol-button__text {\n outline: var(--text-outline);\n border-radius: var(--text-border-radius);\n }\n .kol-button:is(:focus, :hover):not([aria-disabled], [disabled]) .kol-button__text .kol-span__label {\n text-decoration-thickness: 0.25em;\n }\n}";
|
|
1183
1184
|
|
|
@@ -1223,7 +1224,7 @@ var css_248z$i = "/* forward the rem function */\n@layer kol-theme-component {\n
|
|
|
1223
1224
|
|
|
1224
1225
|
var css_248z$h = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-card {\n background-color: var(--color-light);\n box-shadow: 0 0 4px color-mix(in srgb, black 80%, var(--color-subtle));\n border-radius: var(--border-radius);\n width: 100%;\n height: 100%;\n }\n .kol-card__header {\n display: block;\n padding: calc(16 * 1rem / var(--kolibri-root-font-size, 16)) calc(16 * 1rem / var(--kolibri-root-font-size, 16)) calc(8 * 1rem / var(--kolibri-root-font-size, 16)) calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1.75;\n }\n .kol-card__content {\n padding: 0 calc(16 * 1rem / var(--kolibri-root-font-size, 16)) calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-card__content ::slotted(p:first-child) {\n margin-top: 0;\n }\n .kol-card__content ::slotted(p:last-child) {\n margin-bottom: 0;\n }\n .kol-card__close-button {\n color: var(--color-primary);\n background: transparent;\n cursor: pointer;\n }\n .kol-card__close-button .kol-button:focus {\n outline: var(--color-primary-variant) solid calc(3 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-card__close-button .kol-button:focus, .kol-card__close-button .kol-button:hover {\n color: var(--color-light);\n background-color: var(--color-danger);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n border-top-right-radius: var(--border-radius);\n }\n .kol-modal__card {\n box-shadow: 0 0 4px var(--color-subtle);\n border-radius: var(--border-radius);\n }\n}";
|
|
1225
1226
|
|
|
1226
|
-
var css_248z$g = "/* forward the rem function */\n@layer kol-theme-component {\n :host {\n background-color: var(--color-mute);\n }\n .kol-nav {\n --kol-nav-item-padding-left: 0;\n --kol-nav-item-padding-right: 16;\n }\n .kol-nav__list {\n list-style: none;\n --kol-nav-nested-padding-left: calc(var(--kol-nav-item-padding-left) + 8);\n }\n .kol-nav__list-item {\n --kol-nav-item-padding-left: calc(var(--kol-nav-nested-padding-left) + 8);\n }\n .kol-nav__list--horizontal {\n --kol-nav-item-padding-right: 8;\n gap: 0 calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__entry--link {\n display: flex;\n }\n .kol-nav__entry .kol-link,\n .kol-nav__entry .kol-button {\n color: var(--color-primary);\n display: flex;\n min-height: var(--a11y-min-size);\n padding-right: calc(var(--kol-nav-item-padding-right) * 1rem / var(--kolibri-root-font-size, 16));\n padding-left: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n text-decoration: none;\n }\n .kol-nav__entry .kol-link:focus-visible,\n .kol-nav__entry .kol-button:focus-visible {\n outline: var(--color-primary-variant) solid calc(3 * 1rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-nav__list--vertical .kol-nav__entry .kol-link,\n .kol-nav__list--vertical .kol-nav__entry .kol-button {\n padding-left: calc(var(--kol-nav-item-padding-left) * 1rem / var(--kolibri-root-font-size, 16));\n border-left: 2px solid transparent;\n }\n .kol-nav--vertical .kol-nav__list-item--active > .kol-nav__entry-wrapper .kol-nav__entry .kol-link,\n .kol-nav--vertical .kol-nav__list-item--active > .kol-nav__entry-wrapper .kol-nav__entry .kol-button {\n border-left-color: var(--color-primary);\n }\n .kol-nav__list-item--active > .kol-nav__entry-wrapper .kol-nav__entry .kol-link,\n .kol-nav__list-item--active > .kol-nav__entry-wrapper .kol-nav__entry .kol-button {\n font-weight: bold;\n }\n .kol-nav__entry .kol-link:hover .kol-span__label,\n .kol-nav__entry .kol-button:hover .kol-span__label {\n text-decoration: underline;\n }\n .kol-nav__toggle-button .kol-button {\n margin-bottom: calc(5 * 1rem / var(--kolibri-root-font-size, 16));\n --text-background-color: var(--color-
|
|
1227
|
+
var css_248z$g = "/* forward the rem function */\n@layer kol-theme-component {\n :host {\n background-color: var(--color-mute);\n }\n .kol-nav {\n --kol-nav-item-padding-left: 0;\n --kol-nav-item-padding-right: 16;\n }\n .kol-nav__list {\n list-style: none;\n --kol-nav-nested-padding-left: calc(var(--kol-nav-item-padding-left) + 8);\n }\n .kol-nav__list-item {\n --kol-nav-item-padding-left: calc(var(--kol-nav-nested-padding-left) + 8);\n }\n .kol-nav__list--horizontal {\n --kol-nav-item-padding-right: 8;\n gap: 0 calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__entry--link {\n display: flex;\n }\n .kol-nav__entry .kol-link,\n .kol-nav__entry .kol-button {\n color: var(--color-primary);\n display: flex;\n min-height: var(--a11y-min-size);\n padding-right: calc(var(--kol-nav-item-padding-right) * 1rem / var(--kolibri-root-font-size, 16));\n padding-left: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n text-decoration: none;\n }\n .kol-nav__entry .kol-link:focus-visible,\n .kol-nav__entry .kol-button:focus-visible {\n outline: var(--color-primary-variant) solid calc(3 * 1rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-nav__list--vertical .kol-nav__entry .kol-link,\n .kol-nav__list--vertical .kol-nav__entry .kol-button {\n padding-left: calc(var(--kol-nav-item-padding-left) * 1rem / var(--kolibri-root-font-size, 16));\n border-left: 2px solid transparent;\n }\n .kol-nav--vertical .kol-nav__list-item--active > .kol-nav__entry-wrapper .kol-nav__entry .kol-link,\n .kol-nav--vertical .kol-nav__list-item--active > .kol-nav__entry-wrapper .kol-nav__entry .kol-button {\n border-left-color: var(--color-primary);\n }\n .kol-nav__list-item--active > .kol-nav__entry-wrapper .kol-nav__entry .kol-link,\n .kol-nav__list-item--active > .kol-nav__entry-wrapper .kol-nav__entry .kol-button {\n font-weight: bold;\n }\n .kol-nav__entry .kol-link:hover .kol-span__label,\n .kol-nav__entry .kol-button:hover .kol-span__label {\n text-decoration: underline;\n }\n .kol-nav__toggle-button .kol-button {\n margin-bottom: calc(5 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__toggle-button .kol-button:focus {\n outline: none;\n }\n .kol-nav__toggle-button .kol-button:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-nav__toggle-button .kol-button {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-nav__toggle-button .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-style: solid;\n border-radius: var(--border-radius);\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(8 * 1rem / var(--kolibri-root-font-size, 16)) calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: var(--border-width);\n font-weight: 700;\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-nav__toggle-button .kol-button__text:hover {\n color: var(--text-color);\n background-color: var(--text-background-color);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n border-color: var(--text-border-color);\n }\n .kol-nav__toggle-button .kol-button--hide-label .kol-nav__toggle-button .kol-button__text {\n width: unset;\n padding: calc(12.8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__toggle-button .kol-button--hide-label .kol-nav__toggle-button .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-nav__toggle-button .kol-button:focus {\n outline: var(--color-primary-variant) solid calc(3 * 1rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-nav__toggle-button .kol-button:disabled:hover .kol-nav__toggle-button .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n box-shadow: none;\n border-color: var(--text-border-color);\n }\n}";
|
|
1227
1228
|
|
|
1228
1229
|
var css_248z$f = "/* forward the rem function */\n@layer kol-theme-component {\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination, .kol-table-stateful__pagination-wrapper {\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n }\n .kol-pagination .kol-button:focus .kol-button__text {\n outline: var(--color-primary-variant) solid calc(3 * 1rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-pagination .kol-button:is(:active, :hover):not(:disabled) .kol-button__text {\n color: var(--color-light);\n background-color: var(--color-primary-variant);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n border-color: var(--color-primary-variant);\n }\n .kol-pagination .kol-button:active .kol-button__text {\n color: var(--color-light);\n outline: none;\n }\n .kol-pagination .kol-button__text {\n color: var(--color-primary);\n background-color: var(--color-light);\n border-radius: var(--border-radius);\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n font-weight: 700;\n border: 1px solid var(--color-primary);\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-pagination__button--selected .kol-button {\n opacity: 1;\n }\n .kol-pagination__button--selected .kol-button__text {\n color: var(--color-light);\n background-color: var(--color-primary);\n border: 0;\n }\n}";
|
|
1229
1230
|
|