feat: new icons (css) #130

README.md

@@ -76,7 +76,7 @@ We do try to work around some browser bugs, but on the whole we don't use polyfi
 However, many functions can be mapped via [polyfill.io](https://polyfill.io/) and thus the compatibility can be increased.
 
 ```html
-<script id="polyfill" src="https://polyfill.io/v3/polyfill.min.js?features=Array.from,Array.isArray,Array.prototype.entries,Array.prototype.every,Array.prototype.fill,Array.prototype.filter,Array.prototype.find,Array.prototype.forEach,Array.prototype.includes,Array.prototype.indexOf,Array.prototype.keys,Array.prototype.lastIndexOf,Array.prototype.map,Array.prototype.reduce,Array.prototype.some,Array.prototype.sort,Array.prototype.values,ArrayBuffer,atob,Blob,console,CustomEvent,DataView,Date.prototype.toISOString,document,Document,DocumentFragment,Element,Event,fetch,Function.prototype.bind,getComputedStyle,globalThis,HTMLDocument,HTMLTemplateElement,IntersectionObserver,Intl,JSON,Map,Math.log2,MutationObserver,Number.isFinite,Number.isInteger,Object.assign,Object.defineProperty,Object.entries,Object.freeze,Object.getOwnPropertyDescriptor,Object.getOwnPropertyNames,Object.getPrototypeOf,Object.keys,Promise,Reflect,Reflect.defineProperty,Reflect.get,Reflect.getOwnPropertyDescriptor,Reflect.setPrototypeOf,requestAnimationFrame,ResizeObserver,Set,String.prototype.endsWith,String.prototype.includes,String.prototype.matchAll,String.prototype.padStart,String.prototype.startsWith,String.prototype.trim,Symbol,Symbol.for,Symbol.hasInstance,Symbol.iterator,Uint16Array,Uint8Array,URL,WeakMap,WeakSet"
+<script id="polyfill" src="https://polyfill.io/v3/polyfill.min.js?features=AbortController,Array.prototype.entries,Array.prototype.fill,Array.prototype.find,Array.prototype.includes,Array.prototype.keys,Array.prototype.sort,Array.prototype.values,atob,AudioContext,blissfuljs,Blob,CharacterData.prototype.nextElementSibling,CharacterData.prototype.previousElementSibling,CharacterData.prototype.remove,console,console.error,console.log,CSS.supports,CustomEvent,DocumentFragment,DocumentFragment.prototype.append,DocumentFragment.prototype.prepend,DOMRect,DOMTokenList,DOMTokenList.prototype.forEach,DOMTokenList.prototype.replace,Element.prototype.append,Element.prototype.getAttributeNames,Element.prototype.prepend,Element.prototype.remove,Element.prototype.scroll,Event,EventSource,fetch,Function.prototype.name,globalThis,HTMLDocument,HTMLPictureElement,HTMLTemplateElement,IntersectionObserver,IntersectionObserverEntry,Intl,Intl.DateTimeFormat,Intl.NumberFormat,Intl.PluralRules,Map,Math.log2,MutationObserver,Node.prototype.contains,Node.prototype.getRootNode,Node.prototype.isConnected,Node.prototype.isSameNode,NodeList.prototype.forEach,Number.isFinite,Number.isInteger,Object.assign,Object.entries,Object.freeze,Object.getOwnPropertyNames,Object.prototype.toString,Reflect,Reflect.defineProperty,Reflect.get,Reflect.getOwnPropertyDescriptor,Reflect.setPrototypeOf,requestAnimationFrame,ResizeObserver,Set,String.prototype.includes,String.prototype.matchAll,String.prototype.padStart,Symbol,Symbol.for,Symbol.hasInstance,Symbol.iterator,TextDecoder,TextEncoder,Uint16Array,Uint8Array,URLSearchParams,WeakSet"
        crossorigin="anonymous"
        referrerpolicy="no-referrer"></script>
 ```

package.json

@@ -52,8 +52,8 @@
     "c8": "^8.0.1",
     "chai": "^4.3.10",
     "chai-dom": "^1.11.0",
-    "clean-jsdoc-theme": "^4.2.14",
-    "create-polyfill-service-url": "^2.2.6",
+    "clean-jsdoc-theme": "^4.2.17",
+    "create-polyfill-service-url": "^2.3.0",
     "crypt": "^0.0.2",
     "cssnano": "^6.0.1",
     "dom-storage": "^2.1.0",
@@ -61,7 +61,7 @@
     "esbuild": "^0.19.5",
     "esdoc": "^1.1.0",
     "esdoc-standard-plugin": "^1.0.0",
-    "flow-bin": "^0.220.0",
+    "flow-bin": "^0.221.0",
     "fs": "0.0.1-security",
     "glob": "^10.3.10",
     "graphviz": "^0.0.9",
@@ -83,9 +83,9 @@
     "postcss-nesting": "^12.0.1",
     "postcss-normalize": "^10.0.1",
     "postcss-responsive-type": "^1.0.0",
-    "postcss-rtlcss": "^4.0.8",
+    "postcss-rtlcss": "^4.0.9",
     "postcss-strip-units": "^2.0.1",
-    "puppeteer": "^21.5.0",
+    "puppeteer": "^21.5.1",
     "sinon": "^17.0.1",
     "url": "^0.11.3",
     "url-exist": "3.0.1",

playground/icons/index.html

+<!doctype html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0">
+
+    <title>Color</title>
+    <script src="./main.js" type="module"></script>
+</head>
+<body style="display:flex;justify-content: center">
+               
+
+<main style="width: 600px">
+
+    <a href="../index.html">Back to overview</a>
+    <hr> <br>
+    
+    <h1>Icons</h1>
+
+                  <h2>Primary</h2>
+    <div class="container" style="font-size: 16px">
+        Das ist ein <span class="monster-icon-primary-1-info"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-primary-1-positiv"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-primary-1-negativ"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-primary-1-warning"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-primary-1-neutral"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-primary-1-info"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-primary-1-question"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-primary-1-plus"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-primary-1-dash"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-primary-1-gear"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-primary-1-home"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-primary-1-counterclockwise"></span> Text mit Icons.
+    </div>                                                                                     
+
+    <h2>Secondary</h2>
+    <div class="container" style="font-size: 16px">
+        Das ist ein <span class="monster-icon-secondary-1-info"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-secondary-1-positiv"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-secondary-1-negativ"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-secondary-1-warning"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-secondary-1-neutral"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-secondary-1-info"></span> Text mit Icons.
+    </div>
+
+    <h2>Tertiary</h2>
+    <div class="container" style="font-size: 16px">
+        Das ist ein <span class="monster-icon-tertiary-1-info"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-tertiary-1-positiv"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-tertiary-1-negativ"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-tertiary-1-warning"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-tertiary-1-neutral"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-tertiary-1-info"></span> Text mit Icons.
+    </div>
+
+     <h2>Tertiary 3</h2>     
+    <div class="container" style="font-size: 16px">
+        Das ist ein <span class="monster-icon-tertiary-3-info"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-tertiary-3-positiv"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-tertiary-3-negativ"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-tertiary-3-warning"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-tertiary-3-neutral"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-tertiary-3-info"></span> Text mit Icons.
+    </div>
+    
+    <h2>Success</h2>
+    <div class="container" style="font-size: 16px">
+        Das ist ein <span class="monster-icon-success-1"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-success-2"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-success-3"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-success-4"></span> Text mit Icons.
+    </div>
+
+    <h2>Warning</h2>
+    <div class="container" style="font-size: 16px">
+        Das ist ein <span class="monster-icon-warning-1"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-warning-2"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-warning-3"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-warning-4"></span> Text mit Icons.
+    </div>
+
+    <h2>Error</h2>
+    <div class="container" style="font-size: 16px">
+        Das ist ein <span class="monster-icon-error-1"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-error-2"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-error-3"></span> Text mit Icons.
+        Das ist ein <span class="monster-icon-error-4"></span> Text mit Icons.
+    </div>
+
+
+</main>
+
+</body>
+</html>
\ No newline at end of file

playground/icons/main.js

+import "../../source/components/style/property.pcss";
+import "../../source/components/style/normalize.pcss";
+import "../../source/components/style/color.pcss";
+import "../../source/components/style/typography.pcss";
+import "../../source/components/style/theme.pcss";
+import "../../source/components/style/border.pcss";
+import "../../source/components/style/icons.pcss";
+import "./main.pcss";
+
+

playground/icons/main.pcss

+@import "../../source/components/style/mixin/property.pcss";
+
+
+
+.container{
+    font-size: 17px;
+}
+

source/components/datatable/stylesheet/datasource.mjs

+
 /**
  * Copyright schukai GmbH and contributors 2023. All Rights Reserved.
  * Node module: @schukai/monster
@@ -5,10 +6,10 @@
  * License text available at https://www.gnu.org/licenses/agpl-3.0.en.html
  */
 
-import { addAttributeToken } from "../../../dom/attributes.mjs";
-import { ATTRIBUTE_ERRORMESSAGE } from "../../../dom/constants.mjs";
+import {addAttributeToken} from "../../../dom/attributes.mjs";
+import {ATTRIBUTE_ERRORMESSAGE} from "../../../dom/constants.mjs";
 
-export { DatasourceStyleSheet };
+export {DatasourceStyleSheet}
 
 /**
  * @private
@@ -17,17 +18,10 @@ export { DatasourceStyleSheet };
 const DatasourceStyleSheet = new CSSStyleSheet();
 
 try {
-	DatasourceStyleSheet.insertRule(
-		`
+  DatasourceStyleSheet.insertRule(`
 @layer datasource { 
 :host{display:none}:host(.intersection-observer){display:block;height:1px;overflow:hidden;width:1px} 
-}`,
-		0,
-	);
+}`, 0);
 } catch (e) {
-	addAttributeToken(
-		document.getRootNode().querySelector("html"),
-		ATTRIBUTE_ERRORMESSAGE,
-		e + "",
-	);
+  addAttributeToken(document.getRootNode().querySelector('html'), ATTRIBUTE_ERRORMESSAGE, e + "");
 }

source/components/datatable/stylesheet/embedded-pagination.mjs

+
 /**
  * Copyright schukai GmbH and contributors 2023. All Rights Reserved.
  * Node module: @schukai/monster
@@ -5,10 +6,10 @@
  * License text available at https://www.gnu.org/licenses/agpl-3.0.en.html
  */
 
-import { addAttributeToken } from "../../../dom/attributes.mjs";
-import { ATTRIBUTE_ERRORMESSAGE } from "../../../dom/constants.mjs";
+import {addAttributeToken} from "../../../dom/attributes.mjs";
+import {ATTRIBUTE_ERRORMESSAGE} from "../../../dom/constants.mjs";
 
-export { EmbeddedPaginationStyleSheet };
+export {EmbeddedPaginationStyleSheet}
 
 /**
  * @private
@@ -17,17 +18,10 @@ export { EmbeddedPaginationStyleSheet };
 const EmbeddedPaginationStyleSheet = new CSSStyleSheet();
 
 try {
-	EmbeddedPaginationStyleSheet.insertRule(
-		`
+  EmbeddedPaginationStyleSheet.insertRule(`
 @layer embeddedpagination { 
 :where(html){line-height:1.15}:where(h1){font-size:2em;margin-block-end:.67em;margin-block-start:.67em}:where(dl,ol,ul) :where(dl,ol,ul){margin-block-end:0;margin-block-start:0}:where(hr){box-sizing:content-box;color:inherit;height:0}:where(pre){font-family:monospace,monospace;font-size:1em}:where(abbr[title]){text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}:where(b,strong){font-weight:bolder}:where(code,kbd,samp){font-family:monospace,monospace;font-size:1em}:where(small){font-size:80%}:where(table){border-color:currentColor;text-indent:0}:where(button,input,select){margin:0}:where(button){text-transform:none}:where(button,input:is([type=button i],[type=reset i],[type=submit i])){-webkit-appearance:button}:where(progress){vertical-align:baseline}:where(select){text-transform:none}:where(textarea){margin:0}:where(input[type=search i]){-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}:where(button,input:is([type=button i],[type=color i],[type=reset i],[type=submit i]))::-moz-focus-inner{border-style:none;padding:0}:where(button,input:is([type=button i],[type=color i],[type=reset i],[type=submit i]))::-moz-focusring{outline:1px dotted ButtonText}:where(:-moz-ui-invalid){box-shadow:none}:where(dialog){background-color:#fff;border:solid;color:#000;height:-moz-fit-content;height:fit-content;left:0;margin:auto;padding:1em;position:absolute;right:0;width:-moz-fit-content;width:fit-content}:where(dialog:not([open])){display:none}:where(summary){display:list-item}html{height:100%;min-height:100%}body{box-sizing:border-box;margin:0;min-height:99%;padding:0;word-break:break-word}.block{display:block}.inline{display:inline}.inline-block{display:inline-block}.grid{display:grid}.inline-grid{display:inline-grid}.flex{display:flex}.inline-flex{display:inline-flex}.hidden,.hide,.none{display:none}.visible{visibility:visible}.invisible{visibility:hidden}[data-monster-role=control]{outline:none;width:100%}[data-monster-role=control].flex{align-items:center;display:flex;flex-direction:row}:after,:before,:root{--monster-font-family:-apple-system,BlinkMacSystemFont,\"Quicksand\",\"Segoe UI\",\"Roboto\",\"Oxygen\",\"Ubuntu\",\"Cantarell\",\"Fira Sans\",\"Droid Sans\",\"Helvetica Neue\",Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\";--monster-color-primary-1:var(--monster-color-gray-6);--monster-color-primary-2:var(--monster-color-gray-6);--monster-color-primary-3:var(--monster-color-gray-1);--monster-color-primary-4:var(--monster-color-gray-1);--monster-bg-color-primary-1:var(--monster-color-gray-1);--monster-bg-color-primary-2:var(--monster-color-gray-2);--monster-bg-color-primary-3:var(--monster-color-gray-3);--monster-bg-color-primary-4:var(--monster-color-gray-6);--monster-color-secondary-1:var(--monster-color-red-4);--monster-color-secondary-2:var(--monster-color-red-4);--monster-color-secondary-3:var(--monster-color-red-1);--monster-color-secondary-4:var(--monster-color-red-1);--monster-bg-color-secondary-1:var(--monster-color-gray-1);--monster-bg-color-secondary-2:var(--monster-color-red-2);--monster-bg-color-secondary-3:var(--monster-color-red-3);--monster-bg-color-secondary-4:var(--monster-color-red-6);--monster-color-tertiary-1:var(--monster-color-magenta-4);--monster-color-tertiary-2:var(--monster-color-magenta-4);--monster-color-tertiary-3:var(--monster-color-magenta-6);--monster-color-tertiary-4:var(--monster-color-magenta-1);--monster-bg-color-tertiary-1:var(--monster-color-gray-1);--monster-bg-color-tertiary-2:var(--monster-color-magenta-1);--monster-bg-color-tertiary-3:var(--monster-color-magenta-2);--monster-bg-color-tertiary-4:var(--monster-color-magenta-6);--monster-color-destructive-1:var(--monster-color-red-1);--monster-color-destructive-2:var(--monster-color-red-4);--monster-color-destructive-3:var(--monster-color-red-6);--monster-color-destructive-4:var(--monster-color-red-1);--monster-bg-color-destructive-1:var(--monster-color-red-4);--monster-bg-color-destructive-2:var(--monster-color-gray-1);--monster-bg-color-destructive-3:var(--monster-color-red-2);--monster-bg-color-destructive-4:var(--monster-color-red-5);--monster-color-success-1:var(--monster-color-green-1);--monster-color-success-2:var(--monster-color-green-4);--monster-color-success-3:var(--monster-color-green-6);--monster-color-success-4:var(--monster-color-green-1);--monster-bg-color-success-1:var(--monster-color-green-3);--monster-bg-color-success-2:var(--monster-color-gray-1);--monster-bg-color-success-3:var(--monster-color-green-2);--monster-bg-color-success-4:var(--monster-color-green-5);--monster-color-warning-1:var(--monster-color-orange-1);--monster-color-warning-2:var(--monster-color-orange-4);--monster-color-warning-3:var(--monster-color-orange-6);--monster-color-warning-4:var(--monster-color-orange-1);--monster-bg-color-warning-1:var(--monster-color-orange-3);--monster-bg-color-warning-2:var(--monster-color-gray-1);--monster-bg-color-warning-3:var(--monster-color-orange-2);--monster-bg-color-warning-4:var(--monster-color-orange-5);--monster-color-error-1:var(--monster-color-red-1);--monster-color-error-2:var(--monster-color-red-4);--monster-color-error-3:var(--monster-color-red-6);--monster-color-error-4:var(--monster-color-red-1);--monster-bg-color-error-1:var(--monster-color-red-4);--monster-bg-color-error-2:var(--monster-color-gray-1);--monster-bg-color-error-3:var(--monster-color-red-2);--monster-bg-color-error-4:var(--monster-color-red-5);--monster-color-selection-1:var(--monster-color-gray-6);--monster-color-selection-2:var(--monster-color-gray-6);--monster-color-selection-3:var(--monster-color-gray-6);--monster-color-selection-4:var(--monster-color-gray-1);--monster-bg-color-selection-1:var(--monster-color-yellow-2);--monster-bg-color-selection-2:var(--monster-color-yellow-1);--monster-bg-color-selection-3:var(--monster-color-yellow-2);--monster-bg-color-selection-4:var(--monster-color-yellow-6);--monster-color-primary-disabled-1:var(--monster-color-gray-3);--monster-color-primary-disabled-2:var(--monster-color-gray-1);--monster-color-primary-disabled-3:var(--monster-color-gray-4);--monster-color-primary-disabled-4:var(--monster-color-gray-4);--monster-bg-color-primary-disabled-1:var(--monster-color-gray-1);--monster-bg-color-primary-disabled-2:var(--monster-color-gray-2);--monster-bg-color-primary-disabled-3:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-4:var(--monster-color-gray-6);--monster-color-gradient-1:#833ab4;--monster-color-gradient-2:#fd1d1d;--monster-color-gradient-3:#fcb045;--monster-box-shadow-1:none;--monster-box-shadow-2:-1px 1px 10px 1px hsla(0,0%,76%,.61);--monster-text-shadow:none;--monster-border-style:solid;--monster-border-width:2px;--monster-border-radius:0;--monster-popper-witharrrow-distance:-4px;--monster-z-index-default:0;--monster-z-index-outline:10;--monster-z-index-dropdown:200;--monster-z-index-dropdown-overlay:210;--monster-z-index-sticky:300;--monster-z-index-sticky-overlay:310;--monster-z-index-fixed:400;--monster-z-index-fixed-overlay:410;--monster-z-index-modal-backdrop:500;--monster-z-index-modal-backdrop-overlay:510;--monster-z-index-offcanvas:600;--monster-z-index-offcanvas-overlay:610;--monster-z-index-modal:700;--monster-z-index-modal-overlay:710;--monster-z-index-popover:800;--monster-z-index-popover-overlay:810;--monster-z-index-tooltip:800;--monster-z-index-tooltip-overlay:910;--monster-space-0:0;--monster-space-1:2px;--monster-space-2:4px;--monster-space-3:6px;--monster-space-4:10px;--monster-space-5:16px;--monster-space-6:26px;--monster-space-7:42px;--monster-breakpoint-0:480px;--monster-breakpoint-4:480px;--monster-breakpoint-7:768px;--monster-breakpoint-9:992px;--monster-breakpoint-12:1200px}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-primary-1:var(--monster-color-gray-1);--monster-color-primary-2:var(--monster-color-gray-1);--monster-color-primary-3:var(--monster-color-gray-6);--monster-color-primary-4:var(--monster-color-gray-6);--monster-bg-color-primary-1:var(--monster-color-gray-6);--monster-bg-color-primary-2:var(--monster-color-gray-3);--monster-bg-color-primary-3:var(--monster-color-gray-2);--monster-bg-color-primary-4:var(--monster-color-gray-1);--monster-color-secondary-1:var(--monster-color-red-1);--monster-color-secondary-2:var(--monster-color-red-1);--monster-color-secondary-3:var(--monster-color-red-6);--monster-color-secondary-4:var(--monster-color-red-4);--monster-bg-color-secondary-1:var(--monster-color-gray-6);--monster-bg-color-secondary-2:var(--monster-color-red-3);--monster-bg-color-secondary-3:var(--monster-color-red-2);--monster-bg-color-secondary-4:var(--monster-color-red-1);--monster-color-tertiary-1:var(--monster-color-magenta-1);--monster-color-tertiary-2:var(--monster-color-magenta-6);--monster-color-tertiary-3:var(--monster-color-magenta-4);--monster-color-tertiary-4:var(--monster-color-magenta-4);--monster-bg-color-tertiary-1:var(--monster-color-gray-6);--monster-bg-color-tertiary-2:var(--monster-color-magenta-2);--monster-bg-color-tertiary-3:var(--monster-color-magenta-1);--monster-bg-color-tertiary-4:var(--monster-color-magenta-1);--monster-color-destructive-1:var(--monster-color-red-1);--monster-color-destructive-2:var(--monster-color-red-3);--monster-color-destructive-3:var(--monster-color-red-4);--monster-color-destructive-4:var(--monster-color-red-1);--monster-bg-color-destructive-1:var(--monster-color-red-5);--monster-bg-color-destructive-2:var(--monster-color-gray-6);--monster-bg-color-destructive-3:var(--monster-color-red-1);--monster-bg-color-destructive-4:var(--monster-color-red-4);--monster-color-success-1:var(--monster-color-green-1);--monster-color-success-2:var(--monster-color-green-2);--monster-color-success-3:var(--monster-color-green-4);--monster-color-success-4:var(--monster-color-green-1);--monster-bg-color-success-1:var(--monster-color-green-5);--monster-bg-color-success-2:var(--monster-color-gray-6);--monster-bg-color-success-3:var(--monster-color-green-1);--monster-bg-color-success-4:var(--monster-color-green-3);--monster-color-warning-1:var(--monster-color-orange-1);--monster-color-warning-2:var(--monster-color-orange-3);--monster-color-warning-3:var(--monster-color-orange-4);--monster-color-warning-4:var(--monster-color-orange-1);--monster-bg-color-warning-1:var(--monster-color-orange-5);--monster-bg-color-warning-2:var(--monster-color-gray-6);--monster-bg-color-warning-3:var(--monster-color-orange-1);--monster-bg-color-warning-4:var(--monster-color-orange-3);--monster-color-error-1:var(--monster-color-red-1);--monster-color-error-2:var(--monster-color-red-3);--monster-color-error-3:var(--monster-color-red-4);--monster-color-error-4:var(--monster-color-red-1);--monster-bg-color-error-1:var(--monster-color-red-5);--monster-bg-color-error-2:var(--monster-color-gray-6);--monster-bg-color-error-3:var(--monster-color-red-1);--monster-bg-color-error-4:var(--monster-color-red-4);--monster-color-selection-1:var(--monster-color-gray-6);--monster-color-selection-2:var(--monster-color-gray-6);--monster-color-selection-3:var(--monster-color-gray-6);--monster-color-selection-4:var(--monster-color-gray-1);--monster-bg-color-selection-1:var(--monster-color-yellow-2);--monster-bg-color-selection-2:var(--monster-color-yellow-1);--monster-bg-color-selection-3:var(--monster-color-yellow-2);--monster-bg-color-selection-4:var(--monster-color-yellow-6);--monster-color-primary-disabled-1:var(--monster-color-gray-4);--monster-color-primary-disabled-2:var(--monster-color-gray-4);--monster-color-primary-disabled-3:var(--monster-color-gray-3);--monster-color-primary-disabled-4:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-1:var(--monster-color-gray-6);--monster-bg-color-primary-disabled-2:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-3:var(--monster-color-gray-2);--monster-bg-color-primary-disabled-4:var(--monster-color-gray-1)}}[data-monster-role=pagination]{box-sizing:border-box;display:flex;font-size:1rem;font-weight:400;justify-content:center;line-height:1.4}[data-monster-role=pagination] ul{align-items:center;display:flex;flex-wrap:wrap;justify-content:center;list-style:none;margin:20px 0;padding-left:0}[data-monster-role=pagination] ul li{border-left:1px solid #000;margin:0;padding:0 10px}[data-monster-role=pagination] ul li a,[data-monster-role=pagination] ul li a:active,[data-monster-role=pagination] ul li a:focus,[data-monster-role=pagination] ul li a:hover,[data-monster-role=pagination] ul li a:link,[data-monster-role=pagination] ul li a:visited{background-color:var(--monster-bg-color-primary-2);color:var(--monster-color-primary-2);outline:none;padding:0 .4rem;text-decoration:none;width:-moz-max-content;width:max-content}[data-monster-role=pagination] ul li a:active,[data-monster-role=pagination] ul li a:focus,[data-monster-role=pagination] ul li a:hover{outline:none}[data-monster-role=pagination] ul li a:focus{outline:1px dashed var(--monster-color-selection-4);outline-offset:2px}@media (prefers-color-scheme:light){[data-monster-role=pagination] ul li a:focus{outline:1px dashed var(--monster-color-selection-3);outline-offset:2px}}[data-monster-role=pagination] ul li a.current{background-color:var(--monster-bg-color-primary-3);color:var(--monster-color-primary-3);cursor:unset}[data-monster-role=pagination] ul li a.disabled{cursor:not-allowed}[data-monster-role=pagination] ul li:first-child{border-left:none}@media (max-width:768px){[data-monster-role=pagination] ul li{padding:0 2px}[data-monster-role=pagination] ul li:first-child,[data-monster-role=pagination] ul li:nth-child(2){display:none}[data-monster-role=pagination] ul li:nth-child(3){border-left:none}} 
-}`,
-		0,
-	);
+}`, 0);
 } catch (e) {
-	addAttributeToken(
-		document.getRootNode().querySelector("html"),
-		ATTRIBUTE_ERRORMESSAGE,
-		e + "",
-	);
+  addAttributeToken(document.getRootNode().querySelector('html'), ATTRIBUTE_ERRORMESSAGE, e + "");
 }

source/components/datatable/stylesheet/filter-button.mjs

+
 /**
  * Copyright schukai GmbH and contributors 2023. All Rights Reserved.
  * Node module: @schukai/monster
@@ -5,10 +6,10 @@
  * License text available at https://www.gnu.org/licenses/agpl-3.0.en.html
  */
 
-import { addAttributeToken } from "../../../dom/attributes.mjs";
-import { ATTRIBUTE_ERRORMESSAGE } from "../../../dom/constants.mjs";
+import {addAttributeToken} from "../../../dom/attributes.mjs";
+import {ATTRIBUTE_ERRORMESSAGE} from "../../../dom/constants.mjs";
 
-export { FilterButtonStyleSheet };
+export {FilterButtonStyleSheet}
 
 /**
  * @private
@@ -17,17 +18,10 @@ export { FilterButtonStyleSheet };
 const FilterButtonStyleSheet = new CSSStyleSheet();
 
 try {
-	FilterButtonStyleSheet.insertRule(
-		`
+  FilterButtonStyleSheet.insertRule(`
 @layer filterbutton { 
 :host{display:flex}[data-monster-role=control] a{align-items:center;background:none;color:var(--monster-color-primary-1);display:flex}[data-monster-role=control] a:after{content:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-filter-square'%3E%3Cpath d='M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z'/%3E%3Cpath d='M6 11.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E\");margin:2px 3px 0 5px;padding-top:4px} 
-}`,
-		0,
-	);
+}`, 0);
 } catch (e) {
-	addAttributeToken(
-		document.getRootNode().querySelector("html"),
-		ATTRIBUTE_ERRORMESSAGE,
-		e + "",
-	);
+  addAttributeToken(document.getRootNode().querySelector('html'), ATTRIBUTE_ERRORMESSAGE, e + "");
 }

source/components/datatable/stylesheet/filter-controls-defaults.mjs

+
 /**
  * Copyright schukai GmbH and contributors 2023. All Rights Reserved.
  * Node module: @schukai/monster
@@ -5,10 +6,10 @@
  * License text available at https://www.gnu.org/licenses/agpl-3.0.en.html
  */
 
-import { addAttributeToken } from "../../../dom/attributes.mjs";
-import { ATTRIBUTE_ERRORMESSAGE } from "../../../dom/constants.mjs";
+import {addAttributeToken} from "../../../dom/attributes.mjs";
+import {ATTRIBUTE_ERRORMESSAGE} from "../../../dom/constants.mjs";
 
-export { FilterControlsDefaultsStyleSheet };
+export {FilterControlsDefaultsStyleSheet}
 
 /**
  * @private
@@ -17,17 +18,10 @@ export { FilterControlsDefaultsStyleSheet };
 const FilterControlsDefaultsStyleSheet = new CSSStyleSheet();
 
 try {
-	FilterControlsDefaultsStyleSheet.insertRule(
-		`
+  FilterControlsDefaultsStyleSheet.insertRule(`
 @layer filtercontrolsdefaults { 
 [data-monster-role=control]{outline:none;width:100%}[data-monster-role=control].flex{align-items:center;display:flex;flex-direction:row}div[data-monster-role=popper]{align-content:center;background:var(--monster-bg-color-primary-1);border-color:var(--monster-bg-color-primary-4);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style);border-width:var(--monster-border-width);box-shadow:var(--monster-box-shadow-1);box-sizing:border-box;color:var(--monster-color-primary-1);display:none;justify-content:space-between;left:0;padding:1.1em;position:absolute;top:0;width:-moz-max-content;width:max-content;z-index:var(--monster-z-index-modal)}div[data-monster-role=popper] div[data-monster-role=arrow]{background:var(--monster-bg-color-primary-1);height:calc(max(var(--monster-popper-witharrrow-distance), -1 * var(--monster-popper-witharrrow-distance))*2);pointer-events:none;position:absolute;width:calc(max(var(--monster-popper-witharrrow-distance), -1 * var(--monster-popper-witharrrow-distance))*2);z-index:-1}div[data-monster-role=control]{display:flex;height:100%;position:relative}div[data-monster-role=control] .form-container{margin:0 auto;max-width:600px}div[data-monster-role=control] .form-container .form-group{margin-bottom:.2rem}div[data-monster-role=control] .form-container .form-group input[type=number]{text-align:right;width:5rem}div[data-monster-role=control] .form-container .form-group input[type=number]::-webkit-inner-spin-button,div[data-monster-role=control] .form-container .form-group input[type=number]::-webkit-outer-spin-button{margin-left:10px}div[data-monster-role=control] .form-container .form-group input[type=radio]{accent-color:var(--monster-bg-color-primary-3)}[data-monster-role=popper]{position:absolute} 
-}`,
-		0,
-	);
+}`, 0);
 } catch (e) {
-	addAttributeToken(
-		document.getRootNode().querySelector("html"),
-		ATTRIBUTE_ERRORMESSAGE,
-		e + "",
-	);
+  addAttributeToken(document.getRootNode().querySelector('html'), ATTRIBUTE_ERRORMESSAGE, e + "");
 }

source/components/datatable/stylesheet/filter-date-range.mjs

+
 /**
  * Copyright schukai GmbH and contributors 2023. All Rights Reserved.
  * Node module: @schukai/monster
@@ -5,10 +6,10 @@
  * License text available at https://www.gnu.org/licenses/agpl-3.0.en.html
  */
 
-import { addAttributeToken } from "../../../dom/attributes.mjs";
-import { ATTRIBUTE_ERRORMESSAGE } from "../../../dom/constants.mjs";
+import {addAttributeToken} from "../../../dom/attributes.mjs";
+import {ATTRIBUTE_ERRORMESSAGE} from "../../../dom/constants.mjs";
 
-export { FilterDateRangeStyleSheet };
+export {FilterDateRangeStyleSheet}
 
 /**
  * @private
@@ -17,17 +18,10 @@ export { FilterDateRangeStyleSheet };
 const FilterDateRangeStyleSheet = new CSSStyleSheet();
 
 try {
-	FilterDateRangeStyleSheet.insertRule(
-		`
+  FilterDateRangeStyleSheet.insertRule(`
 @layer filterdaterange { 
 [data-monster-role=input]{width:100%}.hidden{display:none} 
-}`,
-		0,
-	);
+}`, 0);
 } catch (e) {
-	addAttributeToken(
-		document.getRootNode().querySelector("html"),
-		ATTRIBUTE_ERRORMESSAGE,
-		e + "",
-	);
+  addAttributeToken(document.getRootNode().querySelector('html'), ATTRIBUTE_ERRORMESSAGE, e + "");
 }

source/components/datatable/stylesheet/filter-range.mjs

+
 /**
  * Copyright schukai GmbH and contributors 2023. All Rights Reserved.
  * Node module: @schukai/monster
@@ -5,10 +6,10 @@
  * License text available at https://www.gnu.org/licenses/agpl-3.0.en.html
  */
 
-import { addAttributeToken } from "../../../dom/attributes.mjs";
-import { ATTRIBUTE_ERRORMESSAGE } from "../../../dom/constants.mjs";
+import {addAttributeToken} from "../../../dom/attributes.mjs";
+import {ATTRIBUTE_ERRORMESSAGE} from "../../../dom/constants.mjs";
 
-export { FilterRangeStyleSheet };
+export {FilterRangeStyleSheet}
 
 /**
  * @private
@@ -17,17 +18,10 @@ export { FilterRangeStyleSheet };
 const FilterRangeStyleSheet = new CSSStyleSheet();
 
 try {
-	FilterRangeStyleSheet.insertRule(
-		`
+  FilterRangeStyleSheet.insertRule(`
 @layer filterrange { 
 [data-monster-role=input]{width:100%} 
-}`,
-		0,
-	);
+}`, 0);
 } catch (e) {
-	addAttributeToken(
-		document.getRootNode().querySelector("html"),
-		ATTRIBUTE_ERRORMESSAGE,
-		e + "",
-	);
+  addAttributeToken(document.getRootNode().querySelector('html'), ATTRIBUTE_ERRORMESSAGE, e + "");
 }

source/components/datatable/stylesheet/pagination.mjs

+
 /**
  * Copyright schukai GmbH and contributors 2023. All Rights Reserved.
  * Node module: @schukai/monster
@@ -5,10 +6,10 @@
  * License text available at https://www.gnu.org/licenses/agpl-3.0.en.html
  */
 
-import { addAttributeToken } from "../../../dom/attributes.mjs";
-import { ATTRIBUTE_ERRORMESSAGE } from "../../../dom/constants.mjs";
+import {addAttributeToken} from "../../../dom/attributes.mjs";
+import {ATTRIBUTE_ERRORMESSAGE} from "../../../dom/constants.mjs";
 
-export { PaginationStyleSheet };
+export {PaginationStyleSheet}
 
 /**
  * @private
@@ -17,17 +18,10 @@ export { PaginationStyleSheet };
 const PaginationStyleSheet = new CSSStyleSheet();
 
 try {
-	PaginationStyleSheet.insertRule(
-		`
+  PaginationStyleSheet.insertRule(`
 @layer pagination { 
 :where(html){line-height:1.15}:where(h1){font-size:2em;margin-block-end:.67em;margin-block-start:.67em}:where(dl,ol,ul) :where(dl,ol,ul){margin-block-end:0;margin-block-start:0}:where(hr){box-sizing:content-box;color:inherit;height:0}:where(pre){font-family:monospace,monospace;font-size:1em}:where(abbr[title]){text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}:where(b,strong){font-weight:bolder}:where(code,kbd,samp){font-family:monospace,monospace;font-size:1em}:where(small){font-size:80%}:where(table){border-color:currentColor;text-indent:0}:where(button,input,select){margin:0}:where(button){text-transform:none}:where(button,input:is([type=button i],[type=reset i],[type=submit i])){-webkit-appearance:button}:where(progress){vertical-align:baseline}:where(select){text-transform:none}:where(textarea){margin:0}:where(input[type=search i]){-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}:where(button,input:is([type=button i],[type=color i],[type=reset i],[type=submit i]))::-moz-focus-inner{border-style:none;padding:0}:where(button,input:is([type=button i],[type=color i],[type=reset i],[type=submit i]))::-moz-focusring{outline:1px dotted ButtonText}:where(:-moz-ui-invalid){box-shadow:none}:where(dialog){background-color:#fff;border:solid;color:#000;height:-moz-fit-content;height:fit-content;left:0;margin:auto;padding:1em;position:absolute;right:0;width:-moz-fit-content;width:fit-content}:where(dialog:not([open])){display:none}:where(summary){display:list-item}html{height:100%;min-height:100%}body{box-sizing:border-box;margin:0;min-height:99%;padding:0;word-break:break-word}.block{display:block}.inline{display:inline}.inline-block{display:inline-block}.grid{display:grid}.inline-grid{display:inline-grid}.flex{display:flex}.inline-flex{display:inline-flex}.hidden,.hide,.none{display:none}.visible{visibility:visible}.invisible{visibility:hidden}.monster-button-primary,button{align-items:center;background-position:50%;border-radius:var(--monster-border-radius);border-style:var(--monster-border-style);border-width:var(--monster-border-width);box-shadow:var(--monster-box-shadow-1);cursor:pointer;display:flex;font-family:var(--monster-font-family);font-size:1rem;font-weight:400;gap:.4rem;justify-content:center;line-height:1.5;outline:none;overflow:hidden;padding:.375rem .75rem;position:relative;text-align:center;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle;width:-webkit-fill-available;width:-moz-available;width:stretch}.monster-button-primary{background-color:var(--monster-bg-color-primary-4);border-color:var(--monster-bg-color-primary-4);color:var(--monster-color-primary-4)}.monster-button-secondary{background-color:var(--monster-bg-color-secondary-4);border-color:var(--monster-bg-color-secondary-4);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style);border-width:var(--monster-border-width);color:var(--monster-color-secondary-4)}.monster-button-secondary,.monster-button-tertiary{align-items:center;background-position:50%;box-shadow:var(--monster-box-shadow-1);cursor:pointer;display:flex;font-family:var(--monster-font-family);font-size:1rem;font-weight:400;gap:.4rem;justify-content:center;line-height:1.5;outline:none;overflow:hidden;padding:.375rem .75rem;position:relative;text-align:center;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle;width:-webkit-fill-available;width:-moz-available;width:stretch}.monster-button-tertiary{background-color:var(--monster-bg-color-tertiary-4);border-color:var(--monster-bg-color-tertiary-4);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style);border-width:var(--monster-border-width);color:var(--monster-color-tertiary-4)}.monster-button-outline-primary{background-color:var(--monster-color-primary-4);border-color:var(--monster-bg-color-primary-4);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style);border-width:var(--monster-border-width);color:var(--monster-bg-color-primary-4)}.monster-button-outline-primary,.monster-button-outline-secondary{align-items:center;background-position:50%;box-shadow:var(--monster-box-shadow-1);cursor:pointer;display:flex;font-family:var(--monster-font-family);font-size:1rem;font-weight:400;gap:.4rem;justify-content:center;line-height:1.5;outline:none;overflow:hidden;padding:.375rem .75rem;position:relative;text-align:center;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle;width:-webkit-fill-available;width:-moz-available;width:stretch}.monster-button-outline-secondary{background-color:var(--monster-color-secondary-4);border-color:var(--monster-bg-color-secondary-4);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style);border-width:var(--monster-border-width);color:var(--monster-bg-color-secondary-4)}.monster-button-outline-tertiary{align-items:center;background-color:var(--monster-color-tertiary-4);background-position:50%;border-color:var(--monster-bg-color-tertiary-4);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style);border-width:var(--monster-border-width);box-shadow:var(--monster-box-shadow-1);color:var(--monster-bg-color-tertiary-4);cursor:pointer;display:flex;font-family:var(--monster-font-family);font-size:1rem;font-weight:400;gap:.4rem;justify-content:center;line-height:1.5;outline:none;overflow:hidden;padding:.375rem .75rem;position:relative;text-align:center;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle;width:-webkit-fill-available;width:-moz-available;width:stretch}button:active,button:hover{box-shadow:var(--monster-box-shadow-2);transition:background .8s,color .25s .0833333333s}button:active{z-index:var(--monster-z-index-outline)}.monster-button-bar,.monster-button-group{align-content:center;align-items:stretch;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between}.monster-button-group{box-sizing:border-box;gap:0;margin:1rem 0}.monster-button-group>:not(:last-child){margin-right:calc(var(--monster-border-width)*-1)}.monster-button-group :hover{box-shadow:none}button:focus{outline:1px dashed var(--monster-color-selection-4);outline-offset:2px;z-index:var(--monster-z-index-outline)}@media (prefers-color-scheme:light){button:focus{outline:1px dashed var(--monster-color-selection-3);outline-offset:2px;z-index:var(--monster-z-index-outline)}}[data-monster-role=control]{outline:none;width:100%}[data-monster-role=control].flex{align-items:center;display:flex;flex-direction:row}:after,:before,:root{--monster-font-family:-apple-system,BlinkMacSystemFont,\"Quicksand\",\"Segoe UI\",\"Roboto\",\"Oxygen\",\"Ubuntu\",\"Cantarell\",\"Fira Sans\",\"Droid Sans\",\"Helvetica Neue\",Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\";--monster-color-primary-1:var(--monster-color-gray-6);--monster-color-primary-2:var(--monster-color-gray-6);--monster-color-primary-3:var(--monster-color-gray-1);--monster-color-primary-4:var(--monster-color-gray-1);--monster-bg-color-primary-1:var(--monster-color-gray-1);--monster-bg-color-primary-2:var(--monster-color-gray-2);--monster-bg-color-primary-3:var(--monster-color-gray-3);--monster-bg-color-primary-4:var(--monster-color-gray-6);--monster-color-secondary-1:var(--monster-color-red-4);--monster-color-secondary-2:var(--monster-color-red-4);--monster-color-secondary-3:var(--monster-color-red-1);--monster-color-secondary-4:var(--monster-color-red-1);--monster-bg-color-secondary-1:var(--monster-color-gray-1);--monster-bg-color-secondary-2:var(--monster-color-red-2);--monster-bg-color-secondary-3:var(--monster-color-red-3);--monster-bg-color-secondary-4:var(--monster-color-red-6);--monster-color-tertiary-1:var(--monster-color-magenta-4);--monster-color-tertiary-2:var(--monster-color-magenta-4);--monster-color-tertiary-3:var(--monster-color-magenta-6);--monster-color-tertiary-4:var(--monster-color-magenta-1);--monster-bg-color-tertiary-1:var(--monster-color-gray-1);--monster-bg-color-tertiary-2:var(--monster-color-magenta-1);--monster-bg-color-tertiary-3:var(--monster-color-magenta-2);--monster-bg-color-tertiary-4:var(--monster-color-magenta-6);--monster-color-destructive-1:var(--monster-color-red-1);--monster-color-destructive-2:var(--monster-color-red-4);--monster-color-destructive-3:var(--monster-color-red-6);--monster-color-destructive-4:var(--monster-color-red-1);--monster-bg-color-destructive-1:var(--monster-color-red-4);--monster-bg-color-destructive-2:var(--monster-color-gray-1);--monster-bg-color-destructive-3:var(--monster-color-red-2);--monster-bg-color-destructive-4:var(--monster-color-red-5);--monster-color-success-1:var(--monster-color-green-1);--monster-color-success-2:var(--monster-color-green-4);--monster-color-success-3:var(--monster-color-green-6);--monster-color-success-4:var(--monster-color-green-1);--monster-bg-color-success-1:var(--monster-color-green-3);--monster-bg-color-success-2:var(--monster-color-gray-1);--monster-bg-color-success-3:var(--monster-color-green-2);--monster-bg-color-success-4:var(--monster-color-green-5);--monster-color-warning-1:var(--monster-color-orange-1);--monster-color-warning-2:var(--monster-color-orange-4);--monster-color-warning-3:var(--monster-color-orange-6);--monster-color-warning-4:var(--monster-color-orange-1);--monster-bg-color-warning-1:var(--monster-color-orange-3);--monster-bg-color-warning-2:var(--monster-color-gray-1);--monster-bg-color-warning-3:var(--monster-color-orange-2);--monster-bg-color-warning-4:var(--monster-color-orange-5);--monster-color-error-1:var(--monster-color-red-1);--monster-color-error-2:var(--monster-color-red-4);--monster-color-error-3:var(--monster-color-red-6);--monster-color-error-4:var(--monster-color-red-1);--monster-bg-color-error-1:var(--monster-color-red-4);--monster-bg-color-error-2:var(--monster-color-gray-1);--monster-bg-color-error-3:var(--monster-color-red-2);--monster-bg-color-error-4:var(--monster-color-red-5);--monster-color-selection-1:var(--monster-color-gray-6);--monster-color-selection-2:var(--monster-color-gray-6);--monster-color-selection-3:var(--monster-color-gray-6);--monster-color-selection-4:var(--monster-color-gray-1);--monster-bg-color-selection-1:var(--monster-color-yellow-2);--monster-bg-color-selection-2:var(--monster-color-yellow-1);--monster-bg-color-selection-3:var(--monster-color-yellow-2);--monster-bg-color-selection-4:var(--monster-color-yellow-6);--monster-color-primary-disabled-1:var(--monster-color-gray-3);--monster-color-primary-disabled-2:var(--monster-color-gray-1);--monster-color-primary-disabled-3:var(--monster-color-gray-4);--monster-color-primary-disabled-4:var(--monster-color-gray-4);--monster-bg-color-primary-disabled-1:var(--monster-color-gray-1);--monster-bg-color-primary-disabled-2:var(--monster-color-gray-2);--monster-bg-color-primary-disabled-3:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-4:var(--monster-color-gray-6);--monster-color-gradient-1:#833ab4;--monster-color-gradient-2:#fd1d1d;--monster-color-gradient-3:#fcb045;--monster-box-shadow-1:none;--monster-box-shadow-2:-1px 1px 10px 1px hsla(0,0%,76%,.61);--monster-text-shadow:none;--monster-border-style:solid;--monster-border-width:2px;--monster-border-radius:0;--monster-popper-witharrrow-distance:-4px;--monster-z-index-default:0;--monster-z-index-outline:10;--monster-z-index-dropdown:200;--monster-z-index-dropdown-overlay:210;--monster-z-index-sticky:300;--monster-z-index-sticky-overlay:310;--monster-z-index-fixed:400;--monster-z-index-fixed-overlay:410;--monster-z-index-modal-backdrop:500;--monster-z-index-modal-backdrop-overlay:510;--monster-z-index-offcanvas:600;--monster-z-index-offcanvas-overlay:610;--monster-z-index-modal:700;--monster-z-index-modal-overlay:710;--monster-z-index-popover:800;--monster-z-index-popover-overlay:810;--monster-z-index-tooltip:800;--monster-z-index-tooltip-overlay:910;--monster-space-0:0;--monster-space-1:2px;--monster-space-2:4px;--monster-space-3:6px;--monster-space-4:10px;--monster-space-5:16px;--monster-space-6:26px;--monster-space-7:42px;--monster-breakpoint-0:480px;--monster-breakpoint-4:480px;--monster-breakpoint-7:768px;--monster-breakpoint-9:992px;--monster-breakpoint-12:1200px}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-primary-1:var(--monster-color-gray-1);--monster-color-primary-2:var(--monster-color-gray-1);--monster-color-primary-3:var(--monster-color-gray-6);--monster-color-primary-4:var(--monster-color-gray-6);--monster-bg-color-primary-1:var(--monster-color-gray-6);--monster-bg-color-primary-2:var(--monster-color-gray-3);--monster-bg-color-primary-3:var(--monster-color-gray-2);--monster-bg-color-primary-4:var(--monster-color-gray-1);--monster-color-secondary-1:var(--monster-color-red-1);--monster-color-secondary-2:var(--monster-color-red-1);--monster-color-secondary-3:var(--monster-color-red-6);--monster-color-secondary-4:var(--monster-color-red-4);--monster-bg-color-secondary-1:var(--monster-color-gray-6);--monster-bg-color-secondary-2:var(--monster-color-red-3);--monster-bg-color-secondary-3:var(--monster-color-red-2);--monster-bg-color-secondary-4:var(--monster-color-red-1);--monster-color-tertiary-1:var(--monster-color-magenta-1);--monster-color-tertiary-2:var(--monster-color-magenta-6);--monster-color-tertiary-3:var(--monster-color-magenta-4);--monster-color-tertiary-4:var(--monster-color-magenta-4);--monster-bg-color-tertiary-1:var(--monster-color-gray-6);--monster-bg-color-tertiary-2:var(--monster-color-magenta-2);--monster-bg-color-tertiary-3:var(--monster-color-magenta-1);--monster-bg-color-tertiary-4:var(--monster-color-magenta-1);--monster-color-destructive-1:var(--monster-color-red-1);--monster-color-destructive-2:var(--monster-color-red-3);--monster-color-destructive-3:var(--monster-color-red-4);--monster-color-destructive-4:var(--monster-color-red-1);--monster-bg-color-destructive-1:var(--monster-color-red-5);--monster-bg-color-destructive-2:var(--monster-color-gray-6);--monster-bg-color-destructive-3:var(--monster-color-red-1);--monster-bg-color-destructive-4:var(--monster-color-red-4);--monster-color-success-1:var(--monster-color-green-1);--monster-color-success-2:var(--monster-color-green-2);--monster-color-success-3:var(--monster-color-green-4);--monster-color-success-4:var(--monster-color-green-1);--monster-bg-color-success-1:var(--monster-color-green-5);--monster-bg-color-success-2:var(--monster-color-gray-6);--monster-bg-color-success-3:var(--monster-color-green-1);--monster-bg-color-success-4:var(--monster-color-green-3);--monster-color-warning-1:var(--monster-color-orange-1);--monster-color-warning-2:var(--monster-color-orange-3);--monster-color-warning-3:var(--monster-color-orange-4);--monster-color-warning-4:var(--monster-color-orange-1);--monster-bg-color-warning-1:var(--monster-color-orange-5);--monster-bg-color-warning-2:var(--monster-color-gray-6);--monster-bg-color-warning-3:var(--monster-color-orange-1);--monster-bg-color-warning-4:var(--monster-color-orange-3);--monster-color-error-1:var(--monster-color-red-1);--monster-color-error-2:var(--monster-color-red-3);--monster-color-error-3:var(--monster-color-red-4);--monster-color-error-4:var(--monster-color-red-1);--monster-bg-color-error-1:var(--monster-color-red-5);--monster-bg-color-error-2:var(--monster-color-gray-6);--monster-bg-color-error-3:var(--monster-color-red-1);--monster-bg-color-error-4:var(--monster-color-red-4);--monster-color-selection-1:var(--monster-color-gray-6);--monster-color-selection-2:var(--monster-color-gray-6);--monster-color-selection-3:var(--monster-color-gray-6);--monster-color-selection-4:var(--monster-color-gray-1);--monster-bg-color-selection-1:var(--monster-color-yellow-2);--monster-bg-color-selection-2:var(--monster-color-yellow-1);--monster-bg-color-selection-3:var(--monster-color-yellow-2);--monster-bg-color-selection-4:var(--monster-color-yellow-6);--monster-color-primary-disabled-1:var(--monster-color-gray-4);--monster-color-primary-disabled-2:var(--monster-color-gray-4);--monster-color-primary-disabled-3:var(--monster-color-gray-3);--monster-color-primary-disabled-4:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-1:var(--monster-color-gray-6);--monster-bg-color-primary-disabled-2:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-3:var(--monster-color-gray-2);--monster-bg-color-primary-disabled-4:var(--monster-color-gray-1)}}span.monster-fx-ripple{animation:monster-fx-ripple .6s linear;background-color:hsla(0,0%,100%,.7);border-radius:50%;position:absolute;transform:scale(0)}@keyframes monster-fx-ripple{to{opacity:0;transform:scale(4)}}[data-monster-role=pagination]{box-sizing:border-box;display:flex;font-size:1rem;font-weight:400;justify-content:center;line-height:1.4}[data-monster-role=pagination] ul{align-items:center;display:flex;flex-wrap:wrap;justify-content:center;list-style:none;margin:20px 0;padding-left:0}[data-monster-role=pagination] ul li{margin:0 1px}[data-monster-role=pagination] ul li a{align-items:center;background-color:var(--monster-bg-color-primary-1);background-position:50%;border-color:var(--monster-bg-color-primary-4);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style);border-width:var(--monster-border-width);box-shadow:var(--monster-box-shadow-1);color:var(--monster-color-primary-1);cursor:pointer;display:flex;font-family:var(--monster-font-family);font-size:1rem;font-weight:400;gap:.4rem;justify-content:center;line-height:1.5;outline:none;overflow:hidden;padding:.375rem .75rem;position:relative;text-align:center;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle;width:-webkit-fill-available;width:-moz-available;width:stretch;width:-moz-max-content;width:max-content}[data-monster-role=pagination] ul li a.current{background-color:var(--monster-bg-color-primary-4);border-color:var(--monster-bg-color-primary-4);color:var(--monster-color-primary-4);cursor:unset}[data-monster-role=pagination] ul li a.disabled{//border-color:var(--monster-bg-color-primary-4);background-color:var(--monster-bg-color-primary-disabled-1);color:var(--monster-color-primary-disabled-1);cursor:not-allowed} 
-}`,
-		0,
-	);
+}`, 0);
 } catch (e) {
-	addAttributeToken(
-		document.getRootNode().querySelector("html"),
-		ATTRIBUTE_ERRORMESSAGE,
-		e + "",
-	);
+  addAttributeToken(document.getRootNode().querySelector('html'), ATTRIBUTE_ERRORMESSAGE, e + "");
 }